@sustaina/shared-ui 1.65.4 → 1.66.0

package/dist/index.mjs

@@ -7,7 +7,7 @@ import { twMerge } from 'tailwind-merge';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import useEmblaCarousel from 'embla-carousel-react';
-import { ChevronLeft, ChevronRight, CircleX, ChevronDown, X, CircleHelp, Clock, Check, Undo, Redo, SearchIcon as SearchIcon$1, Pencil, BaselineIcon, Bold, Italic, Underline, Strikethrough, Code, Pilcrow, Heading1, Heading2, Heading3, List, ListOrdered, QuoteIcon, CodeSquare, LinkIcon, Link2Off, ImageIcon, AlignLeft, AlignCenter, AlignRight, ExternalLink, XIcon, CheckIcon, Triangle, CalendarIcon, Search, ChevronUp, ChevronRightIcon, PanelLeftIcon, Minimize2, Maximize2, Plus, MoreVertical, Bug, GripVertical, Info, CircleMinus, Minus } from 'lucide-react';
+import { ChevronLeft, ChevronRight, CircleX, ChevronDown, X, CircleHelp, Check, Undo, Redo, SearchIcon as SearchIcon$1, Pencil, BaselineIcon, Bold, Italic, Underline, Strikethrough, Code, Pilcrow, Heading1, Heading2, Heading3, List, ListOrdered, QuoteIcon, CodeSquare, LinkIcon, Link2Off, ImageIcon, AlignLeft, AlignCenter, AlignRight, ExternalLink, XIcon, CheckIcon, Triangle, CalendarIcon, Search, ChevronUp, ChevronRightIcon, PanelLeftIcon, Minimize2, Maximize2, Plus, MoreVertical, Bug, GripVertical, Info, CircleMinus, Minus } from 'lucide-react';
 import Autoplay from 'embla-carousel-autoplay';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
@@ -15,7 +15,7 @@ import { createPortal } from 'react-dom';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import { useForm, FormProvider, Controller, useFormContext, useFormState, useFieldArray, useWatch } from 'react-hook-form';
 import * as LabelPrimitive from '@radix-ui/react-label';
-import { format, isValid, parse, parseISO, isAfter, compareAsc } from 'date-fns';
+import { format, isValid, parseISO, isAfter, compareAsc, parse } from 'date-fns';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import { Command as Command$1 } from 'cmdk';
 import * as DialogPrimitive2 from '@radix-ui/react-dialog';
