@auth0/quantum-product 2.5.7 → 2.5.9

package/esm/date-picker/date-picker-popover.js

@@ -0,0 +1,429 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import 'react-day-picker/style.css';
+import * as React from 'react';
+import { DayPicker } from 'react-day-picker';
+import { Box } from '../box';
+import { Button } from '../button';
+import { Card } from '../card';
+import { DropdownMenuList, DropdownMenuListItem } from '../dropdown-menu';
+import { Popover } from '../popover';
+import { styled } from '../styled';
+import { useMergedClasses } from '../styles/classes';
+import { TextField } from '../text-field';
+import clsx from '../utils/clsx';
+import { datePickerPopoverClasses, datePickerPopoverComponentName, getDatePickerPopoverUtilityClass, } from './date-picker-classes';
+import { applyTimeToDate, extractTimeComponents, formatDate, formatDateRange, parseDate, parseDateRange, } from './date-picker-utils';
+var Root = styled(Popover, { name: datePickerPopoverComponentName, slot: 'Root' })(function (_a) {
+    var theme = _a.theme;
+    return ({
+        marginTop: theme.spacing(0.5),
+    });
+});
+var Content = styled(Card, { name: datePickerPopoverComponentName, slot: 'Content' })(function (_a) {
+    var theme = _a.theme, ownerState = _a.ownerState;
+    return ({
+        maxHeight: 'calc(100% - 96px)',
+        minWidth: theme.typography.pxToRem(180),
+        width: ownerState.currentView === 'options'
+            ? ownerState.inputWidth
+                ? "".concat(ownerState.inputWidth, "px")
+                : 'auto'
+            : ownerState.showTwoMonths
+                ? theme.typography.pxToRem(514) // Width for two months calendar view
+                : theme.typography.pxToRem(256),
+        WebkitOverflowScrolling: 'touch',
+        padding: theme.spacing(1),
+        border: "1px solid ".concat(theme.tokens.color_border_default),
+        borderRadius: 8,
+        borderColor: theme.tokens.color_border_default,
+        boxShadow: "0px 33px 80px rgba(0, 0, 0, 0.07), 0px 13.7866px 33.4221px rgba(0, 0, 0, 0.0503198), 0px 7.37098px 17.869px rgba(0, 0, 0, 0.0417275), 0px 4.13211px 10.0172px rgba(0, 0, 0, 0.035), 0px 2.19453px 5.32008px rgba(0, 0, 0, 0.0282725), 0px 0.913195px 2.21381px rgba(0, 0, 0, 0.0196802)",
+    });
+});
+var CalendarWrapper = styled('div', { name: datePickerPopoverComponentName, slot: 'CalendarWrapper' })(function (_a) {
+    var theme = _a.theme;
+    return ({
+        padding: theme.spacing(1),
+        '.rdp': {
+            '--rdp-cell-size': theme.spacing(2),
+            '--rdp-accent-color': theme.tokens.color_bg_button_primary,
+            '--rdp-background-color': theme.tokens.color_bg_link_primary_hover,
+            '--rdp-day-width': theme.spacing(2),
+            '--rdp-day-height': theme.spacing(2),
+            '--rdp-day_button-width': theme.spacing(2),
+            '--rdp-day_button-height': theme.spacing(2),
+            margin: 0,
+        },
+        '.rdp-nav': {
+            width: '100%',
+        },
+        '.rdp-day': {
+            color: theme.tokens.color_fg_default,
+            fontSize: theme.spacing(1.75),
+            width: theme.spacing(4),
+            height: theme.spacing(4),
+        },
+        '.rdp-month_caption': {
+            justifyContent: 'center',
+        },
+        '.rdp-button_previous': {
+            '&:focus': {
+                outline: "2px solid ".concat(theme.tokens.color_border_focus_bold),
+                outlineOffset: 2,
+            },
+            border: "1px solid ".concat(theme.tokens.color_border_default),
+            position: 'absolute',
+            left: 0,
+            width: theme.spacing(3),
+            height: theme.spacing(3),
+            borderRadius: theme.spacing(0.5),
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+        },
+        '.rdp-button_next': {
+            '&:focus': {
+                outline: "2px solid ".concat(theme.tokens.color_border_focus_bold),
+                outlineOffset: 2,
+            },
+            border: "1px solid ".concat(theme.tokens.color_border_default),
+            position: 'absolute',
+            right: 0,
+            width: theme.spacing(3),
+            height: theme.spacing(3),
+            borderRadius: theme.spacing(0.5),
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+        },
+        '.rdp-chevron': {
+            width: theme.spacing(2),
+            height: theme.spacing(2),
+            display: 'inline-block',
+            margin: 0,
+            fill: theme.tokens.color_fg_bold,
+        },
+        '.rdp-day_button': {
+            width: theme.spacing(4),
+            height: theme.spacing(4),
+        },
+        '.rdp-range_start .rdp-day_button': {
+            backgroundColor: theme.tokens.color_bg_button_primary,
+            border: 'none',
+            borderRadius: theme.spacing(0.75),
+        },
+        '.rdp-range_end .rdp-day_button': {
+            backgroundColor: theme.tokens.color_bg_button_primary,
+            border: 'none',
+            borderRadius: theme.spacing(0.75),
+        },
+        '.rdp-range_middle': {
+            backgroundColor: theme.tokens.color_bg_brand_primary_subtle,
+        },
+        '.rdp-selected': {
+            color: theme.tokens.color_fg_bold,
+            fontWeight: 'inherit',
+            fontSize: theme.spacing(1.75),
+        },
+        '.rdp-caption_label': {
+            fontSize: 14,
+        },
+        '.rdp-day_selected': {
+            backgroundColor: theme.tokens.color_bg_button_primary,
+            color: theme.tokens.color_fg_on_button_primary,
+        },
+        '.rdp-day_selected:hover': {
+            backgroundColor: theme.tokens.color_bg_button_primary_hover,
+        },
+        '.rdp-day_range_start, .rdp-day_range_end': {
+            backgroundColor: theme.tokens.color_bg_button_primary,
+            color: theme.tokens.color_fg_on_button_primary,
+        },
+        '.rdp-day_range_middle': {
+            backgroundColor: theme.tokens.color_bg_link_primary_hover,
+        },
+    });
+});
+var ButtonContainer = styled(Box, { name: datePickerPopoverComponentName, slot: 'ButtonContainer' })(function (_a) {
+    var theme = _a.theme;
+    return ({
+        display: 'flex',
+        justifyContent: 'flex-end',
+        padding: theme.spacing(1),
+        borderTop: "1px solid ".concat(theme.tokens.color_border_default),
+    });
+});
+var TimeInputContainer = styled('div', { name: datePickerPopoverComponentName, slot: 'TimeInput' })(function (_a) {
+    var theme = _a.theme;
+    return ({
+        display: 'flex',
+        justifyContent: 'flex-start',
+        gap: theme.spacing(0.5),
+        padding: theme.spacing(1),
+        alignItems: 'center',
+        borderTop: "1px solid ".concat(theme.tokens.color_border_default),
+    });
+});
+var EndTimeInputContainer = styled('div', { name: datePickerPopoverComponentName, slot: 'EndTimeInput' })(function (_a) {
+    var theme = _a.theme;
+    return ({
+        display: 'flex',
+        justifyContent: 'flex-start',
+        gap: theme.spacing(0.5),
+        alignItems: 'center',
+        marginLeft: theme.spacing(2),
+    });
+});
+var TimeInput = styled(TextField, { name: datePickerPopoverComponentName, slot: 'TimeInputField' })({
+    width: '3rem',
+});
+var TimeInputLabel = styled('span', { name: datePickerPopoverComponentName, slot: 'TimeInputLabel' })(function (_a) {
+    var theme = _a.theme;
+    return ({
+        color: theme.tokens.color_fg_default,
+        fontSize: theme.typography.caption.fontSize,
+    });
+});
+export var DatePickerPopover = React.forwardRef(function (props, ref) {
+    var anchorEl = props.anchorEl, open = props.open, onClose = props.onClose, onDateSelect = props.onDateSelect, options = props.options, value = props.value, _a = props.dateFormat, dateFormat = _a === void 0 ? 'MM/dd/yyyy' : _a, _b = props.timeFormat, timeFormat = _b === void 0 ? 'HH:mm:ss' : _b, PopoverProps = props.PopoverProps, _c = props.showTwoMonths, showTwoMonths = _c === void 0 ? false : _c, _d = props.isRangeSelection, isRangeSelection = _d === void 0 ? false : _d, _e = props.showTimeInput, showTimeInput = _e === void 0 ? false : _e, propClasses = props.classes, rootProps = __rest(props, ["anchorEl", "open", "onClose", "onDateSelect", "options", "value", "dateFormat", "timeFormat", "PopoverProps", "showTwoMonths", "isRangeSelection", "showTimeInput", "classes"]);
+    var classes = useMergedClasses(datePickerPopoverClasses, getDatePickerPopoverUtilityClass, propClasses);
+    // State to track the current view: 'options' or 'calendar'
+    var _f = __read(React.useState(options ? 'options' : 'calendar'), 2), currentView = _f[0], setCurrentView = _f[1];
+    // State to track the current range selection
+    var _g = __read(React.useState({}), 2), rangeSelection = _g[0], setRangeSelection = _g[1];
+    // Time state for single date or range start/end
+    var _h = __read(React.useState('00'), 2), hours = _h[0], setHours = _h[1];
+    var _j = __read(React.useState('00'), 2), minutes = _j[0], setMinutes = _j[1];
+    var _k = __read(React.useState('00'), 2), seconds = _k[0], setSeconds = _k[1];
+    // For range selection - end time
+    var _l = __read(React.useState('00'), 2), endHours = _l[0], setEndHours = _l[1];
+    var _m = __read(React.useState('00'), 2), endMinutes = _m[0], setEndMinutes = _m[1];
+    var _o = __read(React.useState('00'), 2), endSeconds = _o[0], setEndSeconds = _o[1];
+    // Reset selection and view when popover opens/closes
+    React.useEffect(function () {
+        if (!open) {
+            setRangeSelection({});
+            // Reset the view to options if there are options available
+            if (options) {
+                setCurrentView('options');
+            }
+        }
+        else if (value) {
+            if (isRangeSelection && value.includes('-')) {
+                // Parse range selection
+                var _a = parseDateRange(value, dateFormat, showTimeInput ? timeFormat : undefined), from = _a.from, to = _a.to;
+                if (from) {
+                    // Extract time components for range start
+                    var _b = extractTimeComponents(from), h = _b.hours, m = _b.minutes, s = _b.seconds;
+                    setHours(h);
+                    setMinutes(m);
+                    setSeconds(s);
+                }
+                if (to) {
+                    // Extract time components for range end
+                    var _c = extractTimeComponents(to), h = _c.hours, m = _c.minutes, s = _c.seconds;
+                    setEndHours(h);
+                    setEndMinutes(m);
+                    setEndSeconds(s);
+                }
+                if (from && to) {
+                    setRangeSelection({ from: from, to: to });
+                }
+            }
+            else if (!isRangeSelection) {
+                // For single date, try to parse with time format first if showTimeInput is enabled
+                var formatString = showTimeInput ? "".concat(dateFormat, " ").concat(timeFormat) : dateFormat;
+                var date = parseDate(value, formatString);
+                if (date) {
+                    setRangeSelection({ from: date });
+                    if (showTimeInput) {
+                        // Extract time components
+                        var _d = extractTimeComponents(date), h = _d.hours, m = _d.minutes, s = _d.seconds;
+                        setHours(h);
+                        setMinutes(m);
+                        setSeconds(s);
+                    }
+                }
+            }
+        }
+    }, [open, value, isRangeSelection, dateFormat, timeFormat, options, showTimeInput]);
+    // Handle calendar selections
+    var handleCalendarSelect = function (selection) {
+        if (!selection)
+            return;
+        // Keep the time values when date changes
+        if (selection.from && !selection.to) {
+            // Single date or range start
+            if (showTimeInput) {
+                var newFrom = applyTimeToDate(selection.from, { hours: hours, minutes: minutes, seconds: seconds });
+                setRangeSelection({ from: newFrom });
+            }
+            else {
+                setRangeSelection({ from: selection.from });
+            }
+        }
+        else if (selection.from && selection.to) {
+            // Range selection
+            if (showTimeInput) {
+                var newFrom = applyTimeToDate(selection.from, { hours: hours, minutes: minutes, seconds: seconds });
+                var newTo = applyTimeToDate(selection.to, { hours: endHours, minutes: endMinutes, seconds: endSeconds });
+                setRangeSelection({ from: newFrom, to: newTo });
+            }
+            else {
+                setRangeSelection(selection);
+            }
+        }
+        // Only auto-apply selection for non-range selection mode and when not showing time input
+        if (!isRangeSelection && !showTimeInput) {
+            applySelection(selection.from);
+        }
+        // For range selection or time input, we'll wait for user to click Apply
+    };
+    var handleTimeChange = function (value, setter, max) {
+        var numValue = value.replace(/\D/g, '');
+        var parsed = parseInt(numValue, 10);
+        if (!isNaN(parsed) && parsed >= 0 && parsed <= max) {
+            setter(parsed.toString().padStart(2, '0'));
+        }
+        else if (value === '') {
+            setter('00');
+        }
+        updateDateWithTime();
+    };
+    var updateDateWithTime = function () {
+        if (!rangeSelection.from)
+            return;
+        var newFrom = applyTimeToDate(rangeSelection.from, { hours: hours, minutes: minutes, seconds: seconds });
+        if (isRangeSelection && rangeSelection.to) {
+            var newTo = applyTimeToDate(rangeSelection.to, {
+                hours: endHours,
+                minutes: endMinutes,
+                seconds: endSeconds,
+            });
+            setRangeSelection({ from: newFrom, to: newTo });
+        }
+        else {
+            setRangeSelection({ from: newFrom });
+        }
+    };
+    var applySelection = function (singleDate) {
+        if (isRangeSelection) {
+            if (rangeSelection.from && rangeSelection.to) {
+                var formattedRange = formatDateRange(rangeSelection.from, rangeSelection.to, dateFormat, showTimeInput ? timeFormat : undefined);
+                onDateSelect(formattedRange, true);
+            }
+        }
+        else if (singleDate || rangeSelection.from) {
+            var dateToFormat = singleDate || rangeSelection.from;
+            if (dateToFormat) {
+                var formatString = showTimeInput ? "".concat(dateFormat, " ").concat(timeFormat) : dateFormat;
+                var formattedDate = formatDate(dateToFormat, formatString);
+                onDateSelect(formattedDate, true);
+            }
+        }
+    };
+    var cancelSelection = function () {
+        if (options) {
+            setCurrentView('options');
+        }
+        else {
+            onClose();
+        }
+    };
+    var handleOptionSelect = function (optionValue) {
+        if (optionValue === 'custom') {
+            setCurrentView('calendar');
+            return;
+        }
+        onDateSelect(optionValue, true);
+    };
+    var selectedValue;
+    if (rangeSelection.from) {
+        selectedValue = { from: rangeSelection.from, to: rangeSelection.to };
+    }
+    else if (value && !isRangeSelection) {
+        var formatString = showTimeInput ? "".concat(dateFormat, " ").concat(timeFormat) : dateFormat;
+        var parsedDate = parseDate(value, formatString);
+        if (parsedDate) {
+            selectedValue = parsedDate;
+        }
+    }
+    // Determine if we should show the action buttons - now for both range selection and time input
+    var showActionButtons = isRangeSelection || showTimeInput;
+    var canApply = isRangeSelection ? rangeSelection.from && rangeSelection.to : !!rangeSelection.from;
+    var _p = __read(React.useState(null), 2), inputWidth = _p[0], setInputWidth = _p[1];
+    React.useEffect(function () {
+        if (open && anchorEl) {
+            var width = anchorEl.getBoundingClientRect().width;
+            setInputWidth(width);
+        }
+    }, [open, anchorEl]);
+    var ownerState = {
+        showTwoMonths: showTwoMonths,
+        isRangeSelection: isRangeSelection,
+    };
+    return (React.createElement(Root, __assign({ open: open, anchorEl: anchorEl, onClose: onClose, className: clsx(classes.root), ownerState: ownerState, ref: ref, anchorOrigin: {
+            vertical: 'bottom',
+            horizontal: 'left',
+        }, transformOrigin: {
+            vertical: 'top',
+            horizontal: 'left',
+        }, marginThreshold: 30, style: { marginTop: '-24px' } }, PopoverProps, rootProps),
+        React.createElement(Content, { className: classes.content, ownerState: __assign(__assign({}, ownerState), { inputWidth: inputWidth, currentView: currentView }) }, currentView === 'options' && options ? (React.createElement(DropdownMenuList, null, options.map(function (option, index) { return (React.createElement(DropdownMenuListItem, { key: index, title: option.text, selected: option.value === value, onClick: function () { return handleOptionSelect(option.value); } })); }))) : (React.createElement(React.Fragment, null,
+            React.createElement(CalendarWrapper, { className: classes.calendarWrapper },
+                React.createElement(DayPicker, { mode: "range", selected: selectedValue, onSelect: handleCalendarSelect, showOutsideDays: true, numberOfMonths: showTwoMonths ? 2 : 1, pagedNavigation: showTwoMonths })),
+            showTimeInput && (React.createElement(React.Fragment, null,
+                React.createElement(TimeInputContainer, null,
+                    React.createElement(TimeInputLabel, null, "Time:"),
+                    React.createElement(TimeInput, { size: "small", value: hours, onChange: function (e) { return handleTimeChange(e.target.value, setHours, 23); }, placeholder: "HH" }),
+                    React.createElement("span", null, ":"),
+                    React.createElement(TimeInput, { size: "small", value: minutes, onChange: function (e) { return handleTimeChange(e.target.value, setMinutes, 59); }, placeholder: "MM" }),
+                    React.createElement("span", null, ":"),
+                    React.createElement(TimeInput, { size: "small", value: seconds, onChange: function (e) { return handleTimeChange(e.target.value, setSeconds, 59); }, placeholder: "SS" }),
+                    isRangeSelection && (React.createElement(EndTimeInputContainer, null,
+                        React.createElement(TimeInputLabel, null, "End Time:"),
+                        React.createElement(TimeInput, { size: "small", value: endHours, onChange: function (e) { return handleTimeChange(e.target.value, setEndHours, 23); }, placeholder: "HH" }),
+                        React.createElement("span", null, ":"),
+                        React.createElement(TimeInput, { size: "small", value: endMinutes, onChange: function (e) { return handleTimeChange(e.target.value, setEndMinutes, 59); }, placeholder: "MM" }),
+                        React.createElement("span", null, ":"),
+                        React.createElement(TimeInput, { size: "small", value: endSeconds, onChange: function (e) { return handleTimeChange(e.target.value, setEndSeconds, 59); }, placeholder: "SS" })))))),
+            showActionButtons && (React.createElement(ButtonContainer, { className: classes.buttonContainer },
+                React.createElement(Button, { size: "small", variant: "outlined", onClick: cancelSelection, style: { marginRight: 8 } }, "Cancel"),
+                React.createElement(Button, { size: "small", variant: "contained", color: "primary", onClick: function () { return applySelection(); }, disabled: !canApply }, "Apply"))))))));
+});

