@povio/ui 3.4.0-rc.24 → 3.4.0-rc.25

package/dist/{BottomSheet-DNnVqMw9.js → BottomSheet-BNGGxiX7.js}

@@ -1,4 +1,4 @@
-import { o as ObjectUtils, t as UIConfig } from "./uiConfig.context-SBtRegKv.js";
+import { o as ObjectUtils, t as UIConfig } from "./uiConfig.context-B_wBkrQZ.js";
 import { t as X } from "./x-BYOEO0gW.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { n as $de32f1b87079253c$export$3ddf2d174ce01153, t as $de32f1b87079253c$export$2e1e1122cf0cba88 } from "./Dialog-DpLXaUXz.js";

package/dist/{Button-B8T7AjGP.js → Button-CtPMeT8f.js}

@@ -1,4 +1,4 @@
-import { t as UIConfig } from "./uiConfig.context-SBtRegKv.js";
+import { t as UIConfig } from "./uiConfig.context-B_wBkrQZ.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { n as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "./Button-oSE-CM83.js";
 import { t as $4f118338184dc1d9$export$a6c7ac8248d6e38a } from "./Link-iPOFlrxY.js";

package/dist/{Calendar-B7OLjVV9.js → Calendar-CzDZnIF0.js}

@@ -2,13 +2,13 @@ import { t as ChevronDown } from "./chevron-down-Ciz9yP9R.js";
 import { t as ChevronLeft } from "./chevron-left-VO8YZrXZ.js";
 import { t as ChevronRight } from "./chevron-right-C_M98bh3.js";
 import { t as ChevronUp } from "./chevron-up-CHRnDSA3.js";