@@ -4854,6 +4854,14 @@ var ClearButton = ({
     event.stopPropagation();
     triggerClear();
   };
+  const handlePointerDown = (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+  };
+  const handleMouseDown = (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+  };
   const handleKeyDown = (event) => {
     if (event.key === "Enter" || event.key === " ") {
       event.preventDefault();
@@ -4866,6 +4874,8 @@ var ClearButton = ({
     {
       role: "button",
       tabIndex: 0,
+      onPointerDown: handlePointerDown,
+      onMouseDown: handleMouseDown,
       onClick: handleClick,
       onKeyDown: handleKeyDown,
       className: `clear-button ${className}`.trim(),
@@ -6296,7 +6306,7 @@ function TooltipContent({
       "data-slot": "tooltip-content",
       sideOffset,
       className: cn(
-        "bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
+        "bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance whitespace-pre-wrap",
         className
       ),
       ...props,
@@ -6742,6 +6752,7 @@ var Truncated = ({
   const [isTruncated, setIsTruncated] = React.useState(false);
   const [measureWidth, setMeasureWidth] = React.useState(0);
   const Comp = as;
+  const isStringChildren = typeof children === "string";
   const normalizedChildren = typeof children === "string" ? children.replace(/>/g, ">\u200B") : children;
   const lineClampLines = typeof ellipsis === "number" ? ellipsis : typeof ellipsis === "object" ? ellipsis?.lineClamp ?? 3 : null;
   const enableMeasure = Boolean(ellipsis) && !tooltipProps?.disabled;
@@ -6781,19 +6792,31 @@ var Truncated = ({
       overflow: "hidden"
     };
   }, [lineClampLines, style]);
-  const baseContent = /* @__PURE__ */ jsx(Comp, { ref: elementRef, className: cn(truncationClass, className), style: clampedStyle, children: /* @__PURE__ */ jsx(
-    EllipsisMeasure,
+  const contentWhitespaceClass = React.useMemo(() => {
+    if (!isStringChildren) return void 0;
+    return truncationClass === "truncate" ? "whitespace-pre" : "whitespace-pre-wrap";
+  }, [isStringChildren, truncationClass]);
+  const baseContent = /* @__PURE__ */ jsx(
+    Comp,
     {
-      enableMeasure,
-      text: normalizedChildren,
-      width: measureWidth,
-      rows: lineClampLines ?? 1,
-      expanded: false,
-      miscDeps: [truncationClass],
-      onEllipsis: setIsTruncated,
-      children: () => normalizedChildren
+      ref: elementRef,
+      className: cn(truncationClass, contentWhitespaceClass, className),
+      style: clampedStyle,
+      children: /* @__PURE__ */ jsx(
+        EllipsisMeasure,
+        {
+          enableMeasure,
+          text: normalizedChildren,
+          width: measureWidth,
+          rows: lineClampLines ?? 1,
+          expanded: false,
+          miscDeps: [truncationClass],
+          onEllipsis: setIsTruncated,
+          children: () => normalizedChildren
+        }
+      )
     }
-  ) });
+  );
   let tooltipContent = normalizedChildren;
   if (typeof ellipsis === "object") {
     tooltipContent = ellipsis?.content ?? normalizedChildren;
@@ -6821,6 +6844,7 @@ var Truncated = ({
             side: tooltipSide,
             className: cn(
               "text-white bg-sus-secondary-gray-10 max-w-xs sm:max-w-md wrap-break-word shadow-lg",
+              isStringChildren && "whitespace-pre-wrap",
               tooltipContentClassName
             ),
             arrowClassName: cn("bg-sus-secondary-gray-10 fill-sus-secondary-gray-10", tooltipArrowClassName),
@@ -8594,7 +8618,7 @@ var sanitizeInput = (val) => {
   if (/[%*~^]/.test(trimmed)) return "__INVALID_WILDCARD__";
   if (/[%><={}\\[\]"']/u.test(trimmed)) return "__INVALID_CHAR__";
   if (/\p{Cc}/u.test(val)) return "__INVALID_CONTROL_CHAR__";
-  return trimmed.replace(/\s+/g, " ");
+  return val;
 };
 var numericTypes = ["number"];
 var dateTypes = ["date", "datemonth"];
@@ -9963,6 +9987,291 @@ var DataTable = ({
   );
 };
 var DataTable_default = DataTable;
+var defaultValueFormatter3 = (date) => format(date, "yyyy-MM-dd'T'HH:mm:ss");
+var parseWithPatterns = (value) => {
+  const patterns = ["yyyy-MM-dd'T'HH:mm:ss", "yyyy-MM-dd HH:mm", "yyyy-MM-dd"];
+  for (const pattern of patterns) {
+    const parsed = parse(value, pattern, /* @__PURE__ */ new Date());
+    if (isValid(parsed)) return parsed;
+  }
+  return void 0;
+};
+var defaultValueParser3 = (value) => {
+  const isoParsed = parseISO(value);
+  if (isValid(isoParsed)) return isoParsed;
+  return parseWithPatterns(value);
+};
+var DateTimePicker = ({
+  value,
+  onChange,
+  onValueChange,
+  disabled = false,
+  invalid = false,
+  allowClear = true,
+  use24Hour = false,
+  placeholderDate = "Select date",
+  placeholderTime = "Select time",
+  className,
+  datePickerClassName,
+  timePickerClassName,
+  popoverContentClassName,
+  clearAriaLabel = "Clear date time",
+  minuteStep = 5,
+  minDateTime,
+  maxDateTime,
+  valueFormatter,
+  valueParser,
+  datePickerProps,
+  timePickerProps
+}) => {
+  const [open, setOpen] = React__default.useState(false);
+  const hourListRef = React__default.useRef(null);
+  const minuteListRef = React__default.useRef(null);
+  const parser = React__default.useMemo(() => valueParser ?? defaultValueParser3, [valueParser]);
+  const outputFormatter = React__default.useMemo(() => valueFormatter ?? defaultValueFormatter3, [valueFormatter]);
+  const parseInput = React__default.useCallback(
+    (input) => {
+      if (input === null || input === void 0) return void 0;
+      if (input instanceof Date) return isValid(input) ? input : void 0;
+      const parsed = parser(input);
+      return parsed && isValid(parsed) ? parsed : void 0;
+    },
+    [parser]
+  );
+  const isControlled = value !== void 0;
+  const parsedValue = React__default.useMemo(() => parseInput(value), [parseInput, value]);
+  const [internalValue, setInternalValue] = React__default.useState(() => parsedValue);
+  React__default.useEffect(() => {
+    if (isControlled) {
+      setInternalValue(parsedValue);
+    }
+  }, [isControlled, parsedValue]);
+  const currentValue = isControlled ? parsedValue : internalValue;
+  const emitChange = React__default.useCallback(
+    (next) => {
+      if (!isControlled) {
+        setInternalValue(next);
+      }
+      onChange?.(next);
+      onValueChange?.(next ? outputFormatter(next) : void 0);
+    },
+    [isControlled, onChange, onValueChange, outputFormatter]
+  );
+  const makeDateTime = React__default.useCallback((baseDate, hour, minute) => {
+    const clampedHour = Math.min(23, Math.max(0, hour));
+    const clampedMinute = Math.min(59, Math.max(0, minute));
+    return new Date(
+      baseDate.getFullYear(),
+      baseDate.getMonth(),
+      baseDate.getDate(),
+      clampedHour,
+      clampedMinute,
+      0,
+      0
+    );
+  }, []);
+  const handleDateChange = React__default.useCallback(
+    (nextDate) => {
+      if (!nextDate) {
+        emitChange(void 0);
+        return;
+      }
+      emitChange(new Date(nextDate.getFullYear(), nextDate.getMonth(), nextDate.getDate(), 0, 0, 0, 0));
+    },
+    [emitChange]
+  );
+  const handleTimeApply = React__default.useCallback(
+    (hour, minute) => {
+      const baseDate = currentValue;
+      if (!baseDate) return;
+      emitChange(makeDateTime(baseDate, hour, minute));
+    },
+    [currentValue, emitChange, makeDateTime]
+  );
+  const currentHour = currentValue?.getHours();
+  const currentMinute = currentValue?.getMinutes();
+  const handleHourSelect = React__default.useCallback(
+    (hour) => {
+      handleTimeApply(hour, currentMinute ?? 0);
+    },
+    [currentMinute, handleTimeApply]
+  );
+  const handleMinuteSelect = React__default.useCallback(
+    (minute) => {
+      handleTimeApply(currentHour ?? 0, minute);
+      setOpen(false);
+    },
+    [currentHour, handleTimeApply]
+  );
+  const hours = React__default.useMemo(() => Array.from({ length: 24 }, (_, index) => 23 - index), []);
+  const minuteInterval = React__default.useMemo(() => {
+    const safeStep = Math.min(60, Math.max(1, minuteStep));
+    return Array.from({ length: Math.ceil(60 / safeStep) }, (_, index) => index * safeStep).filter(
+      (value2) => value2 < 60
+    );
+  }, [minuteStep]);
+  const displayLabel = React__default.useMemo(() => {
+    if (!currentValue) return `${placeholderDate} ${placeholderTime}`;
+    return format(currentValue, use24Hour ? "dd/MM/yyyy HH:mm" : "dd/MM/yyyy hh:mm a");
+  }, [currentValue, placeholderDate, placeholderTime, use24Hour]);
+  const canSelectTime = !disabled && !!currentValue;
+  const isHourDisabled = React__default.useCallback(
+    (hour) => {
+      if (!currentValue) return true;
+      const testDateTime = new Date(
+        currentValue.getFullYear(),
+        currentValue.getMonth(),
+        currentValue.getDate(),
+        hour,
+        0,
+        0,
+        0
+      );
+      if (minDateTime && testDateTime < minDateTime) return true;
+      if (maxDateTime && testDateTime > maxDateTime) return true;
+      return false;
+    },
+    [currentValue, minDateTime, maxDateTime]
+  );
+  const isMinuteDisabled = React__default.useCallback(
+    (minute) => {
+      if (!currentValue || typeof currentHour === "undefined") return true;
+      const testDateTime = new Date(
+        currentValue.getFullYear(),
+        currentValue.getMonth(),
+        currentValue.getDate(),
+        currentHour,
+        minute,
+        0,
+        0
+      );
+      if (minDateTime && testDateTime < minDateTime) return true;
+      if (maxDateTime && testDateTime > maxDateTime) return true;
+      return false;
+    },
+    [currentValue, currentHour, minDateTime, maxDateTime]
+  );
+  const scrollToSelected = React__default.useCallback((container, selector) => {
+    if (!container) return;
+    const element = container.querySelector(selector);
+    if (!element) return;
+    const target = element.offsetTop - container.clientHeight / 2 + element.clientHeight / 2;
+    container.scrollTo({ top: Math.max(0, target), behavior: "smooth" });
+  }, []);
+  React__default.useEffect(() => {
+    if (!open) return;
+    if (typeof currentHour === "number") {
+      scrollToSelected(hourListRef.current, `[data-hour="${currentHour}"]`);
+    }
+    if (typeof currentMinute === "number") {
+      scrollToSelected(minuteListRef.current, `[data-minute="${currentMinute}"]`);
+    }
+  }, [currentHour, currentMinute, open, scrollToSelected]);
+  const handleClear = React__default.useCallback(() => {
+    emitChange(void 0);
+    setOpen(false);
+  }, [emitChange]);
+  return /* @__PURE__ */ jsxs("div", { className: cn("relative w-full", className), children: [
+    /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+      /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+        Button,
+        {
+          type: "button",
+          variant: "outline",
+          disabled,
+          "aria-invalid": invalid || void 0,
+          className: cn(
+            "group relative flex! w-full items-center justify-between rounded-md bg-white! pl-4 text-left text-sm font-medium shadow-none border border-sus-secondary-gray-8 focus-visible:ring-0 focus-visible:ring-offset-0 data-[state=open]:border-black disabled:bg-sus-secondary-gray-3!",
+            "min-h-9",
+            currentValue ? "text-gray-700" : "text-gray-400",
+            invalid && "border-destructive focus-visible:border-destructive focus-visible:ring-destructive/30",
+            allowClear && currentValue ? "pr-8" : "pr-4"
+          ),
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "flex-1 truncate font-light", children: displayLabel }),
+            /* @__PURE__ */ jsx("span", { className: "flex items-center gap-2 text-black group-disabled:text-sus-secondary-gray-8 shrink-0", children: /* @__PURE__ */ jsx(SuiCalendarIcon2, { className: "h-4 w-4" }) })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsx(PopoverContent, { className: cn("w-auto p-0", popoverContentClassName), align: "start", children: /* @__PURE__ */ jsxs("div", { className: "sm:flex", children: [
+        /* @__PURE__ */ jsx(
+          DatePicker,
+          {
+            ...datePickerProps,
+            className: cn(datePickerProps?.className, datePickerClassName),
+            selectionMode: "single",
+            selectedDate: currentValue,
+            onDateSelect: handleDateChange,
+            minDate: minDateTime,
+            maxDate: maxDateTime
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "flex border-t sm:border-t-0 sm:border-l p-2",
+              !canSelectTime && "opacity-60",
+              timePickerClassName,
+              timePickerProps?.panelClassName
+            ),
+            children: /* @__PURE__ */ jsxs("div", { className: "flex w-full", children: [
+              /* @__PURE__ */ jsx("div", { className: "w-14 border-r pr-1", children: /* @__PURE__ */ jsx("div", { ref: hourListRef, className: "h-[300px] overflow-y-auto space-y-1", children: hours.map((hour) => {
+                const selected = currentHour === hour;
+                const hourDisabled = isHourDisabled(hour);
+                return /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    "data-hour": hour,
+                    disabled: !canSelectTime || hourDisabled,
+                    onClick: () => handleHourSelect(hour),
+                    className: cn(
+                      "h-8 w-full rounded-md text-sm transition-colors",
+                      selected ? "bg-[#379a2a] text-white hover:bg-[#379a2a]" : "text-foreground hover:bg-sus-secondary-gray-3",
+                      (!canSelectTime || hourDisabled) && "cursor-not-allowed opacity-50"
+                    ),
+                    children: String(hour).padStart(2, "0")
+                  },
+                  hour
+                );
+              }) }) }),
+              /* @__PURE__ */ jsx("div", { className: "w-14 pl-1", children: /* @__PURE__ */ jsx("div", { ref: minuteListRef, className: "h-[300px] overflow-y-auto space-y-1", children: minuteInterval.map((minute) => {
+                const selected = currentMinute === minute;
+                const minuteDisabled = isMinuteDisabled(minute);
+                return /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    "data-minute": minute,
+                    disabled: !canSelectTime || minuteDisabled,
+                    onClick: () => handleMinuteSelect(minute),
+                    className: cn(
+                      "h-8 w-full rounded-md text-sm transition-colors",
+                      selected ? "bg-[#379a2a] text-white hover:bg-[#379a2a]" : "text-foreground hover:bg-sus-secondary-gray-3",
+                      (!canSelectTime || minuteDisabled) && "cursor-not-allowed opacity-50"
+                    ),
+                    children: String(minute).padStart(2, "0")
+                  },
+                  minute
+                );
+              }) }) })
+            ] })
+          }
+        )
+      ] }) })
+    ] }),
+    allowClear && !!currentValue && !disabled && /* @__PURE__ */ jsx(
+      ClearButton,
+      {
+        onClick: handleClear,
+        ariaLabel: clearAriaLabel,
+        title: clearAriaLabel,
+        className: "absolute right-3 top-1/2 z-10 -translate-y-1/2"
+      }
+    )
+  ] });
+};
 function Dialog2(props) {
   return /* @__PURE__ */ jsx(DialogPrimitive2.Root, { "data-slot": "dialog", ...props });
 }
@@ -16240,7 +16549,10 @@ var DefaultHeader = ({
     "span",
     {
       ref: titleRef,
-      className: cn("text-lg font-semibold text-sus-green-1 truncate", classNames?.title),
+      className: cn(
+        "text-lg font-semibold text-sus-green-1 truncate whitespace-pre",
+        classNames?.title
+      ),
       children: title
     }
   ) : null;
@@ -16257,10 +16569,10 @@ var DefaultHeader = ({
         }
       ) : null,
       /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-w-0", children: [
-        subtitle ? /* @__PURE__ */ jsx("span", { className: cn("text-xs text-gray-500", classNames?.subtitle), children: subtitle }) : null,
+        subtitle ? /* @__PURE__ */ jsx("span", { className: cn("text-xs text-gray-500 whitespace-pre-wrap", classNames?.subtitle), children: subtitle }) : null,
         textElement ? isTruncated ? /* @__PURE__ */ jsxs(Tooltip, { children: [
           /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: textElement }),
-          /* @__PURE__ */ jsx(TooltipContent, { children: title })
+          /* @__PURE__ */ jsx(TooltipContent, { className: "whitespace-pre-wrap", children: title })
         ] }) : textElement : null
       ] })
     ] }),
