@povio/ui 2.2.5 → 2.2.7

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

@@ -1,6 +1,6 @@
 import { Typography } from "../../../text/Typography/Typography.js";
 import { UIConfig } from "../../../../config/uiConfig.context.js";
-import { ns } from "../../../../config/i18n.js";
+import "../../../../config/i18n.js";
 import { DatePickerInput } from "../shared/DatePickerInput.js";
 import { DateTimeDialog } from "../shared/DateTimeDialog.js";
 import { DateTimeDialogFooter } from "../shared/DateTimeDialogFooter.js";
@@ -14,11 +14,12 @@ import { useCallback, useImperativeHandle, useMemo, useRef, useState } from "rea
 import { Button } from "react-aria-components";
 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, getLocalTimeZone, startOfMonth, startOfWeek, startOfYear, toCalendarDate, today } from "@internationalized/date";
 import { DateTime } from "luxon";
 import { useDateRangePickerState, useRangeCalendarState } from "react-stately";
-import { useTranslation } from "react-i18next";
+//#region src/components/inputs/DateTime/DateRangePicker/DateRangePicker.tsx
 var DateRangePickerBase = (props) => {
 	const ui = UIConfig.useConfig();
 	const { t } = useTranslation();
@@ -324,12 +325,12 @@ var DateRangePickerBase = (props) => {
 		state.toggle();
 	};
 	const onTodayPress = () => {
-		const todayDate$1 = today(getLocalTimeZone());
-		leftCalendarState.setFocusedDate(todayDate$1);
-		rightCalendarState.setFocusedDate(todayDate$1.add({ months: 1 }));
+		const todayDate = today(getLocalTimeZone());
+		leftCalendarState.setFocusedDate(todayDate);
+		rightCalendarState.setFocusedDate(todayDate.add({ months: 1 }));
 		syncCalendarStates({
-			start: todayDate$1,
-			end: todayDate$1
+			start: todayDate,
+			end: todayDate
 		});
 	};
 	const onOpenChange = (isOpen) => {
@@ -528,7 +529,7 @@ var DateRangePickerBase = (props) => {
 		})
 	});
 };
-const DateRangePicker = ({ fullIso = true, minValue, maxValue, ...props }) => {
+var DateRangePicker = ({ fullIso = true, minValue, maxValue, ...props }) => {
 	const formatDateRange = (range) => {
 		if (!range?.start || !range?.end) return null;
 		if (fullIso) return {
@@ -592,4 +593,5 @@ const DateRangePicker = ({ fullIso = true, minValue, maxValue, ...props }) => {
 		onChange: (value) => props.onChange?.(formatDateRange(value))
 	});
 };
+//#endregion
 export { DateRangePicker };

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

@@ -13,6 +13,7 @@ import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";
 import { Time, createCalendar, getLocalTimeZone, now, toCalendarDateTime, today } from "@internationalized/date";
 import { useCalendarState, useDatePickerState } from "react-stately";
+//#region src/components/inputs/DateTime/DateTimePicker/DateTimePicker.tsx
 var DateTimePickerBase = (props) => {
 	const ui = UIConfig.useConfig();
 	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, value, disableDropdown, isTimeOptional, 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, ...rest } = props;
@@ -172,7 +173,7 @@ var DateTimePickerBase = (props) => {
 		})
 	});
 };
-const DateTimePicker = ({ fullIso = true, ...props }) => {
+var DateTimePicker = ({ fullIso = true, ...props }) => {
 	const formatDateValue = (dateValue) => {
 		if (dateValue === null) return null;
 		if (fullIso) return DateTimeUtils.fromCalendarDateTimeToUTCISO(dateValue);
@@ -205,4 +206,5 @@ const DateTimePicker = ({ fullIso = true, ...props }) => {
 		onChange: (value) => props.onChange?.(formatDateValue(value))
 	});
 };
+//#endregion
 export { DateTimePicker };

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

@@ -14,6 +14,7 @@ import { Controller } from "react-hook-form";
 import { getLocalTimeZone, now, toTime } from "@internationalized/date";
 import { DateTime } from "luxon";
 import { useTimeFieldState } from "react-stately";
+//#region src/components/inputs/DateTime/TimePicker/TimePicker.tsx
 var TimePickerBase = (props) => {
 	const ui = UIConfig.useConfig();
 	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, value, disableDropdown, placeholder, variant = ui.input.variant, as = ui.input.as, size = ui.input.size, hideLabel = ui.input.hideLabel, isClearable = ui.input.isClearable, disableManualEntry = ui.dateInput.disableManualEntry, ...rest } = props;
@@ -122,7 +123,7 @@ var TimePickerBase = (props) => {
 		})
 	});
 };
