@povio/ui 2.3.2-rc.3 → 2.3.3

package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js

@@ -1,21 +1,13 @@
-import { UIStyle } from "../../../../config/uiStyle.context.js";
 import { Typography } from "../../../text/Typography/Typography.js";
 import { UIConfig } from "../../../../config/uiConfig.context.js";
 import "../../../../config/i18n.js";
 import { DateTimeUtils } from "../../../../utils/date-time.utils.js";
-import { datePickerInputContentRow } from "../shared/datePickerInput.cva.js";
-import { renderDatePickerTodayIcon } from "../shared/datePickerTodayIcon.js";
 import { DatePickerInput } from "../shared/DatePickerInput.js";
 import { DateTimeDialog } from "../shared/DateTimeDialog.js";
 import { DateTimeDialogFooter } from "../shared/DateTimeDialogFooter.js";
-import { getStaticDateRangeSegments } from "../shared/staticDateTimeSegments.js";
 import { FormField } from "../../FormField/FormField.js";
 import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
-import { InputFrame } from "../../Skeleton/InputFrame.js";
-import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
-import { useDebounceCallback } from "../../../../hooks/useDebounceCallback.js";
 import { RangeCalendar } from "../shared/RangeCalendar.js";
-import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { useCallback, useImperativeHandle, useMemo, useRef, useState } from "react";
@@ -24,73 +16,58 @@ import { useDateRangePicker, useLocale as useLocale$1 } from "react-aria";
 import { mergeRefs } from "@react-aria/utils";
 import { useTranslation } from "react-i18next";
 import { Controller } from "react-hook-form";
-import { createCalendar, endOfMonth, endOfWeek, endOfYear, startOfMonth, startOfWeek, startOfYear, toCalendarDate, today } from "@internationalized/date";
+import { createCalendar, endOfMonth, endOfWeek, endOfYear, getLocalTimeZone, startOfMonth, startOfWeek, startOfYear, toCalendarDate, today } from "@internationalized/date";
 import { DateTime } from "luxon";
 import { useDateRangePickerState, useRangeCalendarState } from "react-stately";
 //#region src/components/inputs/DateTime/DateRangePicker/DateRangePicker.tsx
-var DATE_PICKER_TIME_ZONE = "UTC";
 var DateRangePickerBase = (props) => {
 	const ui = UIConfig.useConfig();
 	const { t } = useTranslation();
-	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, className, hideSidebar, placeholder, inputClassName, hideLabel: hideLabelProp, variant: variantProp, as: asProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconButtonComponent: todayIconButtonComponentProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, autoFixYear: autoFixYearProp, fireBlurOnChange: fireBlurOnChangeProp, ...rest } = props;
-	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
-	const variant = variantProp ?? ui.input.variant;
-	const as = asProp ?? ui.input.as;
-	const size = sizeProp ?? ui.input.size;
-	const isClearable = isClearableProp ?? ui.input.isClearable;
-	const todayIcon = todayIconProp ?? ui.dateInput.todayIcon;
-	const todayIconButtonSize = todayIconButtonSizeProp ?? ui.dateInput.todayIconButtonSize;
-	const todayIconButtonComponent = todayIconButtonComponentProp ?? ui.dateInput.todayIconButtonComponent;
-	const todayIconPlacement = todayIconPlacementProp ?? ui.dateInput.todayIconPlacement;
-	const shouldForceLeadingZeros = shouldForceLeadingZerosProp ?? ui.dateInput.shouldForceLeadingZeros;
-	const disableManualEntry = disableManualEntryProp ?? ui.dateInput.disableManualEntry;
-	const autoFixYear = autoFixYearProp ?? ui.dateInput.autoFixYear;
-	const fireBlurOnChange = fireBlurOnChangeProp ?? ui.dateInput.fireBlurOnChange;
+	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, value, disableDropdown, className, hideSidebar, placeholder, inputClassName, hideLabel = ui.input.hideLabel, variant = ui.input.variant, as = ui.input.as, size = ui.input.size, isClearable = ui.input.isClearable, todayIcon = ui.dateInput.todayIcon, shouldForceLeadingZeros = ui.dateInput.shouldForceLeadingZeros, disableManualEntry = ui.dateInput.disableManualEntry, autoFixYear = ui.dateInput.autoFixYear, minValue, maxValue, ...rest } = props;
 	const [validationRangeError, setValidationRangeError] = useState();
 	const datePickerInputRef = useRef(null);
 	const dateRangePickerRef = useMemo(() => ({ get current() {
 		return datePickerInputRef.current?.getContainer?.() || null;
 	} }), []);
-	const normalizedValue = value ?? null;
 	const dialogState = useDateRangePickerState({
 		...rest,
-		value: normalizedValue,
+		value,
 		shouldCloseOnSelect: false,
-		shouldForceLeadingZeros
+		shouldForceLeadingZeros,
+		minValue,
+		maxValue
 	});
 	const state = useDateRangePickerState({
 		...rest,
 		shouldForceLeadingZeros,
-		value: normalizedValue,
+		value,
+		minValue,
+		maxValue,
 		onChange: (newValue) => {
 			if (isValidRange(newValue)) return;
 			onChange?.(newValue);
 			handleCalendarStatesChange(newValue);
-			if (fireBlurOnChange) debouncedBlur(newValue);
 		},
 		shouldCloseOnSelect: false
 	});
 	const { groupProps, labelProps, startFieldProps, endFieldProps, buttonProps, dialogProps } = useDateRangePicker({
 		...rest,
 		label,
-		shouldForceLeadingZeros
+		shouldForceLeadingZeros,
+		minValue,
+		maxValue
 	}, state, dateRangePickerRef);
 	const { calendarProps } = useDateRangePicker({
 		...rest,
 		label,
-		shouldForceLeadingZeros
+		shouldForceLeadingZeros,
+		minValue,
+		maxValue
 	}, dialogState, dateRangePickerRef);
 	const { locale } = useLocale$1();