@@ -16316,351 +16628,6 @@ var RightPanelContainer = ({
   );
 };
 var RightPanelContainer_default = RightPanelContainer;
-var defaultDisplayFormatter3 = (date, use24Hour) => use24Hour ? format(date, "HH:mm") : format(date, "hh:mm a");
-var defaultValueFormatter3 = (date) => format(date, "HH:mm");
-var defaultValueParser3 = (value) => {
-  let parsed = parse(value, "HH:mm", /* @__PURE__ */ new Date());
-  if (isValid(parsed)) return parsed;
-  parsed = parse(value, "HH:mm:ss", /* @__PURE__ */ new Date());
-  if (isValid(parsed)) return parsed;
-  parsed = parse(value, "hh:mm a", /* @__PURE__ */ new Date());
-  if (isValid(parsed)) return parsed;
-  return void 0;
-};
-var TimePicker = React.forwardRef(
-  ({
-    value,
-    onChange,
-    onValueChange,
-    disabled = false,
-    className,
-    buttonClassName,
-    wrapperClassName,
-    placeholder: placeholder2,
-    use24Hour = false,
-    iconPosition = "start",
-    icon,
-    allowClear = true,
-    clearAriaLabel = "Clear time",
-    displayFormatter,
-    valueFormatter,
-    valueParser,
-    invalid = false
-  }, ref) => {
-    const [open, setOpen] = React.useState(false);
-    const [hours, setHours] = React.useState("12");
-    const [minutes, setMinutes] = React.useState("00");
-    const [period, setPeriod] = React.useState("AM");
-    const parser = React.useMemo(() => valueParser ?? defaultValueParser3, [valueParser]);
-    const outputFormatter = React.useMemo(
-      () => valueFormatter ?? defaultValueFormatter3,
-      [valueFormatter]
-    );
-    const labelFormatter = React.useMemo(
-      () => displayFormatter ?? defaultDisplayFormatter3,
-      [displayFormatter]
-    );
-    const parseInput = React.useCallback(
-      (input) => {
-        if (input === null || input === void 0) return void 0;
-        if (input instanceof Date) return isValid(input) ? input : void 0;
-        const parsed = parser(input);
-        return parsed && isValid(parsed) ? parsed : void 0;
-      },
-      [parser]
-    );
-    const parsedValue = React.useMemo(() => parseInput(value), [parseInput, value]);
-    const hasValue = parsedValue !== void 0;
-    React.useEffect(() => {
-      if (parsedValue) {
-        const hour24 = parsedValue.getHours();
-        const minute = parsedValue.getMinutes();
-        if (use24Hour) {
-          setHours(String(hour24).padStart(2, "0"));
-        } else {
-          const newPeriod = hour24 >= 12 ? "PM" : "AM";
-          const hour12 = hour24 === 0 ? 12 : hour24 > 12 ? hour24 - 12 : hour24;
-          setHours(String(hour12).padStart(2, "0"));
-          setPeriod(newPeriod);
-        }
-        setMinutes(String(minute).padStart(2, "0"));
-      } else {
-        setHours(use24Hour ? "00" : "12");
-        setMinutes("00");
-        setPeriod("AM");
-      }
-    }, [parsedValue, use24Hour]);
-    const createTimeDate = (h, m, p) => {
-      let hour = parseInt(h) || 0;
-      const minute = parseInt(m) || 0;
-      if (!use24Hour) {
-        if (p === "PM" && hour !== 12) {
-          hour += 12;
-        } else if (p === "AM" && hour === 12) {
-          hour = 0;
-        }
-      }
-      const today = /* @__PURE__ */ new Date();
-      return new Date(today.getFullYear(), today.getMonth(), today.getDate(), hour, minute, 0, 0);
-    };
-    const emitChange = (date) => {
-      onChange?.(date);
-      onValueChange?.(outputFormatter(date));
-    };
-    const handleClear = () => {
-      onChange?.(void 0);
-      onValueChange?.(void 0);
-    };
-    const handleHourChange = (newHour) => {
-      const hour = parseInt(newHour) || 0;
-      const maxHour = use24Hour ? 23 : 12;
-      const minHour = use24Hour ? 0 : 1;
-      if (hour <= maxHour && hour >= minHour) {
-        setHours(newHour.padStart(2, "0"));
-        emitChange(createTimeDate(newHour, minutes, period));
-      }
-    };
-    const handleMinuteChange = (newMinute) => {
-      const minute = parseInt(newMinute) || 0;
-      if (minute <= 59 && minute >= 0) {
-        setMinutes(newMinute.padStart(2, "0"));
-        emitChange(createTimeDate(hours, newMinute, period));
-      }
-    };
-    const handlePeriodToggle = () => {
-      const newPeriod = period === "AM" ? "PM" : "AM";
-      setPeriod(newPeriod);
-      emitChange(createTimeDate(hours, minutes, newPeriod));
-    };
-    const incrementHour = () => {
-      const hour = parseInt(hours) || 0;
-      const maxHour = use24Hour ? 23 : 12;
-      const minHour = use24Hour ? 0 : 1;
-      const newHour = hour >= maxHour ? minHour : hour + 1;
-      handleHourChange(String(newHour));
-    };
-    const decrementHour = () => {
-      const hour = parseInt(hours) || 0;
-      const maxHour = use24Hour ? 23 : 12;
-      const minHour = use24Hour ? 0 : 1;
-      const newHour = hour <= minHour ? maxHour : hour - 1;
-      handleHourChange(String(newHour));
-    };
-    const incrementMinute = () => {
-      const minute = parseInt(minutes) || 0;
-      const newMinute = minute >= 59 ? 0 : minute + 1;
-      handleMinuteChange(String(newMinute));
-    };
-    const decrementMinute = () => {
-      const minute = parseInt(minutes) || 0;
-      const newMinute = minute <= 0 ? 59 : minute - 1;
-      handleMinuteChange(String(newMinute));
-    };
-    const displayValue = parsedValue ? labelFormatter(parsedValue, use24Hour) : placeholder2;
-    const displayIcon = icon || /* @__PURE__ */ jsx(Clock, { className: "h-4 w-4" });
-    const showClear = allowClear && hasValue && !disabled;
-    return /* @__PURE__ */ jsxs("div", { className: cn("relative inline-flex w-full", wrapperClassName), children: [
-      /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
-        /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
-          Button,
-          {
-            variant: "outline",
-            disabled,
-            className: cn(
-              "w-full justify-between text-left font-normal",
-              !hasValue && "text-muted-foreground",
-              invalid && "border-destructive focus-visible:ring-destructive",
-              showClear && "pr-8",
-              buttonClassName,
-              className
-            ),
-            children: [
-              iconPosition === "start" && /* @__PURE__ */ jsx("span", { className: "shrink-0", children: displayIcon }),
-              /* @__PURE__ */ jsx(
-                "span",
-                {
-                  className: cn(
-                    "flex-1 truncate",
-                    iconPosition === "start" && "ml-2",
-                    iconPosition === "end" && "mr-2"
-                  ),
-                  children: displayValue || placeholder2 || "Select time"
-                }
-              ),
-              iconPosition === "end" && /* @__PURE__ */ jsx("span", { className: "shrink-0", children: displayIcon })
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-4", align: "start", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-1", children: [
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "ghost",
-                size: "icon",
-                className: "h-8 w-8",
-                onClick: incrementHour,
-                type: "button",
-                children: /* @__PURE__ */ jsx(
-                  "svg",
-                  {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    width: "16",
-                    height: "16",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: /* @__PURE__ */ jsx("polyline", { points: "18 15 12 9 6 15" })
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Input,
-              {
-                ref,
-                type: "text",
-                inputMode: "numeric",
-                value: hours,
-                onChange: (e) => handleHourChange(e.target.value),
-                className: "w-16 text-center",
-                maxLength: 2
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "ghost",
-                size: "icon",
-                className: "h-8 w-8",
-                onClick: decrementHour,
-                type: "button",
-                children: /* @__PURE__ */ jsx(
-                  "svg",
-                  {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    width: "16",
-                    height: "16",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
-                  }
-                )
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsx("span", { className: "text-2xl font-semibold", children: ":" }),
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-1", children: [
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "ghost",
-                size: "icon",
-                className: "h-8 w-8",
-                onClick: incrementMinute,
-                type: "button",
-                children: /* @__PURE__ */ jsx(
-                  "svg",
-                  {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    width: "16",
-                    height: "16",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: /* @__PURE__ */ jsx("polyline", { points: "18 15 12 9 6 15" })
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Input,
-              {
-                type: "text",
-                inputMode: "numeric",
-                value: minutes,
-                onChange: (e) => handleMinuteChange(e.target.value),
-                className: "w-16 text-center",
-                maxLength: 2
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "ghost",
-                size: "icon",
-                className: "h-8 w-8",
-                onClick: decrementMinute,
-                type: "button",
-                children: /* @__PURE__ */ jsx(
-                  "svg",
-                  {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    width: "16",
-                    height: "16",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
-                  }
-                )
-              }
-            )
-          ] }),
-          !use24Hour && /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx("div", { className: "w-px h-16 bg-border mx-1" }),
-            /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-1", children: [
-              /* @__PURE__ */ jsx(
-                Button,
-                {
-                  variant: period === "AM" ? "default" : "outline",
-                  size: "sm",
-                  className: "w-14 h-12",
-                  onClick: handlePeriodToggle,
-                  type: "button",
-                  children: "AM"
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Button,
-                {
-                  variant: period === "PM" ? "default" : "outline",
-                  size: "sm",
-                  className: "w-14 h-12",
-                  onClick: handlePeriodToggle,
-                  type: "button",
-                  children: "PM"
-                }
-              )
-            ] })
-          ] })
-        ] }) })
-      ] }),
-      showClear && /* @__PURE__ */ jsx(
-        ClearButton,
-        {
-          onClick: handleClear,
-          ariaLabel: clearAriaLabel,
-          className: "absolute right-2 top-1/2 -translate-y-1/2"
-        }
-      )
-    ] });
-  }
-);
-TimePicker.displayName = "TimePicker";
 
 // src/components/cropperModal/type.ts
 var CropperModalError = class extends Error {
@@ -17755,7 +17722,7 @@ var TruncatedMouseEnterDiv = ({
         ref: textRef,
         onMouseEnter: checkTruncation,
         onMouseLeave: () => setIsTruncated(false),
-        className: cn("truncate", className),
+        className: cn("truncate whitespace-pre", className),
         children: value
       }
     ) }),