-const TimePicker = (props) => {
+var TimePicker = (props) => {
 	const formatTimeValue = (timeValue) => {
 		if (timeValue === null) return null;
 		const parsedDate = props.date ? DateTime.fromISO(props.date).toJSDate() : void 0;
@@ -155,4 +156,5 @@ const TimePicker = (props) => {
 		onChange: (value) => props.onChange?.(formatTimeValue(value))
 	});
 };
+//#endregion
 export { TimePicker };

package/dist/components/inputs/DateTime/shared/Calendar.js

@@ -7,7 +7,8 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { useState } from "react";
 import { useCalendar } from "@react-aria/calendar";
-const Calendar = ({ className, includesTime, datePickerState, hourCycle, onApply, ...props }) => {
+//#region src/components/inputs/DateTime/shared/Calendar.tsx
+var Calendar = ({ className, includesTime, datePickerState, hourCycle, onApply, ...props }) => {
 	const [toggleState, setToggleState] = useState(null);
 	const { calendarProps, prevButtonProps, nextButtonProps } = useCalendar(props.calendarProps, props.state);
 	const handleDateChange = () => {
@@ -51,4 +52,5 @@ const Calendar = ({ className, includesTime, datePickerState, hourCycle, onApply
 		})]
 	});
 };
+//#endregion
 export { Calendar };

package/dist/components/inputs/DateTime/shared/CalendarCell.js

@@ -6,10 +6,11 @@ import { mergeProps } from "@react-aria/utils";
 import { isSameDay } from "@internationalized/date";
 import { useCalendarCell } from "@react-aria/calendar";
 import { useFocusRing } from "@react-aria/focus";
+//#region src/components/inputs/DateTime/shared/CalendarCell.tsx
 var isRange = (state) => {
 	return "highlightedRange" in state;
 };
-const CalendarCell = ({ state, onApply, shouldCloseOnSelect = true, onDateSelection, onDateHover, rangeSelection, hoverDate, onKeyboardNavigation, ...props }) => {
+var CalendarCell = ({ state, onApply, shouldCloseOnSelect = true, onDateSelection, onDateHover, rangeSelection, hoverDate, onKeyboardNavigation, ...props }) => {
 	const ref = useRef(null);
 	const { cellProps, buttonProps, formattedDate, isSelected, isDisabled, isOutsideVisibleRange } = useCalendarCell(props, state, ref);
 	const { focusProps } = useFocusRing();
@@ -127,4 +128,5 @@ const CalendarCell = ({ state, onApply, shouldCloseOnSelect = true, onDateSelect
 		})
 	});
 };
+//#endregion
 export { CalendarCell };

package/dist/components/inputs/DateTime/shared/CalendarGrid.js