package/esm/date-picker/date-picker-state.js

@@ -0,0 +1,66 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import * as React from 'react';
+import { useId } from '../utils/use-id';
+export var useDatePickerState = function (_a) {
+    var _b = _a === void 0 ? {} : _a, propBaseId = _b.baseId;
+    var baseId = useId(propBaseId);
+    var triggerId = "".concat(baseId, "-trigger");
+    var popoverId = "".concat(baseId, "-popover");
+    var _c = __read(React.useState(null), 2), anchorEl = _c[0], setAnchorEl = _c[1];
+    var handleTriggerClick = function (event) {
+        event.preventDefault();
+        setAnchorEl(event.currentTarget);
+    };
+    var handlePopoverClose = function () { return setAnchorEl(null); };
+    var isOpen = Boolean(anchorEl);
+    return {
+        triggerProps: {
+            onClick: handleTriggerClick,
+            id: triggerId,
+            'aria-controls': popoverId,
+            'aria-haspopup': 'dialog',
+            'aria-expanded': isOpen,
+        },
+        popoverProps: {
+            anchorEl: anchorEl,
+            open: isOpen,
+            onClose: handlePopoverClose,
+        },
+    };
+};
+export var DatePickerStateContext = React.createContext({
+    triggerProps: { onClick: function () { return undefined; } },
+    popoverProps: { anchorEl: null, open: false, onClose: function () { return undefined; } },
+});
+export var useDatePickerStateContext = function () { return React.useContext(DatePickerStateContext); };
+export var DatePickerStateProvider = function (_a) {
+    var children = _a.children, props = __rest(_a, ["children"]);
+    var state = useDatePickerState(props);
+    return (React.createElement(DatePickerStateContext.Provider, { value: state }, typeof children === 'function' ? children(state) : children));
+};