@@ -18612,6 +18579,6 @@ function InputMentionInner({
 }
 var InputMention = forwardRef(InputMentionInner);
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, dropdownMenu_default as ActionDropdown, ActionMenu, AdministrationIcon, AdvanceSearch_default as AdvanceSearch, AnalyticsIcon, ApplicationLogIcon, ArrowIcon, AuditFooter, BookmarkIcon, BriefcaseBusinessIcon, BuildingIcon, Button, SuiCalendarIcon2 as Calendar2Icon, CalendarDaysIcon, CardIcon, Carousel, CarouselContent, CarouselDots, CarouselItem, CarouselNext, CarouselPrevious, CarouselThumbnails, Checkbox, CircleUserIcon, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, Combobox_default as Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, CopyUserRightsIcon, CropperModal, CropperModalError, CustomActionStatusIcon, CustomFieldIcon, DIALOG_ALERT_I18N_SUBNAMESPACE, DIALOG_ALERT_TEMPLATES, DashboardIcon, DataEntryIcon, DataTable_default as DataTable, DatePicker2 as DatePicker, DecreaseIcon, Dialog2 as Dialog, DialogAlert, DialogAlertProvider, DialogClose, DialogCloseButton, DialogContent2 as DialogContent, DialogDescription2 as DialogDescription, DialogFooter, DialogHeader2 as DialogHeader, DialogTitle2 as DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EllipsisBoxIcon, ErrorCompression, ErrorCreateCanvas, ErrorGeneratingBlob, ErrorInvalidSVG, ErrorSVGExceedSize, FactoryIcon, FileCogIcon, FileSpreadsheet, FileTextIcon, FiltersIcon, FolderIcon, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FormulaEditor, GridSettingsModal_default as GridSettingsModal, HamburgerMenuIcon, HandymanIcon, header_default as Header, HeaderCell_default as HeaderCell, HelpIcon, HomeIcon, HomePlusIcon, Image2 as Image, ImagePlaceholderIcon, InformationIcon, Input, InputMention, InputNumber_default as InputNumber, Label2 as Label, LoadingPage, LookupSelect, MailIcon, MainListContainer_default as MainListContainer, ManIcon, ManagementIcon, MenuIcon, MessageIcon, MessageIconInverse, MessageSquareIcon, MonthPicker2 as MonthPicker, navbar_default as Navbar, NotFoundIcon, OutlineArrowIcon, PlusIcon, PlusSearchIcon, Popover, PopoverAnchor, PopoverArrow, PopoverContent, PopoverTrigger, PowerIcon, PreventPageLeave_default as PreventPageLeave, ProgressBar_default as ProgressBar, QuestionIcon, RadioGroupItem, RadioGroupRoot, RadioLabel, RichText, RightPanelContainer_default as RightPanelContainer, RoleIcon, SearchIcon, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, SetupIcon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarLayout, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Spinner, SuiCalendarIcon, SuiCalendarIcon2, SuiCheckIcon, SuiDotsVerticalIcon, SuiEmptyDataIcon, SuiExpandIcon, SuiFilterIcon, SuiSettingIcon, SuiTriangleDownIcon, SuiWarningIcon, Switch, TabSelect, Table, TableBody, TableCaption, TableCell, TableContainer, TableFooter, TableHead, TableHeader, TableOfContents, TableRow, TagListViewIcon, TextArea, TimePicker, ToolBoxIcon, Tooltip2 as Tooltip, TooltipArrow, TooltipContent2 as TooltipContent, TooltipProvider2 as TooltipProvider, TooltipTrigger2 as TooltipTrigger, TransferUserRightsIcon, TrashIcon, truncated_default as Truncated, truncatedMouseEnterDiv_default as TruncatedMouseEnterDiv, ui_exports as UI, UserActiveIcon, UserAloneIcon, UserFriendIcon, UserGroupIcon, UserIcon, UserInactiveIcon, UserNameIcon, UserProtectIcon, UsersIcon, VirtualizedCommand_default as VirtualizedCommand, WorkFlowIcon, booleanToSelectValue, buildPrefixMap, buttonVariants, cn, compareAlphanumeric, debounce, defaultOperatorShortcuts, defaultOperators, formatISODate, getDialogAlertControls, inputVariants, isDefined, isEmptyObject, isValidParentheses, mapTokensToOutput, parseFormula, parseFormulaToToken, resetVisibleTableState, selectValueToBoolean, spinnerVariants, splitOperators, stripNullishObject, throttle, tokenizeFormulaString, useBindRef_default as useBindRef, useCarousel, useControllableState_default as useControllableState, useDraftGuardStore, useFormField, useGridSettingsStore_default as useGridSettingsStore, useHover_default as useHover, useIntersectionObserver_default as useIntersectionObserver, useIsomorphicLayoutEffect, useMediaQuery_default as useMediaQuery, usePreventPageLeave_default as usePreventPageLeave, usePreventPageLeaveStore_default as usePreventPageLeaveStore, useSafeBlocker, useScreenSize_default as useScreenSize, useSidebar, useTruncated_default as useTruncated, validateTokenPrefixes };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, dropdownMenu_default as ActionDropdown, ActionMenu, AdministrationIcon, AdvanceSearch_default as AdvanceSearch, AnalyticsIcon, ApplicationLogIcon, ArrowIcon, AuditFooter, BookmarkIcon, BriefcaseBusinessIcon, BuildingIcon, Button, SuiCalendarIcon2 as Calendar2Icon, CalendarDaysIcon, CardIcon, Carousel, CarouselContent, CarouselDots, CarouselItem, CarouselNext, CarouselPrevious, CarouselThumbnails, Checkbox, CircleUserIcon, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, Combobox_default as Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, CopyUserRightsIcon, CropperModal, CropperModalError, CustomActionStatusIcon, CustomFieldIcon, DIALOG_ALERT_I18N_SUBNAMESPACE, DIALOG_ALERT_TEMPLATES, DashboardIcon, DataEntryIcon, DataTable_default as DataTable, DatePicker2 as DatePicker, DateTimePicker, DecreaseIcon, Dialog2 as Dialog, DialogAlert, DialogAlertProvider, DialogClose, DialogCloseButton, DialogContent2 as DialogContent, DialogDescription2 as DialogDescription, DialogFooter, DialogHeader2 as DialogHeader, DialogTitle2 as DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EllipsisBoxIcon, ErrorCompression, ErrorCreateCanvas, ErrorGeneratingBlob, ErrorInvalidSVG, ErrorSVGExceedSize, FactoryIcon, FileCogIcon, FileSpreadsheet, FileTextIcon, FiltersIcon, FolderIcon, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FormulaEditor, GridSettingsModal_default as GridSettingsModal, HamburgerMenuIcon, HandymanIcon, header_default as Header, HeaderCell_default as HeaderCell, HelpIcon, HomeIcon, HomePlusIcon, Image2 as Image, ImagePlaceholderIcon, InformationIcon, Input, InputMention, InputNumber_default as InputNumber, Label2 as Label, LoadingPage, LookupSelect, MailIcon, MainListContainer_default as MainListContainer, ManIcon, ManagementIcon, MenuIcon, MessageIcon, MessageIconInverse, MessageSquareIcon, MonthPicker2 as MonthPicker, navbar_default as Navbar, NotFoundIcon, OutlineArrowIcon, PlusIcon, PlusSearchIcon, Popover, PopoverAnchor, PopoverArrow, PopoverContent, PopoverTrigger, PowerIcon, PreventPageLeave_default as PreventPageLeave, ProgressBar_default as ProgressBar, QuestionIcon, RadioGroupItem, RadioGroupRoot, RadioLabel, RichText, RightPanelContainer_default as RightPanelContainer, RoleIcon, SearchIcon, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, SetupIcon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarLayout, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Spinner, SuiCalendarIcon, SuiCalendarIcon2, SuiCheckIcon, SuiDotsVerticalIcon, SuiEmptyDataIcon, SuiExpandIcon, SuiFilterIcon, SuiSettingIcon, SuiTriangleDownIcon, SuiWarningIcon, Switch, TabSelect, Table, TableBody, TableCaption, TableCell, TableContainer, TableFooter, TableHead, TableHeader, TableOfContents, TableRow, TagListViewIcon, TextArea, ToolBoxIcon, Tooltip2 as Tooltip, TooltipArrow, TooltipContent2 as TooltipContent, TooltipProvider2 as TooltipProvider, TooltipTrigger2 as TooltipTrigger, TransferUserRightsIcon, TrashIcon, truncated_default as Truncated, truncatedMouseEnterDiv_default as TruncatedMouseEnterDiv, ui_exports as UI, UserActiveIcon, UserAloneIcon, UserFriendIcon, UserGroupIcon, UserIcon, UserInactiveIcon, UserNameIcon, UserProtectIcon, UsersIcon, VirtualizedCommand_default as VirtualizedCommand, WorkFlowIcon, booleanToSelectValue, buildPrefixMap, buttonVariants, cn, compareAlphanumeric, debounce, defaultOperatorShortcuts, defaultOperators, formatISODate, getDialogAlertControls, inputVariants, isDefined, isEmptyObject, isValidParentheses, mapTokensToOutput, parseFormula, parseFormulaToToken, resetVisibleTableState, selectValueToBoolean, spinnerVariants, splitOperators, stripNullishObject, throttle, tokenizeFormulaString, useBindRef_default as useBindRef, useCarousel, useControllableState_default as useControllableState, useDraftGuardStore, useFormField, useGridSettingsStore_default as useGridSettingsStore, useHover_default as useHover, useIntersectionObserver_default as useIntersectionObserver, useIsomorphicLayoutEffect, useMediaQuery_default as useMediaQuery, usePreventPageLeave_default as usePreventPageLeave, usePreventPageLeaveStore_default as usePreventPageLeaveStore, useSafeBlocker, useScreenSize_default as useScreenSize, useSidebar, useTruncated_default as useTruncated, validateTokenPrefixes };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map