@@ -3,6 +3,7 @@ import { CalendarCell } from "./CalendarCell.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { useCalendarGrid } from "@react-aria/calendar";
+//#region src/components/inputs/DateTime/shared/CalendarGrid.tsx
 var WEEK_INDICES = [
 	0,
 	1,
@@ -11,7 +12,7 @@ var WEEK_INDICES = [
 	4,
 	5
 ];
-const CalendarGrid = ({ state, onApply, shouldCloseOnSelect, offset = {}, onDateSelection, onDateHover, rangeSelection, hoverDate, onKeyboardNavigation, className, calendarSide, ...props }) => {
+var CalendarGrid = ({ state, onApply, shouldCloseOnSelect, offset = {}, onDateSelection, onDateHover, rangeSelection, hoverDate, onKeyboardNavigation, className, calendarSide, ...props }) => {
 	const { gridProps, headerProps, weekDays } = useCalendarGrid({
 		...props,
 		weekdayStyle: "short"
@@ -47,4 +48,5 @@ const CalendarGrid = ({ state, onApply, shouldCloseOnSelect, offset = {}, onDate
 		})
 	});
 };
+//#endregion
 export { CalendarGrid };

package/dist/components/inputs/DateTime/shared/CalendarHeader.js

@@ -8,11 +8,12 @@ import { clsx } from "clsx";
 import { Button, ToggleButtonGroup } from "react-aria-components";
 import { Time } from "@internationalized/date";
 import { useDateFormatter } from "@react-aria/i18n";
+//#region src/components/inputs/DateTime/shared/CalendarHeader.tsx
 var HourCycle = {
 	12: "h12",
 	24: "h23"
 };
-const CalendarHeader = ({ calendarState, datePickerState, prevButtonProps, nextButtonProps, includesTime, hourCycle, toggleState, setToggleState }) => {
+var CalendarHeader = ({ calendarState, datePickerState, prevButtonProps, nextButtonProps, includesTime, hourCycle, toggleState, setToggleState }) => {
 	const formatter = useDateFormatter({
 		month: "long",
 		timeZone: calendarState.timeZone
@@ -86,4 +87,5 @@ const CalendarHeader = ({ calendarState, datePickerState, prevButtonProps, nextB
 		]
 	});
 };
+//#endregion
 export { CalendarHeader };

package/dist/components/inputs/DateTime/shared/CalendarSelectHeader.js

@@ -5,13 +5,14 @@ import { ChevronsLeftIcon } from "../../../../assets/icons/ChevronsLeft.js";
 import { ChevronsRightIcon } from "../../../../assets/icons/ChevronsRight.js";
 import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconButton.js";
 import { PillButton } from "../../../buttons/PillButton/PillButton.js";
-import { ns } from "../../../../config/i18n.js";
+import "../../../../config/i18n.js";
 import { Select } from "../../Selection/Select/Select.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useMemo } from "react";
-import { useDateFormatter } from "@react-aria/i18n";
 import { useTranslation } from "react-i18next";
-const CalendarSelectHeader = ({ state, isPrevMonthDisabled, isPrevYearDisabled, isNextMonthDisabled, isNextYearDisabled, offset = { months: 0 }, onNavigate, maxDate, minDate }) => {
+import { useDateFormatter } from "@react-aria/i18n";
+//#region src/components/inputs/DateTime/shared/CalendarSelectHeader.tsx
+var CalendarSelectHeader = ({ state, isPrevMonthDisabled, isPrevYearDisabled, isNextMonthDisabled, isNextYearDisabled, offset = { months: 0 }, onNavigate, maxDate, minDate }) => {
 	const { t } = useTranslation("ui");
 	const displayDate = state.visibleRange.start.add(offset);
 	const currentMonth = displayDate.month - 1;
@@ -172,4 +173,5 @@ const CalendarSelectHeader = ({ state, isPrevMonthDisabled, isPrevYearDisabled,
 		]
 	});
 };
+//#endregion
 export { CalendarSelectHeader };

package/dist/components/inputs/DateTime/shared/DateField.js

@@ -5,7 +5,8 @@ import { useEffect, useImperativeHandle, useRef } from "react";
 import { useDateField, useLocale } from "react-aria";
 import { createCalendar } from "@internationalized/date";
 import { useDateFieldState } from "react-stately";
-const DateField = ({ ref, onClearChange, hidePlaceholder, isDisabled, disableManualEntry, ...props }) => {
+//#region src/components/inputs/DateTime/shared/DateField.tsx
+var DateField = ({ ref, onClearChange, hidePlaceholder, isDisabled, disableManualEntry, ...props }) => {
 	const { locale } = useLocale();
 	const state = useDateFieldState({
 		...props,
@@ -86,4 +87,5 @@ const DateField = ({ ref, onClearChange, hidePlaceholder, isDisabled, disableMan
 		})
 	});
 };
+//#endregion
 export { DateField };

package/dist/components/inputs/DateTime/shared/DatePickerInput.js

@@ -15,7 +15,8 @@ import { useCallback, useImperativeHandle, useRef, useState } from "react";
 import { Button } from "react-aria-components";
 import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
 import { getLocalTimeZone, now, toCalendarDateTime, today } from "@internationalized/date";
-const DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, isClearable, headerProps, todayIcon, isDirty, isRequired, disableManualEntry, placeholder, className, onOpenDropdown, ...props }) => {
+//#region src/components/inputs/DateTime/shared/DatePickerInput.tsx
+var DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, isClearable, headerProps, todayIcon, isDirty, isRequired, disableManualEntry, placeholder, className, onOpenDropdown, ...props }) => {
 	const inputBaseCva = UIStyle.useCva("input.baseCva", inputBase);
 	const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
 	const [canClear, setCanClear] = useState(false);
@@ -152,4 +153,5 @@ const DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, butto
 		})]
 	});
 };