package/esm/date-picker/date-picker-types.js

@@ -0,0 +1 @@
+export {};

package/esm/date-picker/date-picker-utils.js

@@ -0,0 +1,153 @@
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import { format, isValid, parse } from 'date-fns';
+/**
+ * Formats a date object using the specified format string
+ */
+export var formatDate = function (date, formatString) {
+    return format(date, formatString);
+};
+/**
+ * Parses a date string using the specified format
+ */
+export var parseDate = function (dateString, formatString, referenceDate) {
+    if (referenceDate === void 0) { referenceDate = new Date(); }
+    try {
+        var parsed = parse(dateString, formatString, referenceDate);
+        return isValid(parsed) ? parsed : null;
+    }
+    catch (error) {
+        return null;
+    }
+};
+/**
+ * Try to parse a date string using multiple formats
+ */
+export var tryParseDate = function (dateString, formatStrings, referenceDate) {
+    var e_1, _a;
+    if (referenceDate === void 0) { referenceDate = new Date(); }
+    try {
+        for (var formatStrings_1 = __values(formatStrings), formatStrings_1_1 = formatStrings_1.next(); !formatStrings_1_1.done; formatStrings_1_1 = formatStrings_1.next()) {
+            var formatString = formatStrings_1_1.value;
+            var parsed = parseDate(dateString, formatString, referenceDate);
+            if (parsed) {
+                return parsed;
+            }
+        }
+    }
+    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+    finally {
+        try {
+            if (formatStrings_1_1 && !formatStrings_1_1.done && (_a = formatStrings_1.return)) _a.call(formatStrings_1);
+        }
+        finally { if (e_1) throw e_1.error; }
+    }
+    return null;
+};
+/**
+ * Handles parsing a timestamp (number) into a Date
+ */
+export var parseTimestamp = function (timestamp, unit) {
+    if (unit === void 0) { unit = 'ms'; }
+    try {
+        var date = new Date(unit === 's' ? timestamp * 1000 : timestamp);
+        return isValid(date) ? date : null;
+    }
+    catch (error) {
+        return null;
+    }
+};
+/**
+ * Parses a date range string (format: "start - end")
+ */
+export var parseDateRange = function (rangeString, dateFormat, timeFormat) {
+    if (!rangeString.includes('-')) {
+        return { from: null, to: null };
+    }
+    var _a = __read(rangeString.split('-').map(function (s) { return s.trim(); }), 2), fromStr = _a[0], toStr = _a[1];
+    var fullFormat = timeFormat ? "".concat(dateFormat, " ").concat(timeFormat) : dateFormat;
+    var from = parseDate(fromStr, fullFormat);
+    var to = parseDate(toStr, fullFormat);
+    if (!from) {
+        from = parseDate(fromStr, dateFormat);
+    }
+    if (!to) {
+        to = parseDate(toStr, dateFormat);
+    }
+    return { from: from, to: to };
+};
+/**
+ * Format a date range as a string
+ */
+export var formatDateRange = function (from, to, dateFormat, timeFormat) {
+    if (!from)
+        return '';
+    var formatString = timeFormat ? "".concat(dateFormat, " ").concat(timeFormat) : dateFormat;
+    if (!to) {
+        return formatDate(from, formatString);
+    }
+    return "".concat(formatDate(from, formatString), " - ").concat(formatDate(to, formatString));
+};
+/**
+ * Extract time components from a date
+ */
+export var extractTimeComponents = function (date) {
+    return {
+        hours: formatDate(date, 'HH'),
+        minutes: formatDate(date, 'mm'),
+        seconds: formatDate(date, 'ss'),
+    };
+};
+/**
+ * Apply time components to a date
+ */
+export var applyTimeToDate = function (date, time) {
+    var newDate = new Date(date);
+    newDate.setHours(parseInt(time.hours, 10) || 0);
+    newDate.setMinutes(parseInt(time.minutes, 10) || 0);
+    newDate.setSeconds(parseInt(time.seconds, 10) || 0);
+    return newDate;
+};
+/**
+ * Safely parses a value that might be a timestamp or a date string
+ */
+export var parseSmartDate = function (value, dateFormat, timeFormat) {
+    var timestamp = parseInt(value, 10);
+    if (!isNaN(timestamp)) {
+        var date = parseTimestamp(timestamp);
+        if (date)
+            return date;
+    }
+    if (timeFormat) {
+        var fullFormat = "".concat(dateFormat, " ").concat(timeFormat);
+        var date = parseDate(value, fullFormat);
+        if (date)
+            return date;
+    }
+    return parseDate(value, dateFormat);
+};