-	useImperativeHandle(ref, () => ({
-		clear: () => {
-			datePickerInputRef.current?.clear();
-		},
-		getContainer: () => datePickerInputRef.current?.getContainer?.() ?? null
-	}));
-	const handleBlur = (newValue_0) => {
-		onBlur?.({ target: { value: newValue_0 } });
-	};
-	const { callback: debouncedBlur } = useDebounceCallback(handleBlur, { delay: 500 });
+	useImperativeHandle(ref, () => ({ clear: () => {
+		datePickerInputRef.current?.clear();
+	} }));
 	const formFieldProps = {
 		error: error || validationRangeError,
 		label,
@@ -110,8 +87,8 @@ var DateRangePickerBase = (props) => {
 		createCalendar,
 		pageBehavior: "single",
 		visibleDuration: { months: 1 },
-		minValue: void 0,
-		maxValue: void 0
+		minValue,
+		maxValue
 	});
 	const rightCalendarState = useRangeCalendarState({
 		...calendarProps,
@@ -119,9 +96,9 @@ var DateRangePickerBase = (props) => {
 		createCalendar,
 		pageBehavior: "single",
 		visibleDuration: { months: 1 },
-		defaultFocusedValue: today(DATE_PICKER_TIME_ZONE).add({ months: 1 }),
-		minValue: void 0,
-		maxValue: void 0
+		defaultFocusedValue: today(getLocalTimeZone()).add({ months: 1 }),
+		minValue,
+		maxValue
 	});
 	const [activePreset, setActivePreset] = useState(null);
 	const [rangeSelection, setRangeSelection] = useState({
@@ -141,10 +118,36 @@ var DateRangePickerBase = (props) => {
 		className: headerClassName,
 		labelProps
 	};
-	const isValidRange = useCallback((newValue_1) => {
-		if (newValue_1?.start && newValue_1?.end) {
-			const startDate = newValue_1.start;
-			if (newValue_1.end.compare(startDate) < 0) {
+	const isDateOutsideBounds = useCallback((date) => {
+		if (minValue && date.compare(minValue) < 0) return true;
+		if (maxValue && date.compare(maxValue) > 0) return true;
+		return false;
+	}, [minValue, maxValue]);
+	const clampRangeToBounds = useCallback((range) => {
+		if (range === null) return null;
+		if (minValue && maxValue && minValue.compare(maxValue) > 0) return null;
+		let startDate = range.start;
+		let endDate = range.end;
+		if (minValue && endDate.compare(minValue) < 0 || maxValue && startDate.compare(maxValue) > 0) return null;
+		if (minValue && startDate.compare(minValue) < 0) startDate = minValue;
+		if (maxValue && startDate.compare(maxValue) > 0) startDate = maxValue;
+		if (minValue && endDate.compare(minValue) < 0) endDate = minValue;
+		if (maxValue && endDate.compare(maxValue) > 0) endDate = maxValue;
+		if (startDate.compare(endDate) > 0) return null;
+		return {
+			start: startDate,
+			end: endDate
+		};
+	}, [minValue, maxValue]);
+	const isRangeWithinBounds = useCallback((range) => {
+		if (minValue && range.start.compare(minValue) < 0) return false;
+		if (maxValue && range.end.compare(maxValue) > 0) return false;
+		return true;
+	}, [minValue, maxValue]);
+	const isValidRange = useCallback((newValue) => {
+		if (newValue?.start && newValue?.end) {
+			const startDate = newValue.start;
+			if (newValue.end.compare(startDate) < 0) {
 				setValidationRangeError(t(($) => $.ui.datePicker.errors.endDateBeforeStart, { ns: "ui" }));
 				return true;
 			}
@@ -152,20 +155,22 @@ var DateRangePickerBase = (props) => {
 		} else setValidationRangeError(void 0);
 		return false;
 	}, [t]);
-	const handleCalendarStatesChange = (newValue_2) => {
-		if (newValue_2) {
-			if (isValidRange(newValue_2)) return;
-			dialogState.setValue(newValue_2);
-			const startDate_0 = newValue_2.start;
-			const endDate_0 = newValue_2.end;
-			leftCalendarState.setFocusedDate(startDate_0);
-			if (startDate_0.year === endDate_0.year && startDate_0.month === endDate_0.month) rightCalendarState.setFocusedDate(startDate_0.add({ months: 1 }));
-			else rightCalendarState.setFocusedDate(endDate_0);
-			leftCalendarState.setValue(newValue_2);
-			rightCalendarState.setValue(newValue_2);
+	const handleCalendarStatesChange = (newValue) => {
+		if (newValue) {
+			const clampedValue = clampRangeToBounds(newValue);
+			if (!clampedValue) return;
+			if (isValidRange(clampedValue)) return;
+			dialogState.setValue(clampedValue);
+			const startDate = clampedValue.start;
+			const endDate = clampedValue.end;
+			leftCalendarState.setFocusedDate(startDate);
+			if (startDate.year === endDate.year && startDate.month === endDate.month) rightCalendarState.setFocusedDate(startDate.add({ months: 1 }));
+			else rightCalendarState.setFocusedDate(endDate);
+			leftCalendarState.setValue(clampedValue);
+			rightCalendarState.setValue(clampedValue);
 			setRangeSelection({
-				start: newValue_2.start,
-				end: newValue_2.end,
+				start: clampedValue.start,
+				end: clampedValue.end,
 				isSelecting: false
 			});
 			setHoverDate(null);
@@ -189,27 +194,28 @@ var DateRangePickerBase = (props) => {
 			setHoverDate(date);
 		});
 	}, []);
-	const handleDateHover = useCallback((date_0) => {
-		if (rangeSelection.isSelecting && rangeSelection.start) throttledSetHoverDate(date_0);
+	const handleDateHover = useCallback((date) => {
+		if (rangeSelection.isSelecting && rangeSelection.start) throttledSetHoverDate(date);
 	}, [
 		rangeSelection.isSelecting,
 		rangeSelection.start,
 		throttledSetHoverDate
 	]);
-	const handleDateSelection = useCallback((date_1, calendarSide) => {
+	const handleDateSelection = useCallback((date, calendarSide) => {
 		if (calendarSide) {
 			const currentVisibleMonth = (calendarSide === "left" ? leftCalendarState : rightCalendarState).visibleRange.start;
-			if (date_1.month !== currentVisibleMonth.month || date_1.year !== currentVisibleMonth.year) if (calendarSide === "left") {
-				leftCalendarState.setFocusedDate(date_1);
-				rightCalendarState.setFocusedDate(date_1.add({ months: 1 }));
+			if (date.month !== currentVisibleMonth.month || date.year !== currentVisibleMonth.year) if (calendarSide === "left") {
+				leftCalendarState.setFocusedDate(date);
+				rightCalendarState.setFocusedDate(date.add({ months: 1 }));
 			} else {
-				rightCalendarState.setFocusedDate(date_1);
-				leftCalendarState.setFocusedDate(date_1.subtract({ months: 1 }));
+				rightCalendarState.setFocusedDate(date);
+				leftCalendarState.setFocusedDate(date.subtract({ months: 1 }));
 			}
 		}
+		if (isDateOutsideBounds(date)) return;
 		if (!rangeSelection.isSelecting || !rangeSelection.start) {
 			setRangeSelection({
-				start: date_1,
+				start: date,
 				end: null,
 				isSelecting: true
 			});
@@ -218,19 +224,18 @@ var DateRangePickerBase = (props) => {
 			rightCalendarState.setValue(null);
 		} else {
 			const { start } = rangeSelection;
-			const end = date_1;
-			const finalStart = start.compare(end) <= 0 ? start : end;
-			const finalEnd = start.compare(end) <= 0 ? end : start;
-			const newRange = {
-				start: finalStart,
-				end: finalEnd
-			};
-			leftCalendarState.setValue(newRange);
-			rightCalendarState.setValue(newRange);
-			dialogState.setValue(newRange);
+			const end = date;
+			const clampedRange = clampRangeToBounds({
+				start: start.compare(end) <= 0 ? start : end,
+				end: start.compare(end) <= 0 ? end : start
+			});
+			if (!clampedRange) return;
+			leftCalendarState.setValue(clampedRange);
+			rightCalendarState.setValue(clampedRange);
+			dialogState.setValue(clampedRange);
 			setRangeSelection({
-				start: finalStart,
-				end: finalEnd,
+				start: clampedRange.start,
+				end: clampedRange.end,
 				isSelecting: false
 			});
 			setHoverDate(null);
@@ -240,18 +245,20 @@ var DateRangePickerBase = (props) => {
 		rangeSelection,
 		leftCalendarState,
 		rightCalendarState,
-		dialogState
+		dialogState,
+		isDateOutsideBounds,
+		clampRangeToBounds
 	]);
-	const handleKeyboardNavigation = useCallback((event, date_2, calendarSide_0) => {
-		const currentState_0 = calendarSide_0 === "left" ? leftCalendarState : rightCalendarState;
-		const otherState = calendarSide_0 === "left" ? rightCalendarState : leftCalendarState;
+	const handleKeyboardNavigation = useCallback((event, date, calendarSide) => {
+		const currentState = calendarSide === "left" ? leftCalendarState : rightCalendarState;
+		const otherState = calendarSide === "left" ? rightCalendarState : leftCalendarState;
 		let shouldPreventDefault = false;
 		switch (event.key) {
 			case "ArrowRight": {
-				const nextDate = date_2.add({ days: 1 });
-				const currentMonth_2 = currentState_0.visibleRange.start;
-				const otherMonth_2 = otherState.visibleRange.start;
-				if (calendarSide_0 === "left" && nextDate.month !== currentMonth_2.month) if (nextDate.year === otherMonth_2.year && nextDate.month === otherMonth_2.month) {
+				const nextDate = date.add({ days: 1 });
+				const currentMonth = currentState.visibleRange.start;
+				const otherMonth = otherState.visibleRange.start;
+				if (calendarSide === "left" && nextDate.month !== currentMonth.month) if (nextDate.year === otherMonth.year && nextDate.month === otherMonth.month) {
 					otherState.setFocusedDate(nextDate);
 					shouldPreventDefault = true;
 				} else {
@@ -261,10 +268,10 @@ var DateRangePickerBase = (props) => {
 				break;
 			}
 			case "ArrowLeft": {
-				const prevDate = date_2.subtract({ days: 1 });
-				const currentMonth_1 = currentState_0.visibleRange.start;
-				const otherMonth_1 = otherState.visibleRange.start;
-				if (calendarSide_0 === "right" && prevDate.month !== currentMonth_1.month) if (prevDate.year === otherMonth_1.year && prevDate.month === otherMonth_1.month) {
+				const prevDate = date.subtract({ days: 1 });
+				const currentMonth = currentState.visibleRange.start;
+				const otherMonth = otherState.visibleRange.start;
+				if (calendarSide === "right" && prevDate.month !== currentMonth.month) if (prevDate.year === otherMonth.year && prevDate.month === otherMonth.month) {
 					otherState.setFocusedDate(prevDate);
 					shouldPreventDefault = true;
 				} else {
@@ -274,10 +281,10 @@ var DateRangePickerBase = (props) => {
 				break;
 			}
 			case "ArrowDown": {
-				const nextWeekDate = date_2.add({ weeks: 1 });
-				const currentMonth_0 = currentState_0.visibleRange.start;
-				const otherMonth_0 = otherState.visibleRange.start;
-				if (calendarSide_0 === "left" && nextWeekDate.month !== currentMonth_0.month) if (nextWeekDate.year === otherMonth_0.year && nextWeekDate.month === otherMonth_0.month) {
+				const nextWeekDate = date.add({ weeks: 1 });
+				const currentMonth = currentState.visibleRange.start;
+				const otherMonth = otherState.visibleRange.start;
+				if (calendarSide === "left" && nextWeekDate.month !== currentMonth.month) if (nextWeekDate.year === otherMonth.year && nextWeekDate.month === otherMonth.month) {
 					otherState.setFocusedDate(nextWeekDate);
 					shouldPreventDefault = true;
 				} else {
@@ -287,10 +294,10 @@ var DateRangePickerBase = (props) => {
 				break;
 			}
 			case "ArrowUp": {
-				const prevWeekDate = date_2.subtract({ weeks: 1 });
-				const currentMonth = currentState_0.visibleRange.start;
+				const prevWeekDate = date.subtract({ weeks: 1 });
+				const currentMonth = currentState.visibleRange.start;
 				const otherMonth = otherState.visibleRange.start;
-				if (calendarSide_0 === "right" && prevWeekDate.month !== currentMonth.month) if (prevWeekDate.year === otherMonth.year && prevWeekDate.month === otherMonth.month) {
+				if (calendarSide === "right" && prevWeekDate.month !== currentMonth.month) if (prevWeekDate.year === otherMonth.year && prevWeekDate.month === otherMonth.month) {
 					otherState.setFocusedDate(prevWeekDate);
 					shouldPreventDefault = true;
 				} else {
@@ -301,7 +308,7 @@ var DateRangePickerBase = (props) => {
 			}
 			case "Enter":
 			case " ":
-				handleDateSelection(date_2);
+				handleDateSelection(date);
 				shouldPreventDefault = true;
 				break;
 			case "Escape":
@@ -325,19 +332,29 @@ var DateRangePickerBase = (props) => {
 		rightCalendarState,
 		handleDateSelection
 	]);
-	const syncCalendarStates = useCallback((newValue_3) => {
-		if (isValidRange(newValue_3)) return;
-		leftCalendarState.setValue(newValue_3);
-		rightCalendarState.setValue(newValue_3);
-		dialogState.setValue(newValue_3);
-		if (newValue_3) setRangeSelection({
-			start: newValue_3.start,
-			end: newValue_3.end,
-			isSelecting: false
-		});
-		else setRangeSelection({
-			start: null,
-			end: null,
+	const syncCalendarStates = useCallback((newValue) => {
+		if (newValue === null) {
+			setValidationRangeError(void 0);
+			leftCalendarState.setValue(null);
+			rightCalendarState.setValue(null);
+			dialogState.setValue(null);
+			setRangeSelection({
+				start: null,
+				end: null,
+				isSelecting: false
+			});
+			setHoverDate(null);
+			return;
+		}
+		const clampedValue = clampRangeToBounds(newValue);
+		if (!clampedValue) return;
+		if (isValidRange(clampedValue)) return;
+		leftCalendarState.setValue(clampedValue);
+		rightCalendarState.setValue(clampedValue);
+		dialogState.setValue(clampedValue);
+		setRangeSelection({
+			start: clampedValue.start,
+			end: clampedValue.end,
 			isSelecting: false
 		});
 		setHoverDate(null);
@@ -345,30 +362,32 @@ var DateRangePickerBase = (props) => {
 		isValidRange,
 		leftCalendarState,
 		rightCalendarState,
-		dialogState
+		dialogState,
+		clampRangeToBounds
 	]);
 	const onApply = () => {
-		const valueToApply = rangeSelection.start && rangeSelection.end ? {
+		let valueToApply = dialogState.value;
+		if (rangeSelection.start && rangeSelection.end) valueToApply = {
 			start: rangeSelection.start,
 			end: rangeSelection.end
-		} : dialogState.value;
-		if (valueToApply) {
-			state.setValue(valueToApply);
-			if (fireBlurOnChange) handleBlur(valueToApply);
-		}
+		};
+		const clampedValue = clampRangeToBounds(valueToApply);
+		if (clampedValue) state.setValue(clampedValue);
 		state.toggle();
 	};
 	const onTodayPress = () => {
-		const todayDate = today(DATE_PICKER_TIME_ZONE);
-		leftCalendarState.setFocusedDate(todayDate);
-		rightCalendarState.setFocusedDate(todayDate.add({ months: 1 }));
-		syncCalendarStates({
+		const todayDate = today(getLocalTimeZone());
+		const clampedTodayRange = clampRangeToBounds({
 			start: todayDate,
 			end: todayDate
 		});
-	};
-	const onInputClear = () => {
-		onChange?.(null);
+		if (!clampedTodayRange) return;
+		const startDate = clampedTodayRange.start;
+		const endDate = clampedTodayRange.end;
+		leftCalendarState.setFocusedDate(startDate);
+		if (startDate.year === endDate.year && startDate.month === endDate.month) rightCalendarState.setFocusedDate(startDate.add({ months: 1 }));
+		else rightCalendarState.setFocusedDate(endDate);
+		syncCalendarStates(clampedTodayRange);
 	};
 	const onOpenChange = (isOpen) => {
 		state.toggle();
@@ -377,11 +396,11 @@ var DateRangePickerBase = (props) => {
 				dialogState.setValue(state.value);
 				leftCalendarState.setValue(state.value);
 				rightCalendarState.setValue(state.value);
-				const startDate_1 = state.value.start || today(DATE_PICKER_TIME_ZONE);
-				const endDate_1 = state.value.end || today(DATE_PICKER_TIME_ZONE).add({ months: 1 });
-				leftCalendarState.setFocusedDate(startDate_1);
-				if (startDate_1.year === endDate_1.year && startDate_1.month === endDate_1.month) rightCalendarState.setFocusedDate(startDate_1.add({ months: 1 }));
-				else rightCalendarState.setFocusedDate(endDate_1);
+				const startDate = state.value.start || today(getLocalTimeZone());
+				const endDate = state.value.end || today(getLocalTimeZone()).add({ months: 1 });
+				leftCalendarState.setFocusedDate(startDate);
+				if (startDate.year === endDate.year && startDate.month === endDate.month) rightCalendarState.setFocusedDate(startDate.add({ months: 1 }));
+				else rightCalendarState.setFocusedDate(endDate);
 				setRangeSelection({
 					start: state.value.start,
 					end: state.value.end,
@@ -390,100 +409,125 @@ var DateRangePickerBase = (props) => {
 			}
 		}
 	};
-	const todayDate_0 = today(DATE_PICKER_TIME_ZONE);
+	const todayDate = today(getLocalTimeZone());
 	const getThisWeekRange = () => {
 		return {
-			start: startOfWeek(todayDate_0, locale),
-			end: endOfWeek(todayDate_0, locale)
+			start: startOfWeek(todayDate, locale),
+			end: endOfWeek(todayDate, locale)
 		};
 	};
 	const getLastWeekRange = () => {
-		const thisWeekStart = startOfWeek(todayDate_0, locale);
+		const thisWeekStart = startOfWeek(todayDate, locale);
 		return {
 			start: thisWeekStart.subtract({ weeks: 1 }),
 			end: thisWeekStart.subtract({ days: 1 })
 		};
 	};
 	const getThisAndLastWeekRange = () => {
-		const thisWeekEnd = endOfWeek(todayDate_0, locale);
+		const thisWeekEnd = endOfWeek(todayDate, locale);
 		return {
-			start: startOfWeek(todayDate_0, locale).subtract({ weeks: 1 }),
+			start: startOfWeek(todayDate, locale).subtract({ weeks: 1 }),
 			end: thisWeekEnd
 		};
 	};
 	const getThisMonthRange = () => {
 		return {
-			start: startOfMonth(todayDate_0),
-			end: endOfMonth(todayDate_0)
+			start: startOfMonth(todayDate),
+			end: endOfMonth(todayDate)
 		};
 	};
 	const getThisAndLastMonthRange = () => {
-		const thisMonthEnd = endOfMonth(todayDate_0);
+		const thisMonthEnd = endOfMonth(todayDate);
 		return {
-			start: startOfMonth(todayDate_0).subtract({ months: 1 }),
+			start: startOfMonth(todayDate).subtract({ months: 1 }),
 			end: thisMonthEnd
 		};
 	};
+	const createPreset = (params) => {
+		let clampedValue = clampRangeToBounds(params.getValue());
+		let isDisabled = false;
+		if (params.keepEnabledUnlessFutureMin) {
+			let minDateIsInFuture = false;
+			if (minValue && minValue.compare(todayDate) > 0) minDateIsInFuture = true;
+			if (minDateIsInFuture) {
+				isDisabled = true;
+				clampedValue = null;
+			} else if (!clampedValue && maxValue) clampedValue = {
+				start: maxValue,
+				end: maxValue
+			};
+		}
+		if (!clampedValue) isDisabled = true;
+		if (clampedValue && !isRangeWithinBounds(clampedValue)) isDisabled = true;
+		return {
+			label: params.label,
+			getValue: params.getValue,
+			clampedValue,
+			isDisabled
+		};
+	};
 	const presets = [
-		{
-			label: t(($_0) => $_0.ui.datePicker.presets.thisWeek, { ns: "ui" }),
+		createPreset({
+			label: t(($) => $.ui.datePicker.presets.thisWeek, { ns: "ui" }),
 			getValue: getThisWeekRange
-		},
-		{
-			label: t(($_1) => $_1.ui.datePicker.presets.lastWeek, { ns: "ui" }),
+		}),
+		createPreset({
+			label: t(($) => $.ui.datePicker.presets.lastWeek, { ns: "ui" }),
 			getValue: getLastWeekRange
-		},
-		{
-			label: t(($_2) => $_2.ui.datePicker.presets.thisAndLastWeek, { ns: "ui" }),
+		}),
+		createPreset({
+			label: t(($) => $.ui.datePicker.presets.thisAndLastWeek, { ns: "ui" }),
 			getValue: getThisAndLastWeekRange
-		},
-		{
-			label: t(($_3) => $_3.ui.datePicker.presets.thisMonth, { ns: "ui" }),
+		}),
+		createPreset({
+			label: t(($) => $.ui.datePicker.presets.thisMonth, { ns: "ui" }),
 			getValue: getThisMonthRange
-		},
-		{
-			label: t(($_4) => $_4.ui.datePicker.presets.thisAndLastMonth, { ns: "ui" }),
+		}),
+		createPreset({
+			label: t(($) => $.ui.datePicker.presets.thisAndLastMonth, { ns: "ui" }),
 			getValue: getThisAndLastMonthRange
-		},
-		{
-			label: t(($_5) => $_5.ui.datePicker.presets.thisYear, { ns: "ui" }),
+		}),
+		createPreset({
+			label: t(($) => $.ui.datePicker.presets.thisYear, { ns: "ui" }),
 			getValue: () => ({
-				start: startOfYear(todayDate_0),
-				end: todayDate_0
+				start: startOfYear(todayDate),
+				end: todayDate
 			})
-		},
-		{
-			label: t(($_6) => $_6.ui.datePicker.presets.lastYear, { ns: "ui" }),
+		}),
+		createPreset({
+			label: t(($) => $.ui.datePicker.presets.lastYear, { ns: "ui" }),
 			getValue: () => ({
-				start: startOfYear(todayDate_0.subtract({ years: 1 })),
-				end: endOfYear(todayDate_0.subtract({ years: 1 }))
+				start: startOfYear(todayDate.subtract({ years: 1 })),
+				end: endOfYear(todayDate.subtract({ years: 1 }))
 			})
-		},
-		{
-			label: t(($_7) => $_7.ui.datePicker.presets.thisAndLastYear, { ns: "ui" }),
+		}),
+		createPreset({
+			label: t(($) => $.ui.datePicker.presets.thisAndLastYear, { ns: "ui" }),
 			getValue: () => ({
-				start: startOfYear(todayDate_0.subtract({ years: 1 })),
-				end: todayDate_0
+				start: startOfYear(todayDate.subtract({ years: 1 })),
+				end: todayDate
 			})
-		},
-		{
-			label: t(($_8) => $_8.ui.datePicker.presets.soFar, { ns: "ui" }),
+		}),
+		createPreset({
+			label: t(($) => $.ui.datePicker.presets.soFar, { ns: "ui" }),
 			getValue: () => ({
-				start: startOfYear(todayDate_0),
-				end: todayDate_0
-			})
-		}
+				start: startOfYear(todayDate),
+				end: todayDate
+			}),
+			keepEnabledUnlessFutureMin: true
+		})
 	];
 	const selectPreset = (preset) => {
+		if (preset.isDisabled || !preset.clampedValue) return;
 		setActivePreset(preset.label);
-		const presetValue = preset.getValue();
+		const presetValue = preset.clampedValue;
 		syncCalendarStates(presetValue);
-		const startDate_2 = presetValue.start;
-		leftCalendarState.setFocusedDate(startDate_2);
-		const endDate_2 = presetValue.end;
-		if ((endDate_2.year - startDate_2.year) * 12 + (endDate_2.month - startDate_2.month) > 2) rightCalendarState.setFocusedDate(endDate_2);
+		const startDate = presetValue.start;
+		leftCalendarState.setFocusedDate(startDate);
+		const endDate = presetValue.end;
+		if ((endDate.year - startDate.year) * 12 + (endDate.month - startDate.month) > 2) rightCalendarState.setFocusedDate(endDate);
 		else {
-			const rightCalendarMonth = startDate_2.add({ months: 1 });
+			const rightCalendarMonth = startDate.add({ months: 1 });
 			rightCalendarState.setFocusedDate(rightCalendarMonth);
 		}
 	};
@@ -501,24 +545,8 @@ var DateRangePickerBase = (props) => {
 				ref: mergeRefs(ref, datePickerInputRef),
 				as,
 				groupProps,
-				fieldProps: {
-					...startFieldProps,
-					onBlur: (event_0) => {
-						startFieldProps.onBlur?.(event_0);
-						handleBlur(state.value);
-					}
-				},
-				endFieldProps: {
-					...endFieldProps,
-					onBlur: (event_1) => {
-						endFieldProps.onBlur?.(event_1);
-						handleBlur(state.value);
-					}
-				},
-				fieldValue: normalizedValue?.start ?? null,
-				endFieldValue: normalizedValue?.end ?? null,
-				isValueControlled: true,
-				hasValue: normalizedValue?.start != null || normalizedValue?.end != null,
+				fieldProps: startFieldProps,
+				endFieldProps,
 				buttonProps,
 				isDisabled,
 				isInvalid: !!error,
@@ -528,33 +556,28 @@ var DateRangePickerBase = (props) => {
 				isClearable,
 				headerProps,
 				todayIcon,
-				todayIconButtonSize,
-				todayIconButtonComponent,
-				todayIconPlacement,
 				isDirty,
 				disableManualEntry,
-				autoFixYear,
 				placeholder,
 				className: inputClassName,
 				onOpenDropdown: () => state.toggle(),
-				timeZone: DATE_PICKER_TIME_ZONE,
-				fireBlurOnChange,
-				onClear: onInputClear
+				autoFixYear
 			}), /* @__PURE__ */ jsx(DateTimeDialog, {
 				hideSidebar,
 				sidebar: /* @__PURE__ */ jsx("div", {
 					className: "flex w-full flex-row overflow-auto border-elevation-outline-default-1 border-solid [-ms-overflow-style:none] [scrollbar-width:none] md:w-[156px] md:flex-col md:border-r [&::-webkit-scrollbar]:hidden",
-					children: presets.map((preset_0) => /* @__PURE__ */ jsx(Button, {
-						onClick: () => selectPreset(preset_0),
-						className: clsx("w-full px-2 py-1 text-left md:px-list-side-item-left md:py-list-height-item", activePreset !== preset_0.label && "text-interactive-text-secondary-idle hover:text-interactive-text-secondary-hover", activePreset === preset_0.label && "bg-interactive-contained-primary-idle text-interactive-text-secondary-idle-inverted"),
+					children: presets.map((preset) => /* @__PURE__ */ jsx(Button, {
+						isDisabled: preset.isDisabled,
+						onClick: () => selectPreset(preset),
+						className: clsx("w-full px-2 py-1 text-left md:px-list-side-item-left md:py-list-height-item disabled:text-interactive-text-secondary-disabled!", activePreset !== preset.label && "text-interactive-text-secondary-idle hover:text-interactive-text-secondary-hover", activePreset === preset.label && "bg-interactive-contained-primary-idle text-interactive-text-secondary-idle-inverted"),
 						children: /* @__PURE__ */ jsx(Typography, {
 							size: "label-2",
 							sizeMobile: "label-3",
 							as: "span",
 							className: "whitespace-nowrap",
-							children: preset_0.label
+							children: preset.label
 						})
-					}, preset_0.label))
+					}, preset.label))
 				}),
 				footer: /* @__PURE__ */ jsx(DateTimeDialogFooter, {
 					isDisabled,
@@ -589,300 +612,69 @@ var DateRangePickerBase = (props) => {
 		})
 	});
 };
-var DateRangePickerInner = (t0) => {
-	const $ = c(25);
-	const { fullIso: t1, minValue, maxValue, renderStaticInput, isFormControlDisabled, ...props } = t0;
-	const fullIso = t1 === void 0 ? true : t1;
-	const ui = UIConfig.useConfig();
-	const datePickerInputContentRowCva = UIStyle.useCva("datePickerInput.contentRowCva", datePickerInputContentRow);
-	const { locale } = useLocale$1();
-	const shouldForceLeadingZeros = props.shouldForceLeadingZeros ?? ui.dateInput.shouldForceLeadingZeros;
-	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
-	const inputRef = useRef(null);
-	const { renderRealInput } = useStaticInputHandoff({
-		inputRef,
-		renderInput,
-		setRenderInput,
-		getFocusTarget: _temp
-	});
-	const normalizedValue = props.value ?? null;
-	let t2;
-	if ($[0] !== fullIso) {
-		t2 = (range) => {
-			if (!range?.start || !range?.end) return null;
-			if (fullIso) return {
-				start: DateTimeUtils.fromCalendarDateToUTCISO(range.start),
-				end: DateTimeUtils.fromCalendarDateToUTCISO(range.end, { endOfDay: true })
-			};
-			const startDate = DateTimeUtils.fromDateValueToLocal(range.start, "UTC");
-			const endDate = DateTimeUtils.fromDateValueToLocal(range.end, "UTC");
-			return {
-				start: DateTime.fromJSDate(startDate, { zone: "UTC" }).toISODate(),
-				end: DateTime.fromJSDate(endDate, { zone: "UTC" }).toISODate()
-			};
+var DateRangePicker = ({ fullIso = true, minValue, maxValue, ...props }) => {
+	const formatDateRange = (range) => {
+		if (!range?.start || !range?.end) return null;
+		if (fullIso) return {
+			start: DateTimeUtils.fromCalendarDateToUTCISO(range.start),
+			end: DateTimeUtils.fromCalendarDateToUTCISO(range.end, { endOfDay: true })
 		};
-		$[0] = fullIso;
-		$[1] = t2;
-	} else t2 = $[1];
-	const formatDateRange = t2;
-	let t3;
-	if ($[2] !== fullIso) {
-		t3 = (formattedRange) => {
-			if (!formattedRange?.start || !formattedRange?.end) return null;
-			if (fullIso) return {
-				start: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.start),
-				end: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.end)
-			};
-			const startDate_0 = DateTime.fromISO(formattedRange.start, { zone: "UTC" }).toJSDate();
-			const endDate_0 = DateTime.fromISO(formattedRange.end, { zone: "UTC" }).toJSDate();
-			const startZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(startDate_0, "UTC");
-			const endZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(endDate_0, "UTC");
-			return {
-				start: toCalendarDate(startZonedDateTime),
-				end: toCalendarDate(endZonedDateTime)
-			};
+		const startDate = DateTimeUtils.fromDateValueToLocal(range.start);
+		const endDate = DateTimeUtils.fromDateValueToLocal(range.end);
+		return {
+			start: DateTime.fromJSDate(startDate).toISODate(),
+			end: DateTime.fromJSDate(endDate).toISODate()
 		};
-		$[2] = fullIso;
-		$[3] = t3;
-	} else t3 = $[3];
-	const parseDateRange = t3;
-	let t4;
-	if ($[4] !== fullIso) {
-		t4 = (formattedDate) => {
-			if (formattedDate == null) return null;
-			if (fullIso) return DateTimeUtils.fromUTCISOToCalendarDate(formattedDate);
-			const date = DateTime.fromISO(formattedDate, { zone: "UTC" }).toJSDate();
-			return toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date, "UTC"));
+	};
+	const parseDateRange = (formattedRange) => {
+		if (!formattedRange?.start || !formattedRange?.end) return formattedRange;
+		if (fullIso) return {
+			start: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.start),
+			end: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.end)
 		};
-		$[4] = fullIso;
-		$[5] = t4;
-	} else t4 = $[5];
-	const parseCalendarDate = t4;
-	let t5;
-	if ($[6] !== minValue || $[7] !== parseCalendarDate) {
-		t5 = typeof minValue === "string" ? parseCalendarDate(minValue) : minValue;
-		$[6] = minValue;
-		$[7] = parseCalendarDate;
-		$[8] = t5;
-	} else t5 = $[8];
-	let t6;
-	if ($[9] !== maxValue || $[10] !== parseCalendarDate) {
-		t6 = typeof maxValue === "string" ? parseCalendarDate(maxValue) : maxValue;
-		$[9] = maxValue;
-		$[10] = parseCalendarDate;
-		$[11] = t6;
-	} else t6 = $[11];
-	let t7;
-	if ($[12] !== t5 || $[13] !== t6) {
-		t7 = {
-			minValue: t5,
-			maxValue: t6
+		const startDate = DateTime.fromISO(formattedRange.start).toJSDate();
+		const endDate = DateTime.fromISO(formattedRange.end).toJSDate();
+		const startZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(startDate);
+		const endZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(endDate);
+		return {
+			start: toCalendarDate(startZonedDateTime),
+			end: toCalendarDate(endZonedDateTime)
 		};
-		$[12] = t5;
-		$[13] = t6;
-		$[14] = t7;
-	} else t7 = $[14];
-	const dateLimits = t7;
-	if (!renderInput) {
-		const startDateValue = parseCalendarDate(normalizedValue?.start ?? null);
-		const endDateValue = parseCalendarDate(normalizedValue?.end ?? null);
-		const hasProvidedRangeValue = !!(normalizedValue?.start || normalizedValue?.end);
-		const as = props.as ?? ui.input.as;
-		const size = props.size ?? ui.input.size;
-		const isDisabled = isFormControlDisabled || !!props.isDisabled;
-		const todayIcon = props.todayIcon ?? ui.dateInput.todayIcon;
-		const todayIconButtonSize = props.todayIconButtonSize ?? ui.dateInput.todayIconButtonSize;
-		const todayIconButtonComponent = props.todayIconButtonComponent ?? ui.dateInput.todayIconButtonComponent;
-		const todayIconPlacement = props.todayIconPlacement ?? ui.dateInput.todayIconPlacement;
-		const staticTodayIcon = renderDatePickerTodayIcon(todayIcon, {
-			isDisabled,
-			renderStatic: true,
-			size: todayIconButtonSize,
-			todayIconButtonComponent
-		});
-		const disableManualEntry = props.disableManualEntry ?? ui.dateInput.disableManualEntry;
-		const showDropdown = !props.disableDropdown || disableManualEntry;
-		const staticSegments = getStaticDateRangeSegments({
-			start: startDateValue,
-			end: endDateValue,
-			locale,
-			shouldForceLeadingZeros,
-			isDisabled,
-			hidePlaceholder: as === "floating" && !hasProvidedRangeValue,
-			disableManualEntry,
-			placeholder: props.placeholder
-		});
-		return /* @__PURE__ */ jsx(InputFrame, {
-			...props,
-			isDisabled,
-			className: clsx("group relative inline-flex w-full flex-col text-left", props.className),
-			inputClassName: clsx("min-w-input-width-min-width", props.inputClassName),
-			contentClassName: "pr-0!",
-			contentWrapperClassName: datePickerInputContentRowCva({ size }),
-			contentGroup: "date-picker",
-			labelPlacement: "content-row",
-			dataAttributes: {
-				dataIsEmpty: !hasProvidedRangeValue,
-				dataIsFilled: hasProvidedRangeValue,
-				dataIsDirty: props.isDirty,
-				dataIsRequired: props.isRequired,
-				dataIsDisabled: isDisabled,
-				dataDisabled: isDisabled,
-				dataInvalid: !!props.error,
-				dataHasSelection: hasProvidedRangeValue
-			},
-			renderStatic: true,
-			onStaticInteract: renderRealInput,
-			actionContent: staticTodayIcon,
-			actionContentPlacement: todayIconPlacement === "fieldLabel" ? "content-row" : "content-wrapper",
-			showClear: hasProvidedRangeValue,
-			wrapContentAndTrailing: true,
-			contentAndTrailingClassName: "gap-2!",
-			trailingClassName: "py-0! pl-0!",
-			action: showDropdown ? {
-				icon: ui.dateInput.calendarIcon,
-				onClick: _temp2,
-				altText: ""
-			} : void 0,
-			children: staticSegments
-		});
-	}
-	const T0 = DateRangePickerBase;
-	const t8 = mergeRefs(props.ref, inputRef);
-	const t9 = parseDateRange(normalizedValue);
-	let t10;
-	if ($[15] !== formatDateRange || $[16] !== props) {
-		t10 = (value) => props.onChange?.(formatDateRange(value));
-		$[15] = formatDateRange;
-		$[16] = props;
-		$[17] = t10;
-	} else t10 = $[17];
-	let t11;
-	if ($[18] !== T0 || $[19] !== dateLimits || $[20] !== props || $[21] !== t10 || $[22] !== t8 || $[23] !== t9) {
-		t11 = /* @__PURE__ */ jsx(T0, {
-			...props,
-			...dateLimits,
-			ref: t8,
-			value: t9,
-			onChange: t10
-		});
-		$[18] = T0;
-		$[19] = dateLimits;
-		$[20] = props;
-		$[21] = t10;
-		$[22] = t8;
-		$[23] = t9;
-		$[24] = t11;
-	} else t11 = $[24];
-	return t11;
-};
-var DateRangePicker = (t0) => {
-	const $ = c(30);
-	let maxValue;
-	let minValue;
-	let props;
-	let renderStaticInput;
-	let t1;
-	if ($[0] !== t0) {
-		({fullIso: t1, minValue, maxValue, renderStaticInput, ...props} = t0);
-		$[0] = t0;
-		$[1] = maxValue;
-		$[2] = minValue;
-		$[3] = props;
-		$[4] = renderStaticInput;
-		$[5] = t1;
-	} else {
-		maxValue = $[1];
-		minValue = $[2];
-		props = $[3];
-		renderStaticInput = $[4];
-		t1 = $[5];
-	}
-	const fullIso = t1 === void 0 ? true : t1;
+	};
+	const parseCalendarDate = (formattedDate) => {
+		if (formattedDate == null) return formattedDate;
+		if (fullIso) return DateTimeUtils.fromUTCISOToCalendarDate(formattedDate);
+		const date = DateTime.fromISO(formattedDate).toJSDate();
+		return toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date));
+	};
+	const dateLimits = {
+		minValue: typeof minValue === "string" ? parseCalendarDate(minValue) : minValue,
+		maxValue: typeof maxValue === "string" ? parseCalendarDate(maxValue) : maxValue
+	};
 	if ("formControl" in props && props.formControl) {
-		let formControl;
-		let innerProps;
-		let ref;
-		if ($[6] !== props) {
-			({formControl, ref, ...innerProps} = props);
-			$[6] = props;
-			$[7] = formControl;
-			$[8] = innerProps;
-			$[9] = ref;
-		} else {
-			formControl = $[7];
-			innerProps = $[8];
-			ref = $[9];
-		}
-		const controlWithOptions = formControl.control;
-		let t2;
-		if ($[10] !== controlWithOptions._options?.disabled || $[11] !== fullIso || $[12] !== innerProps || $[13] !== maxValue || $[14] !== minValue || $[15] !== props.error || $[16] !== props.isDisabled || $[17] !== ref || $[18] !== renderStaticInput) {
-			t2 = (t3) => {
-				const { field, fieldState: t4 } = t3;
-				const { error, isDirty } = t4;
-				return /* @__PURE__ */ jsx(DateRangePickerInner, {
-					...innerProps,
-					ref: mergeRefs(ref, field.ref),
-					value: field.value ?? null,
-					onChange: field.onChange,
-					onBlur: field.onBlur,
-					isDirty,
-					isDisabled: field.disabled || props.isDisabled,
-					isFormControlDisabled: !!controlWithOptions._options?.disabled,
-					error: props.error ?? error?.message,
-					fullIso,
-					minValue,
-					maxValue,
-					renderStaticInput
-				});
-			};
-			$[10] = controlWithOptions._options?.disabled;
-			$[11] = fullIso;
-			$[12] = innerProps;
-			$[13] = maxValue;
-			$[14] = minValue;
-			$[15] = props.error;
-			$[16] = props.isDisabled;
-			$[17] = ref;
-			$[18] = renderStaticInput;
-			$[19] = t2;
-		} else t2 = $[19];
-		let t3;
-		if ($[20] !== formControl.control || $[21] !== formControl.name || $[22] !== t2) {
-			t3 = /* @__PURE__ */ jsx(Controller, {
-				control: formControl.control,
-				name: formControl.name,
-				render: t2
-			});
-			$[20] = formControl.control;
-			$[21] = formControl.name;
-			$[22] = t2;
-			$[23] = t3;
-		} else t3 = $[23];
-		return t3;
-	}
-	let t2;
-	if ($[24] !== fullIso || $[25] !== maxValue || $[26] !== minValue || $[27] !== props || $[28] !== renderStaticInput) {
-		t2 = /* @__PURE__ */ jsx(DateRangePickerInner, {
-			...props,
-			fullIso,
-			minValue,
-			maxValue,
-			renderStaticInput
+		const { formControl, ref, ...innerProps } = props;
+		return /* @__PURE__ */ jsx(Controller, {
+			control: formControl.control,
+			name: formControl.name,
+			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(DateRangePickerBase, {
+				...innerProps,
+				...dateLimits,
+				ref: mergeRefs(ref, field.ref),
+				value: parseDateRange(field.value),
+				onChange: (value) => field.onChange(formatDateRange(value)),
+				onBlur: field.onBlur,
+				isDirty,
+				isDisabled: field.disabled || props.isDisabled,
+				error: props.error ?? error?.message
+			})
 		});
-		$[24] = fullIso;
-		$[25] = maxValue;
-		$[26] = minValue;
-		$[27] = props;
-		$[28] = renderStaticInput;
-		$[29] = t2;
-	} else t2 = $[29];
-	return t2;
+	}
+	return /* @__PURE__ */ jsx(DateRangePickerBase, {
+		...props,
+		...dateLimits,
+		value: parseDateRange(props.value),
+		onChange: (value) => props.onChange?.(formatDateRange(value))
+	});
 };
-function _temp(input) {
-	const container = input.getContainer?.() ?? input;
-	return container instanceof HTMLElement ? container.querySelector("input, button, [tabindex]:not([tabindex='-1'])") : null;
-}
-function _temp2() {}
 //#endregion
 export { DateRangePicker };