+//#endregion
 export { DatePickerInput };

package/dist/components/inputs/DateTime/shared/DateSegmentItem.js

@@ -2,7 +2,8 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { useRef } from "react";
 import { useDateSegment } from "react-aria";
-const getPlaceholder = (segment) => {
+//#region src/components/inputs/DateTime/shared/DateSegmentItem.tsx
+var getPlaceholder = (segment) => {
 	if (!segment.isPlaceholder) return null;
 	switch (segment.type) {
 		case "hour": return "hh";
@@ -11,7 +12,7 @@ const getPlaceholder = (segment) => {
 		default: return segment.placeholder;
 	}
 };
-const DateSegmentItem = ({ segment, state, isDisabled, timePickerOnly, hidePlaceholder }) => {
+var DateSegmentItem = ({ segment, state, isDisabled, timePickerOnly, hidePlaceholder }) => {
 	const ref = useRef(null);
 	const { segmentProps } = useDateSegment(segment, state, ref);
 	const isInputEmpty = !state.value;
@@ -26,4 +27,5 @@ const DateSegmentItem = ({ segment, state, isDisabled, timePickerOnly, hidePlace
 		}), segment.isPlaceholder ? "" : segment.text] })
 	});
 };
+//#endregion
 export { DateSegmentItem, getPlaceholder };

package/dist/components/inputs/DateTime/shared/DateTimeDialog.js

@@ -1,13 +1,12 @@
 import { UIStyle } from "../../../../config/uiStyle.context.js";
 import { BottomSheet } from "../../../overlays/BottomSheet/BottomSheet.js";
 import { useBreakpoint } from "../../../../hooks/useBreakpoint.js";
-import { FormFieldHeader } from "../../FormField/FormFieldHeader.js";
-import { FormFieldHeaderClose } from "../../FormField/FormFieldHeaderClose.js";
 import { popover } from "../../../shared/popover.cva.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import clsx$1 from "clsx";
 import { Dialog, Popover } from "react-aria-components";
-const DateTimeDialog = ({ hideSidebar, children, footer, sidebar, label, isOpen, triggerRef, dialogProps, onOpenChange }) => {
+//#region src/components/inputs/DateTime/shared/DateTimeDialog.tsx
+var DateTimeDialog = ({ hideSidebar, children, footer, sidebar, label, isOpen, triggerRef, dialogProps, onOpenChange }) => {
 	const popoverCva = UIStyle.useCva("popover.cva", popover);
 	if (useBreakpoint("md")) {
 		if (!isOpen) return null;
@@ -30,7 +29,7 @@ const DateTimeDialog = ({ hideSidebar, children, footer, sidebar, label, isOpen,
 			})
 		});
 	}
