@mdigital_ui/ui 0.4.3 → 0.4.4

package/dist/chunk-EC5DXYME.js

@@ -1,1273 +0,0 @@
-import { Popover, PopoverTrigger, PopoverContent } from './chunk-LM6CJZX5.js';
-import { colorVars } from './chunk-GLJDHW73.js';
-import { getValidationStatus, cn, iconSizes, statusMessageVariants } from './chunk-RAS6HUEI.js';
-import React from 'react';
-import ReactDatePicker from 'react-datepicker';
-import 'react-datepicker/dist/react-datepicker.css';
-import { Calendar, X, Clock, ChevronsLeft, ChevronsRight, ChevronLeft, ChevronRight } from 'lucide-react';
-import { cva } from 'class-variance-authority';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-
-var pickerInputVariants = cva(
-  "w-full placeholder:text-text-secondary/50 disabled:opacity-50 disabled:cursor-not-allowed outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-background text-text-primary transition-colors",
-  {
-    variants: {
-      variant: {
-        outline: "bg-background border rounded-md",
-        filled: "bg-surface border border-transparent rounded-md"
-      },
-      status: {
-        default: "border-border",
-        error: "border-error",
-        warning: "border-warning",
-        info: "border-info",
-        success: "border-success"
-      },
-      size: {
-        xs: "h-(--input-height-xs) px-(--input-padding-x-xs) text-xs",
-        sm: "h-(--input-height-sm) px-(--input-padding-x-sm) text-sm",
-        md: "h-(--input-height-md) px-(--input-padding-x-md) text-base",
-        lg: "h-(--input-height-lg) px-(--input-padding-x-lg) text-lg"
-      },
-      fullWidth: {
-        true: "w-full",
-        false: "max-w-full"
-      }
-    },
-    defaultVariants: {
-      variant: "outline",
-      status: "default",
-      size: "md",
-      fullWidth: true
-    }
-  }
-);
-var datePickerBaseStyles = `
-  datePicker_day
-  [&_.react-datepicker]:!bg-background
-  [&_.react-datepicker]:!border-border
-  [&_.react-datepicker]:!text-text-primary
-  [&_.react-datepicker]:!flex
-  [&_.react-datepicker]:!gap-0
-  [&_.react-datepicker__header]:!bg-transparent
-  [&_.react-datepicker__header]:!border-none
-  [&_.react-datepicker__header]:!p-0
-  [&_.react-datepicker__month-container]:!flex
-  [&_.react-datepicker__month-container]:!flex-col
-  [&_.react-datepicker__month]:!m-0
-  [&_.react-datepicker__month]:!p-4
-  [&_.react-datepicker__week]:!grid
-  [&_.react-datepicker__week]:!grid-cols-7
-  [&_.react-datepicker__week]:!gap-1
-  [&_.react-datepicker__day-names]:!grid
-  [&_.react-datepicker__day-names]:!grid-cols-7
-  [&_.react-datepicker__day-names]:!gap-1
-  [&_.react-datepicker__day-names]:!px-4
-  [&_.react-datepicker__day-names]:!pt-4
-  [&_.react-datepicker__day-names]:!pb-2
-  [&_.react-datepicker__day-name]:!text-text-secondary
-  [&_.react-datepicker__day-name]:!text-sm
-  [&_.react-datepicker__day-name]:!font-medium
-  [&_.react-datepicker__day-name]:!text-center
-  [&_.react-datepicker__day-name]:!w-auto
-  [&_.react-datepicker__day-name]:!m-0
-  [&_.react-datepicker__day]:!w-10
-  [&_.react-datepicker__day]:!h-10
-  [&_.react-datepicker__day]:!leading-10
-  [&_.react-datepicker__day]:!text-center
-  [&_.react-datepicker__day]:!rounded-md
-  [&_.react-datepicker__day]:!text-text-primary
-  [&_.react-datepicker__day]:!text-sm
-  [&_.react-datepicker__day]:!m-0
-  [&_.react-datepicker__day]:!cursor-pointer
-  [&_.react-datepicker__day]:!transition-colors
-  [&_.react-datepicker__day--selected]:datePicker_daySelected
-  [&_.react-datepicker__day]:hover:!bg-surface
-  [&_.react-datepicker__day--disabled]:!cursor-not-allowed
-  [&_.react-datepicker__day--disabled]:!opacity-40
-  [&_.react-datepicker__day--disabled]:hover:!bg-transparent
-  [&_.react-datepicker__day--outside-month]:!text-text-secondary
-  [&_.react-datepicker__day--today]:datePicker_dayToday
-  [&_.react-datepicker__day--today]:!font-semibold
-  [&_.react-datepicker__current-month]:!hidden
-  [&_.react-datepicker__navigation]:!hidden
-  [&_.react-datepicker__time-container]:!border-border
-  [&_.react-datepicker__time-list-item]:hover:!bg-surface
-  [&_.react-datepicker__time-list]:!bg-background
-`;
-var datePickerColorStyles = {
-  default: `
-    [&_.react-datepicker__day--selected]:!bg-surface
-    [&_.react-datepicker__day--selected]:!text-text-primary
-    [&_.react-datepicker__day--keyboard-selected]:!bg-surface/50
-    [&_.react-datepicker__day--today]:!border
-    [&_.react-datepicker__day--today]:!border-border
-    [&_.react-datepicker__time-list-item--selected]:!bg-surface
-    [&_.react-datepicker__time-list-item--selected]:!text-text-primary
-    [&_.react-datepicker__day--in-selecting-range]:!bg-surface/30
-    [&_.react-datepicker__day--in-range]:!bg-surface/10
-    [&_.react-datepicker__day--range-start]:!bg-surface
-    [&_.react-datepicker__day--range-start]:!text-text-primary
-    [&_.react-datepicker__day--range-end]:!bg-surface
-    [&_.react-datepicker__day--range-end]:!text-text-primary
-  `,
-  primary: `
-    [&_.react-datepicker__day--selected]:!bg-primary
-    [&_.react-datepicker__day--selected]:!text-background
-    [&_.react-datepicker__day--keyboard-selected]:!bg-primary/50
-    [&_.react-datepicker__day--today]:!border
-    [&_.react-datepicker__day--today]:!border-primary
-    [&_.react-datepicker__time-list-item--selected]:!bg-primary
-    [&_.react-datepicker__time-list-item--selected]:!text-background
-    [&_.react-datepicker__day--in-selecting-range]:!bg-primary/30
-    [&_.react-datepicker__day--in-range]:!bg-primary/10
-    [&_.react-datepicker__day--range-start]:!bg-primary
-    [&_.react-datepicker__day--range-start]:!text-background
-    [&_.react-datepicker__day--range-end]:!bg-primary
-    [&_.react-datepicker__day--range-end]:!text-background
-  `,
-  secondary: `
-    [&_.react-datepicker__day--selected]:!bg-secondary
-    [&_.react-datepicker__day--selected]:!text-background
-    [&_.react-datepicker__day--keyboard-selected]:!bg-secondary/50
-    [&_.react-datepicker__day--today]:!border
-    [&_.react-datepicker__day--today]:!border-secondary
-    [&_.react-datepicker__time-list-item--selected]:!bg-secondary
-    [&_.react-datepicker__time-list-item--selected]:!text-background
-    [&_.react-datepicker__day--in-selecting-range]:!bg-secondary/30
-    [&_.react-datepicker__day--in-range]:!bg-secondary/10
-    [&_.react-datepicker__day--range-start]:!bg-secondary
-    [&_.react-datepicker__day--range-start]:!text-background
-    [&_.react-datepicker__day--range-end]:!bg-secondary
-    [&_.react-datepicker__day--range-end]:!text-background
-  `,
-  accent: `
-    [&_.react-datepicker__day--selected]:!bg-accent
-    [&_.react-datepicker__day--selected]:!text-background
-    [&_.react-datepicker__day--keyboard-selected]:!bg-accent/50
-    [&_.react-datepicker__day--today]:!border
-    [&_.react-datepicker__day--today]:!border-accent
-    [&_.react-datepicker__time-list-item--selected]:!bg-accent
-    [&_.react-datepicker__time-list-item--selected]:!text-background
-    [&_.react-datepicker__day--in-selecting-range]:!bg-accent/30
-    [&_.react-datepicker__day--in-range]:!bg-accent/10
-    [&_.react-datepicker__day--range-start]:!bg-accent
-    [&_.react-datepicker__day--range-start]:!text-background
-    [&_.react-datepicker__day--range-end]:!bg-accent
-    [&_.react-datepicker__day--range-end]:!text-background
-  `,
-  success: `
-    [&_.react-datepicker__day--selected]:!bg-success
-    [&_.react-datepicker__day--selected]:!text-background
-    [&_.react-datepicker__day--keyboard-selected]:!bg-success/50
-    [&_.react-datepicker__day--today]:!border
-    [&_.react-datepicker__day--today]:!border-success
-    [&_.react-datepicker__time-list-item--selected]:!bg-success
-    [&_.react-datepicker__time-list-item--selected]:!text-background
-    [&_.react-datepicker__day--in-selecting-range]:!bg-success/30
-    [&_.react-datepicker__day--in-range]:!bg-success/10
-    [&_.react-datepicker__day--range-start]:!bg-success
-    [&_.react-datepicker__day--range-start]:!text-background
-    [&_.react-datepicker__day--range-end]:!bg-success
-    [&_.react-datepicker__day--range-end]:!text-background
-  `,
-  error: `
-    [&_.react-datepicker__day--selected]:!bg-error
-    [&_.react-datepicker__day--selected]:!text-background
-    [&_.react-datepicker__day--keyboard-selected]:!bg-error/50
-    [&_.react-datepicker__day--today]:!border
-    [&_.react-datepicker__day--today]:!border-error
-    [&_.react-datepicker__time-list-item--selected]:!bg-error
-    [&_.react-datepicker__time-list-item--selected]:!text-background
-    [&_.react-datepicker__day--in-selecting-range]:!bg-error/30
-    [&_.react-datepicker__day--in-range]:!bg-error/10
-    [&_.react-datepicker__day--range-start]:!bg-error
-    [&_.react-datepicker__day--range-start]:!text-background
-    [&_.react-datepicker__day--range-end]:!bg-error
-    [&_.react-datepicker__day--range-end]:!text-background
-  `,
-  warning: `
-    [&_.react-datepicker__day--selected]:!bg-warning
-    [&_.react-datepicker__day--selected]:!text-background
-    [&_.react-datepicker__day--keyboard-selected]:!bg-warning/50
-    [&_.react-datepicker__day--today]:!border
-    [&_.react-datepicker__day--today]:!border-warning
-    [&_.react-datepicker__time-list-item--selected]:!bg-warning
-    [&_.react-datepicker__time-list-item--selected]:!text-background
-    [&_.react-datepicker__day--in-selecting-range]:!bg-warning/30
-    [&_.react-datepicker__day--in-range]:!bg-warning/10
-    [&_.react-datepicker__day--range-start]:!bg-warning
-    [&_.react-datepicker__day--range-start]:!text-background
-    [&_.react-datepicker__day--range-end]:!bg-warning
-    [&_.react-datepicker__day--range-end]:!text-background
-  `,
-  info: `
-    [&_.react-datepicker__day--selected]:!bg-info
-    [&_.react-datepicker__day--selected]:!text-background
-    [&_.react-datepicker__day--keyboard-selected]:!bg-info/50
-    [&_.react-datepicker__day--today]:!border
-    [&_.react-datepicker__day--today]:!border-info
-    [&_.react-datepicker__time-list-item--selected]:!bg-info
-    [&_.react-datepicker__time-list-item--selected]:!text-background
-    [&_.react-datepicker__day--in-selecting-range]:!bg-info/30
-    [&_.react-datepicker__day--in-range]:!bg-info/10
-    [&_.react-datepicker__day--range-start]:!bg-info
-    [&_.react-datepicker__day--range-start]:!text-background
-    [&_.react-datepicker__day--range-end]:!bg-info
-    [&_.react-datepicker__day--range-end]:!text-background
-  `
-};
-var getDatePickerStyles = (color = "primary", classNames) => {
-  return cn(
-    datePickerBaseStyles,
-    datePickerColorStyles[color],
-    classNames?.day && `[&_.react-datepicker__day]:${classNames.day}`,
-    classNames?.daySelected && `[&_.react-datepicker__day--selected]:${classNames.daySelected}`,
-    classNames?.dayToday && `[&_.react-datepicker__day--today]:${classNames.dayToday}`
-  );
-};
-var pickerSelectedColorClasses = {
-  default: "bg-surface text-text-primary",
-  primary: "bg-primary text-background",
-  secondary: "bg-secondary text-background",
-  accent: "bg-accent text-background",
-  success: "bg-success text-background",
-  error: "bg-error text-background",
-  warning: "bg-warning text-background",
-  info: "bg-info text-background"
-};
-var YearSelector = ({
-  date,
-  onYearSelect,
-  onDecadeChange,
-  color = "primary"
-}) => {
-  const currentYear = date.getFullYear();
-  const startYear = Math.floor(currentYear / 10) * 10;
-  const years = Array.from({ length: 12 }, (_, i) => startYear - 1 + i);
-  return /* @__PURE__ */ jsxs("div", { className: "p-4 bg-background", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-4", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: () => onDecadeChange(currentYear - 10),
-          className: "p-1 rounded hover:bg-surface text-text-primary transition-colors",
-          "aria-label": "Previous decade",
-          children: /* @__PURE__ */ jsx(ChevronsLeft, { className: iconSizes.sm })
-        }
-      ),
-      /* @__PURE__ */ jsxs("div", { className: "text-sm font-medium text-text-primary", children: [
-        startYear,
-        "-",
-        startYear + 9
-      ] }),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: () => onDecadeChange(currentYear + 10),
-          className: "p-1 rounded hover:bg-surface text-text-primary transition-colors",
-          "aria-label": "Next decade",
-          children: /* @__PURE__ */ jsx(ChevronsRight, { className: iconSizes.sm })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 gap-2", children: years.map((year) => /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        onClick: () => onYearSelect(year),
-        className: cn(
-          "px-4 py-2 rounded text-sm font-medium transition-colors",
-          year === currentYear ? pickerSelectedColorClasses[color] : year < startYear || year > startYear + 9 ? "text-text-secondary opacity-50" : "text-text-primary hover:bg-surface"
-        ),
-        children: year
-      },
-      year
-    )) })
-  ] });
-};
-var MonthSelector = ({
-  date,
-  onMonthSelect,
-  onYearClick,
-  onYearChange,
-  color = "primary"
-}) => {
-  const months = [
-    "Jan",
-    "Feb",
-    "Mar",
-    "Apr",
-    "May",
-    "Jun",
-    "Jul",
-    "Aug",
-    "Sep",
-    "Oct",
-    "Nov",
-    "Dec"
-  ];
-  const currentMonth = date.getMonth();
-  const currentYear = date.getFullYear();
-  return /* @__PURE__ */ jsxs("div", { className: "p-4 bg-background", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-4", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: () => onYearChange(currentYear - 1),
-          className: "p-1 rounded hover:bg-surface text-text-primary transition-colors",
-          "aria-label": "Previous year",
-          children: /* @__PURE__ */ jsx(ChevronsLeft, { className: iconSizes.sm })
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: onYearClick,
-          className: "text-sm font-medium text-text-primary hover:text-primary transition-colors",
-          children: currentYear
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: () => onYearChange(currentYear + 1),
-          className: "p-1 rounded hover:bg-surface text-text-primary transition-colors",
-          "aria-label": "Next year",
-          children: /* @__PURE__ */ jsx(ChevronsRight, { className: iconSizes.sm })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 gap-2", children: months.map((month, index) => /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        onClick: () => onMonthSelect(index),
-        className: cn(
-          "px-4 py-2 rounded text-sm font-medium transition-colors",
-          index === currentMonth ? pickerSelectedColorClasses[color] : "text-text-primary hover:bg-surface"
-        ),
-        children: month
-      },
-      month
-    )) })
-  ] });
-};
-var CustomCalendarHeader = ({
-  date,
-  decreaseMonth,
-  increaseMonth,
-  decreaseYear,
-  increaseYear,
-  prevMonthButtonDisabled,
-  nextMonthButtonDisabled,
-  prevYearButtonDisabled,
-  nextYearButtonDisabled,
-  showMonthSelector = false,
-  onMonthClick,
-  onYearClick,
-  headerClassName,
-  navigationClassName
-}) => {
-  const monthName = date.toLocaleDateString("en-US", { month: "long" });
-  const year = date.getFullYear();
-  return /* @__PURE__ */ jsxs("div", { className: cn("datePicker_header", "flex items-center justify-between px-4 py-3 bg-surface border-b border-border", headerClassName), "data-slot": "header", children: [
-    /* @__PURE__ */ jsxs("div", { className: cn("datePicker_navigation", "flex items-center gap-1", navigationClassName), "data-slot": "navigation", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: decreaseYear,
-          disabled: prevYearButtonDisabled || showMonthSelector,
-          className: "p-1 rounded hover:bg-surface text-text-primary disabled:opacity-50 disabled:cursor-not-allowed transition-colors",
-          "aria-label": "Previous year",
-          children: /* @__PURE__ */ jsx(ChevronsLeft, { className: iconSizes.sm })
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: decreaseMonth,
-          disabled: prevMonthButtonDisabled || showMonthSelector,
-          className: "p-1 rounded hover:bg-surface text-text-primary disabled:opacity-50 disabled:cursor-not-allowed transition-colors",
-          "aria-label": "Previous month",
-          children: /* @__PURE__ */ jsx(ChevronLeft, { className: iconSizes.sm })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: onMonthClick,
-          className: "text-sm font-medium text-text-primary hover:text-primary transition-colors",
-          children: monthName
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: onYearClick,
-          className: "text-sm font-medium text-text-primary hover:text-primary transition-colors",
-          children: year
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: cn("datePicker_navigation", "flex items-center gap-1", navigationClassName), "data-slot": "navigation", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: increaseMonth,
-          disabled: nextMonthButtonDisabled || showMonthSelector,
-          className: "p-1 rounded hover:bg-surface text-text-primary disabled:opacity-50 disabled:cursor-not-allowed transition-colors",
-          "aria-label": "Next month",
-          children: /* @__PURE__ */ jsx(ChevronRight, { className: iconSizes.sm })
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: increaseYear,
-          disabled: nextYearButtonDisabled || showMonthSelector,
-          className: "p-1 rounded hover:bg-surface text-text-primary disabled:opacity-50 disabled:cursor-not-allowed transition-colors",
-          "aria-label": "Next year",
-          children: /* @__PURE__ */ jsx(ChevronsRight, { className: iconSizes.sm })
-        }
-      )
-    ] })
-  ] });
-};
-var PickerWrapper = ({
-  label,
-  error,
-  warning,
-  info,
-  success,
-  helperText,
-  messagePosition = "bottom",
-  required = false,
-  fullWidth = true,
-  children,
-  classNames
-}) => {
-  const uniqueId = React.useId();
-  const helperId = `picker-helper-${uniqueId}`;
-  const { status, message: helperMessage } = getValidationStatus({ error, warning, info, success, helperText });
-  return /* @__PURE__ */ jsxs("div", { className: cn("w-full flex flex-col relative", !fullWidth && "inline-block"), children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex gap-2 items-center relative mb-0.5", children: [
-      label && /* @__PURE__ */ jsxs("label", { className: cn("datePicker_label", "text-sm font-medium text-text-secondary", classNames?.label), "data-slot": "label", children: [
-        label,
-        required && /* @__PURE__ */ jsx("span", { className: "text-error ml-1", children: "*" })
-      ] }),
-      helperMessage && messagePosition === "top" && /* @__PURE__ */ jsx("p", { id: helperId, className: cn("datePicker_helper", statusMessageVariants({ status }), classNames?.helper), "data-slot": "helper", children: helperMessage })
-    ] }),
-    children,
-    helperMessage && messagePosition === "bottom" && /* @__PURE__ */ jsx("p", { id: helperId, className: cn("datePicker_helper", "mt-0.5", statusMessageVariants({ status }), classNames?.helper), "data-slot": "helper", children: helperMessage })
-  ] });
-};
-var DatePickerComponent = React.memo(
-  ({
-    variant = "outline",
-    size = "md",
-    color = "primary",
-    label,
-    error,
-    warning,
-    info,
-    success,
-    helperText,
-    messagePosition = "bottom",
-    placeholder = "Select date...",
-    disabled = false,
-    required = false,
-    clearable = false,
-    fullWidth = true,
-    className,
-    classNames,
-    ref,
-    value,
-    defaultValue,
-    onChange,
-    minDate,
-    maxDate,
-    dateFormat = "MM/dd/yyyy"
-  }) => {
-    const [internalValue, setInternalValue] = React.useState(
-      defaultValue || null
-    );
-    const currentValue = value !== void 0 ? value : internalValue;
-    const [isOpen, setIsOpen] = React.useState(false);
-    const [showMonthSelector, setShowMonthSelector] = React.useState(false);
-    const [showYearSelector, setShowYearSelector] = React.useState(false);
-    const [viewDate, setViewDate] = React.useState(currentValue || /* @__PURE__ */ new Date());
-    const [hoverDate, setHoverDate] = React.useState(null);
-    const { status } = getValidationStatus({ error, warning, info, success, helperText });
-    React.useEffect(() => {
-      if (value) setViewDate(value);
-    }, [value]);
-    const handleDateChange = (date) => {
-      if (value === void 0) {
-        setInternalValue(date);
-      }
-      onChange?.(date);
-      setHoverDate(null);
-      setIsOpen(false);
-      setShowMonthSelector(false);
-      setShowYearSelector(false);
-    };
-    const handleClear = (e) => {
-      e.stopPropagation();
-      if (value === void 0) {
-        setInternalValue(null);
-      }
-      onChange?.(null);
-    };
-    const handleMonthSelect = (month) => {
-      const newDate = new Date(viewDate);
-      newDate.setMonth(month);
-      setViewDate(newDate);
-      setShowMonthSelector(false);
-    };
-    const handleYearSelect = (year) => {
-      const newDate = new Date(viewDate);
-      newDate.setFullYear(year);
-      setViewDate(newDate);
-      setShowYearSelector(false);
-      setShowMonthSelector(true);
-    };
-    const handleYearChange = (year) => {
-      const newDate = new Date(viewDate);
-      newDate.setFullYear(year);
-      setViewDate(newDate);
-    };
-    const handleDecadeChange = (year) => {
-      const newDate = new Date(viewDate);
-      newDate.setFullYear(year);
-      setViewDate(newDate);
-    };
-    const showClear = clearable && currentValue && !disabled;
-    const formatDate = React.useCallback(
-      (date) => {
-        const d = new Date(date);
-        const year = d.getFullYear();
-        const month = String(d.getMonth() + 1).padStart(2, "0");
-        const day = String(d.getDate()).padStart(2, "0");
-        return dateFormat.replace("yyyy", String(year)).replace("MM", month).replace("dd", day);
-      },
-      [dateFormat]
-    );
-    const getDisplayValue = () => {
-      if (hoverDate) {
-        return { confirmed: "", preview: formatDate(hoverDate) };
-      }
-      if (currentValue) {
-        return { confirmed: formatDate(currentValue), preview: "" };
-      }
-      return { confirmed: "", preview: "" };
-    };
-    const { confirmed, preview } = getDisplayValue();
-    const customHeader = (props) => /* @__PURE__ */ jsx(
-      CustomCalendarHeader,
-      {
-        ...props,
-        showMonthSelector,
-        onMonthClick: () => setShowMonthSelector(!showMonthSelector),
-        onYearClick: () => setShowYearSelector(true),
-        headerClassName: classNames?.header,
-        navigationClassName: classNames?.navigation
-      }
-    );
-    const triggerButton = /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        disabled,
-        onClick: () => setIsOpen(!isOpen),
-        "aria-expanded": isOpen,
-        "aria-haspopup": "dialog",
-        className: cn(
-          "datePicker_trigger",
-          pickerInputVariants({ variant, status, size, fullWidth }),
-          colorVars[color],
-          "focus-visible:ring-slot",
-          "pl-10 flex items-center justify-start cursor-pointer",
-          showClear && "pr-10",
-          className,
-          classNames?.trigger
-        ),
-        "data-slot": "trigger",
-        children: confirmed || preview ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          confirmed && /* @__PURE__ */ jsx("span", { children: confirmed }),
-          preview && /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: preview })
-        ] }) : /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: placeholder })
-      }
-    );
-    return /* @__PURE__ */ jsx(
-      PickerWrapper,
-      {
-        label,
-        error,
-        warning,
-        info,
-        success,
-        helperText,
-        messagePosition,
-        required,
-        fullWidth,
-        classNames,
-        children: /* @__PURE__ */ jsxs("div", { ref, className: cn("datePicker_root", "relative w-full", classNames?.root), "data-slot": "root", children: [
-          /* @__PURE__ */ jsx("div", { className: cn("absolute left-3 flex items-center h-full top-0 text-text-secondary pointer-events-none z-10", classNames?.icon), "data-slot": "icon", children: /* @__PURE__ */ jsx(Calendar, { className: iconSizes[size] }) }),
-          /* @__PURE__ */ jsxs(
-            Popover,
-            {
-              open: isOpen,
-              onOpenChange: (open) => {
-                setIsOpen(open);
-                if (!open) {
-                  setShowMonthSelector(false);
-                  setShowYearSelector(false);
-                  setHoverDate(null);
-                }
-              },
-              children: [
-                /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: triggerButton }),
-                /* @__PURE__ */ jsx(
-                  PopoverContent,
-                  {
-                    className: "p-0 w-auto",
-                    align: "start",
-                    sideOffset: 4,
-                    onOpenAutoFocus: (e) => e.preventDefault(),
-                    children: /* @__PURE__ */ jsx(Fragment, { children: showYearSelector ? /* @__PURE__ */ jsx(
-                      YearSelector,
-                      {
-                        date: viewDate,
-                        onYearSelect: handleYearSelect,
-                        onDecadeChange: handleDecadeChange,
-                        color
-                      }
-                    ) : showMonthSelector ? /* @__PURE__ */ jsx(
-                      MonthSelector,
-                      {
-                        date: viewDate,
-                        onMonthSelect: handleMonthSelect,
-                        onYearClick: () => setShowYearSelector(true),
-                        onYearChange: handleYearChange,
-                        color
-                      }
-                    ) : /* @__PURE__ */ jsx("div", { className: cn("datePicker_calendar", getDatePickerStyles(color, classNames), classNames?.calendar), "data-slot": "calendar", children: /* @__PURE__ */ jsx(
-                      ReactDatePicker,
-                      {
-                        selected: currentValue,
-                        onChange: handleDateChange,
-                        disabled,
-                        minDate,
-                        maxDate,
-                        dateFormat,
-                        renderCustomHeader: customHeader,
-                        openToDate: viewDate,
-                        onMonthChange: setViewDate,
-                        onDayMouseEnter: setHoverDate,
-                        inline: true
-                      }
-                    ) }) })
-                  }
-                )
-              ]
-            }
-          ),
-          showClear && /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              onClick: handleClear,
-              className: cn("absolute right-3 flex items-center h-full top-0 text-text-secondary hover:text-text-primary z-10", classNames?.clear),
-              "aria-label": "Clear date",
-              "data-slot": "clear",
-              children: /* @__PURE__ */ jsx(X, { className: iconSizes[size] })
-            }
-          )
-        ] })
-      }
-    );
-  }
-);
-DatePickerComponent.displayName = "DatePicker";
-var RangePickerComponent = React.memo(
-  ({
-    variant = "outline",
-    size = "md",
-    color = "primary",
-    label,
-    error,
-    warning,
-    info,
-    success,
-    helperText,
-    messagePosition = "bottom",
-    placeholder = "Select date range...",
-    disabled = false,
-    required = false,
-    clearable = false,
-    fullWidth = true,
-    className,
-    classNames,
-    ref,
-    startDate,
-    endDate,
-    defaultStartDate,
-    defaultEndDate,
-    onChange,
-    minDate,
-    maxDate,
-    dateFormat = "MM/dd/yyyy"
-  }) => {
-    const [internalStartDate, setInternalStartDate] = React.useState(defaultStartDate || null);
-    const [internalEndDate, setInternalEndDate] = React.useState(
-      defaultEndDate || null
-    );
-    const currentStartDate = startDate !== void 0 ? startDate : internalStartDate;
-    const currentEndDate = endDate !== void 0 ? endDate : internalEndDate;
-    const [isOpen, setIsOpen] = React.useState(false);
-    const [showMonthSelector, setShowMonthSelector] = React.useState(false);
-    const [showYearSelector, setShowYearSelector] = React.useState(false);
-    const [viewDate, setViewDate] = React.useState(
-      currentStartDate || /* @__PURE__ */ new Date()
-    );
-    const [hoverDate, setHoverDate] = React.useState(null);
-    const { status } = getValidationStatus({ error, warning, info, success, helperText });
-    React.useEffect(() => {
-      if (startDate) setViewDate(startDate);
-    }, [startDate]);
-    const handleChange = (dates) => {
-      if (startDate === void 0 && endDate === void 0) {
-        setInternalStartDate(dates[0]);
-        setInternalEndDate(dates[1]);
-      }
-      onChange?.(dates);
-      setHoverDate(null);
-      if (dates[0] && dates[1]) {
-        setIsOpen(false);
-        setShowMonthSelector(false);
-        setShowYearSelector(false);
-      }
-    };
-    const handleClear = (e) => {
-      e.stopPropagation();
-      if (startDate === void 0 && endDate === void 0) {
-        setInternalStartDate(null);
-        setInternalEndDate(null);
-      }
-      onChange?.([null, null]);
-    };
-    const handleMonthSelect = (month) => {
-      const newDate = new Date(viewDate);
-      newDate.setMonth(month);
-      setViewDate(newDate);
-      setShowMonthSelector(false);
-    };
-    const handleYearSelect = (year) => {
-      const newDate = new Date(viewDate);
-      newDate.setFullYear(year);
-      setViewDate(newDate);
-      setShowYearSelector(false);
-      setShowMonthSelector(true);
-    };
-    const handleYearChange = (year) => {
-      const newDate = new Date(viewDate);
-      newDate.setFullYear(year);
-      setViewDate(newDate);
-    };
-    const handleDecadeChange = (year) => {
-      const newDate = new Date(viewDate);
-      newDate.setFullYear(year);
-      setViewDate(newDate);
-    };
-    const showClear = clearable && (currentStartDate || currentEndDate) && !disabled;
-    const formatDate = React.useCallback(
-      (date) => {
-        const d = new Date(date);
-        const year = d.getFullYear();
-        const month = String(d.getMonth() + 1).padStart(2, "0");
-        const day = String(d.getDate()).padStart(2, "0");
-        return dateFormat.replace("yyyy", String(year)).replace("MM", month).replace("dd", day);
-      },
-      [dateFormat]
-    );
-    const getDisplayValue = () => {
-      if (hoverDate && currentStartDate && !currentEndDate) {
-        const start2 = formatDate(currentStartDate);
-        const hover = formatDate(hoverDate);
-        return { confirmed: `${start2} - `, preview: hover };
-      }
-      if (hoverDate && !currentStartDate && !currentEndDate) {
-        const hover = formatDate(hoverDate);
-        return { confirmed: "", preview: hover };
-      }
-      if (!currentStartDate && !currentEndDate) {
-        return { confirmed: "", preview: "" };
-      }
-      const start = currentStartDate ? formatDate(currentStartDate) : "";
-      const end = currentEndDate ? formatDate(currentEndDate) : "";
-      if (start && end) {
-        return { confirmed: `${start} - ${end}`, preview: "" };
-      }
-      if (start) {
-        return { confirmed: `${start}`, preview: " - ..." };
-      }
-      return { confirmed: "", preview: "" };
-    };
-    const { confirmed: rangeConfirmed, preview: rangePreview } = getDisplayValue();
-    const customHeader = (props) => /* @__PURE__ */ jsx(
-      CustomCalendarHeader,
-      {
-        ...props,
-        showMonthSelector,
-        onMonthClick: () => setShowMonthSelector(!showMonthSelector),
-        onYearClick: () => setShowYearSelector(true),
-        headerClassName: classNames?.header,
-        navigationClassName: classNames?.navigation
-      }
-    );
-    const rangeTriggerButton = /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        disabled,
-        onClick: () => setIsOpen(!isOpen),
-        "aria-expanded": isOpen,
-        "aria-haspopup": "dialog",
-        className: cn(
-          "datePicker_trigger",
-          pickerInputVariants({ variant, status, size, fullWidth }),
-          colorVars[color],
-          "focus-visible:ring-slot",
-          "pl-10 flex items-center justify-start cursor-pointer",
-          showClear && "pr-10",
-          className,
-          classNames?.trigger
-        ),
-        "data-slot": "trigger",
-        children: rangeConfirmed || rangePreview ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          rangeConfirmed && /* @__PURE__ */ jsx("span", { children: rangeConfirmed }),
-          rangePreview && /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: rangePreview })
-        ] }) : /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: placeholder })
-      }
-    );
-    return /* @__PURE__ */ jsx(
-      PickerWrapper,
-      {
-        label,
-        error,
-        warning,
-        info,
-        success,
-        helperText,
-        messagePosition,
-        required,
-        fullWidth,
-        classNames,
-        children: /* @__PURE__ */ jsxs("div", { ref, className: cn("datePicker_root", "relative w-full", classNames?.root), "data-slot": "root", children: [
-          /* @__PURE__ */ jsx("div", { className: cn("absolute left-3 flex items-center h-full top-0 text-text-secondary pointer-events-none z-10", classNames?.icon), "data-slot": "icon", children: /* @__PURE__ */ jsx(Calendar, { className: iconSizes[size] }) }),
-          /* @__PURE__ */ jsxs(
-            Popover,
-            {
-              open: isOpen,
-              onOpenChange: (open) => {
-                setIsOpen(open);
-                if (!open) {
-                  setShowMonthSelector(false);
-                  setShowYearSelector(false);
-                  setHoverDate(null);
-                }
-              },
-              children: [
-                /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: rangeTriggerButton }),
-                /* @__PURE__ */ jsx(
-                  PopoverContent,
-                  {
-                    className: "p-0 w-auto",
-                    align: "start",
-                    sideOffset: 4,
-                    onOpenAutoFocus: (e) => e.preventDefault(),
-                    children: /* @__PURE__ */ jsx(Fragment, { children: showYearSelector ? /* @__PURE__ */ jsx(
-                      YearSelector,
-                      {
-                        date: viewDate,
-                        onYearSelect: handleYearSelect,
-                        onDecadeChange: handleDecadeChange,
-                        color
-                      }
-                    ) : showMonthSelector ? /* @__PURE__ */ jsx(
-                      MonthSelector,
-                      {
-                        date: viewDate,
-                        onMonthSelect: handleMonthSelect,
-                        onYearClick: () => setShowYearSelector(true),
-                        onYearChange: handleYearChange,
-                        color
-                      }
-                    ) : /* @__PURE__ */ jsx("div", { className: cn("datePicker_calendar", getDatePickerStyles(color, classNames), classNames?.calendar), "data-slot": "calendar", children: /* @__PURE__ */ jsx(
-                      ReactDatePicker,
-                      {
-                        selectsRange: true,
-                        startDate: currentStartDate,
-                        endDate: currentEndDate,
-                        onChange: handleChange,
-                        disabled,
-                        minDate,
-                        maxDate,
-                        dateFormat,
-                        renderCustomHeader: customHeader,
-                        openToDate: viewDate,
-                        onMonthChange: setViewDate,
-                        monthsShown: 2,
-                        onDayMouseEnter: setHoverDate,
-                        inline: true
-                      }
-                    ) }) })
-                  }
-                )
-              ]
-            }
-          ),
-          showClear && /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              onClick: handleClear,
-              className: cn("absolute right-3 flex items-center h-full top-0 text-text-secondary hover:text-text-primary z-10", classNames?.clear),
-              "aria-label": "Clear date range",
-              "data-slot": "clear",
-              children: /* @__PURE__ */ jsx(X, { className: iconSizes[size] })
-            }
-          )
-        ] })
-      }
-    );
-  }
-);
-RangePickerComponent.displayName = "RangePicker";
-var TimeColumn = React.memo(({ items, selected, onSelect, onHover, onLeave }) => /* @__PURE__ */ jsx(
-  "div",
-  {
-    className: "flex flex-col h-[240px] overflow-y-auto scrollbar-thin scrollbar-thumb-border scrollbar-track-background",
-    onMouseLeave: onLeave,
-    children: items.map((item) => /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        onClick: () => onSelect(item),
-        onMouseEnter: () => onHover?.(item),
-        className: cn(
-          "px-4 py-2 text-sm font-medium transition-colors text-center min-h-[40px] flex items-center justify-center",
-          item === selected ? "bg-surface text-text-primary font-semibold" : "text-text-secondary hover:bg-surface/50"
-        ),
-        children: typeof item === "number" ? String(item).padStart(2, "0") : item
-      },
-      item
-    ))
-  }
-));
-TimeColumn.displayName = "TimeColumn";
-var TimeColumnPicker = ({
-  value,
-  onChange,
-  onPreview,
-  timeFormat = "h:mm aa",
-  color = "primary"
-}) => {
-  const is12Hour = timeFormat.includes("aa");
-  const currentDate = value || /* @__PURE__ */ new Date();
-  const currentHour = currentDate.getHours();
-  const currentMinute = currentDate.getMinutes();
-  const [selectedHour, setSelectedHour] = React.useState(
-    is12Hour ? currentHour % 12 || 12 : currentHour
-  );
-  const [selectedMinute, setSelectedMinute] = React.useState(currentMinute);
-  const [selectedPeriod, setSelectedPeriod] = React.useState(
-    currentHour >= 12 ? "PM" : "AM"
-  );
-  const [hoverHour, setHoverHour] = React.useState(null);
-  const [hoverMinute, setHoverMinute] = React.useState(null);
-  const [hoverPeriod, setHoverPeriod] = React.useState(null);
-  const hours = is12Hour ? Array.from({ length: 12 }, (_, i) => i + 1) : Array.from({ length: 24 }, (_, i) => i);
-  const minutes = Array.from({ length: 60 }, (_, i) => i);
-  const periods = ["AM", "PM"];
-  React.useEffect(() => {
-    if (hoverHour !== null || hoverMinute !== null || hoverPeriod !== null) {
-      const previewHour = hoverHour ?? selectedHour;
-      const previewMinute = hoverMinute ?? selectedMinute;
-      const previewPeriod = hoverPeriod ?? selectedPeriod;
-      const formattedHour = String(previewHour).padStart(2, "0");
-      const formattedMinute = String(previewMinute).padStart(2, "0");
-      const previewString = is12Hour ? `${previewHour}:${formattedMinute} ${previewPeriod}` : `${formattedHour}:${formattedMinute}`;
-      onPreview?.(previewString);
-    } else {
-      onPreview?.("");
-    }
-  }, [
-    hoverHour,
-    hoverMinute,
-    hoverPeriod,
-    selectedHour,
-    selectedMinute,
-    selectedPeriod,
-    is12Hour,
-    onPreview
-  ]);
-  const handleOkClick = () => {
-    const newDate = new Date(currentDate);
-    let finalHour = selectedHour;
-    if (is12Hour) {
-      if (selectedPeriod === "PM" && selectedHour !== 12) {
-        finalHour = selectedHour + 12;
-      } else if (selectedPeriod === "AM" && selectedHour === 12) {
-        finalHour = 0;
-      }
-    }
-    newDate.setHours(finalHour);
-    newDate.setMinutes(selectedMinute);
-    newDate.setSeconds(0);
-    onPreview?.("");
-    onChange(newDate);
-  };
-  const handleNowClick = () => {
-    const now = /* @__PURE__ */ new Date();
-    const nowHour = now.getHours();
-    const nowMinute = now.getMinutes();
-    setSelectedHour(is12Hour ? nowHour % 12 || 12 : nowHour);
-    setSelectedMinute(nowMinute);
-    setSelectedPeriod(nowHour >= 12 ? "PM" : "AM");
-    onPreview?.("");
-    onChange(now);
-  };
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col bg-background", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex gap-0", children: [
-      /* @__PURE__ */ jsx(
-        TimeColumn,
-        {
-          items: hours,
-          selected: selectedHour,
-          onSelect: (item) => setSelectedHour(item),
-          onHover: (item) => setHoverHour(item),
-          onLeave: () => setHoverHour(null)
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        TimeColumn,
-        {
-          items: minutes,
-          selected: selectedMinute,
-          onSelect: (item) => setSelectedMinute(item),
-          onHover: (item) => setHoverMinute(item),
-          onLeave: () => setHoverMinute(null)
-        }
-      ),
-      is12Hour && /* @__PURE__ */ jsx(
-        TimeColumn,
-        {
-          items: periods,
-          selected: selectedPeriod,
-          onSelect: (item) => setSelectedPeriod(item),
-          onHover: (item) => setHoverPeriod(item),
-          onLeave: () => setHoverPeriod(null)
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "p-3 border-t border-border flex gap-2", children: [
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: handleNowClick,
-          className: "flex-1 px-4 py-2 bg-surface text-text-primary rounded-md hover:bg-surface/80 transition-colors font-medium text-sm border border-border",
-          children: "Now"
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: handleOkClick,
-          className: cn("flex-1 px-4 py-2 rounded-md hover:opacity-90 transition-colors font-medium text-sm", pickerSelectedColorClasses[color]),
-          children: "OK"
-        }
-      )
-    ] })
-  ] });
-};
-var TimePickerComponent = React.memo(
-  ({
-    variant = "outline",
-    size = "md",
-    color = "primary",
-    label,
-    error,
-    warning,
-    info,
-    success,
-    helperText,
-    messagePosition = "bottom",
-    placeholder = "Select time...",
-    disabled = false,
-    required = false,
-    clearable = false,
-    fullWidth = true,
-    className,
-    classNames,
-    ref,
-    value,
-    defaultValue,
-    onChange,
-    timeFormat = "h:mm aa"
-  }) => {
-    const [internalValue, setInternalValue] = React.useState(
-      defaultValue || null
-    );
-    const currentValue = value !== void 0 ? value : internalValue;
-    const [isOpen, setIsOpen] = React.useState(false);
-    const [previewTime, setPreviewTime] = React.useState("");
-    const { status } = getValidationStatus({ error, warning, info, success, helperText });
-    const handleTimeChange = (date) => {
-      if (value === void 0) {
-        setInternalValue(date);
-      }
-      onChange?.(date);
-      setPreviewTime("");
-      setIsOpen(false);
-    };
-    const handleClear = (e) => {
-      e.stopPropagation();
-      if (value === void 0) {
-        setInternalValue(null);
-      }
-      onChange?.(null);
-    };
-    const showClear = clearable && currentValue && !disabled;
-    const formatTime = (date) => {
-      return new Date(date).toLocaleTimeString("en-US", {
-        hour: "numeric",
-        minute: "2-digit",
-        hour12: timeFormat.includes("aa")
-      });
-    };
-    const getDisplayValue = () => {
-      if (previewTime) {
-        return { confirmed: "", preview: previewTime };
-      }
-      if (currentValue) {
-        return { confirmed: formatTime(currentValue), preview: "" };
-      }
-      return { confirmed: "", preview: "" };
-    };
-    const { confirmed: timeConfirmed, preview: timePreview } = getDisplayValue();
-    const timeTriggerButton = /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        disabled,
-        onClick: () => setIsOpen(!isOpen),
-        "aria-expanded": isOpen,
-        "aria-haspopup": "dialog",
-        className: cn(
-          "datePicker_trigger",
-          pickerInputVariants({ variant, status, size, fullWidth }),
-          colorVars[color],
-          "focus-visible:ring-slot",
-          "pl-10 flex items-center justify-start cursor-pointer",
-          showClear && "pr-10",
-          className,
-          classNames?.trigger
-        ),
-        "data-slot": "trigger",
-        children: timeConfirmed || timePreview ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          timeConfirmed && /* @__PURE__ */ jsx("span", { children: timeConfirmed }),
-          timePreview && /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: timePreview })
-        ] }) : /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: placeholder })
-      }
-    );
-    return /* @__PURE__ */ jsx(
-      PickerWrapper,
-      {
-        label,
-        error,
-        warning,
-        info,
-        success,
-        helperText,
-        messagePosition,
-        required,
-        fullWidth,
-        classNames,
-        children: /* @__PURE__ */ jsxs("div", { ref, className: cn("datePicker_root", "relative w-full", classNames?.root), "data-slot": "root", children: [
-          /* @__PURE__ */ jsx("div", { className: cn("absolute left-3 flex items-center h-full top-0 text-text-secondary pointer-events-none z-10", classNames?.icon), "data-slot": "icon", children: /* @__PURE__ */ jsx(Clock, { className: iconSizes[size] }) }),
-          /* @__PURE__ */ jsxs(
-            Popover,
-            {
-              open: isOpen,
-              onOpenChange: (open) => {
-                setIsOpen(open);
-                if (!open) {
-                  setPreviewTime("");
-                }
-              },
-              children: [
-                /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: timeTriggerButton }),
-                /* @__PURE__ */ jsx(
-                  PopoverContent,
-                  {
-                    className: "p-0 w-auto",
-                    align: "start",
-                    sideOffset: 4,
-                    onOpenAutoFocus: (e) => e.preventDefault(),
-                    children: /* @__PURE__ */ jsx(
-                      TimeColumnPicker,
-                      {
-                        value: currentValue,
-                        onChange: handleTimeChange,
-                        onPreview: setPreviewTime,
-                        timeFormat,
-                        color
-                      }
-                    )
-                  }
-                )
-              ]
-            }
-          ),
-          showClear && /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              onClick: handleClear,
-              className: cn("absolute right-3 flex items-center h-full top-0 text-text-secondary hover:text-text-primary z-10", classNames?.clear),
-              "aria-label": "Clear time",
-              "data-slot": "clear",
-              children: /* @__PURE__ */ jsx(X, { className: iconSizes[size] })
-            }
-          )
-        ] })
-      }
-    );
-  }
-);
-TimePickerComponent.displayName = "TimePicker";
-var DatePicker = Object.assign(DatePickerComponent, {
-  RangePicker: RangePickerComponent,
-  TimePicker: TimePickerComponent
-});
-
-export { DatePicker, RangePickerComponent, TimePickerComponent };
-//# sourceMappingURL=chunk-EC5DXYME.js.map
-//# sourceMappingURL=chunk-EC5DXYME.js.map