-import { i as CalendarGrid } from "./DatePickerInput-BLL4-Sqj.js";
+import { i as CalendarGrid } from "./DatePickerInput-CQKtbsQd.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { b as $bdb11010cef70236$export$f680877a34711e37, g as $3ef42575df84b30b$export$9d1611c77c2fe928, h as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "./import-CuNJ25EP.js";
 import { n as $d4ee10de306f2510$export$4282f70798064fe0, t as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "./context-HV79Qf_F.js";
 import { o as $9bf71ea28793e738$export$c5251b9e124bf29 } from "./SelectionIndicator-BiAHPBz2.js";
 import { t as $ef06256079686ba0$export$f8aeda7b10753fa1 } from "./useDescription-D8raJPFb.js";
-import { C as $dfb4eba373ed9493$exports, S as $3dfb0f96be0d6a08$export$4a931266a3838b86, v as $16f0b7bb276bc17e$export$300019f83c56d282, w as $896ba0a80a8f4d36$export$85fd5fdf27bacc79 } from "./staticDateTimeSegments-C8AOKnEO.js";
+import { C as $dfb4eba373ed9493$exports, S as $3dfb0f96be0d6a08$export$4a931266a3838b86, v as $16f0b7bb276bc17e$export$300019f83c56d282, w as $896ba0a80a8f4d36$export$85fd5fdf27bacc79 } from "./staticDateTimeSegments-CAEX9ogz.js";
 import { i as $eed445e0843c11d0$export$a11e76429ed99b4, t as $eed445e0843c11d0$export$41f133550aa26f48 } from "./ListBox-BCW74bzR.js";
 import { n as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "./Button-oSE-CM83.js";
 import { n as $fca6afa0e843324b$export$f12b703ca79dfbb1 } from "./useLocalizedStringFormatter-D9TmTRN_.js";
@@ -16,8 +16,8 @@ import { n as $e5be200c675c3b3a$export$a763b9476acd3eb } from "./useFormValidati
 import { n as $84b7d8702d4ff4a8$export$40258cc1d95ff477 } from "./ToggleButton-DYVFkuEk.js";
 import { t as Typography } from "./Typography-AcUd9df8.js";
 import { PillButton } from "./components/pill-button.js";
-import { t as useBreakpoint } from "./useBreakpoint-D0s71F97.js";
-import { n as TimePickerForm } from "./datePickerValue.utils-BqdbvGFL.js";
+import { t as useBreakpoint } from "./useBreakpoint-YuMYUdpG.js";
+import { n as TimePickerForm } from "./datePickerValue.utils-BoOLaZk_.js";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { c } from "react/compiler-runtime";
 import { CalendarDateTime, Time, today } from "@internationalized/date";

package/dist/{Checkbox-B7f8NgnO.js → Checkbox-Feyideqw.js}

@@ -1,4 +1,4 @@
-import { t as UIConfig } from "./uiConfig.context-SBtRegKv.js";
+import { t as UIConfig } from "./uiConfig.context-B_wBkrQZ.js";
 import { c as checkboxIndicatorClass, l as checkboxTypography, n as checkboxContentClassName, t as CheckboxCheckmark } from "./CheckboxCheckmark-C7Oq15ms.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { n as $4e85f108e88277b8$export$b085522c77523c51 } from "./RSPContexts-DHQi1l7F.js";

package/dist/{DatePicker-p5zEtFfc.js → DatePicker-O55fFlKg.js}

@@ -1,16 +1,16 @@
-import { t as UIConfig } from "./uiConfig.context-SBtRegKv.js";
+import { t as UIConfig } from "./uiConfig.context-B_wBkrQZ.js";
 import { t as FormField } from "./FormField-ChDNTHr4.js";
-import { n as renderDatePickerTodayIcon, r as datePickerInputContentRowDefinition, t as DatePickerInput } from "./DatePickerInput-BLL4-Sqj.js";
+import { n as renderDatePickerTodayIcon, r as datePickerInputContentRowDefinition, t as DatePickerInput } from "./DatePickerInput-CQKtbsQd.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { _ as $5dc95899b306f630$export$c9058316764c140e } from "./import-CuNJ25EP.js";
 import { t as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "./context-HV79Qf_F.js";
-import { d as useCalendarState, i as getStaticDateTimeFocusTarget, o as DateTimeDialogFooter, p as useDatePickerState, s as DateTimeDialog, t as getStaticCalendarDateSegments } from "./staticDateTimeSegments-C8AOKnEO.js";
-import { r as $6057a3d2a53a12fd$export$42df105a73306d51, t as Calendar } from "./Calendar-B7OLjVV9.js";
+import { d as useCalendarState, i as getStaticDateTimeFocusTarget, o as DateTimeDialogFooter, p as useDatePickerState, s as DateTimeDialog, t as getStaticCalendarDateSegments } from "./staticDateTimeSegments-CAEX9ogz.js";
+import { r as $6057a3d2a53a12fd$export$42df105a73306d51, t as Calendar } from "./Calendar-CzDZnIF0.js";
 import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
 import { t as FieldController } from "./form.binding-DyZ4fH8l.js";
-import { t as TooltipWrapper } from "./TooltipWrapper-D8gfa-pC.js";
-import { n as InputFrame, t as useStaticInputHandoff } from "./useStaticInputHandoff-pnEcfX_d.js";
-import { t as normalizeDatePickerValue } from "./datePickerValue.utils-BqdbvGFL.js";
+import { t as TooltipWrapper } from "./TooltipWrapper-eCF5-eNP.js";
+import { n as InputFrame, t as useStaticInputHandoff } from "./useStaticInputHandoff-ClwANfo-.js";
+import { t as normalizeDatePickerValue } from "./datePickerValue.utils-BoOLaZk_.js";
 import { t as DateTimeUtils } from "./date-time.utils-0F9qduim.js";
 import { memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
 import { createCalendar, getLocalTimeZone, toCalendarDate, today } from "@internationalized/date";

package/dist/{DatePickerInput-BLL4-Sqj.js → DatePickerInput-CQKtbsQd.js}

@@ -1,17 +1,17 @@
 import { t as createLucideIcon } from "./createLucideIcon-CskCrR9z.js";
-import { t as UIConfig } from "./uiConfig.context-SBtRegKv.js";
+import { t as UIConfig } from "./uiConfig.context-B_wBkrQZ.js";
 import { r as FormFieldLabel } from "./FormField-ChDNTHr4.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { g as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "./import-CuNJ25EP.js";
 import { t as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "./context-HV79Qf_F.js";
-import { b as $16f0b7bb276bc17e$export$5591b0b878c1a989, c as useFirefoxDateSegmentSelectionGuard, f as useDateFieldState, l as DateSegmentItem } from "./staticDateTimeSegments-C8AOKnEO.js";
+import { b as $16f0b7bb276bc17e$export$5591b0b878c1a989, c as useFirefoxDateSegmentSelectionGuard, f as useDateFieldState, l as DateSegmentItem } from "./staticDateTimeSegments-CAEX9ogz.js";
 import { n as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "./Button-oSE-CM83.js";
 import { t as $f7dceffc5ad7768b$export$4e328f61c538687f } from "./useFocusRing-Cd0lBvKO.js";
 import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
 import { t as Typography } from "./Typography-AcUd9df8.js";
 import { IconButton } from "./components/icon-button.js";
 import { InlineIconButton } from "./components/inline-icon-button.js";
-import { r as InputClear } from "./TooltipWrapper-D8gfa-pC.js";
+import { r as InputClear } from "./TooltipWrapper-eCF5-eNP.js";
 import { a as inputSizeDefinition, t as inputBaseDefinition } from "./input.cva-KYGD4Bdz.js";
 import { t as DateTimeUtils } from "./date-time.utils-0F9qduim.js";
 import { t as DateUtils } from "./date.utils-B8_QF9y6.js";
@@ -187,7 +187,7 @@ const WEEK_INDICES = [
 	5
 ];
 const NO_CALENDAR_OFFSET = {};
-const CalendarGrid = ({ state, onApply, onDoubleClickApply, shouldApplyOnDateSelection, shouldCloseOnSelect, offset = NO_CALENDAR_OFFSET, onDateSelection, onDateHover, rangeSelection, hoverDate, onKeyboardNavigation, className, calendarSide, ...props }) => {
+const CalendarGrid = ({ state, onApply, onDoubleClickApply, shouldApplyOnDateSelection, shouldCloseOnSelect, offset = NO_CALENDAR_OFFSET, onDateSelection, onDateHover, rangeSelection, hoverDate, onKeyboardNavigation, className, calendarSide, isSelectionDisabled, ...props }) => {
 	const { gridProps, headerProps, weekDays } = useCalendarGrid({
 		...props,
 		weekdayStyle: "short"
@@ -198,6 +198,8 @@ const CalendarGrid = ({ state, onApply, onDoubleClickApply, shouldApplyOnDateSel
 	};
 	return /* @__PURE__ */ jsx("div", {
 		className: clsx("h-72 w-full px-3 py-1 md:w-80", className),
+		inert: isSelectionDisabled || void 0,
+		"aria-disabled": isSelectionDisabled || void 0,
 		children: /* @__PURE__ */ jsxs("table", {
 			...gridProps,
 			cellPadding: "0",
@@ -419,7 +421,7 @@ const renderDatePickerTodayIcon = (todayIcon, options) => {
 };
 //#endregion
 //#region src/components/inputs/DateTime/shared/DatePickerInput.tsx
-const DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, fieldValue, endFieldValue, isValueControlled, hasValue, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, shouldShrinkInput, isClearable, isClearableIfDisabled, headerProps, todayIcon, todayIconButtonSize = "none", todayIconButtonComponent, todayIconPlacement = "content", isDirty, isRequired, disableManualEntry, autoFixYear = false, placeholder, className, onOpenDropdown, dateGranularity = "day", timeZone: timeZoneProp, isTimeOptional = false, format, onClear: onClearProp, ...props }) => {
+const DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, fieldValue, endFieldValue, isValueControlled, hasValue, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, shouldShrinkInput, isClearable, isClearableIfDisabled, headerProps, todayIcon, todayIconButtonSize = "none", todayIconButtonComponent, todayIconPlacement = "content", isDirty, isRequired, disableManualEntry, autoFixYear = false, placeholder, displayValue, className, onOpenDropdown, dateGranularity = "day", timeZone: timeZoneProp, isTimeOptional = false, format, onClear: onClearProp, ...props }) => {
 	const uiConfig = UIConfig.useConfig();
 	const timeZone = timeZoneProp ?? uiConfig.dateInput.timeZone;
 	let effectiveTimeZone = getLocalTimeZone();
@@ -474,6 +476,7 @@ const DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, field
 		setCanClear(canClearInput);
 	}, []);
 	const showClear = (!isDisabled || isClearableIfDisabled === true) && (canClear || hasValue || normalizedFieldProps.value != null || normalizedEndFieldProps?.value != null);
+	const hasDisplayedValue = !!hasValue || normalizedFieldProps.value != null;
 	const isTodayIconDisabled = isDisabled || buttonProps.isDisabled;
 	const onToday = () => {
 		if (isTodayIconDisabled) return;
@@ -511,13 +514,13 @@ const DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, field
 		"data-disabled": isDisabled || void 0,
 		"data-is-disabled": isDisabled || void 0,
 		"data-invalid": isInvalid || void 0,
-		"data-is-empty": normalizedFieldProps.value == null || void 0,
+		"data-is-empty": !hasDisplayedValue || void 0,
 		"data-focus-within": isFocused || void 0,
 		"data-focus-visible": isFocused && isFocusVisible || void 0,
-		"data-has-selection": normalizedFieldProps.value != null || void 0,
+		"data-has-selection": hasDisplayedValue || void 0,
 		"data-is-dirty": isDirty || void 0,
 		"data-is-required": isRequired || void 0,
-		"data-is-filled": normalizedFieldProps.value != null || void 0,
+		"data-is-filled": hasDisplayedValue || void 0,
 		children: [/* @__PURE__ */ jsxs("div", {
 			className: clsx("flex items-center gap-input-gap-input-text-to-elements pr-0!", shouldShrinkInput ? "min-w-0 flex-1 w-full" : "w-full", inputSizeCva({
 				size,
@@ -538,7 +541,11 @@ const DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, field
 							isDisabled
 						}),
 						!shouldRenderTodayIconWithFieldLabel && todayIconButton,
-						disableManualEntry && placeholder && !fieldProps.value ? /* @__PURE__ */ jsx(Typography, {
+						displayValue ? /* @__PURE__ */ jsx(Typography, {
+							size: "label-1",
+							className: "truncate",
+							children: displayValue
+						}) : disableManualEntry && placeholder && !fieldProps.value ? /* @__PURE__ */ jsx(Typography, {
 							size: "label-1",
 							className: "text-text-default-3",
 							children: placeholder

package/dist/{DateRangePicker-CjOo8S9R.d.ts → DateRangePicker-CMWUdyh1.d.ts}

@@ -25,23 +25,36 @@ interface DateRangePickerBaseProps extends FormFieldProps, InputVariantProps, Om
   inputClassName?: string;
   onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
   allowPartialRange?: boolean;
+  mode?: "absolute" | "relative";
+  relativeValue?: string | null;
+  relativeOptions?: DateRangeRelativeOption[];
+  onRelativeChange?: (value: string | null) => void;
 }
-interface DateRangePickerProps extends Omit<DateRangePickerBaseProps, "value" | "onChange" | "minValue" | "maxValue"> {
-  value?: {
-    start: string | null;
-    end: string | null;
-  } | null;
-  onChange?: (value: {
-    start: string | null;
-    end: string | null;
-  } | null) => void;
+interface DateRangeRelativeOption {
+  /** Stable value emitted by DateRangePicker when mode is `relative`. */
+  value: string;
+  /** Human-readable value shown in the input and options list. */
+  label: string;
+  isDisabled?: boolean;
+}
+interface DateRangePickerSharedProps extends Omit<DateRangePickerBaseProps, "value" | "onChange" | "minValue" | "maxValue"> {
   fullIso?: boolean;
   minValue?: DateValue$1 | string;
   maxValue?: DateValue$1 | string;
   renderStaticInput?: boolean;
 }
-type ControlledDateRangePickerProps<TFieldValues extends FieldValues> = ControlProps<DateRangePickerProps, TFieldValues>;
-declare const DateRangePickerComponent: <TFieldValues extends FieldValues>({ fullIso, minValue, maxValue, renderStaticInput, ...props }: ControlledDateRangePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
+type DateRangePickerValue = {
+  start: string | null;
+  end: string | null;
+} | string | null;
+type DateRangePickerProps<TMode extends "absolute" | "relative" = "absolute"> = DateRangePickerSharedProps & {
+  /** `relative` returns and displays an option key instead of a concrete range. */
+  mode?: TMode;
+  value?: TMode extends "relative" ? string | null : Exclude<DateRangePickerValue, string>;
+  onChange?: (value: TMode extends "relative" ? string | null : Exclude<DateRangePickerValue, string>) => void;
+};
+type ControlledDateRangePickerProps<TFieldValues extends FieldValues, TMode extends "absolute" | "relative" = "absolute"> = ControlProps<DateRangePickerProps<TMode>, TFieldValues>;
+declare const DateRangePickerComponent: <TFieldValues extends FieldValues, TMode extends "absolute" | "relative" = "absolute">({ fullIso, minValue, maxValue, renderStaticInput, ...props }: ControlledDateRangePickerProps<TFieldValues, TMode>) => import("react/jsx-runtime").JSX.Element;
 declare const DateRangePicker: typeof DateRangePickerComponent;
 //#endregion
-export { DateRangePicker as n, DateRangePickerProps as r, ControlledDateRangePickerProps as t };
+export { DateRangeRelativeOption as i, DateRangePicker as n, DateRangePickerProps as r, ControlledDateRangePickerProps as t };

package/dist/{DateRangePicker-BELkyFZ3.js → DateRangePicker-CnxuqAB1.js}

@@ -1,16 +1,16 @@
-import { t as UIConfig } from "./uiConfig.context-SBtRegKv.js";
+import { t as UIConfig } from "./uiConfig.context-B_wBkrQZ.js";
 import { t as ChevronDown } from "./chevron-down-Ciz9yP9R.js";
 import { t as ChevronLeft } from "./chevron-left-VO8YZrXZ.js";
 import { t as ChevronRight } from "./chevron-right-C_M98bh3.js";
 import { n as ChevronsLeft, t as ChevronsRight } from "./chevrons-right-BXdmZ2TS.js";
 import { t as FormField } from "./FormField-ChDNTHr4.js";
-import { i as CalendarGrid, n as renderDatePickerTodayIcon, r as datePickerInputContentRowDefinition, t as DatePickerInput } from "./DatePickerInput-BLL4-Sqj.js";
+import { i as CalendarGrid, n as renderDatePickerTodayIcon, r as datePickerInputContentRowDefinition, t as DatePickerInput } from "./DatePickerInput-CQKtbsQd.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { _ as $5dc95899b306f630$export$c9058316764c140e, b as $bdb11010cef70236$export$f680877a34711e37, g as $3ef42575df84b30b$export$9d1611c77c2fe928, h as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "./import-CuNJ25EP.js";
 import { n as $d4ee10de306f2510$export$4282f70798064fe0, t as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "./context-HV79Qf_F.js";
 import { o as $9bf71ea28793e738$export$c5251b9e124bf29 } from "./SelectionIndicator-BiAHPBz2.js";
 import { t as $ef06256079686ba0$export$f8aeda7b10753fa1 } from "./useDescription-D8raJPFb.js";
-import { C as $dfb4eba373ed9493$exports, S as $3dfb0f96be0d6a08$export$4a931266a3838b86, h as useRangeCalendarState, i as getStaticDateTimeFocusTarget, m as useDateRangePickerState, o as DateTimeDialogFooter, r as getStaticDateRangeSegments, s as DateTimeDialog, v as $16f0b7bb276bc17e$export$300019f83c56d282, w as $896ba0a80a8f4d36$export$85fd5fdf27bacc79, x as $16f0b7bb276bc17e$export$7b3062cd49e80452 } from "./staticDateTimeSegments-C8AOKnEO.js";
+import { C as $dfb4eba373ed9493$exports, S as $3dfb0f96be0d6a08$export$4a931266a3838b86, h as useRangeCalendarState, i as getStaticDateTimeFocusTarget, m as useDateRangePickerState, o as DateTimeDialogFooter, r as getStaticDateRangeSegments, s as DateTimeDialog, v as $16f0b7bb276bc17e$export$300019f83c56d282, w as $896ba0a80a8f4d36$export$85fd5fdf27bacc79, x as $16f0b7bb276bc17e$export$7b3062cd49e80452 } from "./staticDateTimeSegments-CAEX9ogz.js";
 import { n as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "./Button-oSE-CM83.js";
 import { n as $fca6afa0e843324b$export$f12b703ca79dfbb1 } from "./useLocalizedStringFormatter-D9TmTRN_.js";
 import { n as $e5be200c675c3b3a$export$a763b9476acd3eb, r as $e5be200c675c3b3a$export$dad6ae84456c676a, t as $e5be200c675c3b3a$export$75ee7c75d68f5b0e } from "./useFormValidationState-Bpry7Uk5.js";
@@ -20,10 +20,10 @@ import { InlineIconButton } from "./components/inline-icon-button.js";
 import { PillButton } from "./components/pill-button.js";
 import "./i18n-C2TBJvnh.js";
 import { t as FieldController } from "./form.binding-DyZ4fH8l.js";
-import { t as TooltipWrapper } from "./TooltipWrapper-D8gfa-pC.js";
-import { n as InputFrame, t as useStaticInputHandoff } from "./useStaticInputHandoff-pnEcfX_d.js";
+import { t as TooltipWrapper } from "./TooltipWrapper-eCF5-eNP.js";
+import { n as InputFrame, t as useStaticInputHandoff } from "./useStaticInputHandoff-ClwANfo-.js";
 import { t as DateTimeUtils } from "./date-time.utils-0F9qduim.js";
-import { t as Select } from "./Select-T4am7u5p.js";
+import { t as Select } from "./Select-C_cXfp8z.js";
 import { memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
 import { createCalendar, endOfMonth, endOfWeek, endOfYear, getLocalTimeZone, startOfMonth, startOfWeek, startOfYear, toCalendarDate, today } from "@internationalized/date";
 import { useFocusWithin } from "@react-aria/interactions";
@@ -368,7 +368,7 @@ const CalendarSelectHeader = ({ state, isPrevMonthDisabled, isPrevYearDisabled,
 };
 //#endregion
 //#region src/components/inputs/DateTime/shared/RangeCalendar.tsx
-const RangeCalendar = ({ className, leftCalendarState, rightCalendarState, calendarProps, onApply, onRangeChange: _onRangeChange, onDateSelection, onDateHover, rangeSelection, hoverDate, onKeyboardNavigation }) => {
+const RangeCalendar = ({ className, leftCalendarState, rightCalendarState, calendarProps, onApply, onRangeChange: _onRangeChange, onDateSelection, onDateHover, rangeSelection, hoverDate, onKeyboardNavigation, isRangeSelectionDisabled }) => {
 	const leftRef = useRef(null);
 	const rightRef = useRef(null);
 	const { calendarProps: leftCalendarAriaProps } = useRangeCalendar(calendarProps, leftCalendarState, leftRef);
@@ -428,8 +428,9 @@ const RangeCalendar = ({ className, leftCalendarState, rightCalendarState, calen
 					onDateHover,
 					hoverDate,
 					onKeyboardNavigation: handleLeftKeyboardNavigation,
-					className: "h-64 w-[304px]!",
-					calendarSide: "left"
+					className: clsx("h-64 w-[304px]!", isRangeSelectionDisabled && "pointer-events-none opacity-50"),
+					calendarSide: "left",
+					isSelectionDisabled: isRangeSelectionDisabled
 				})]
 			}), /* @__PURE__ */ jsxs("div", {
 				...rightCalendarAriaProps,
@@ -450,8 +451,9 @@ const RangeCalendar = ({ className, leftCalendarState, rightCalendarState, calen
 					onDateHover,
 					hoverDate,
 					onKeyboardNavigation: handleRightKeyboardNavigation,
-					className: "h-64 w-[304px]!",
-					calendarSide: "right"
+					className: clsx("h-64 w-[304px]!", isRangeSelectionDisabled && "pointer-events-none opacity-50"),
+					calendarSide: "right",
+					isSelectionDisabled: isRangeSelectionDisabled
 				})]
 			})]
 		})
@@ -462,7 +464,7 @@ const RangeCalendar = ({ className, leftCalendarState, rightCalendarState, calen
 const 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, isClearableIfDisabled, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconButtonComponent: todayIconButtonComponentProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, autoFixYear: autoFixYearProp, allowPartialRange: allowPartialRangeProp, minValue, maxValue, ...rest } = props;
+	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, isClearableIfDisabled, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconButtonComponent: todayIconButtonComponentProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, autoFixYear: autoFixYearProp, allowPartialRange: allowPartialRangeProp, mode = "absolute", relativeValue, relativeOptions = [], onRelativeChange, minValue, maxValue, ...rest } = props;
 	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
 	const variant = variantProp ?? ui.input.variant;
 	const as = asProp ?? ui.input.as;
@@ -578,7 +580,7 @@ const DateRangePickerBase = (props) => {
 		minValue,
 		maxValue
 	});
-	const [activePreset, setActivePreset] = useState(null);
+	const [activePreset, setActivePreset] = useState(mode === "relative" ? relativeValue ?? null : null);
 	const [rangeSelection, setRangeSelection] = useState({
 		start: value?.start || null,
 		end: value?.end || null,
@@ -843,6 +845,11 @@ const DateRangePickerBase = (props) => {
 		clampRangeToBounds
 	]);
 	const onApply = () => {
+		if (mode === "relative") {
+			onRelativeChange?.(activePreset);
+			state.toggle();
+			return;
+		}
 		let valueToApply = dialogState.value;
 		if (rangeSelection.start && rangeSelection.end) valueToApply = {
 			start: rangeSelection.start,
@@ -872,6 +879,11 @@ const DateRangePickerBase = (props) => {
 		syncCalendarStates(clampedTodayRange);
 	};
 	const onInputClear = () => {
+		if (mode === "relative") {
+			setActivePreset(null);
+			onRelativeChange?.(null);
+			return;
+		}
 		fieldRangeRef.current = null;
 		onChange?.(null);
 		dialogState.setValue(null);
@@ -885,6 +897,10 @@ const DateRangePickerBase = (props) => {
 		setHoverDate(null);
 	};
 	const syncSelectionFromControlledValue = () => {
+		if (mode === "relative") {
+			setActivePreset(relativeValue ?? null);
+			return;
+		}
 		const currentValue = state.value;
 		if (!(currentValue != null && currentValue.start != null && currentValue.end != null)) {
 			syncCalendarStates(null);
@@ -963,6 +979,7 @@ const DateRangePickerBase = (props) => {
 		if (!clampedValue) isDisabled = true;
 		if (clampedValue && !isRangeWithinBounds(clampedValue)) isDisabled = true;
 		return {
+			value: params.value,
 			label: params.label,
 			getValue: params.getValue,
 			clampedValue,
@@ -971,26 +988,32 @@ const DateRangePickerBase = (props) => {
 	};
 	const presets = [
 		createPreset({
+			value: "thisWeek",
 			label: t(($) => $.ui.datePicker.presets.thisWeek, { ns: "ui" }),
 			getValue: getThisWeekRange
 		}),
 		createPreset({
+			value: "lastWeek",
 			label: t(($) => $.ui.datePicker.presets.lastWeek, { ns: "ui" }),
 			getValue: getLastWeekRange
 		}),
 		createPreset({
+			value: "thisAndLastWeek",
 			label: t(($) => $.ui.datePicker.presets.thisAndLastWeek, { ns: "ui" }),
 			getValue: getThisAndLastWeekRange
 		}),
 		createPreset({
+			value: "thisMonth",
 			label: t(($) => $.ui.datePicker.presets.thisMonth, { ns: "ui" }),
 			getValue: getThisMonthRange
 		}),
 		createPreset({
+			value: "thisAndLastMonth",
 			label: t(($) => $.ui.datePicker.presets.thisAndLastMonth, { ns: "ui" }),
 			getValue: getThisAndLastMonthRange
 		}),
 		createPreset({
+			value: "thisYear",
 			label: t(($) => $.ui.datePicker.presets.thisYear, { ns: "ui" }),
 			getValue: () => ({
 				start: startOfYear(todayDate),
@@ -998,6 +1021,7 @@ const DateRangePickerBase = (props) => {
 			})
 		}),
 		createPreset({
+			value: "lastYear",
 			label: t(($) => $.ui.datePicker.presets.lastYear, { ns: "ui" }),
 			getValue: () => ({
 				start: startOfYear(todayDate.subtract({ years: 1 })),
@@ -1005,6 +1029,7 @@ const DateRangePickerBase = (props) => {
 			})
 		}),
 		createPreset({
+			value: "thisAndLastYear",
 			label: t(($) => $.ui.datePicker.presets.thisAndLastYear, { ns: "ui" }),
 			getValue: () => ({
 				start: startOfYear(todayDate.subtract({ years: 1 })),
@@ -1012,17 +1037,29 @@ const DateRangePickerBase = (props) => {
 			})
 		}),
 		createPreset({
+			value: "soFar",
 			label: t(($) => $.ui.datePicker.presets.soFar, { ns: "ui" }),
 			getValue: () => ({
 				start: startOfYear(todayDate),
 				end: todayDate
 			}),
 			keepEnabledUnlessFutureMin: true
-		})
+		}),
+		...relativeOptions.map((option) => ({
+			value: option.value,
+			label: option.label,
+			getValue: () => ({
+				start: todayDate,
+				end: todayDate
+			}),
+			clampedValue: null,
+			isDisabled: option.isDisabled ?? false
+		}))
 	];
 	const selectPreset = (preset) => {
-		if (preset.isDisabled || !preset.clampedValue) return;
-		setActivePreset(preset.label);
+		if (preset.isDisabled || mode !== "relative" && !preset.clampedValue) return;
+		setActivePreset(mode === "relative" ? preset.value : preset.label);
+		if (!preset.clampedValue) return;
 		const presetValue = preset.clampedValue;
 		syncCalendarStates(presetValue);
 		const startDate = presetValue.start;
@@ -1033,7 +1070,9 @@ const DateRangePickerBase = (props) => {
 			const rightCalendarMonth = startDate.add({ months: 1 });
 			rightCalendarState.setFocusedDate(rightCalendarMonth);
 		}
+		if (mode === "relative") setActivePreset(preset.value);
 	};
+	const activeRelativeOption = mode === "relative" ? presets.find((preset) => preset.value === relativeValue) : void 0;
 	return /* @__PURE__ */ jsx(TooltipWrapper, {
 		as,
 		error,
@@ -1073,7 +1112,7 @@ const DateRangePickerBase = (props) => {
 				fieldValue: normalizedValue?.start ?? null,
 				endFieldValue: normalizedValue?.end ?? null,
 				isValueControlled: true,
-				hasValue: normalizedValue?.start != null || normalizedValue?.end != null,
+				hasValue: mode === "relative" ? !!relativeValue : normalizedValue?.start != null || normalizedValue?.end != null,
 				buttonProps,
 				isDisabled,
 				isInvalid: !!error,
@@ -1088,7 +1127,8 @@ const DateRangePickerBase = (props) => {
 				todayIconButtonComponent,
 				todayIconPlacement,
 				isDirty,
-				disableManualEntry,
+				disableManualEntry: mode === "relative" || disableManualEntry,
+				displayValue: activeRelativeOption?.label,
 				autoFixYear,
 				placeholder,
 				className: inputClassName,
@@ -1098,11 +1138,11 @@ const DateRangePickerBase = (props) => {
 			}), /* @__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",
+					className: "flex w-full flex-row overflow-auto border-elevation-outline-default-1 border-solid [-ms-overflow-style:none] [scrollbar-width:none] md:max-h-[344px] md:w-[156px] md:flex-col md:border-r [&::-webkit-scrollbar]:hidden",
 					children: presets.map((preset) => /* @__PURE__ */ jsx($d2b4bc8c273e7be6$export$353f5b6fc5456de1, {
 						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"),
+						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 !== (mode === "relative" ? preset.value : preset.label) && "text-interactive-text-secondary-idle hover:text-interactive-text-secondary-hover", activePreset === (mode === "relative" ? preset.value : preset.label) && "bg-interactive-contained-primary-idle text-interactive-text-secondary-idle-inverted"),
 						children: /* @__PURE__ */ jsx(Typography, {
 							size: "label-2",
 							sizeMobile: "label-3",
@@ -1110,12 +1150,12 @@ const DateRangePickerBase = (props) => {
 							className: "whitespace-nowrap",
 							children: preset.label
 						})
-					}, preset.label))
+					}, mode === "relative" ? preset.value : preset.label))
 				}),
 				footer: /* @__PURE__ */ jsx(DateTimeDialogFooter, {
 					isDisabled,
-					isValid: !dialogState.isInvalid && !!dialogState.value,
-					onTodayPress,
+					isValid: mode === "relative" ? !!activePreset : !dialogState.isInvalid && !!dialogState.value,
+					onTodayPress: mode === "relative" ? void 0 : onTodayPress,
 					onApply
 				}),
 				label,
@@ -1133,11 +1173,12 @@ const DateRangePickerBase = (props) => {
 							calendarProps,
 							onApply,
 							onRangeChange: syncCalendarStates,
-							onDateSelection: handleDateSelection,
+							onDateSelection: mode === "relative" ? void 0 : handleDateSelection,
 							onDateHover: handleDateHover,
 							rangeSelection,
 							hoverDate,
-							onKeyboardNavigation: handleKeyboardNavigation
+							onKeyboardNavigation: mode === "relative" ? void 0 : handleKeyboardNavigation,
+							isRangeSelectionDisabled: mode === "relative"
 						})
 					})
 				})
@@ -1147,6 +1188,7 @@ const DateRangePickerBase = (props) => {
 };
 const DateRangePickerInner = ({ fullIso = true, minValue, maxValue, renderStaticInput, isFormControlDisabled, ...props }) => {
 	const ui = UIConfig.useConfig();
+	const { t } = useTranslation();
 	const datePickerInputContentRowCva = UIOverrides.useCva("datePickerInput.contentRowCva", datePickerInputContentRowDefinition);
 	const { locale } = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7();
 	const shouldForceLeadingZeros = props.shouldForceLeadingZeros ?? ui.dateInput.shouldForceLeadingZeros;
@@ -1211,10 +1253,51 @@ const DateRangePickerInner = ({ fullIso = true, minValue, maxValue, renderStatic
 		maxValue,
 		parseCalendarDate
 	]);
+	const normalizedRange = normalizedValue;
 	if (!renderInput) {
-		const startDateValue = parseCalendarDate(normalizedValue?.start ?? null);
-		const endDateValue = parseCalendarDate(normalizedValue?.end ?? null);
-		const hasProvidedRangeValue = !!(normalizedValue?.start || normalizedValue?.end);
+		const relativeOptions = [
+			{
+				value: "thisWeek",
+				label: t(($) => $.ui.datePicker.presets.thisWeek, { ns: "ui" })
+			},
+			{
+				value: "lastWeek",
+				label: t(($) => $.ui.datePicker.presets.lastWeek, { ns: "ui" })
+			},
+			{
+				value: "thisAndLastWeek",
+				label: t(($) => $.ui.datePicker.presets.thisAndLastWeek, { ns: "ui" })
+			},
+			{
+				value: "thisMonth",
+				label: t(($) => $.ui.datePicker.presets.thisMonth, { ns: "ui" })
+			},
+			{
+				value: "thisAndLastMonth",
+				label: t(($) => $.ui.datePicker.presets.thisAndLastMonth, { ns: "ui" })
+			},
+			{
+				value: "thisYear",
+				label: t(($) => $.ui.datePicker.presets.thisYear, { ns: "ui" })
+			},
+			{
+				value: "lastYear",
+				label: t(($) => $.ui.datePicker.presets.lastYear, { ns: "ui" })
+			},
+			{
+				value: "thisAndLastYear",
+				label: t(($) => $.ui.datePicker.presets.thisAndLastYear, { ns: "ui" })
+			},
+			{
+				value: "soFar",
+				label: t(($) => $.ui.datePicker.presets.soFar, { ns: "ui" })
+			},
+			...ui.dateInput.dateRangeOptions
+		];
+		const relativeLabel = props.mode === "relative" ? relativeOptions.find((option) => option.value === normalizedValue)?.label : void 0;
+		const startDateValue = parseCalendarDate(normalizedRange?.start ?? null);
+		const endDateValue = parseCalendarDate(normalizedRange?.end ?? null);
+		const hasProvidedRangeValue = props.mode === "relative" ? !!relativeLabel : !!(normalizedRange?.start || normalizedRange?.end);
 		const as = props.as ?? ui.input.as;
 		const size = props.size ?? ui.input.size;
 		const isDisabled = isFormControlDisabled || !!props.isDisabled;
@@ -1228,7 +1311,7 @@ const DateRangePickerInner = ({ fullIso = true, minValue, maxValue, renderStatic
 			size: todayIconButtonSize,
 			todayIconButtonComponent
 		});
-		const disableManualEntry = props.disableManualEntry ?? ui.dateInput.disableManualEntry;
+		const disableManualEntry = props.mode === "relative" || (props.disableManualEntry ?? ui.dateInput.disableManualEntry);
 		const showDropdown = !props.disableDropdown || disableManualEntry;
 		const staticSegments = getStaticDateRangeSegments({
 			start: startDateValue,
@@ -1274,14 +1357,22 @@ const DateRangePickerInner = ({ fullIso = true, minValue, maxValue, renderStatic
 				onClick: () => {},
 				altText: ""
 			} : void 0,
-			children: staticSegments
+			children: relativeLabel ? /* @__PURE__ */ jsx(Typography, {
+				size: "label-1",
+				className: "truncate",
+				children: relativeLabel
+			}) : staticSegments
 		});
 	}
 	return /* @__PURE__ */ jsx(DateRangePickerBase, {
 		...props,
 		...dateLimits,
 		ref: $5dc95899b306f630$export$c9058316764c140e(props.ref, inputRef),
-		value: parseDateRange(normalizedValue),
+		mode: props.mode,
+		relativeValue: props.mode === "relative" ? normalizedValue : null,
+		relativeOptions: props.mode === "relative" ? ui.dateInput.dateRangeOptions : [],
+		onRelativeChange: (value) => props.onChange?.(value),
+		value: props.mode === "relative" ? null : parseDateRange(normalizedRange),
 		onChange: (value) => props.onChange?.(formatDateRange(value))
 	});
 };

package/dist/{DateTimePicker-YxEZH7Kk.js → DateTimePicker-B39ywgjx.js}

@@ -1,16 +1,16 @@
-import { t as UIConfig } from "./uiConfig.context-SBtRegKv.js";
+import { t as UIConfig } from "./uiConfig.context-B_wBkrQZ.js";
 import { t as FormField } from "./FormField-ChDNTHr4.js";
-import { n as renderDatePickerTodayIcon, r as datePickerInputContentRowDefinition, t as DatePickerInput } from "./DatePickerInput-BLL4-Sqj.js";
+import { n as renderDatePickerTodayIcon, r as datePickerInputContentRowDefinition, t as DatePickerInput } from "./DatePickerInput-CQKtbsQd.js";
 import { t as clsx } from "./clsx-CnD0nOiA.js";
 import { _ as $5dc95899b306f630$export$c9058316764c140e } from "./import-CuNJ25EP.js";
 import { t as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "./context-HV79Qf_F.js";
-import { d as useCalendarState, i as getStaticDateTimeFocusTarget, n as getStaticCalendarDateTimeSegments, o as DateTimeDialogFooter, p as useDatePickerState, s as DateTimeDialog } from "./staticDateTimeSegments-C8AOKnEO.js";
-import { r as $6057a3d2a53a12fd$export$42df105a73306d51, t as Calendar } from "./Calendar-B7OLjVV9.js";
+import { d as useCalendarState, i as getStaticDateTimeFocusTarget, n as getStaticCalendarDateTimeSegments, o as DateTimeDialogFooter, p as useDatePickerState, s as DateTimeDialog } from "./staticDateTimeSegments-CAEX9ogz.js";
+import { r as $6057a3d2a53a12fd$export$42df105a73306d51, t as Calendar } from "./Calendar-CzDZnIF0.js";
 import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
 import { t as FieldController } from "./form.binding-DyZ4fH8l.js";
-import { t as TooltipWrapper } from "./TooltipWrapper-D8gfa-pC.js";
-import { n as InputFrame, t as useStaticInputHandoff } from "./useStaticInputHandoff-pnEcfX_d.js";
-import { t as normalizeDatePickerValue } from "./datePickerValue.utils-BqdbvGFL.js";
+import { t as TooltipWrapper } from "./TooltipWrapper-eCF5-eNP.js";
+import { n as InputFrame, t as useStaticInputHandoff } from "./useStaticInputHandoff-ClwANfo-.js";
+import { t as normalizeDatePickerValue } from "./datePickerValue.utils-BoOLaZk_.js";
 import { t as DateTimeUtils } from "./date-time.utils-0F9qduim.js";
 import { memo, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
 import { Time, createCalendar, getLocalTimeZone, toCalendarDate, toCalendarDateTime, today } from "@internationalized/date";

package/dist/{FileUpload-uqaBcMUE.js → FileUpload-CnYu5cmB.js}

@@ -1,5 +1,5 @@
 import { t as createLucideIcon } from "./createLucideIcon-CskCrR9z.js";
-import { t as UIConfig } from "./uiConfig.context-SBtRegKv.js";
+import { t as UIConfig } from "./uiConfig.context-B_wBkrQZ.js";
 import { t as FormField } from "./FormField-ChDNTHr4.js";
 import { n as $cb088e721efb9218$export$3c6489d84dc98b6, r as Upload, t as $1e2864c73f66a4da$export$6fb4a10d2c950550 } from "./FileTrigger-BSzrj50r.js";
 import { t as X } from "./x-BYOEO0gW.js";
@@ -8,7 +8,7 @@ import { _ as $5dc95899b306f630$export$c9058316764c140e } from "./import-CuNJ25E
 import { t as $313b98861ee5dd6c$export$d6875122194c7b44 } from "./useLabels-CUjKpeKj.js";
 import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
 import { t as Typography } from "./Typography-AcUd9df8.js";
-import { t as Button } from "./Button-B8T7AjGP.js";
+import { t as Button } from "./Button-CtPMeT8f.js";
 import { InlineIconButton } from "./components/inline-icon-button.js";
 import "./i18n-C2TBJvnh.js";
 import { TextButton } from "./components/text-button.js";

package/dist/{Form-BO5xLioQ.d.ts → Form-DsbBBmgz.d.ts}

@@ -1,5 +1,5 @@
 import { c as ZodObject, h as output } from "./schemas-CAtYiHoz.js";
-import { c as InputComponentProps, i as DefaultComponentType, r as AllowedComponentType, u as InputDefBaseProps } from "./dynamicInputs-BoAqswLw.js";
+import { c as InputComponentProps, i as DefaultComponentType, r as AllowedComponentType, u as InputDefBaseProps } from "./dynamicInputs-CiJNkz3F.js";
 import { c as UIForm, l as UseFormProps, o as FormSubmitErrorHandler, s as FormSubmitHandler } from "./form.binding-DWlFTecs.js";
 import { DependencyList, ReactNode } from "react";
 //#region src/hooks/useAutosave.d.ts