-	return /* @__PURE__ */ jsx(BottomSheet, {
+	return /* @__PURE__ */ jsxs(BottomSheet, {
 		label,
 		footer,
 		isOpen,
@@ -39,15 +38,8 @@ const DateTimeDialog = ({ hideSidebar, children, footer, sidebar, label, isOpen,
 		isScrollable: true,
 		height: "auto",
 		isDismissable: true,
-		children: (close) => /* @__PURE__ */ jsxs(Fragment, { children: [
-			/* @__PURE__ */ jsx(FormFieldHeader, {
-				label,
-				className: "mb-list-height-title-bottom! shrink-0 px-4 pt-3",
-				rightContent: /* @__PURE__ */ jsx(FormFieldHeaderClose, { onClose: close })
-			}),
-			children,
-			!hideSidebar && sidebar
-		] })
+		children: [children, !hideSidebar && sidebar]
 	});
 };
+//#endregion
 export { DateTimeDialog };

package/dist/components/inputs/DateTime/shared/DateTimeDialogFooter.js

@@ -1,9 +1,10 @@
+import "../../../../config/i18n.js";
 import { TextButton } from "../../../buttons/TextButton/TextButton.js";
-import { ns } from "../../../../config/i18n.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { useTranslation } from "react-i18next";
-const DateTimeDialogFooter = ({ isValid = true, isDisabled = false, onTodayPress, onApply }) => {
+//#region src/components/inputs/DateTime/shared/DateTimeDialogFooter.tsx
+var DateTimeDialogFooter = ({ isValid = true, isDisabled = false, onTodayPress, onApply }) => {
 	const { t } = useTranslation("ui");
 	return /* @__PURE__ */ jsxs("footer", {
 		className: clsx("flex shrink-0 items-center gap-2 bg-elevation-fill-default-2 px-4 py-3 md:border-elevation-outline-default-1 md:border-t md:bg-elevation-fill-default-1 md:py-1-5", onTodayPress ? "justify-between" : "justify-end"),
@@ -22,4 +23,5 @@ const DateTimeDialogFooter = ({ isValid = true, isDisabled = false, onTodayPress
 		})]
 	});
 };
+//#endregion
 export { DateTimeDialogFooter };

package/dist/components/inputs/DateTime/shared/MonthPicker.js

@@ -3,7 +3,8 @@ import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { ListBox, ListBoxItem } from "react-aria-components";
 import { useDateFormatter } from "@react-aria/i18n";
-const MonthPicker = ({ state, onSelectionChange }) => {
+//#region src/components/inputs/DateTime/shared/MonthPicker.tsx
+var MonthPicker = ({ state, onSelectionChange }) => {
 	const formatter = useDateFormatter({
 		month: "long",
 		timeZone: state.timeZone
@@ -53,4 +54,5 @@ const MonthPicker = ({ state, onSelectionChange }) => {
 		})
 	});
 };
+//#endregion
 export { MonthPicker };

package/dist/components/inputs/DateTime/shared/RangeCalendar.js

@@ -4,7 +4,8 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { useMemo, useRef } from "react";
 import { useRangeCalendar } from "@react-aria/calendar";
-const RangeCalendar = ({ className, leftCalendarState, rightCalendarState, calendarProps, onApply, onRangeChange: _onRangeChange, onDateSelection, onDateHover, rangeSelection, hoverDate, onKeyboardNavigation }) => {
+//#region src/components/inputs/DateTime/shared/RangeCalendar.tsx
+var RangeCalendar = ({ className, leftCalendarState, rightCalendarState, calendarProps, onApply, onRangeChange: _onRangeChange, onDateSelection, onDateHover, rangeSelection, hoverDate, onKeyboardNavigation }) => {
 	const leftRef = useRef(null);
 	const rightRef = useRef(null);
 	const { calendarProps: leftCalendarAriaProps } = useRangeCalendar(calendarProps, leftCalendarState, leftRef);
@@ -93,4 +94,5 @@ const RangeCalendar = ({ className, leftCalendarState, rightCalendarState, calen
 		})
 	});
 };
+//#endregion
 export { RangeCalendar };

package/dist/components/inputs/DateTime/shared/TimeField.js

@@ -1,6 +1,7 @@
 import { DateSegmentItem } from "./DateSegmentItem.js";
 import { jsx } from "react/jsx-runtime";
-const TimeField = ({ ref, fieldProps, state, isDisabled, hidePlaceholder }) => {
+//#region src/components/inputs/DateTime/shared/TimeField.tsx
+var TimeField = ({ ref, fieldProps, state, isDisabled, hidePlaceholder }) => {
 	return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("div", {
 		...fieldProps,
 		ref,
@@ -14,4 +15,5 @@ const TimeField = ({ ref, fieldProps, state, isDisabled, hidePlaceholder }) => {
 		}, i))
 	}) });
 };
+//#endregion
 export { TimeField };

package/dist/components/inputs/DateTime/shared/TimePickerForm.js

@@ -11,8 +11,9 @@ import { useEffect, useRef } from "react";
 import { useDateSegment, useLocale, useTimeField } from "react-aria";
 import { Time } from "@internationalized/date";
 import { useTimeFieldState } from "@react-stately/datepicker";
+//#region src/components/inputs/DateTime/shared/TimePickerForm.tsx
 var INCREMENT_STEP_SIZE = 5;
