@povio/ui 2.3.0-rc.12 → 2.3.0-rc.14
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/dist/components/inputs/DateTime/DatePicker/DatePicker.js +13 -11
- package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js +19 -17
- package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.js +5 -7
- package/dist/components/inputs/DateTime/TimePicker/TimePicker.js +2 -3
- package/dist/components/inputs/DateTime/shared/DatePickerInput.js +139 -145
- package/package.json +1 -1
|
@@ -19,10 +19,11 @@ import { useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState
|
|
|
19
19
|
import { useDatePicker, useLocale } from "react-aria";
|
|
20
20
|
import { mergeRefs } from "@react-aria/utils";
|
|
21
21
|
import { Controller, useWatch } from "react-hook-form";
|
|
22
|
-
import { createCalendar,
|
|
22
|
+
import { createCalendar, toCalendarDate, today } from "@internationalized/date";
|
|
23
23
|
import { DateTime } from "luxon";
|
|
24
24
|
import { useCalendarState, useDatePickerState } from "react-stately";
|
|
25
25
|
//#region src/components/inputs/DateTime/DatePicker/DatePicker.tsx
|
|
26
|
+
var DATE_PICKER_TIME_ZONE = "UTC";
|
|
26
27
|
var DatePickerBase = (props) => {
|
|
27
28
|
const ui = UIConfig.useConfig();
|
|
28
29
|
const { ref, label, tooltipText, helperText, isRequired, rightContent, isDirty, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, className, placeholder, inputClassName, as: asProp, hideLabel: hideLabelProp, variant: variantProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, shouldUpdateDateOnMonthYearChange: shouldUpdateDateOnMonthYearChangeProp, granularity: granularityProp, autoFixYear: autoFixYearProp, format, ...rest } = props;
|
|
@@ -98,7 +99,7 @@ var DatePickerBase = (props) => {
|
|
|
98
99
|
calendarState.setFocusedDate(normalizedValue);
|
|
99
100
|
return;
|
|
100
101
|
}
|
|
101
|
-
calendarState.setFocusedDate(today(
|
|
102
|
+
calendarState.setFocusedDate(today(DATE_PICKER_TIME_ZONE));
|
|
102
103
|
},
|
|
103
104
|
shouldCloseOnSelect: false
|
|
104
105
|
});
|
|
@@ -137,7 +138,7 @@ var DatePickerBase = (props) => {
|
|
|
137
138
|
};
|
|
138
139
|
const onMonthYearChange = (selectedDate) => {
|
|
139
140
|
if (!(shouldUpdateDateOnMonthYearChange || granularity !== "day")) return;
|
|
140
|
-
const updatedDate = normalizeByGranularity((dialogState.value || state.value || today(
|
|
141
|
+
const updatedDate = normalizeByGranularity((dialogState.value || state.value || today(DATE_PICKER_TIME_ZONE)).set({
|
|
141
142
|
year: selectedDate.year,
|
|
142
143
|
month: selectedDate.month
|
|
143
144
|
}));
|
|
@@ -148,7 +149,7 @@ var DatePickerBase = (props) => {
|
|
|
148
149
|
onApply();
|
|
149
150
|
};
|
|
150
151
|
const onTodayPress = () => {
|
|
151
|
-
const todayValue = normalizeByGranularity(today(
|
|
152
|
+
const todayValue = normalizeByGranularity(today(DATE_PICKER_TIME_ZONE));
|
|
152
153
|
dialogState.setValue(todayValue);
|
|
153
154
|
calendarState.setFocusedDate(todayValue);
|
|
154
155
|
};
|
|
@@ -156,7 +157,7 @@ var DatePickerBase = (props) => {
|
|
|
156
157
|
if (!state.isOpen) return;
|
|
157
158
|
if (granularity !== "year") return;
|
|
158
159
|
if (dialogState.value) return;
|
|
159
|
-
const defaultYearValue = normalizeByGranularity(today(
|
|
160
|
+
const defaultYearValue = normalizeByGranularity(today(DATE_PICKER_TIME_ZONE));
|
|
160
161
|
dialogState.setValue(defaultYearValue);
|
|
161
162
|
calendarState.setFocusedDate(defaultYearValue);
|
|
162
163
|
}, [
|
|
@@ -170,7 +171,7 @@ var DatePickerBase = (props) => {
|
|
|
170
171
|
const onOpenChange = (isOpen) => {
|
|
171
172
|
state.toggle();
|
|
172
173
|
if (state.value) calendarState.setFocusedDate(normalizeByGranularity(state.value));
|
|
173
|
-
if (!state.value) calendarState.setFocusedDate(today(
|
|
174
|
+
if (!state.value) calendarState.setFocusedDate(today(DATE_PICKER_TIME_ZONE));
|
|
174
175
|
if (!isOpen) dialogState.setValue(state.value);
|
|
175
176
|
};
|
|
176
177
|
return /* @__PURE__ */ jsx(TooltipWrapper, {
|
|
@@ -206,7 +207,8 @@ var DatePickerBase = (props) => {
|
|
|
206
207
|
placeholder,
|
|
207
208
|
className: inputClassName,
|
|
208
209
|
dateGranularity: granularity,
|
|
209
|
-
format
|
|
210
|
+
format,
|
|
211
|
+
timeZone: DATE_PICKER_TIME_ZONE
|
|
210
212
|
}), (!disableDropdown || disableManualEntry) && state.isOpen && /* @__PURE__ */ jsx(DateTimeDialog, {
|
|
211
213
|
footer: /* @__PURE__ */ jsx(DateTimeDialogFooter, {
|
|
212
214
|
isDisabled,
|
|
@@ -267,14 +269,14 @@ var DatePicker = ({ fullIso = true, granularity = "day", minValue, maxValue, ren
|
|
|
267
269
|
if (calendarDate === null) return null;
|
|
268
270
|
const normalizedDate = normalizeByGranularity(calendarDate);
|
|
269
271
|
if (fullIso) return DateTimeUtils.fromCalendarDateToUTCISO(normalizedDate);
|
|
270
|
-
const date_0 = DateTimeUtils.fromDateValueToLocal(normalizedDate);
|
|
271
|
-
return DateTime.fromJSDate(date_0).toISODate();
|
|
272
|
+
const date_0 = DateTimeUtils.fromDateValueToLocal(normalizedDate, "UTC");
|
|
273
|
+
return DateTime.fromJSDate(date_0, { zone: "UTC" }).toISODate();
|
|
272
274
|
};
|
|
273
275
|
const parseCalendarDate = (formattedDate) => {
|
|
274
276
|
if (formattedDate == null) return formattedDate;
|
|
275
277
|
if (fullIso) return normalizeByGranularity(DateTimeUtils.fromUTCISOToCalendarDate(formattedDate));
|
|
276
|
-
const date_1 = DateTime.fromISO(formattedDate).toJSDate();
|
|
277
|
-
return normalizeByGranularity(toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date_1)));
|
|
278
|
+
const date_1 = DateTime.fromISO(formattedDate, { zone: "UTC" }).toJSDate();
|
|
279
|
+
return normalizeByGranularity(toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date_1, "UTC")));
|
|
278
280
|
};
|
|
279
281
|
const dateLimits = {
|
|
280
282
|
minValue: typeof minValue === "string" ? parseCalendarDate(minValue) : minValue,
|
|
@@ -23,10 +23,11 @@ import { useDateRangePicker, useLocale as useLocale$1 } from "react-aria";
|
|
|
23
23
|
import { mergeRefs } from "@react-aria/utils";
|
|
24
24
|
import { useTranslation } from "react-i18next";
|
|
25
25
|
import { Controller, useWatch } from "react-hook-form";
|
|
26
|
-
import { createCalendar, endOfMonth, endOfWeek, endOfYear,
|
|
26
|
+
import { createCalendar, endOfMonth, endOfWeek, endOfYear, startOfMonth, startOfWeek, startOfYear, toCalendarDate, today } from "@internationalized/date";
|
|
27
27
|
import { DateTime } from "luxon";
|
|
28
28
|
import { useDateRangePickerState, useRangeCalendarState } from "react-stately";
|
|
29
29
|
//#region src/components/inputs/DateTime/DateRangePicker/DateRangePicker.tsx
|
|
30
|
+
var DATE_PICKER_TIME_ZONE = "UTC";
|
|
30
31
|
var DateRangePickerBase = (props) => {
|
|
31
32
|
const ui = UIConfig.useConfig();
|
|
32
33
|
const { t } = useTranslation();
|
|
@@ -114,7 +115,7 @@ var DateRangePickerBase = (props) => {
|
|
|
114
115
|
createCalendar,
|
|
115
116
|
pageBehavior: "single",
|
|
116
117
|
visibleDuration: { months: 1 },
|
|
117
|
-
defaultFocusedValue: today(
|
|
118
|
+
defaultFocusedValue: today(DATE_PICKER_TIME_ZONE).add({ months: 1 }),
|
|
118
119
|
minValue: void 0,
|
|
119
120
|
maxValue: void 0
|
|
120
121
|
});
|
|
@@ -354,7 +355,7 @@ var DateRangePickerBase = (props) => {
|
|
|
354
355
|
state.toggle();
|
|
355
356
|
};
|
|
356
357
|
const onTodayPress = () => {
|
|
357
|
-
const todayDate = today(
|
|
358
|
+
const todayDate = today(DATE_PICKER_TIME_ZONE);
|
|
358
359
|
leftCalendarState.setFocusedDate(todayDate);
|
|
359
360
|
rightCalendarState.setFocusedDate(todayDate.add({ months: 1 }));
|
|
360
361
|
syncCalendarStates({
|
|
@@ -369,8 +370,8 @@ var DateRangePickerBase = (props) => {
|
|
|
369
370
|
dialogState.setValue(state.value);
|
|
370
371
|
leftCalendarState.setValue(state.value);
|
|
371
372
|
rightCalendarState.setValue(state.value);
|
|
372
|
-
const startDate_1 = state.value.start || today(
|
|
373
|
-
const endDate_1 = state.value.end || today(
|
|
373
|
+
const startDate_1 = state.value.start || today(DATE_PICKER_TIME_ZONE);
|
|
374
|
+
const endDate_1 = state.value.end || today(DATE_PICKER_TIME_ZONE).add({ months: 1 });
|
|
374
375
|
leftCalendarState.setFocusedDate(startDate_1);
|
|
375
376
|
if (startDate_1.year === endDate_1.year && startDate_1.month === endDate_1.month) rightCalendarState.setFocusedDate(startDate_1.add({ months: 1 }));
|
|
376
377
|
else rightCalendarState.setFocusedDate(endDate_1);
|
|
@@ -382,7 +383,7 @@ var DateRangePickerBase = (props) => {
|
|
|
382
383
|
}
|
|
383
384
|
}
|
|
384
385
|
};
|
|
385
|
-
const todayDate_0 = today(
|
|
386
|
+
const todayDate_0 = today(DATE_PICKER_TIME_ZONE);
|
|
386
387
|
const getThisWeekRange = () => {
|
|
387
388
|
return {
|
|
388
389
|
start: startOfWeek(todayDate_0, locale),
|
|
@@ -511,7 +512,8 @@ var DateRangePickerBase = (props) => {
|
|
|
511
512
|
autoFixYear,
|
|
512
513
|
placeholder,
|
|
513
514
|
className: inputClassName,
|
|
514
|
-
onOpenDropdown: () => state.toggle()
|
|
515
|
+
onOpenDropdown: () => state.toggle(),
|
|
516
|
+
timeZone: DATE_PICKER_TIME_ZONE
|
|
515
517
|
}), /* @__PURE__ */ jsx(DateTimeDialog, {
|
|
516
518
|
hideSidebar,
|
|
517
519
|
sidebar: /* @__PURE__ */ jsx("div", {
|
|
@@ -590,11 +592,11 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
|
|
|
590
592
|
start: DateTimeUtils.fromCalendarDateToUTCISO(range.start),
|
|
591
593
|
end: DateTimeUtils.fromCalendarDateToUTCISO(range.end, { endOfDay: true })
|
|
592
594
|
};
|
|
593
|
-
const startDate = DateTimeUtils.fromDateValueToLocal(range.start);
|
|
594
|
-
const endDate = DateTimeUtils.fromDateValueToLocal(range.end);
|
|
595
|
+
const startDate = DateTimeUtils.fromDateValueToLocal(range.start, "UTC");
|
|
596
|
+
const endDate = DateTimeUtils.fromDateValueToLocal(range.end, "UTC");
|
|
595
597
|
return {
|
|
596
|
-
start: DateTime.fromJSDate(startDate).toISODate(),
|
|
597
|
-
end: DateTime.fromJSDate(endDate).toISODate()
|
|
598
|
+
start: DateTime.fromJSDate(startDate, { zone: "UTC" }).toISODate(),
|
|
599
|
+
end: DateTime.fromJSDate(endDate, { zone: "UTC" }).toISODate()
|
|
598
600
|
};
|
|
599
601
|
};
|
|
600
602
|
const parseDateRange = (formattedRange) => {
|
|
@@ -603,10 +605,10 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
|
|
|
603
605
|
start: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.start),
|
|
604
606
|
end: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.end)
|
|
605
607
|
};
|
|
606
|
-
const startDate_0 = DateTime.fromISO(formattedRange.start).toJSDate();
|
|
607
|
-
const endDate_0 = DateTime.fromISO(formattedRange.end).toJSDate();
|
|
608
|
-
const startZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(startDate_0);
|
|
609
|
-
const endZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(endDate_0);
|
|
608
|
+
const startDate_0 = DateTime.fromISO(formattedRange.start, { zone: "UTC" }).toJSDate();
|
|
609
|
+
const endDate_0 = DateTime.fromISO(formattedRange.end, { zone: "UTC" }).toJSDate();
|
|
610
|
+
const startZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(startDate_0, "UTC");
|
|
611
|
+
const endZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(endDate_0, "UTC");
|
|
610
612
|
return {
|
|
611
613
|
start: toCalendarDate(startZonedDateTime),
|
|
612
614
|
end: toCalendarDate(endZonedDateTime)
|
|
@@ -615,8 +617,8 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
|
|
|
615
617
|
const parseCalendarDate = (formattedDate) => {
|
|
616
618
|
if (formattedDate == null) return formattedDate;
|
|
617
619
|
if (fullIso) return DateTimeUtils.fromUTCISOToCalendarDate(formattedDate);
|
|
618
|
-
const date = DateTime.fromISO(formattedDate).toJSDate();
|
|
619
|
-
return toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date));
|
|
620
|
+
const date = DateTime.fromISO(formattedDate, { zone: "UTC" }).toJSDate();
|
|
621
|
+
return toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date, "UTC"));
|
|
620
622
|
};
|
|
621
623
|
const dateLimits = {
|
|
622
624
|
minValue: typeof minValue === "string" ? parseCalendarDate(minValue) : minValue,
|
|
@@ -19,12 +19,12 @@ import { useEffect, useImperativeHandle, useMemo, useRef, useState } from "react
|
|
|
19
19
|
import { useDatePicker, useLocale } from "react-aria";
|
|
20
20
|
import { mergeRefs } from "@react-aria/utils";
|
|
21
21
|
import { Controller, useWatch } from "react-hook-form";
|
|
22
|
-
import { Time, createCalendar,
|
|
22
|
+
import { Time, createCalendar, now, toCalendarDateTime, today } from "@internationalized/date";
|
|
23
23
|
import { useCalendarState, useDatePickerState } from "react-stately";
|
|
24
24
|
//#region src/components/inputs/DateTime/DateTimePicker/DateTimePicker.tsx
|
|
25
25
|
var DateTimePickerBase = (props) => {
|
|
26
26
|
const ui = UIConfig.useConfig();
|
|
27
|
-
const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, isTimeOptional, placeholder, inputClassName, hideLabel: hideLabelProp, variant: variantProp, as: asProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, shouldUpdateDateOnMonthYearChange: shouldUpdateDateOnMonthYearChangeProp, timeZone, autoFixYear: autoFixYearProp, format, setDateValueOnDateSelection: setDateValueOnDateSelectionProp, ...rest } = props;
|
|
27
|
+
const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, isTimeOptional, placeholder, inputClassName, hideLabel: hideLabelProp, variant: variantProp, as: asProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, shouldUpdateDateOnMonthYearChange: shouldUpdateDateOnMonthYearChangeProp, timeZone: _timeZone, autoFixYear: autoFixYearProp, format, setDateValueOnDateSelection: setDateValueOnDateSelectionProp, ...rest } = props;
|
|
28
28
|
const hideLabel = hideLabelProp ?? ui.input.hideLabel;
|
|
29
29
|
const variant = variantProp ?? ui.input.variant;
|
|
30
30
|
const as = asProp ?? ui.input.as;
|
|
@@ -38,8 +38,7 @@ var DateTimePickerBase = (props) => {
|
|
|
38
38
|
const shouldUpdateDateOnMonthYearChange = shouldUpdateDateOnMonthYearChangeProp ?? ui.dateInput.shouldUpdateDateOnMonthYearChange;
|
|
39
39
|
const autoFixYear = autoFixYearProp ?? ui.dateInput.autoFixYear;
|
|
40
40
|
const setDateValueOnDateSelection = setDateValueOnDateSelectionProp ?? ui.dateInput.setDateValueOnDateSelection;
|
|
41
|
-
|
|
42
|
-
if (timeZone) effectiveTimeZone = timeZone;
|
|
41
|
+
const effectiveTimeZone = "UTC";
|
|
43
42
|
const formFieldProps = {
|
|
44
43
|
error,
|
|
45
44
|
label,
|
|
@@ -85,7 +84,7 @@ var DateTimePickerBase = (props) => {
|
|
|
85
84
|
onChange: (val_0) => {
|
|
86
85
|
onChange?.(val_0);
|
|
87
86
|
dialogState.setValue(val_0);
|
|
88
|
-
calendarState.setFocusedDate(val_0 || today(
|
|
87
|
+
calendarState.setFocusedDate(val_0 || today(effectiveTimeZone));
|
|
89
88
|
debouncedBlur(val_0);
|
|
90
89
|
},
|
|
91
90
|
shouldCloseOnSelect: false,
|
|
@@ -257,8 +256,7 @@ var DateTimePicker = ({ fullIso = true, renderStaticInput, ...props }) => {
|
|
|
257
256
|
let isFormControlDisabled = false;
|
|
258
257
|
if ("formControl" in props && props.formControl) isFormControlDisabled = !!props.formControl.control._options?.disabled;
|
|
259
258
|
const rawValue = watchedValue ?? props.value ?? null;
|
|
260
|
-
|
|
261
|
-
if (props.timeZone) effectiveTimeZone = props.timeZone;
|
|
259
|
+
const effectiveTimeZone = "UTC";
|
|
262
260
|
const formatDateValue = (dateValue) => {
|
|
263
261
|
if (dateValue === null) return null;
|
|
264
262
|
if (fullIso) return DateTimeUtils.fromDateValueToISO(dateValue, effectiveTimeZone);
|
|
@@ -17,7 +17,7 @@ import { useEffect, useRef, useState } from "react";
|
|
|
17
17
|
import { useLocale, useTimeField } from "react-aria";
|
|
18
18
|
import { mergeRefs } from "@react-aria/utils";
|
|
19
19
|
import { Controller, useWatch } from "react-hook-form";
|
|
20
|
-
import {
|
|
20
|
+
import { now, toTime } from "@internationalized/date";
|
|
21
21
|
import { DateTime } from "luxon";
|
|
22
22
|
import { useTimeFieldState } from "react-stately";
|
|
23
23
|
//#region src/components/inputs/DateTime/TimePicker/TimePicker.tsx
|
|
@@ -415,8 +415,7 @@ var TimePickerBase = (props) => {
|
|
|
415
415
|
};
|
|
416
416
|
var TimePicker = ({ renderStaticInput, ...props }) => {
|
|
417
417
|
const ui = UIConfig.useConfig();
|
|
418
|
-
|
|
419
|
-
if (props.timeZone) effectiveTimeZone = props.timeZone;
|
|
418
|
+
const effectiveTimeZone = "UTC";
|
|
420
419
|
const { locale } = useLocale();
|
|
421
420
|
const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
|
|
422
421
|
const inputRef = useRef(null);
|
|
@@ -14,10 +14,10 @@ import { clsx } from "clsx";
|
|
|
14
14
|
import { useImperativeHandle, useRef, useState } from "react";
|
|
15
15
|
import { Button } from "react-aria-components";
|
|
16
16
|
import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
|
|
17
|
-
import {
|
|
17
|
+
import { now, toCalendarDateTime, today } from "@internationalized/date";
|
|
18
18
|
//#region src/components/inputs/DateTime/shared/DatePickerInput.tsx
|
|
19
19
|
var DatePickerInput = (t0) => {
|
|
20
|
-
const $ = c(
|
|
20
|
+
const $ = c(96);
|
|
21
21
|
const { ref, as, groupProps, fieldProps, endFieldProps, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, isClearable, headerProps, todayIcon, todayIconButtonSize: t1, todayIconPlacement: t2, isDirty, isRequired, disableManualEntry, autoFixYear: t3, placeholder, className, onOpenDropdown, dateGranularity: t4, timeZone, isTimeOptional: t5, format, ...props } = t0;
|
|
22
22
|
const todayIconButtonSize = t1 === void 0 ? "none" : t1;
|
|
23
23
|
const todayIconPlacement = t2 === void 0 ? "content" : t2;
|
|
@@ -25,27 +25,21 @@ var DatePickerInput = (t0) => {
|
|
|
25
25
|
const dateGranularity = t4 === void 0 ? "day" : t4;
|
|
26
26
|
const isTimeOptional = t5 === void 0 ? false : t5;
|
|
27
27
|
const uiConfig = UIConfig.useConfig();
|
|
28
|
-
|
|
29
|
-
if ($[0] !== timeZone) {
|
|
30
|
-
effectiveTimeZone = getLocalTimeZone();
|
|
31
|
-
if (timeZone) effectiveTimeZone = timeZone;
|
|
32
|
-
$[0] = timeZone;
|
|
33
|
-
$[1] = effectiveTimeZone;
|
|
34
|
-
} else effectiveTimeZone = $[1];
|
|
28
|
+
const effectiveTimeZone = timeZone ?? "UTC";
|
|
35
29
|
const inputBaseCva = UIStyle.useCva("input.baseCva", inputBase);
|
|
36
30
|
const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
|
|
37
31
|
const datePickerInputContentRowCva = UIStyle.useCva("datePickerInput.contentRowCva", datePickerInputContentRow);
|
|
38
32
|
const [canClear, setCanClear] = useState(false);
|
|
39
33
|
let t6;
|
|
40
|
-
if ($[
|
|
34
|
+
if ($[0] !== isDisabled) {
|
|
41
35
|
t6 = { isDisabled };
|
|
42
|
-
$[
|
|
43
|
-
$[
|
|
44
|
-
} else t6 = $[
|
|
36
|
+
$[0] = isDisabled;
|
|
37
|
+
$[1] = t6;
|
|
38
|
+
} else t6 = $[1];
|
|
45
39
|
const { hoverProps, isHovered } = useHover(t6);
|
|
46
40
|
const [isFocused, setIsFocused] = useState(false);
|
|
47
41
|
let t7;
|
|
48
|
-
if ($[
|
|
42
|
+
if ($[2] !== autoFixYear) {
|
|
49
43
|
t7 = { onFocusWithinChange: (isFocusWithin) => {
|
|
50
44
|
setIsFocused(isFocusWithin);
|
|
51
45
|
if (!isFocusWithin && autoFixYear) {
|
|
@@ -53,16 +47,16 @@ var DatePickerInput = (t0) => {
|
|
|
53
47
|
endDateFieldRef.current?.autoFixYear();
|
|
54
48
|
}
|
|
55
49
|
} };
|
|
56
|
-
$[
|
|
57
|
-
$[
|
|
58
|
-
} else t7 = $[
|
|
50
|
+
$[2] = autoFixYear;
|
|
51
|
+
$[3] = t7;
|
|
52
|
+
} else t7 = $[3];
|
|
59
53
|
const { focusWithinProps } = useFocusWithin(t7);
|
|
60
54
|
const { isFocusVisible } = useFocusVisible();
|
|
61
55
|
const dateFieldRef = useRef(null);
|
|
62
56
|
const endDateFieldRef = useRef(null);
|
|
63
57
|
const containerRef = useRef(null);
|
|
64
58
|
let t8;
|
|
65
|
-
if ($[
|
|
59
|
+
if ($[4] !== endFieldProps || $[5] !== fieldProps) {
|
|
66
60
|
t8 = () => ({
|
|
67
61
|
clear: () => {
|
|
68
62
|
dateFieldRef.current?.clearField();
|
|
@@ -75,21 +69,21 @@ var DatePickerInput = (t0) => {
|
|
|
75
69
|
},
|
|
76
70
|
getContainer: () => containerRef.current
|
|
77
71
|
});
|
|
78
|
-
$[
|
|
79
|
-
$[
|
|
80
|
-
$[
|
|
81
|
-
} else t8 = $[
|
|
72
|
+
$[4] = endFieldProps;
|
|
73
|
+
$[5] = fieldProps;
|
|
74
|
+
$[6] = t8;
|
|
75
|
+
} else t8 = $[6];
|
|
82
76
|
useImperativeHandle(ref, t8);
|
|
83
77
|
let t9;
|
|
84
|
-
if ($[
|
|
78
|
+
if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
|
|
85
79
|
t9 = (canClearInput) => {
|
|
86
80
|
setCanClear(canClearInput);
|
|
87
81
|
};
|
|
88
|
-
$[
|
|
89
|
-
} else t9 = $[
|
|
82
|
+
$[7] = t9;
|
|
83
|
+
} else t9 = $[7];
|
|
90
84
|
const onClearChange = t9;
|
|
91
85
|
let t10;
|
|
92
|
-
if ($[
|
|
86
|
+
if ($[8] !== endFieldProps || $[9] !== fieldProps) {
|
|
93
87
|
t10 = () => {
|
|
94
88
|
dateFieldRef.current?.clearField();
|
|
95
89
|
fieldProps.onChange?.(null);
|
|
@@ -99,13 +93,13 @@ var DatePickerInput = (t0) => {
|
|
|
99
93
|
fieldProps.onBlur?.(null);
|
|
100
94
|
endFieldProps?.onBlur?.(null);
|
|
101
95
|
};
|
|
102
|
-
$[
|
|
103
|
-
$[
|
|
104
|
-
$[
|
|
105
|
-
} else t10 = $[
|
|
96
|
+
$[8] = endFieldProps;
|
|
97
|
+
$[9] = fieldProps;
|
|
98
|
+
$[10] = t10;
|
|
99
|
+
} else t10 = $[10];
|
|
106
100
|
const onClear = t10;
|
|
107
101
|
let t11;
|
|
108
|
-
if ($[
|
|
102
|
+
if ($[11] !== effectiveTimeZone || $[12] !== endFieldProps || $[13] !== fieldProps || $[14] !== isDateTime) {
|
|
109
103
|
t11 = () => {
|
|
110
104
|
if (isDateTime) {
|
|
111
105
|
const calendarDateTime = toCalendarDateTime(now(effectiveTimeZone));
|
|
@@ -118,23 +112,23 @@ var DatePickerInput = (t0) => {
|
|
|
118
112
|
fieldProps.onBlur?.(null);
|
|
119
113
|
endFieldProps?.onBlur?.(null);
|
|
120
114
|
};
|
|
121
|
-
$[
|
|
122
|
-
$[
|
|
123
|
-
$[
|
|
124
|
-
$[
|
|
125
|
-
$[
|
|
126
|
-
} else t11 = $[
|
|
115
|
+
$[11] = effectiveTimeZone;
|
|
116
|
+
$[12] = endFieldProps;
|
|
117
|
+
$[13] = fieldProps;
|
|
118
|
+
$[14] = isDateTime;
|
|
119
|
+
$[15] = t11;
|
|
120
|
+
} else t11 = $[15];
|
|
127
121
|
const onToday = t11;
|
|
128
122
|
const hidePlaceholder = as === "floating" && !fieldProps.value && !isFocused;
|
|
129
123
|
let t12;
|
|
130
|
-
if ($[
|
|
124
|
+
if ($[16] !== todayIcon) {
|
|
131
125
|
t12 = getDatePickerTodayIcon(todayIcon);
|
|
132
|
-
$[
|
|
133
|
-
$[
|
|
134
|
-
} else t12 = $[
|
|
126
|
+
$[16] = todayIcon;
|
|
127
|
+
$[17] = t12;
|
|
128
|
+
} else t12 = $[17];
|
|
135
129
|
const todayIconComponent = t12;
|
|
136
130
|
let t13;
|
|
137
|
-
if ($[
|
|
131
|
+
if ($[18] !== onToday || $[19] !== todayIconButtonSize || $[20] !== todayIconComponent) {
|
|
138
132
|
t13 = todayIconComponent ? /* @__PURE__ */ jsx(InlineIconButton, {
|
|
139
133
|
label: "",
|
|
140
134
|
icon: todayIconComponent,
|
|
@@ -142,11 +136,11 @@ var DatePickerInput = (t0) => {
|
|
|
142
136
|
onPress: onToday,
|
|
143
137
|
className: "relative z-1 !border-none"
|
|
144
138
|
}) : null;
|
|
145
|
-
$[
|
|
146
|
-
$[
|
|
147
|
-
$[
|
|
148
|
-
$[
|
|
149
|
-
} else t13 = $[
|
|
139
|
+
$[18] = onToday;
|
|
140
|
+
$[19] = todayIconButtonSize;
|
|
141
|
+
$[20] = todayIconComponent;
|
|
142
|
+
$[21] = t13;
|
|
143
|
+
} else t13 = $[21];
|
|
150
144
|
const todayIconButton = t13;
|
|
151
145
|
const shouldRenderTodayIconWithFieldLabel = todayIconPlacement === "fieldLabel";
|
|
152
146
|
const pickerIcon = isDateTime ? uiConfig.dateInput.dateTimeIcon : uiConfig.dateInput.calendarIcon;
|
|
@@ -167,49 +161,49 @@ var DatePickerInput = (t0) => {
|
|
|
167
161
|
const t24 = isRequired || void 0;
|
|
168
162
|
const t25 = fieldProps.value !== null || void 0;
|
|
169
163
|
let t26;
|
|
170
|
-
if ($[
|
|
164
|
+
if ($[22] !== as || $[23] !== inputSizeCva || $[24] !== size) {
|
|
171
165
|
t26 = clsx("flex w-full items-center gap-input-gap-input-text-to-elements pr-0!", inputSizeCva({
|
|
172
166
|
size,
|
|
173
167
|
as
|
|
174
168
|
}));
|
|
175
|
-
$[
|
|
176
|
-
$[
|
|
177
|
-
$[
|
|
178
|
-
$[
|
|
179
|
-
} else t26 = $[
|
|
169
|
+
$[22] = as;
|
|
170
|
+
$[23] = inputSizeCva;
|
|
171
|
+
$[24] = size;
|
|
172
|
+
$[25] = t26;
|
|
173
|
+
} else t26 = $[25];
|
|
180
174
|
let t27;
|
|
181
|
-
if ($[
|
|
175
|
+
if ($[26] !== as || $[27] !== headerProps) {
|
|
182
176
|
t27 = as && ["filter", "floating"].includes(as) && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
|
|
183
177
|
as,
|
|
184
178
|
...headerProps
|
|
185
179
|
});
|
|
186
|
-
$[
|
|
187
|
-
$[
|
|
188
|
-
$[
|
|
189
|
-
} else t27 = $[
|
|
180
|
+
$[26] = as;
|
|
181
|
+
$[27] = headerProps;
|
|
182
|
+
$[28] = t27;
|
|
183
|
+
} else t27 = $[28];
|
|
190
184
|
const t28 = shouldRenderTodayIconWithFieldLabel && todayIconButton;
|
|
191
185
|
let t29;
|
|
192
|
-
if ($[
|
|
186
|
+
if ($[29] !== datePickerInputContentRowCva || $[30] !== size) {
|
|
193
187
|
t29 = datePickerInputContentRowCva({ size });
|
|
194
|
-
$[
|
|
195
|
-
$[
|
|
196
|
-
$[
|
|
197
|
-
} else t29 = $[
|
|
188
|
+
$[29] = datePickerInputContentRowCva;
|
|
189
|
+
$[30] = size;
|
|
190
|
+
$[31] = t29;
|
|
191
|
+
} else t29 = $[31];
|
|
198
192
|
let t30;
|
|
199
|
-
if ($[
|
|
193
|
+
if ($[32] !== disableManualEntry || $[33] !== isDisabled || $[34] !== onOpenDropdown) {
|
|
200
194
|
t30 = disableManualEntry && /* @__PURE__ */ jsx(Button, {
|
|
201
195
|
onPress: onOpenDropdown,
|
|
202
196
|
className: "absolute inset-0 z-0",
|
|
203
197
|
isDisabled
|
|
204
198
|
});
|
|
205
|
-
$[
|
|
206
|
-
$[
|
|
207
|
-
$[
|
|
208
|
-
$[
|
|
209
|
-
} else t30 = $[
|
|
199
|
+
$[32] = disableManualEntry;
|
|
200
|
+
$[33] = isDisabled;
|
|
201
|
+
$[34] = onOpenDropdown;
|
|
202
|
+
$[35] = t30;
|
|
203
|
+
} else t30 = $[35];
|
|
210
204
|
const t31 = !shouldRenderTodayIconWithFieldLabel && todayIconButton;
|
|
211
205
|
let t32;
|
|
212
|
-
if ($[
|
|
206
|
+
if ($[36] !== as || $[37] !== dateGranularity || $[38] !== disableManualEntry || $[39] !== effectiveTimeZone || $[40] !== endFieldProps || $[41] !== fieldProps || $[42] !== format || $[43] !== hidePlaceholder || $[44] !== isDisabled || $[45] !== isInvalid || $[46] !== isTimeOptional || $[47] !== onClearChange || $[48] !== placeholder) {
|
|
213
207
|
t32 = disableManualEntry && placeholder && !fieldProps.value ? /* @__PURE__ */ jsx(Typography, {
|
|
214
208
|
size: "label-1",
|
|
215
209
|
className: "text-text-default-3",
|
|
@@ -241,23 +235,23 @@ var DatePickerInput = (t0) => {
|
|
|
241
235
|
format,
|
|
242
236
|
timeZone: effectiveTimeZone
|
|
243
237
|
})] })] });
|
|
244
|
-
$[
|
|
245
|
-
$[
|
|
246
|
-
$[
|
|
247
|
-
$[
|
|
248
|
-
$[
|
|
249
|
-
$[
|
|
250
|
-
$[
|
|
251
|
-
$[
|
|
252
|
-
$[
|
|
253
|
-
$[
|
|
254
|
-
$[
|
|
255
|
-
$[
|
|
256
|
-
$[
|
|
257
|
-
$[
|
|
258
|
-
} else t32 = $[
|
|
238
|
+
$[36] = as;
|
|
239
|
+
$[37] = dateGranularity;
|
|
240
|
+
$[38] = disableManualEntry;
|
|
241
|
+
$[39] = effectiveTimeZone;
|
|
242
|
+
$[40] = endFieldProps;
|
|
243
|
+
$[41] = fieldProps;
|
|
244
|
+
$[42] = format;
|
|
245
|
+
$[43] = hidePlaceholder;
|
|
246
|
+
$[44] = isDisabled;
|
|
247
|
+
$[45] = isInvalid;
|
|
248
|
+
$[46] = isTimeOptional;
|
|
249
|
+
$[47] = onClearChange;
|
|
250
|
+
$[48] = placeholder;
|
|
251
|
+
$[49] = t32;
|
|
252
|
+
} else t32 = $[49];
|
|
259
253
|
let t33;
|
|
260
|
-
if ($[
|
|
254
|
+
if ($[50] !== t29 || $[51] !== t30 || $[52] !== t31 || $[53] !== t32) {
|
|
261
255
|
t33 = /* @__PURE__ */ jsxs("div", {
|
|
262
256
|
className: t29,
|
|
263
257
|
children: [
|
|
@@ -266,14 +260,14 @@ var DatePickerInput = (t0) => {
|
|
|
266
260
|
t32
|
|
267
261
|
]
|
|
268
262
|
});
|
|
269
|
-
$[
|
|
270
|
-
$[
|
|
271
|
-
$[
|
|
272
|
-
$[
|
|
273
|
-
$[
|
|
274
|
-
} else t33 = $[
|
|
263
|
+
$[50] = t29;
|
|
264
|
+
$[51] = t30;
|
|
265
|
+
$[52] = t31;
|
|
266
|
+
$[53] = t32;
|
|
267
|
+
$[54] = t33;
|
|
268
|
+
} else t33 = $[54];
|
|
275
269
|
let t34;
|
|
276
|
-
if ($[
|
|
270
|
+
if ($[55] !== t26 || $[56] !== t27 || $[57] !== t28 || $[58] !== t33) {
|
|
277
271
|
t34 = /* @__PURE__ */ jsxs("div", {
|
|
278
272
|
className: t26,
|
|
279
273
|
children: [
|
|
@@ -282,36 +276,36 @@ var DatePickerInput = (t0) => {
|
|
|
282
276
|
t33
|
|
283
277
|
]
|
|
284
278
|
});
|
|
285
|
-
$[
|
|
286
|
-
$[
|
|
287
|
-
$[
|
|
288
|
-
$[
|
|
289
|
-
$[
|
|
290
|
-
} else t34 = $[
|
|
279
|
+
$[55] = t26;
|
|
280
|
+
$[56] = t27;
|
|
281
|
+
$[57] = t28;
|
|
282
|
+
$[58] = t33;
|
|
283
|
+
$[59] = t34;
|
|
284
|
+
} else t34 = $[59];
|
|
291
285
|
let t35;
|
|
292
|
-
if ($[
|
|
286
|
+
if ($[60] !== as || $[61] !== inputSizeCva || $[62] !== size) {
|
|
293
287
|
t35 = clsx(inputSizeCva({
|
|
294
288
|
size,
|
|
295
289
|
as
|
|
296
290
|
}), "flex items-center gap-input-gap-trailing-elements py-0! pl-0!");
|
|
297
|
-
$[
|
|
298
|
-
$[
|
|
299
|
-
$[
|
|
300
|
-
$[
|
|
301
|
-
} else t35 = $[
|
|
291
|
+
$[60] = as;
|
|
292
|
+
$[61] = inputSizeCva;
|
|
293
|
+
$[62] = size;
|
|
294
|
+
$[63] = t35;
|
|
295
|
+
} else t35 = $[63];
|
|
302
296
|
let t36;
|
|
303
|
-
if ($[
|
|
297
|
+
if ($[64] !== canClear || $[65] !== isClearable || $[66] !== onClear) {
|
|
304
298
|
t36 = isClearable && /* @__PURE__ */ jsx(InputClear, {
|
|
305
299
|
onClear,
|
|
306
300
|
show: canClear
|
|
307
301
|
});
|
|
308
|
-
$[
|
|
309
|
-
$[
|
|
310
|
-
$[
|
|
311
|
-
$[
|
|
312
|
-
} else t36 = $[
|
|
302
|
+
$[64] = canClear;
|
|
303
|
+
$[65] = isClearable;
|
|
304
|
+
$[66] = onClear;
|
|
305
|
+
$[67] = t36;
|
|
306
|
+
} else t36 = $[67];
|
|
313
307
|
let t37;
|
|
314
|
-
if ($[
|
|
308
|
+
if ($[68] !== buttonProps || $[69] !== disableDropdown || $[70] !== disableManualEntry || $[71] !== isDisabled || $[72] !== pickerIcon) {
|
|
315
309
|
t37 = (!disableDropdown || disableManualEntry) && /* @__PURE__ */ jsx(InlineIconButton, {
|
|
316
310
|
label: "",
|
|
317
311
|
color: "secondary",
|
|
@@ -320,26 +314,26 @@ var DatePickerInput = (t0) => {
|
|
|
320
314
|
isDisabled,
|
|
321
315
|
className: "border-0!"
|
|
322
316
|
});
|
|
323
|
-
$[
|
|
324
|
-
$[
|
|
325
|
-
$[
|
|
326
|
-
$[
|
|
327
|
-
$[
|
|
328
|
-
$[
|
|
329
|
-
} else t37 = $[
|
|
317
|
+
$[68] = buttonProps;
|
|
318
|
+
$[69] = disableDropdown;
|
|
319
|
+
$[70] = disableManualEntry;
|
|
320
|
+
$[71] = isDisabled;
|
|
321
|
+
$[72] = pickerIcon;
|
|
322
|
+
$[73] = t37;
|
|
323
|
+
} else t37 = $[73];
|
|
330
324
|
let t38;
|
|
331
|
-
if ($[
|
|
325
|
+
if ($[74] !== t35 || $[75] !== t36 || $[76] !== t37) {
|
|
332
326
|
t38 = /* @__PURE__ */ jsxs("div", {
|
|
333
327
|
className: t35,
|
|
334
328
|
children: [t36, t37]
|
|
335
329
|
});
|
|
336
|
-
$[
|
|
337
|
-
$[
|
|
338
|
-
$[
|
|
339
|
-
$[
|
|
340
|
-
} else t38 = $[
|
|
330
|
+
$[74] = t35;
|
|
331
|
+
$[75] = t36;
|
|
332
|
+
$[76] = t37;
|
|
333
|
+
$[77] = t38;
|
|
334
|
+
} else t38 = $[77];
|
|
341
335
|
let t39;
|
|
342
|
-
if ($[
|
|
336
|
+
if ($[78] !== focusWithinProps || $[79] !== groupProps || $[80] !== hoverProps || $[81] !== t14 || $[82] !== t15 || $[83] !== t16 || $[84] !== t17 || $[85] !== t18 || $[86] !== t19 || $[87] !== t20 || $[88] !== t21 || $[89] !== t22 || $[90] !== t23 || $[91] !== t24 || $[92] !== t25 || $[93] !== t34 || $[94] !== t38) {
|
|
343
337
|
t39 = /* @__PURE__ */ jsxs("div", {
|
|
344
338
|
ref: containerRef,
|
|
345
339
|
className: t14,
|
|
@@ -361,25 +355,25 @@ var DatePickerInput = (t0) => {
|
|
|
361
355
|
...hoverProps,
|
|
362
356
|
children: [t34, t38]
|
|
363
357
|
});
|
|
364
|
-
$[
|
|
365
|
-
$[
|
|
366
|
-
$[
|
|
367
|
-
$[
|
|
368
|
-
$[
|
|
369
|
-
$[
|
|
370
|
-
$[
|
|
371
|
-
$[
|
|
372
|
-
$[
|
|
373
|
-
$[
|
|
374
|
-
$[
|
|
375
|
-
$[
|
|
376
|
-
$[
|
|
377
|
-
$[
|
|
378
|
-
$[
|
|
379
|
-
$[
|
|
380
|
-
$[
|
|
381
|
-
$[
|
|
382
|
-
} else t39 = $[
|
|
358
|
+
$[78] = focusWithinProps;
|
|
359
|
+
$[79] = groupProps;
|
|
360
|
+
$[80] = hoverProps;
|
|
361
|
+
$[81] = t14;
|
|
362
|
+
$[82] = t15;
|
|
363
|
+
$[83] = t16;
|
|
364
|
+
$[84] = t17;
|
|
365
|
+
$[85] = t18;
|
|
366
|
+
$[86] = t19;
|
|
367
|
+
$[87] = t20;
|
|
368
|
+
$[88] = t21;
|
|
369
|
+
$[89] = t22;
|
|
370
|
+
$[90] = t23;
|
|
371
|
+
$[91] = t24;
|
|
372
|
+
$[92] = t25;
|
|
373
|
+
$[93] = t34;
|
|
374
|
+
$[94] = t38;
|
|
375
|
+
$[95] = t39;
|
|
376
|
+
} else t39 = $[95];
|
|
383
377
|
return t39;
|
|
384
378
|
};
|
|
385
379
|
//#endregion
|