-const TimePickerForm = ({ state, datePickerState }) => {
+var TimePickerForm = ({ state, datePickerState }) => {
 	const isDesktop = useBreakpoint("md");
 	const { locale } = useLocale();
 	const fieldState = useTimeFieldState({
@@ -155,4 +156,5 @@ var TimeSegmentButton = ({ segment, state, type }) => {
 	});
 };
 var showSegmentText = (text) => !/[\u2066\u2069]/.test(text);
+//#endregion
 export { TimePickerForm };

package/dist/components/inputs/DateTime/shared/TimePickerInput.js

@@ -11,7 +11,8 @@ import { clsx } from "clsx";
 import { useState } from "react";
 import { Button } from "react-aria-components";
 import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
-const TimePickerInput = ({ ref, as, fieldProps, state, isDisabled, isDirty, isInvalid, disableDropdown, variant, size, isClearable, headerProps, disableManualEntry, placeholder, onPress, ...props }) => {
+//#region src/components/inputs/DateTime/shared/TimePickerInput.tsx
+var TimePickerInput = ({ ref, as, fieldProps, state, isDisabled, isDirty, isInvalid, disableDropdown, variant, size, isClearable, headerProps, disableManualEntry, placeholder, onPress, ...props }) => {
 	const inputBaseCva = UIStyle.useCva("input.baseCva", inputBase);
 	const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
 	const { hoverProps, isHovered } = useHover({ isDisabled });
@@ -85,4 +86,5 @@ const TimePickerInput = ({ ref, as, fieldProps, state, isDisabled, isDirty, isIn
 		})]
 	});
 };
+//#endregion
 export { TimePickerInput };

package/dist/components/inputs/DateTime/shared/YearPicker.js

@@ -6,7 +6,8 @@ import { useMemo } from "react";
 import { ListBox, ListBoxItem } from "react-aria-components";
 import { today } from "@internationalized/date";
 import { useDateFormatter } from "@react-aria/i18n";
-const YearPicker = ({ state, onSelectionChange }) => {
+//#region src/components/inputs/DateTime/shared/YearPicker.tsx
+var YearPicker = ({ state, onSelectionChange }) => {
 	const formatter = useDateFormatter({
 		year: "numeric",
 		timeZone: state.timeZone
@@ -61,4 +62,5 @@ const YearPicker = ({ state, onSelectionChange }) => {
 		})
 	});
 };
+//#endregion
 export { YearPicker };

package/dist/components/inputs/File/FileUpload.d.ts

@@ -1,4 +1,4 @@
 import { FieldValues } from 'react-hook-form';
 import { FileUploadProps } from './fileUpload.types';
-export type { FileUploadBaseProps, FileUploadError, FileUploadProps, FileUploadRequest, FileUploadResponse, FileUploadState, } from './fileUpload.types';
+export type { DefaultFile, FileUploadBaseProps, FileUploadError, FileUploadProps, FileUploadRequest, FileUploadResponse, FileUploadState, } from './fileUpload.types';
 export declare const FileUpload: <TFieldValues extends FieldValues = FieldValues>(props: FileUploadProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/inputs/File/FileUpload.js

@@ -1,5 +1,5 @@
 import { UIConfig } from "../../../config/uiConfig.context.js";
-import { ns } from "../../../config/i18n.js";
+import "../../../config/i18n.js";
 import { FormField } from "../FormField/FormField.js";
 import { FileUtils } from "../../../utils/file.utils.js";
 import { FileCardList } from "./shared/FileCardList.js";
@@ -11,13 +11,26 @@ import { clsx } from "clsx";
 import { useCallback, useState } from "react";
 import { DropZone } from "react-aria-components";
 import { mergeRefs, useLabels } from "@react-aria/utils";
-import { Controller } from "react-hook-form";
 import { useTranslation } from "react-i18next";
+import { Controller } from "react-hook-form";
+//#region src/components/inputs/File/FileUpload.tsx
 var FileUploadBase = (props) => {
 	const { t } = useTranslation("ui");
-	const { ref: _ref, label, tooltipText, variant = "vertical", as = "button", helperText, isRequired, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, className, allowsMultiple = false, hideLabel, acceptedFileTypes, clearOnSuccess, emptyText = t(($) => $.ui.fileUpload.emptyText), uploadText = t(($) => $.ui.fileUpload.uploadText), browseText = t(($) => $.ui.fileUpload.browse), fileUpload, fileRemove, children, listRenderer, onInvalidFileType, ...rest } = props;
+	const { ref: _ref, label, tooltipText, variant = "vertical", as = "button", helperText, isRequired, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, className, allowsMultiple = false, hideLabel, acceptedFileTypes, clearOnSuccess, emptyText = t(($) => $.ui.fileUpload.emptyText), uploadText = t(($) => $.ui.fileUpload.uploadText), browseText = t(($) => $.ui.fileUpload.browse), fileUpload, fileRemove, children, listRenderer, onInvalidFileType, defaultState, ...rest } = props;
 	const ui = UIConfig.useConfig();
-	const [uploadState, setUploadState] = useState(props.value ?? []);
+	const getInitialState = () => {
+		if (props.value != null && props.value.length > 0) return props.value;
+		if (!defaultState?.length) return [];
+		const items = defaultState.map((item, index) => ({
+			state: "uploaded",
+			displayName: item.name,
+			displaySize: item.size,
+			displayType: item.type,
+			id: item.id ?? `default-${index}`
+		}));
+		return allowsMultiple ? items : items.slice(0, 1);
+	};
+	const [uploadState, setUploadState] = useState(getInitialState);
 	const formFieldProps = {
 		error,
 		label,
@@ -77,9 +90,9 @@ var FileUploadBase = (props) => {
 				} : state));
 			});
 			if (clearOnSuccess) setUploadState([]);
-		} catch (error$1) {
+		} catch (error) {
 			setUploadState((prev) => prev.filter((_, i) => i < startIndex));
-			throw error$1;
+			throw error;
 		}
 	};
 	const handleSelect = (inputFiles) => {
@@ -168,7 +181,7 @@ var FileUploadBase = (props) => {
 		}))]
 	});
 };
-const FileUpload = (props) => {
+var FileUpload = (props) => {
 	if ("formControl" in props && props.formControl) {
 		const { formControl, ref, ...innerProps } = props;
 		return /* @__PURE__ */ jsx(Controller, {
@@ -186,4 +199,5 @@ const FileUpload = (props) => {
 	}
 	return /* @__PURE__ */ jsx(FileUploadBase, { ...props });
 };
+//#endregion
 export { FileUpload };

package/dist/components/inputs/File/FileUploadContainer.js

@@ -1,6 +1,7 @@
 import { FileUpload } from "./FileUpload.js";
 import { jsx } from "react/jsx-runtime";
-const FileUploadContainer = (props) => {
+//#region src/components/inputs/File/FileUploadContainer.tsx
+var FileUploadContainer = (props) => {
 	return /* @__PURE__ */ jsx(FileUpload, {
 		label: "",
 		hideLabel: true,
@@ -9,4 +10,5 @@ const FileUploadContainer = (props) => {
 		...props
 	});
 };
+//#endregion
 export { FileUploadContainer };

package/dist/components/inputs/File/InputUpload.js

@@ -8,6 +8,7 @@ import { clsx } from "clsx";
 import { useState } from "react";
 import { mergeRefs, useLabels } from "@react-aria/utils";
 import { Controller } from "react-hook-form";
+//#region src/components/inputs/File/InputUpload.tsx
 var InputUploadBase = ({ ref: _ref, label, tooltipText, variant, helperText, isRequired, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, className, onChange, onInvalidFileType, value, defaultValue, allowsMultiple = false, hideLabel, acceptedFileTypes, ...rest }) => {
 	const ui = UIConfig.useConfig();
 	const [internalFiles, setInternalFiles] = useState(() => {
@@ -90,7 +91,7 @@ var InputUploadBase = ({ ref: _ref, label, tooltipText, variant, helperText, isR
 		})
 	});
 };
-const InputUpload = (props) => {
+var InputUpload = (props) => {
 	if ("formControl" in props && props.formControl) {
 		const { formControl, ref, ...innerProps } = props;
 		return /* @__PURE__ */ jsx(Controller, {
@@ -108,4 +109,5 @@ const InputUpload = (props) => {
 	}
 	return /* @__PURE__ */ jsx(InputUploadBase, { ...props });
 };
+//#endregion
 export { InputUpload };

package/dist/components/inputs/File/fileUpload.types.d.ts

@@ -38,6 +38,12 @@ export interface FileUploadRequest {
         method: string;
     };
 }
+export interface DefaultFile {
+    name: string;
+    size: number;
+    type?: string;
+    id?: string;
+}
 export interface FileUploadCallbacks {
     fileUpload?: (request: FileUploadRequest, file: File, options?: {
         abortController?: AbortController;
@@ -53,7 +59,10 @@ export interface FileUploadCallbacks {
 export type FileUploadError = ApplicationException<GeneralErrorCodes>;
 export interface FileUploadState {
     state: "idle" | "uploading" | "uploaded" | "error";
-    file: File;
+    file?: File;
+    displayName?: string;
+    displaySize?: number;
+    displayType?: string;
     src?: string;
     id?: string;
     progress?: number;
@@ -74,6 +83,7 @@ export type FileUploadBaseProps = {
     uploadText?: string;
     browseText?: string;
     value?: FileUploadState[];
+    defaultState?: DefaultFile[];
     clearOnSuccess?: boolean;
     children?: (props: FileUploadContainerChildrenProps) => ReactNode;
     listRenderer?: (props: FileUploadContainerChildrenProps) => ReactNode;

package/dist/components/inputs/File/shared/FileCard.js

@@ -4,7 +4,8 @@ import { FileUploadContentLoading } from "./FileUploadContentLoading.js";
 import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { useMemo } from "react";
-const FileCard = ({ index, as, state, onRemove, isDisabled, onCancel }) => {
+//#region src/components/inputs/File/shared/FileCard.tsx
+var FileCard = ({ index, as, state, onRemove, isDisabled, onCancel }) => {
 	const content = useMemo(() => {
 		if (state.state === "uploading") return /* @__PURE__ */ jsx(FileUploadContentLoading, {
 			index,
@@ -47,4 +48,5 @@ const FileCard = ({ index, as, state, onRemove, isDisabled, onCancel }) => {
 		children: content
 	});
 };
+//#endregion
 export { FileCard };

package/dist/components/inputs/File/shared/FileCardList.js

@@ -1,7 +1,8 @@
 import { FileCard } from "./FileCard.js";
 import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
-const FileCardList = ({ uploadState, as, isDisabled, className, onRemove, onCancel }) => {
+//#region src/components/inputs/File/shared/FileCardList.tsx
+var FileCardList = ({ uploadState, as, isDisabled, className, onRemove, onCancel }) => {
 	return /* @__PURE__ */ jsx("div", {
 		className: clsx("mt-10 flex flex-col items-start gap-4 self-stretch", className),
 		children: uploadState.map((state, index) => /* @__PURE__ */ jsx(FileCard, {
@@ -11,7 +12,8 @@ const FileCardList = ({ uploadState, as, isDisabled, className, onRemove, onCanc
 			isDisabled,
 			onRemove,
 			onCancel
-		}, state.file.name || state.id || state.src))
+		}, state.file?.name ?? state.displayName ?? state.id ?? state.src))
 	});
 };
+//#endregion
 export { FileCardList };

package/dist/components/inputs/File/shared/FileUploadContent.js

@@ -4,7 +4,8 @@ import { FileUploadContentLoading } from "./FileUploadContentLoading.js";
 import { FileUploadContentEmpty } from "./FileUploadContentEmpty.js";
 import { jsx } from "react/jsx-runtime";
 import { FileTrigger } from "react-aria-components";
-const FileUploadContent = ({ variant, as, isDisabled, browseText, uploadText, emptyText, uploadState, handleCancelUpload, handleRemove, acceptedFileTypes, allowsMultiple, handleSelect, ...rest }) => {
+//#region src/components/inputs/File/shared/FileUploadContent.tsx
+var FileUploadContent = ({ variant, as, isDisabled, browseText, uploadText, emptyText, uploadState, handleCancelUpload, handleRemove, acceptedFileTypes, allowsMultiple, handleSelect, ...rest }) => {
 	const currentState = uploadState.at(0);
 	const fileTriggerProps = {
 		...rest,
@@ -58,4 +59,5 @@ const FileUploadContent = ({ variant, as, isDisabled, browseText, uploadText, em
 		})
 	});
 };
+//#endregion
 export { FileUploadContent };