@rufous/ui 0.2.93 → 0.2.95

package/dist/main.js

@@ -1665,6 +1665,28 @@ var TextField = forwardRef3(({
     className
   ].filter(Boolean).join(" ");
   const internalRef = React68.useRef(null);
+  const handleChange = (e) => {
+    if (type === "number") {
+      const raw = e.target.value;
+      const inputMax = slotProps?.input?.max ?? props.max;
+      const inputMaxLength = slotProps?.input?.maxLength ?? props.maxLength;
+      if (inputMaxLength != null) {
+        const digits = raw.replace(/[^0-9]/g, "");
+        if (digits.length > Number(inputMaxLength)) return;
+      }
+      if (inputMax != null && raw !== "") {
+        if (Number(raw) > Number(inputMax)) return;
+      }
+      const numericValue = raw === "" ? "" : Number(raw);
+      const syntheticEvent = Object.assign({}, e, {
+        target: Object.assign({}, e.target, { value: numericValue }),
+        currentTarget: Object.assign({}, e.currentTarget, { value: numericValue })
+      });
+      onChange?.(syntheticEvent);
+      return;
+    }
+    onChange?.(e);
+  };
   const triggerChange = () => {
     if (internalRef.current) {
       const nativeInputValueSetter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set;
@@ -1728,35 +1750,267 @@ var TextField = forwardRef3(({
       name,
       id: inputId,
       value,
-      onChange,
       required,
       disabled,
       readOnly,
       step: type === "number" && numberVariant ? STEP_BY_VARIANT[numberVariant] : void 0,
       min: type === "number" && numberVariant ? MIN_BY_VARIANT[numberVariant] : void 0,
       ...slotProps?.input,
-      ...props
+      ...props,
+      onChange: handleChange
     }
   ), InputProps?.endAdornment && /* @__PURE__ */ React68.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, InputProps.endAdornment), type === "number" && !disabled && !readOnly && /* @__PURE__ */ React68.createElement("div", { className: "rf-text-field__number-controls" }, /* @__PURE__ */ React68.createElement("button", { type: "button", tabIndex: -1, onClick: handleIncrement, className: "rf-text-field__number-btn" }, /* @__PURE__ */ React68.createElement("svg", { width: "8", height: "5", viewBox: "0 0 8 5", fill: "currentColor" }, /* @__PURE__ */ React68.createElement("path", { d: "M4 0L8 5H0L4 0Z" }))), /* @__PURE__ */ React68.createElement("button", { type: "button", tabIndex: -1, onClick: handleDecrement, className: "rf-text-field__number-btn", style: { marginTop: 2 } }, /* @__PURE__ */ React68.createElement("svg", { width: "8", height: "5", viewBox: "0 0 8 5", fill: "currentColor" }, /* @__PURE__ */ React68.createElement("path", { d: "M4 5L0 0H8L4 5Z" })))), hasLabel && /* @__PURE__ */ React68.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React68.createElement("span", { className: "rf-text-field__asterisk" }, "*")), variant === "outlined" && /* @__PURE__ */ React68.createElement("fieldset", { className: "rf-text-field__notch" }, hasLabel ? /* @__PURE__ */ React68.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React68.createElement("span", null, label, " ", required ? "*" : "")) : /* @__PURE__ */ React68.createElement("legend", { className: "rf-text-field__legend--empty" }))), helperText && /* @__PURE__ */ React68.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
 });
 TextField.displayName = "TextField";
 
 // lib/TextFields/AddressLookup.tsx
-import React70, { useState as useState5, useRef as useRef4, useEffect as useEffect5 } from "react";
+import React71, { useState as useState6, useRef as useRef5, useEffect as useEffect6 } from "react";
 import Axios from "axios";
 import { Country, State, City } from "country-state-city";
 
 // lib/TextFields/Autocomplete.tsx
+import React70, {
+  useState as useState5,
+  useRef as useRef4,
+  useEffect as useEffect5,
+  useCallback as useCallback2
+} from "react";
+import ReactDOM3 from "react-dom";
+
+// lib/Tooltip/Tooltip.tsx
 import React69, {
-  useState as useState4,
-  useRef as useRef3,
+  useCallback,
   useEffect as useEffect4,
-  useCallback
+  useRef as useRef3,
+  useState as useState4
 } from "react";
 import ReactDOM2 from "react-dom";
-var ChevronDownIcon = () => /* @__PURE__ */ React69.createElement("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React69.createElement("polyline", { points: "6 9 12 15 18 9" }));
-var CloseSmIcon = ({ size = 16 }) => /* @__PURE__ */ React69.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round" }, /* @__PURE__ */ React69.createElement("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), /* @__PURE__ */ React69.createElement("line", { x1: "6", y1: "6", x2: "18", y2: "18" }));
-var CheckIcon = () => /* @__PURE__ */ React69.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React69.createElement("polyline", { points: "20 6 9 17 4 12" }));
+var GAP = 8;
+function computePosition(anchor, tooltip, placement) {
+  const { top: aTop, left: aLeft, width: aW, height: aH } = anchor;
+  const { width: tW, height: tH } = tooltip;
+  let top = 0;
+  let left = 0;
+  let arrowLeft;
+  let arrowTop;
+  switch (placement) {
+    case "top":
+      top = aTop - tH - GAP;
+      left = aLeft + aW / 2 - tW / 2;
+      arrowLeft = tW / 2 - 4;
+      break;
+    case "top-start":
+      top = aTop - tH - GAP;
+      left = aLeft;
+      arrowLeft = Math.min(aW / 2, tW - 16);
+      break;
+    case "top-end":
+      top = aTop - tH - GAP;
+      left = aLeft + aW - tW;
+      arrowLeft = Math.max(tW - aW / 2 - 4, 8);
+      break;
+    case "bottom":
+      top = aTop + aH + GAP;
+      left = aLeft + aW / 2 - tW / 2;
+      arrowLeft = tW / 2 - 4;
+      break;
+    case "bottom-start":
+      top = aTop + aH + GAP;
+      left = aLeft;
+      arrowLeft = Math.min(aW / 2, tW - 16);
+      break;
+    case "bottom-end":
+      top = aTop + aH + GAP;
+      left = aLeft + aW - tW;
+      arrowLeft = Math.max(tW - aW / 2 - 4, 8);
+      break;
+    case "left":
+      top = aTop + aH / 2 - tH / 2;
+      left = aLeft - tW - GAP;
+      arrowTop = tH / 2 - 4;
+      break;
+    case "left-start":
+      top = aTop;
+      left = aLeft - tW - GAP;
+      arrowTop = Math.min(aH / 2, tH - 16);
+      break;
+    case "left-end":
+      top = aTop + aH - tH;
+      left = aLeft - tW - GAP;
+      arrowTop = Math.max(tH - aH / 2 - 4, 8);
+      break;
+    case "right":
+      top = aTop + aH / 2 - tH / 2;
+      left = aLeft + aW + GAP;
+      arrowTop = tH / 2 - 4;
+      break;
+    case "right-start":
+      top = aTop;
+      left = aLeft + aW + GAP;
+      arrowTop = Math.min(aH / 2, tH - 16);
+      break;
+    case "right-end":
+      top = aTop + aH - tH;
+      left = aLeft + aW + GAP;
+      arrowTop = Math.max(tH - aH / 2 - 4, 8);
+      break;
+    default:
+      top = aTop - tH - GAP;
+      left = aLeft + aW / 2 - tW / 2;
+  }
+  const vw = window.innerWidth;
+  const vh = window.innerHeight;
+  left = Math.max(8, Math.min(left, vw - tW - 8));
+  top = Math.max(8, Math.min(top, vh - tH - 8));
+  return { top, left, arrowLeft, arrowTop };
+}
+var Tooltip = ({
+  title,
+  placement = "top",
+  arrow = false,
+  open: controlledOpen,
+  disableHoverListener = false,
+  disableFocusListener = false,
+  enterDelay = 100,
+  leaveDelay = 0,
+  children,
+  followCursor = false,
+  className = "",
+  style,
+  sx
+}) => {
+  const sxClass = useSx(sx);
+  const [internalOpen, setInternalOpen] = useState4(false);
+  const [position, setPosition] = useState4({ top: 0, left: 0 });
+  const anchorRef = useRef3(null);
+  const tooltipRef = useRef3(null);
+  const enterTimer = useRef3(null);
+  const leaveTimer = useRef3(null);
+  const cursorPos = useRef3({ x: 0, y: 0 });
+  const isOpen = controlledOpen !== void 0 ? controlledOpen : internalOpen;
+  const clearTimers = useCallback(() => {
+    if (enterTimer.current) clearTimeout(enterTimer.current);
+    if (leaveTimer.current) clearTimeout(leaveTimer.current);
+  }, []);
+  const updatePosition = useCallback(() => {
+    if (!anchorRef.current || !tooltipRef.current) return;
+    const anchorRect = anchorRef.current.getBoundingClientRect();
+    const tooltipRect = tooltipRef.current.getBoundingClientRect();
+    if (followCursor) {
+      const fakeRect = {
+        top: cursorPos.current.y,
+        left: cursorPos.current.x,
+        right: cursorPos.current.x,
+        bottom: cursorPos.current.y,
+        width: 0,
+        height: 0,
+        x: cursorPos.current.x,
+        y: cursorPos.current.y,
+        toJSON: () => ({})
+      };
+      setPosition(computePosition(fakeRect, tooltipRect, placement));
+    } else {
+      setPosition(computePosition(anchorRect, tooltipRect, placement));
+    }
+  }, [placement, followCursor]);
+  useEffect4(() => {
+    if (isOpen) {
+      requestAnimationFrame(() => {
+        updatePosition();
+      });
+    }
+  }, [isOpen, updatePosition]);
+  const handleOpen = useCallback(() => {
+    clearTimers();
+    if (enterDelay > 0) {
+      enterTimer.current = setTimeout(() => {
+        setInternalOpen(true);
+      }, enterDelay);
+    } else {
+      setInternalOpen(true);
+    }
+  }, [enterDelay, clearTimers]);
+  const handleClose = useCallback(() => {
+    clearTimers();
+    if (leaveDelay > 0) {
+      leaveTimer.current = setTimeout(() => {
+        setInternalOpen(false);
+      }, leaveDelay);
+    } else {
+      setInternalOpen(false);
+    }
+  }, [leaveDelay, clearTimers]);
+  const handleMouseMove = useCallback(
+    (e) => {
+      cursorPos.current = { x: e.clientX, y: e.clientY };
+      if (isOpen && followCursor) {
+        updatePosition();
+      }
+    },
+    [isOpen, followCursor, updatePosition]
+  );
+  useEffect4(() => {
+    return () => clearTimers();
+  }, [clearTimers]);
+  const childProps = {};
+  if (!disableHoverListener) {
+    childProps.onMouseEnter = handleOpen;
+    childProps.onMouseLeave = handleClose;
+    childProps.onMouseMove = followCursor ? handleMouseMove : void 0;
+  }
+  if (!disableFocusListener) {
+    childProps.onFocus = handleOpen;
+    childProps.onBlur = handleClose;
+  }
+  const tooltipClasses = [
+    "rf-tooltip",
+    `rf-tooltip--placement-${placement}`,
+    isOpen ? "rf-tooltip--visible" : "",
+    sxClass,
+    className
+  ].filter(Boolean).join(" ");
+  const tooltipElement = /* @__PURE__ */ React69.createElement(
+    "div",
+    {
+      ref: tooltipRef,
+      className: tooltipClasses,
+      style: {
+        top: position.top,
+        left: position.left,
+        ...style
+      },
+      role: "tooltip",
+      "aria-hidden": !isOpen
+    },
+    title,
+    arrow && /* @__PURE__ */ React69.createElement(
+      "span",
+      {
+        className: "rf-tooltip__arrow",
+        style: {
+          ...position.arrowLeft !== void 0 ? { left: position.arrowLeft } : {},
+          ...position.arrowTop !== void 0 ? { top: position.arrowTop } : {}
+        }
+      }
+    )
+  );
+  return /* @__PURE__ */ React69.createElement(React69.Fragment, null, /* @__PURE__ */ React69.createElement(
+    "span",
+    {
+      ref: anchorRef,
+      style: { display: "inline-flex", position: "relative" },
+      "aria-describedby": isOpen ? "rf-tooltip" : void 0,
+      ...childProps
+    },
+    React69.cloneElement(children)
+  ), ReactDOM2.createPortal(tooltipElement, document.body));
+};
+Tooltip.displayName = "Tooltip";
+
+// lib/TextFields/Autocomplete.tsx
+var ChevronDownIcon = () => /* @__PURE__ */ React70.createElement("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React70.createElement("polyline", { points: "6 9 12 15 18 9" }));
+var CloseSmIcon = ({ size = 16 }) => /* @__PURE__ */ React70.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round" }, /* @__PURE__ */ React70.createElement("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), /* @__PURE__ */ React70.createElement("line", { x1: "6", y1: "6", x2: "18", y2: "18" }));
+var CheckIcon = () => /* @__PURE__ */ React70.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React70.createElement("polyline", { points: "20 6 9 17 4 12" }));
 function defaultGetLabel(option) {
   if (option === null || option === void 0) return "";
   if (typeof option === "string") return option;
@@ -1766,11 +2020,19 @@ function defaultGetLabel(option) {
 }
 function defaultIsEqual(a, b) {
   if (a === b) return true;
-  if (a !== null && b !== null && typeof a === "object" && typeof b === "object") {
+  if (a == null || b == null) return false;
+  const aIsObj = typeof a === "object";
+  const bIsObj = typeof b === "object";
+  if (aIsObj && bIsObj) {
     const aVal = a.value;
     const bVal = b.value;
     if (aVal !== void 0 && bVal !== void 0) return aVal === bVal;
+    const aId = a.id;
+    const bId = b.id;
+    if (aId !== void 0 && bId !== void 0) return aId === bId;
   }
+  if (aIsObj && !bIsObj) return a.value === b;
+  if (!aIsObj && bIsObj) return a === b.value;
   return false;
 }
 function defaultFilter(options, inputValue, getLabel) {
@@ -1813,18 +2075,18 @@ function AutocompleteInner(props, _ref) {
     onOpen,
     onClose
   } = props;
-  const [open, setOpen] = useState4(false);
-  const [inputStr, setInputStr] = useState4("");
-  const [filterQuery, setFilterQuery] = useState4("");
-  const [focusedIdx, setFocusedIdx] = useState4(-1);
-  const [popupStyle, setPopupStyle] = useState4({});
-  const containerRef = useRef3(null);
-  const popupRef = useRef3(null);
-  const inputRef = useRef3(null);
-  const listRef = useRef3(null);
-  const inputId = useRef3(`rf-ac-${Math.random().toString(36).slice(2, 9)}`).current;
+  const [open, setOpen] = useState5(false);
+  const [inputStr, setInputStr] = useState5("");
+  const [filterQuery, setFilterQuery] = useState5("");
+  const [focusedIdx, setFocusedIdx] = useState5(-1);
+  const [popupStyle, setPopupStyle] = useState5({});
+  const containerRef = useRef4(null);
+  const popupRef = useRef4(null);
+  const inputRef = useRef4(null);
+  const listRef = useRef4(null);
+  const inputId = useRef4(`rf-ac-${Math.random().toString(36).slice(2, 9)}`).current;
   const sxClass = useSx(sx);
-  const calcPopupStyle = useCallback(() => {
+  const calcPopupStyle = useCallback2(() => {
     if (!containerRef.current) return;
     const rect = containerRef.current.getBoundingClientRect();
     const POPUP_MAX_HEIGHT = 280;
@@ -1855,11 +2117,11 @@ function AutocompleteInner(props, _ref) {
   }, []);
   const activeInput = controlledInput !== void 0 ? controlledInput : inputStr;
   const selectedValues = multiple ? Array.isArray(value) ? value : [] : value != null ? [value] : [];
-  const isEqual = useCallback(
+  const isEqual = useCallback2(
     (a, b) => isOptionEqualToValue ? isOptionEqualToValue(a, b) : defaultIsEqual(a, b),
     [isOptionEqualToValue]
   );
-  const isSelected = useCallback(
+  const isSelected = useCallback2(
     (opt) => selectedValues.some((v) => isEqual(opt, v)),
     [selectedValues, isEqual]
   );
@@ -1886,7 +2148,7 @@ function AutocompleteInner(props, _ref) {
     filtered.forEach((opt, i) => flatEntries.push({ kind: "option", option: opt, flatIdx: i }));
   }
   const selectableOptions = flatEntries.filter((e) => e.kind === "option");
-  const openPopup = useCallback(() => {
+  const openPopup = useCallback2(() => {
     if (disabled) return;
     calcPopupStyle();
     setOpen(true);
@@ -1894,7 +2156,7 @@ function AutocompleteInner(props, _ref) {
     setFilterQuery("");
     onOpen?.();
   }, [disabled, calcPopupStyle, onOpen]);
-  const closePopup = useCallback((justSelected = false) => {
+  const closePopup = useCallback2((justSelected = false) => {
     setOpen(false);
     setFocusedIdx(-1);
     onClose?.();
@@ -1903,7 +2165,7 @@ function AutocompleteInner(props, _ref) {
       onInputChange?.("");
     }
   }, [freeSolo, multiple, value, onInputChange, onClose]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (!open) return;
     const handleOutside = (e) => {
       const target = e.target;
@@ -1922,7 +2184,7 @@ function AutocompleteInner(props, _ref) {
       window.removeEventListener("resize", calcPopupStyle);
     };
   }, [open, closePopup, calcPopupStyle]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (controlledInput !== void 0) return;
     if (!multiple) {
       const v = value;
@@ -2038,7 +2300,7 @@ function AutocompleteInner(props, _ref) {
     className
   ].filter(Boolean).join(" ");
   const inputPlaceholder = placeholder || (variant === "outlined" ? " " : void 0);
-  return /* @__PURE__ */ React69.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React69.createElement(
+  return /* @__PURE__ */ React70.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React70.createElement(
     "div",
     {
       className: "rf-text-field__wrapper",
@@ -2049,7 +2311,7 @@ function AutocompleteInner(props, _ref) {
         }
       }
     },
-    multiple && visibleTags.map((opt, i) => /* @__PURE__ */ React69.createElement("span", { key: i, className: "rf-autocomplete__tag" }, /* @__PURE__ */ React69.createElement("span", { style: { overflow: "hidden", textOverflow: "ellipsis" } }, getOptionLabel(opt)), /* @__PURE__ */ React69.createElement(
+    multiple && visibleTags.map((opt, i) => /* @__PURE__ */ React70.createElement("span", { key: i, className: "rf-autocomplete__tag" }, /* @__PURE__ */ React70.createElement("span", { style: { overflow: "hidden", textOverflow: "ellipsis" } }, getOptionLabel(opt)), /* @__PURE__ */ React70.createElement(
       "button",
       {
         type: "button",
@@ -2058,10 +2320,17 @@ function AutocompleteInner(props, _ref) {
         onClick: (e) => removeTag(opt, e),
         tabIndex: -1
       },
-      /* @__PURE__ */ React69.createElement(CloseSmIcon, { size: 12 })
+      /* @__PURE__ */ React70.createElement(CloseSmIcon, { size: 12 })
     ))),
-    hiddenCount > 0 && /* @__PURE__ */ React69.createElement("span", { className: "rf-autocomplete__tag-more" }, "+", hiddenCount, " more"),
-    /* @__PURE__ */ React69.createElement(
+    hiddenCount > 0 && /* @__PURE__ */ React70.createElement(
+      Tooltip,
+      {
+        title: selectedValues.slice(limitTags).map((o) => getOptionLabel(o)).join(", "),
+        placement: "top"
+      },
+      /* @__PURE__ */ React70.createElement("span", { className: "rf-autocomplete__tag-more" }, "+", hiddenCount, " more")
+    ),
+    /* @__PURE__ */ React70.createElement(
       "input",
       {
         ref: inputRef,
@@ -2083,9 +2352,9 @@ function AutocompleteInner(props, _ref) {
         "aria-autocomplete": "list"
       }
     ),
-    label && /* @__PURE__ */ React69.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, required && /* @__PURE__ */ React69.createElement("span", { className: "rf-text-field__asterisk" }, " *")),
-    variant === "outlined" && /* @__PURE__ */ React69.createElement("fieldset", { className: "rf-text-field__notch" }, label ? /* @__PURE__ */ React69.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React69.createElement("span", null, label, required ? " *" : "")) : /* @__PURE__ */ React69.createElement("legend", { className: "rf-text-field__legend--empty" })),
-    /* @__PURE__ */ React69.createElement("div", { className: "rf-autocomplete__endgroup" }, hasClearable && /* @__PURE__ */ React69.createElement(
+    label && /* @__PURE__ */ React70.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, required && /* @__PURE__ */ React70.createElement("span", { className: "rf-text-field__asterisk" }, " *")),
+    variant === "outlined" && /* @__PURE__ */ React70.createElement("fieldset", { className: "rf-text-field__notch" }, label ? /* @__PURE__ */ React70.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React70.createElement("span", null, label, required ? " *" : "")) : /* @__PURE__ */ React70.createElement("legend", { className: "rf-text-field__legend--empty" })),
+    /* @__PURE__ */ React70.createElement("div", { className: "rf-autocomplete__endgroup" }, hasClearable && /* @__PURE__ */ React70.createElement(
       "button",
       {
         type: "button",
@@ -2095,8 +2364,8 @@ function AutocompleteInner(props, _ref) {
         tabIndex: -1,
         "aria-label": "Clear"
       },
-      /* @__PURE__ */ React69.createElement(CloseSmIcon, { size: 16 })
-    ), !freeSolo && /* @__PURE__ */ React69.createElement(
+      /* @__PURE__ */ React70.createElement(CloseSmIcon, { size: 16 })
+    ), !freeSolo && /* @__PURE__ */ React70.createElement(
       "button",
       {
         type: "button",
@@ -2108,10 +2377,10 @@ function AutocompleteInner(props, _ref) {
         tabIndex: -1,
         "aria-label": open ? "Close" : "Open"
       },
-      /* @__PURE__ */ React69.createElement(ChevronDownIcon, null)
+      /* @__PURE__ */ React70.createElement(ChevronDownIcon, null)
     ))
-  ), helperText && /* @__PURE__ */ React69.createElement("div", { className: `rf-text-field__helper-text${error ? " rf-text-field__helper-text--error" : ""}` }, helperText), open && !disabled && ReactDOM2.createPortal(
-    /* @__PURE__ */ React69.createElement("div", { ref: popupRef, className: "rf-autocomplete__popup", role: "presentation", style: popupStyle }, loading ? /* @__PURE__ */ React69.createElement("div", { className: "rf-autocomplete__loading" }, /* @__PURE__ */ React69.createElement("span", { className: "rf-ac-spinner" }), loadingText) : flatEntries.length === 0 ? /* @__PURE__ */ React69.createElement("div", { className: "rf-autocomplete__no-options" }, noOptionsText) : /* @__PURE__ */ React69.createElement("ul", { ref: listRef, className: "rf-autocomplete__listbox", role: "listbox" }, groupBy ? (
+  ), helperText && /* @__PURE__ */ React70.createElement("div", { className: `rf-text-field__helper-text${error ? " rf-text-field__helper-text--error" : ""}` }, helperText), open && !disabled && ReactDOM3.createPortal(
+    /* @__PURE__ */ React70.createElement("div", { ref: popupRef, className: "rf-autocomplete__popup", role: "presentation", style: popupStyle }, loading ? /* @__PURE__ */ React70.createElement("div", { className: "rf-autocomplete__loading" }, /* @__PURE__ */ React70.createElement("span", { className: "rf-ac-spinner" }), loadingText) : flatEntries.length === 0 ? /* @__PURE__ */ React70.createElement("div", { className: "rf-autocomplete__no-options" }, noOptionsText) : /* @__PURE__ */ React70.createElement("ul", { ref: listRef, className: "rf-autocomplete__listbox", role: "listbox" }, groupBy ? (
       // Grouped render
       (() => {
         const rendered = [];
@@ -2121,7 +2390,7 @@ function AutocompleteInner(props, _ref) {
           if (entry.kind === "group") {
             if (groupItems.length > 0) {
               rendered.push(
-                /* @__PURE__ */ React69.createElement("li", { key: `g-${currentGroup}`, role: "presentation" }, /* @__PURE__ */ React69.createElement("div", { className: "rf-autocomplete__group-header" }, currentGroup), /* @__PURE__ */ React69.createElement("ul", { className: "rf-autocomplete__group-items", role: "group" }, groupItems))
+                /* @__PURE__ */ React70.createElement("li", { key: `g-${currentGroup}`, role: "presentation" }, /* @__PURE__ */ React70.createElement("div", { className: "rf-autocomplete__group-header" }, currentGroup), /* @__PURE__ */ React70.createElement("ul", { className: "rf-autocomplete__group-items", role: "group" }, groupItems))
               );
               groupItems = [];
             }
@@ -2132,7 +2401,7 @@ function AutocompleteInner(props, _ref) {
           }
           if (ei === flatEntries.length - 1 && groupItems.length > 0) {
             rendered.push(
-              /* @__PURE__ */ React69.createElement("li", { key: `g-${currentGroup}`, role: "presentation" }, /* @__PURE__ */ React69.createElement("div", { className: "rf-autocomplete__group-header" }, currentGroup), /* @__PURE__ */ React69.createElement("ul", { className: "rf-autocomplete__group-items", role: "group" }, groupItems))
+              /* @__PURE__ */ React70.createElement("li", { key: `g-${currentGroup}`, role: "presentation" }, /* @__PURE__ */ React70.createElement("div", { className: "rf-autocomplete__group-header" }, currentGroup), /* @__PURE__ */ React70.createElement("ul", { className: "rf-autocomplete__group-items", role: "group" }, groupItems))
             );
           }
         });
@@ -2146,7 +2415,7 @@ function AutocompleteInner(props, _ref) {
     const focused = focusedIdx === flatIdx;
     const optDisabled = getOptionDisabled?.(option) ?? false;
     const label2 = getOptionLabel(option);
-    return /* @__PURE__ */ React69.createElement(
+    return /* @__PURE__ */ React70.createElement(
       "li",
       {
         key: label2 + flatIdx,
@@ -2165,12 +2434,12 @@ function AutocompleteInner(props, _ref) {
         onMouseDown: (e) => e.preventDefault(),
         onClick: (e) => selectOption(option, e)
       },
-      renderOption ? renderOption(option, { selected, focused, index: flatIdx }) : /* @__PURE__ */ React69.createElement("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, label2),
-      !renderOption && /* @__PURE__ */ React69.createElement("span", { className: "rf-autocomplete__option-check" }, /* @__PURE__ */ React69.createElement(CheckIcon, null))
+      renderOption ? renderOption(option, { selected, focused, index: flatIdx }) : /* @__PURE__ */ React70.createElement("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, label2),
+      !renderOption && /* @__PURE__ */ React70.createElement("span", { className: "rf-autocomplete__option-check" }, /* @__PURE__ */ React70.createElement(CheckIcon, null))
     );
   }
 }
-var Autocomplete = React69.forwardRef(AutocompleteInner);
+var Autocomplete = React70.forwardRef(AutocompleteInner);
 Autocomplete.displayName = "Autocomplete";
 
 // lib/TextFields/AddressLookup.tsx
@@ -2187,16 +2456,16 @@ var AddressLookup = ({
   token = ""
 }) => {
   const { theme } = useRufousTheme();
-  const [suggestions, setSuggestions] = useState5([]);
-  const [loading, setLoading] = useState5(false);
-  const [showSuggestions, setShowSuggestions] = useState5(false);
-  const debounceTimeout = useRef4(null);
-  const containerRef = useRef4(null);
+  const [suggestions, setSuggestions] = useState6([]);
+  const [loading, setLoading] = useState6(false);
+  const [showSuggestions, setShowSuggestions] = useState6(false);
+  const debounceTimeout = useRef5(null);
+  const containerRef = useRef5(null);
   const apiKey = token || "";
   const countries = Country.getAllCountries();
-  const [states, setStates] = useState5([]);
-  const [cities, setCities] = useState5([]);
-  useEffect5(() => {
+  const [states, setStates] = useState6([]);
+  const [cities, setCities] = useState6([]);
+  useEffect6(() => {
     const handleClickOutside = (event) => {
       if (containerRef.current && !containerRef.current.contains(event.target)) {
         setShowSuggestions(false);
@@ -2205,7 +2474,7 @@ var AddressLookup = ({
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  useEffect5(() => {
+  useEffect6(() => {
     if (value.country) {
       const country = countries.find((c) => c.name === value.country);
       if (country) {
@@ -2218,7 +2487,7 @@ var AddressLookup = ({
       setStates([]);
     }
   }, [value.country]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (value.state && value.country) {
       const country = countries.find((c) => c.name === value.country);
       if (country) {
@@ -2323,7 +2592,7 @@ var AddressLookup = ({
       city: ""
     });
   };
-  return /* @__PURE__ */ React70.createElement("div", { className: "address-lookup-container", style: sx, ref: containerRef }, /* @__PURE__ */ React70.createElement("div", { className: `address-lookup-grid address-lookup-grid-${layout}` }, /* @__PURE__ */ React70.createElement("div", { className: "address-lookup-grid-item col-l1" }, /* @__PURE__ */ React70.createElement(
+  return /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-container", style: sx, ref: containerRef }, /* @__PURE__ */ React71.createElement("div", { className: `address-lookup-grid address-lookup-grid-${layout}` }, /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-l1" }, /* @__PURE__ */ React71.createElement(
     TextField,
     {
       label,
@@ -2355,7 +2624,7 @@ var AddressLookup = ({
       },
       onFocus: () => suggestions.length > 0 && setShowSuggestions(true)
     }
-  ), loading && /* @__PURE__ */ React70.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ React70.createElement(circularProgress_default, { size: 20 })), showSuggestions && suggestions.length > 0 && /* @__PURE__ */ React70.createElement("div", { className: "autocomplete-dropdown" }, suggestions.map((option, idx) => /* @__PURE__ */ React70.createElement(
+  ), loading && /* @__PURE__ */ React71.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ React71.createElement(circularProgress_default, { size: 20 })), showSuggestions && suggestions.length > 0 && /* @__PURE__ */ React71.createElement("div", { className: "autocomplete-dropdown" }, suggestions.map((option, idx) => /* @__PURE__ */ React71.createElement(
     "div",
     {
       key: idx,
@@ -2366,9 +2635,9 @@ var AddressLookup = ({
         fetchPlaceDetails(option.placePrediction.placeId, mainText);
       }
     },
-    /* @__PURE__ */ React70.createElement("div", { className: "autocomplete-main-text" }, option?.placePrediction?.structuredFormat?.mainText?.text),
-    /* @__PURE__ */ React70.createElement("div", { className: "autocomplete-secondary-text" }, option?.placePrediction?.structuredFormat?.secondaryText?.text)
-  ))), error.addressLine1 && /* @__PURE__ */ React70.createElement("div", { className: "field-error-text" }, error.addressLine1)), layout === "compact" && /* @__PURE__ */ React70.createElement("div", { className: "address-lookup-grid-item col-l2" }, /* @__PURE__ */ React70.createElement(
+    /* @__PURE__ */ React71.createElement("div", { className: "autocomplete-main-text" }, option?.placePrediction?.structuredFormat?.mainText?.text),
+    /* @__PURE__ */ React71.createElement("div", { className: "autocomplete-secondary-text" }, option?.placePrediction?.structuredFormat?.secondaryText?.text)
+  ))), error.addressLine1 && /* @__PURE__ */ React71.createElement("div", { className: "field-error-text" }, error.addressLine1)), layout === "compact" && /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-l2" }, /* @__PURE__ */ React71.createElement(
     TextField,
     {
       label: "Address Line 2",
@@ -2377,7 +2646,7 @@ var AddressLookup = ({
       value: value.addressLine2 || "",
       onChange: (e) => handleChange("addressLine2", e.target.value)
     }
-  )), layout !== "compact" && /* @__PURE__ */ React70.createElement("div", { className: "address-lookup-grid-item col-l2" }, /* @__PURE__ */ React70.createElement(
+  )), layout !== "compact" && /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-l2" }, /* @__PURE__ */ React71.createElement(
     TextField,
     {
       label: "Address Line 2",
@@ -2386,7 +2655,7 @@ var AddressLookup = ({
       value: value.addressLine2 || "",
       onChange: (e) => handleChange("addressLine2", e.target.value)
     }
-  )), /* @__PURE__ */ React70.createElement("div", { className: "address-lookup-grid-item col-country" }, /* @__PURE__ */ React70.createElement(
+  )), /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-country" }, /* @__PURE__ */ React71.createElement(
     Autocomplete,
     {
       options: countries.map((c) => c.name),
@@ -2397,7 +2666,7 @@ var AddressLookup = ({
       required,
       error: !!error.country
     }
-  ), error.country && /* @__PURE__ */ React70.createElement("div", { className: "field-error-text" }, error.country)), /* @__PURE__ */ React70.createElement("div", { className: "address-lookup-grid-item col-state" }, /* @__PURE__ */ React70.createElement(
+  ), error.country && /* @__PURE__ */ React71.createElement("div", { className: "field-error-text" }, error.country)), /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-state" }, /* @__PURE__ */ React71.createElement(
     Autocomplete,
     {
       options: states.map((s2) => s2.name),
@@ -2408,7 +2677,7 @@ var AddressLookup = ({
       required,
       error: !!error.state
     }
-  ), error.state && /* @__PURE__ */ React70.createElement("div", { className: "field-error-text" }, error.state)), /* @__PURE__ */ React70.createElement("div", { className: "address-lookup-grid-item col-city" }, /* @__PURE__ */ React70.createElement(
+  ), error.state && /* @__PURE__ */ React71.createElement("div", { className: "field-error-text" }, error.state)), /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-city" }, /* @__PURE__ */ React71.createElement(
     Autocomplete,
     {
       options: cities.map((c) => c.name),
@@ -2419,7 +2688,7 @@ var AddressLookup = ({
       required,
       error: !!error.city
     }
-  ), error.city && /* @__PURE__ */ React70.createElement("div", { className: "field-error-text" }, error.city)), /* @__PURE__ */ React70.createElement("div", { className: "address-lookup-grid-item col-pin" }, /* @__PURE__ */ React70.createElement(
+  ), error.city && /* @__PURE__ */ React71.createElement("div", { className: "field-error-text" }, error.city)), /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-pin" }, /* @__PURE__ */ React71.createElement(
     TextField,
     {
       label: "Pincode",
@@ -2429,16 +2698,16 @@ var AddressLookup = ({
       required,
       onChange: (e) => handleChange("pincode", e.target.value)
     }
-  ), error.pincode && /* @__PURE__ */ React70.createElement("div", { className: "field-error-text" }, error.pincode))));
+  ), error.pincode && /* @__PURE__ */ React71.createElement("div", { className: "field-error-text" }, error.pincode))));
 };
 var AddressLookup_default = AddressLookup;
 
 // lib/TextFields/DateField.tsx
-import React71, {
-  useState as useState6,
-  useRef as useRef5,
-  useEffect as useEffect6,
-  useCallback as useCallback2
+import React72, {
+  useState as useState7,
+  useRef as useRef6,
+  useEffect as useEffect7,
+  useCallback as useCallback3
 } from "react";
 import { createPortal } from "react-dom";
 var WEEKDAYS = ["SU", "MO", "TU", "WE", "TH", "FR", "SA"];
@@ -2600,25 +2869,25 @@ var parseTimeFromISO = (iso) => {
   if (h === 0) h = 12;
   return { h, m, ampm };
 };
-var CalendarIcon = () => /* @__PURE__ */ React71.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React71.createElement("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2" }), /* @__PURE__ */ React71.createElement("line", { x1: "16", y1: "2", x2: "16", y2: "6" }), /* @__PURE__ */ React71.createElement("line", { x1: "8", y1: "2", x2: "8", y2: "6" }), /* @__PURE__ */ React71.createElement("line", { x1: "3", y1: "10", x2: "21", y2: "10" }));
-var ChevUp = () => /* @__PURE__ */ React71.createElement("svg", { width: "10", height: "7", viewBox: "0 0 10 7", fill: "currentColor" }, /* @__PURE__ */ React71.createElement("path", { d: "M5 0L10 7H0L5 0Z" }));
-var ChevDown = () => /* @__PURE__ */ React71.createElement("svg", { width: "10", height: "7", viewBox: "0 0 10 7", fill: "currentColor" }, /* @__PURE__ */ React71.createElement("path", { d: "M5 7L0 0H10L5 7Z" }));
+var CalendarIcon = () => /* @__PURE__ */ React72.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React72.createElement("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2" }), /* @__PURE__ */ React72.createElement("line", { x1: "16", y1: "2", x2: "16", y2: "6" }), /* @__PURE__ */ React72.createElement("line", { x1: "8", y1: "2", x2: "8", y2: "6" }), /* @__PURE__ */ React72.createElement("line", { x1: "3", y1: "10", x2: "21", y2: "10" }));
+var ChevUp = () => /* @__PURE__ */ React72.createElement("svg", { width: "10", height: "7", viewBox: "0 0 10 7", fill: "currentColor" }, /* @__PURE__ */ React72.createElement("path", { d: "M5 0L10 7H0L5 0Z" }));
+var ChevDown = () => /* @__PURE__ */ React72.createElement("svg", { width: "10", height: "7", viewBox: "0 0 10 7", fill: "currentColor" }, /* @__PURE__ */ React72.createElement("path", { d: "M5 7L0 0H10L5 7Z" }));
 var ITEM_H = 36;
 var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
-  const listRef = useRef5(null);
-  const isInternalScroll = useRef5(false);
-  const scrollTimeout = useRef5(null);
+  const listRef = useRef6(null);
+  const isInternalScroll = useRef6(false);
+  const scrollTimeout = useRef6(null);
   const MULTIPLIER = infinite ? 100 : 1;
   const virtualItems = infinite ? Array(MULTIPLIER).fill(items).flat() : items;
   const centerOffset = infinite ? Math.floor(MULTIPLIER / 2) * items.length : 0;
   const VISUAL_OFFSET = 54;
-  useEffect6(() => {
+  useEffect7(() => {
     if (listRef.current) {
       const targetIndex = centerOffset + selected;
       listRef.current.scrollTop = targetIndex * ITEM_H - (infinite ? VISUAL_OFFSET : 0);
     }
   }, [centerOffset, infinite, selected]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (listRef.current && !isInternalScroll.current) {
       const targetIndex = centerOffset + selected;
       listRef.current.scrollTo({
@@ -2650,15 +2919,15 @@ var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
       }
     }, 100);
   };
-  return /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__col-wrapper" }, /* @__PURE__ */ React71.createElement(
+  return /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__col-wrapper" }, /* @__PURE__ */ React72.createElement(
     "div",
     {
       className: "rf-timescroll__col",
       ref: listRef,
       onScroll: handleScroll
     },
-    !infinite && /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__spacer" }),
-    virtualItems.map((label, idx) => /* @__PURE__ */ React71.createElement(
+    !infinite && /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__spacer" }),
+    virtualItems.map((label, idx) => /* @__PURE__ */ React72.createElement(
       "div",
       {
         key: `${label}-${idx}`,
@@ -2666,8 +2935,8 @@ var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
       },
       label
     )),
-    !infinite && /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__spacer" })
-  ), /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__mask rf-timescroll__mask--top" }), /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__mask rf-timescroll__mask--bottom" }));
+    !infinite && /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__spacer" })
+  ), /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__mask rf-timescroll__mask--top" }), /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__mask rf-timescroll__mask--bottom" }));
 };
 var SpinnerPanel = ({
   hour,
@@ -2678,7 +2947,7 @@ var SpinnerPanel = ({
   onHourInput,
   onMinuteInput,
   onAmpmToggle
-}) => /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__time-row" }, /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__time-input-wrap" }, /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onHourChange(1) }, /* @__PURE__ */ React71.createElement(ChevUp, null)), /* @__PURE__ */ React71.createElement(
+}) => /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__time-row" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__time-input-wrap" }, /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onHourChange(1) }, /* @__PURE__ */ React72.createElement(ChevUp, null)), /* @__PURE__ */ React72.createElement(
   "input",
   {
     type: "number",
@@ -2689,7 +2958,7 @@ var SpinnerPanel = ({
     onChange: onHourInput,
     onMouseDown: (e) => e.stopPropagation()
   }
-), /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onHourChange(-1) }, /* @__PURE__ */ React71.createElement(ChevDown, null))), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__time-colon" }, ":"), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__time-input-wrap" }, /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onMinuteChange(1) }, /* @__PURE__ */ React71.createElement(ChevUp, null)), /* @__PURE__ */ React71.createElement(
+), /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onHourChange(-1) }, /* @__PURE__ */ React72.createElement(ChevDown, null))), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__time-colon" }, ":"), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__time-input-wrap" }, /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onMinuteChange(1) }, /* @__PURE__ */ React72.createElement(ChevUp, null)), /* @__PURE__ */ React72.createElement(
   "input",
   {
     type: "number",
@@ -2700,7 +2969,7 @@ var SpinnerPanel = ({
     onChange: onMinuteInput,
     onMouseDown: (e) => e.stopPropagation()
   }
-), /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onMinuteChange(-1) }, /* @__PURE__ */ React71.createElement(ChevDown, null))), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__ampm" }, /* @__PURE__ */ React71.createElement(
+), /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onMinuteChange(-1) }, /* @__PURE__ */ React72.createElement(ChevDown, null))), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__ampm" }, /* @__PURE__ */ React72.createElement(
   "button",
   {
     type: "button",
@@ -2709,7 +2978,7 @@ var SpinnerPanel = ({
     onClick: () => onAmpmToggle("AM")
   },
   "AM"
-), /* @__PURE__ */ React71.createElement(
+), /* @__PURE__ */ React72.createElement(
   "button",
   {
     type: "button",
@@ -2731,7 +3000,7 @@ var CalendarBody = ({
   onMonthSelect,
   onYearSelect
 }) => {
-  const [pickerView, setPickerView] = useState6("calendar");
+  const [pickerView, setPickerView] = useState7("calendar");
   const handleMonthClick = () => {
     setPickerView(pickerView === "month" ? "calendar" : "month");
   };
@@ -2749,21 +3018,21 @@ var CalendarBody = ({
   const currentYear = todayDate.getFullYear();
   const yearStart = viewYear - 6;
   const years = Array.from({ length: 16 }, (_, i) => yearStart + i);
-  return /* @__PURE__ */ React71.createElement(React71.Fragment, null, /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__header" }, /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__header-labels" }, /* @__PURE__ */ React71.createElement(
+  return /* @__PURE__ */ React72.createElement(React72.Fragment, null, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__header" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__header-labels" }, /* @__PURE__ */ React72.createElement(
     "span",
     {
       className: `rf-date-picker__month-label ${pickerView === "month" ? "rf-date-picker__month-label--active" : ""}`,
       onClick: handleMonthClick
     },
     MONTHS[viewMonth]
-  ), /* @__PURE__ */ React71.createElement(
+  ), /* @__PURE__ */ React72.createElement(
     "span",
     {
       className: `rf-date-picker__year-label ${pickerView === "year" ? "rf-date-picker__year-label--active" : ""}`,
       onClick: handleYearClick
     },
     viewYear
-  )), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__nav" }, pickerView === "year" ? /* @__PURE__ */ React71.createElement(React71.Fragment, null, /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: () => onYearSelect(viewYear - 16), "aria-label": "Previous years" }, "\u2039"), /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: () => onYearSelect(viewYear + 16), "aria-label": "Next years" }, "\u203A")) : /* @__PURE__ */ React71.createElement(React71.Fragment, null, /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: onPrev, "aria-label": "Previous month" }, "\u2039"), /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: onNext, "aria-label": "Next month" }, "\u203A")))), pickerView === "month" && /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__month-grid" }, MONTHS_SHORT.map((m, idx) => /* @__PURE__ */ React71.createElement(
+  )), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__nav" }, pickerView === "year" ? /* @__PURE__ */ React72.createElement(React72.Fragment, null, /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: () => onYearSelect(viewYear - 16), "aria-label": "Previous years" }, "\u2039"), /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: () => onYearSelect(viewYear + 16), "aria-label": "Next years" }, "\u203A")) : /* @__PURE__ */ React72.createElement(React72.Fragment, null, /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: onPrev, "aria-label": "Previous month" }, "\u2039"), /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: onNext, "aria-label": "Next month" }, "\u203A")))), pickerView === "month" && /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__month-grid" }, MONTHS_SHORT.map((m, idx) => /* @__PURE__ */ React72.createElement(
     "button",
     {
       key: m,
@@ -2776,7 +3045,7 @@ var CalendarBody = ({
       onClick: () => handleMonthPick(idx)
     },
     m
-  ))), pickerView === "year" && /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__year-grid" }, years.map((y) => /* @__PURE__ */ React71.createElement(
+  ))), pickerView === "year" && /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__year-grid" }, years.map((y) => /* @__PURE__ */ React72.createElement(
     "button",
     {
       key: y,
@@ -2789,12 +3058,12 @@ var CalendarBody = ({
       onClick: () => handleYearPick(y)
     },
     y
-  ))), pickerView === "calendar" && /* @__PURE__ */ React71.createElement(React71.Fragment, null, /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__weekdays" }, WEEKDAYS.map((w) => /* @__PURE__ */ React71.createElement("div", { key: w, className: "rf-date-picker__weekday" }, w))), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__grid" }, dayCells.map((day, idx) => {
-    if (day === null) return /* @__PURE__ */ React71.createElement("div", { key: `e-${idx}`, className: "rf-date-picker__day rf-date-picker__day--empty" });
+  ))), pickerView === "calendar" && /* @__PURE__ */ React72.createElement(React72.Fragment, null, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__weekdays" }, WEEKDAYS.map((w) => /* @__PURE__ */ React72.createElement("div", { key: w, className: "rf-date-picker__weekday" }, w))), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__grid" }, dayCells.map((day, idx) => {
+    if (day === null) return /* @__PURE__ */ React72.createElement("div", { key: `e-${idx}`, className: "rf-date-picker__day rf-date-picker__day--empty" });
     const cellDate = new Date(viewYear, viewMonth, day);
     const isSelected = selectedDate ? isSameDay(cellDate, selectedDate) : false;
     const isToday = isSameDay(cellDate, todayDate);
-    return /* @__PURE__ */ React71.createElement(
+    return /* @__PURE__ */ React72.createElement(
       "button",
       {
         key: day,
@@ -2830,29 +3099,29 @@ var DateField = ({
   sx
 }) => {
   const sxClass = useSx(sx);
-  const [open, setOpen] = useState6(false);
-  const [selectedDate, setSelectedDate] = useState6(() => value ? isoToDate(value) : null);
-  const [hour, setHour] = useState6(() => {
+  const [open, setOpen] = useState7(false);
+  const [selectedDate, setSelectedDate] = useState7(() => value ? isoToDate(value) : null);
+  const [hour, setHour] = useState7(() => {
     if (value && isDatetimeType(type)) return parseTimeFromISO(value).h;
     return 12;
   });
-  const [minute, setMinute] = useState6(() => {
+  const [minute, setMinute] = useState7(() => {
     if (value && isDatetimeType(type)) return parseTimeFromISO(value).m;
     return 0;
   });
-  const [ampm, setAmpm] = useState6(() => {
+  const [ampm, setAmpm] = useState7(() => {
     if (value && isDatetimeType(type)) return parseTimeFromISO(value).ampm;
     return "AM";
   });
-  const [viewYear, setViewYear] = useState6(() => {
+  const [viewYear, setViewYear] = useState7(() => {
     const base = value ? isoToDate(value) : null;
     return base ? base.getFullYear() : today().getFullYear();
   });
-  const [viewMonth, setViewMonth] = useState6(() => {
+  const [viewMonth, setViewMonth] = useState7(() => {
     const base = value ? isoToDate(value) : null;
     return base ? base.getMonth() : today().getMonth();
   });
-  const [inputStr, setInputStr] = useState6(() => {
+  const [inputStr, setInputStr] = useState7(() => {
     if (!value) return "";
     const d = isoToDate(value);
     if (!d) return "";
@@ -2866,12 +3135,12 @@ var DateField = ({
   const HOURS = Array.from({ length: 12 }, (_, i) => String(i + 1).padStart(2, "0"));
   const MINUTES = Array.from({ length: 60 }, (_, i) => String(i).padStart(2, "0"));
   const AMPMS = ["AM", "PM"];
-  const containerRef = useRef5(null);
-  const pickerRef = useRef5(null);
-  const [dropUp, setDropUp] = useState6(false);
-  const inputId = useRef5(`rf-df-${Math.random().toString(36).substring(2, 11)}`).current;
-  const isInternalChange = useRef5(false);
-  useEffect6(() => {
+  const containerRef = useRef6(null);
+  const pickerRef = useRef6(null);
+  const [dropUp, setDropUp] = useState7(false);
+  const inputId = useRef6(`rf-df-${Math.random().toString(36).substring(2, 11)}`).current;
+  const isInternalChange = useRef6(false);
+  useEffect7(() => {
     if (value === void 0) return;
     if (isInternalChange.current) {
       isInternalChange.current = false;
@@ -2898,7 +3167,7 @@ var DateField = ({
       setInputStr(str);
     }
   }, [value, type]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (!open) return;
     const handler = (e) => {
       const target = e.target;
@@ -2909,14 +3178,14 @@ var DateField = ({
     document.addEventListener("mousedown", handler);
     return () => document.removeEventListener("mousedown", handler);
   }, [open]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (!open || !containerRef.current) return;
     const rect = containerRef.current.getBoundingClientRect();
     const spaceBelow = window.innerHeight - rect.bottom;
     const pickerHeight = 400;
     setDropUp(spaceBelow < pickerHeight && rect.top > pickerHeight);
   }, [open]);
-  const commitDate = useCallback2((d, h, m, ap) => {
+  const commitDate = useCallback3((d, h, m, ap) => {
     setSelectedDate(d);
     if (!d) {
       setInputStr("");
@@ -3067,7 +3336,7 @@ var DateField = ({
   const inputPlaceholder = placeholder || (variant === "outlined" ? " " : void 0);
   const todayDate = today();
   const isSideVariant = type === "datetime-side" || type === "datetime-scroll";
-  return /* @__PURE__ */ React71.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React71.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React71.createElement(
+  return /* @__PURE__ */ React72.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React72.createElement(
     "div",
     {
       className: "rf-text-field__wrapper",
@@ -3076,7 +3345,7 @@ var DateField = ({
       },
       style: { cursor: disabled ? "default" : "pointer" }
     },
-    /* @__PURE__ */ React71.createElement(
+    /* @__PURE__ */ React72.createElement(
       "input",
       {
         id: inputId,
@@ -3092,7 +3361,7 @@ var DateField = ({
         }
       }
     ),
-    /* @__PURE__ */ React71.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React71.createElement(
+    /* @__PURE__ */ React72.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React72.createElement(
       "button",
       {
         type: "button",
@@ -3105,12 +3374,12 @@ var DateField = ({
         },
         "aria-label": "Pick date"
       },
-      /* @__PURE__ */ React71.createElement(CalendarIcon, null)
+      /* @__PURE__ */ React72.createElement(CalendarIcon, null)
     )),
-    label && /* @__PURE__ */ React71.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React71.createElement("span", { className: "rf-text-field__asterisk" }, "*")),
-    variant === "outlined" && /* @__PURE__ */ React71.createElement("fieldset", { className: "rf-text-field__notch" }, label && /* @__PURE__ */ React71.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React71.createElement("span", null, label, required ? " *" : "")))
+    label && /* @__PURE__ */ React72.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React72.createElement("span", { className: "rf-text-field__asterisk" }, "*")),
+    variant === "outlined" && /* @__PURE__ */ React72.createElement("fieldset", { className: "rf-text-field__notch" }, label && /* @__PURE__ */ React72.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React72.createElement("span", null, label, required ? " *" : "")))
   ), open && !disabled && createPortal(
-    /* @__PURE__ */ React71.createElement(
+    /* @__PURE__ */ React72.createElement(
       "div",
       {
         ref: pickerRef,
@@ -3135,7 +3404,7 @@ var DateField = ({
         })(),
         onMouseDown: (e) => e.preventDefault()
       },
-      /* @__PURE__ */ React71.createElement("div", { className: isSideVariant ? "rf-date-picker__cal-col" : void 0 }, /* @__PURE__ */ React71.createElement(
+      /* @__PURE__ */ React72.createElement("div", { className: isSideVariant ? "rf-date-picker__cal-col" : void 0 }, /* @__PURE__ */ React72.createElement(
         CalendarBody,
         {
           viewMonth,
@@ -3149,7 +3418,7 @@ var DateField = ({
           onMonthSelect: setViewMonth,
           onYearSelect: setViewYear
         }
-      ), type === "datetime" && /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__time-section" }, /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__time-label" }, "Time"), /* @__PURE__ */ React71.createElement(
+      ), type === "datetime" && /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__time-section" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__time-label" }, "Time"), /* @__PURE__ */ React72.createElement(
         SpinnerPanel,
         {
           hour,
@@ -3161,8 +3430,8 @@ var DateField = ({
           onMinuteInput: handleMinuteInput,
           onAmpmToggle: handleAmpmToggle
         }
-      )), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__divider" }), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__footer" }, /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-date-picker__footer-btn", onClick: handleToday }, "Today"), /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-date-picker__footer-btn rf-date-picker__footer-btn--clear", onClick: handleClear }, "Clear"))),
-      type === "datetime-side" && /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__side-panel" }, /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__side-label" }, "Time"), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__side-spinner" }, /* @__PURE__ */ React71.createElement(
+      )), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__divider" }), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__footer" }, /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-date-picker__footer-btn", onClick: handleToday }, "Today"), /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-date-picker__footer-btn rf-date-picker__footer-btn--clear", onClick: handleClear }, "Clear"))),
+      type === "datetime-side" && /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__side-panel" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__side-label" }, "Time"), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__side-spinner" }, /* @__PURE__ */ React72.createElement(
         SpinnerPanel,
         {
           hour,
@@ -3174,22 +3443,22 @@ var DateField = ({
           onMinuteInput: handleMinuteInput,
           onAmpmToggle: handleAmpmToggle
         }
-      )), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm)),
-      type === "datetime-scroll" && /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__side-panel" }, /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__side-label" }, "Time"), /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll" }, /* @__PURE__ */ React71.createElement(
+      )), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm)),
+      type === "datetime-scroll" && /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__side-panel" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__side-label" }, "Time"), /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll" }, /* @__PURE__ */ React72.createElement(
         ScrollColumn,
         {
           items: HOURS,
           selected: hour - 1,
           onSelect: handleScrollHour
         }
-      ), /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__colon" }, ":"), /* @__PURE__ */ React71.createElement(
+      ), /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__colon" }, ":"), /* @__PURE__ */ React72.createElement(
         ScrollColumn,
         {
           items: MINUTES,
           selected: minute,
           onSelect: handleScrollMinute
         }
-      ), /* @__PURE__ */ React71.createElement(
+      ), /* @__PURE__ */ React72.createElement(
         ScrollColumn,
         {
           items: AMPMS,
@@ -3197,18 +3466,18 @@ var DateField = ({
           onSelect: handleScrollAmpm,
           infinite: false
         }
-      )), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm))
+      )), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm))
     ),
     document.body
-  )), helperText && /* @__PURE__ */ React71.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
+  )), helperText && /* @__PURE__ */ React72.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
 };
 DateField.displayName = "DateField";
 
 // lib/TextFields/DateRangeField.tsx
-import React72, {
-  useState as useState7,
-  useRef as useRef6,
-  useEffect as useEffect7
+import React73, {
+  useState as useState8,
+  useRef as useRef7,
+  useEffect as useEffect8
 } from "react";
 var WEEKDAYS2 = ["SU", "MO", "TU", "WE", "TH", "FR", "SA"];
 var MONTHS2 = [
@@ -3334,7 +3603,7 @@ var detectPreset = (start, end) => {
   if (isSameDay2(start, new Date(2e3, 0, 1)) && isSameDay2(end, today2)) return "all";
   return null;
 };
-var CalendarIcon2 = () => /* @__PURE__ */ React72.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React72.createElement("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2" }), /* @__PURE__ */ React72.createElement("line", { x1: "16", y1: "2", x2: "16", y2: "6" }), /* @__PURE__ */ React72.createElement("line", { x1: "8", y1: "2", x2: "8", y2: "6" }), /* @__PURE__ */ React72.createElement("line", { x1: "3", y1: "10", x2: "21", y2: "10" }));
+var CalendarIcon2 = () => /* @__PURE__ */ React73.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React73.createElement("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2" }), /* @__PURE__ */ React73.createElement("line", { x1: "16", y1: "2", x2: "16", y2: "6" }), /* @__PURE__ */ React73.createElement("line", { x1: "8", y1: "2", x2: "8", y2: "6" }), /* @__PURE__ */ React73.createElement("line", { x1: "3", y1: "10", x2: "21", y2: "10" }));
 var RangeCalendarBody = ({
   viewYear,
   viewMonth,
@@ -3359,7 +3628,7 @@ var RangeCalendarBody = ({
   const hasRange = startDate != null && effectiveEnd != null && !isSameDay2(startDate, effectiveEnd);
   const lo = startDate && effectiveEnd ? startDate <= effectiveEnd ? startDate : effectiveEnd : null;
   const hi = startDate && effectiveEnd ? startDate <= effectiveEnd ? effectiveEnd : startDate : null;
-  return /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-calendar" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-calendar__header" }, /* @__PURE__ */ React72.createElement(
+  return /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-calendar" }, /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-calendar__header" }, /* @__PURE__ */ React73.createElement(
     "button",
     {
       type: "button",
@@ -3369,7 +3638,7 @@ var RangeCalendarBody = ({
       "aria-label": "Previous month"
     },
     "\u2039"
-  ), /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-calendar__month-label" }, MONTHS2[viewMonth], " ", viewYear), /* @__PURE__ */ React72.createElement(
+  ), /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-calendar__month-label" }, MONTHS2[viewMonth], " ", viewYear), /* @__PURE__ */ React73.createElement(
     "button",
     {
       type: "button",
@@ -3379,9 +3648,9 @@ var RangeCalendarBody = ({
       "aria-label": "Next month"
     },
     "\u203A"
-  )), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-calendar__weekdays" }, WEEKDAYS2.map((w) => /* @__PURE__ */ React72.createElement("div", { key: w, className: "rf-dr-calendar__weekday" }, w))), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-calendar__grid" }, dayCells.map((day, idx) => {
+  )), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-calendar__weekdays" }, WEEKDAYS2.map((w) => /* @__PURE__ */ React73.createElement("div", { key: w, className: "rf-dr-calendar__weekday" }, w))), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-calendar__grid" }, dayCells.map((day, idx) => {
     if (day === null) {
-      return /* @__PURE__ */ React72.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
+      return /* @__PURE__ */ React73.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
     }
     const cellDate = new Date(viewYear, viewMonth, day);
     const isStart = startDate ? isSameDay2(cellDate, startDate) : false;
@@ -3401,7 +3670,7 @@ var RangeCalendarBody = ({
       isStart || isEnd ? "rf-dr-calendar__day--selected" : "",
       isToday && !isStart && !isEnd ? "rf-dr-calendar__day--today" : ""
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ React72.createElement(
+    return /* @__PURE__ */ React73.createElement(
       "div",
       {
         key: day,
@@ -3409,7 +3678,7 @@ var RangeCalendarBody = ({
         onMouseEnter: () => onDayHover(cellDate),
         onMouseLeave: () => onDayHover(null)
       },
-      /* @__PURE__ */ React72.createElement(
+      /* @__PURE__ */ React73.createElement(
         "button",
         {
           type: "button",
@@ -3423,8 +3692,8 @@ var RangeCalendarBody = ({
 };
 var MiniCalendar = ({ selectedDate, todayDate, onSelect, onClose }) => {
   const init = selectedDate ?? todayDate;
-  const [viewYear, setViewYear] = useState7(init.getFullYear());
-  const [viewMonth, setViewMonth] = useState7(init.getMonth());
+  const [viewYear, setViewYear] = useState8(init.getFullYear());
+  const [viewMonth, setViewMonth] = useState8(init.getMonth());
   const firstDay = new Date(viewYear, viewMonth, 1).getDay();
   const daysInMonth = new Date(viewYear, viewMonth + 1, 0).getDate();
   const dayCells = [
@@ -3443,14 +3712,14 @@ var MiniCalendar = ({ selectedDate, todayDate, onSelect, onClose }) => {
       setViewYear((y) => y + 1);
     } else setViewMonth((m) => m + 1);
   };
-  return /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-mini-cal" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-mini-cal__header" }, /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-dr-calendar__nav-btn", onClick: prevMonth }, "\u2039"), /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-calendar__month-label", style: { fontSize: "0.88rem" } }, MONTHS2[viewMonth], " ", viewYear), /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-dr-calendar__nav-btn", onClick: nextMonth }, "\u203A")), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-calendar__weekdays" }, WEEKDAYS2.map((w) => /* @__PURE__ */ React72.createElement("div", { key: w, className: "rf-dr-calendar__weekday" }, w))), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-calendar__grid" }, dayCells.map((day, idx) => {
+  return /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-mini-cal" }, /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-mini-cal__header" }, /* @__PURE__ */ React73.createElement("button", { type: "button", className: "rf-dr-calendar__nav-btn", onClick: prevMonth }, "\u2039"), /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-calendar__month-label", style: { fontSize: "0.88rem" } }, MONTHS2[viewMonth], " ", viewYear), /* @__PURE__ */ React73.createElement("button", { type: "button", className: "rf-dr-calendar__nav-btn", onClick: nextMonth }, "\u203A")), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-calendar__weekdays" }, WEEKDAYS2.map((w) => /* @__PURE__ */ React73.createElement("div", { key: w, className: "rf-dr-calendar__weekday" }, w))), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-calendar__grid" }, dayCells.map((day, idx) => {
     if (day === null) {
-      return /* @__PURE__ */ React72.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
+      return /* @__PURE__ */ React73.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
     }
     const cellDate = new Date(viewYear, viewMonth, day);
     const isSel = selectedDate ? isSameDay2(cellDate, selectedDate) : false;
     const isToday = isSameDay2(cellDate, todayDate);
-    return /* @__PURE__ */ React72.createElement("div", { key: day, className: "rf-dr-calendar__cell" }, /* @__PURE__ */ React72.createElement(
+    return /* @__PURE__ */ React73.createElement("div", { key: day, className: "rf-dr-calendar__cell" }, /* @__PURE__ */ React73.createElement(
       "button",
       {
         type: "button",
@@ -3489,22 +3758,22 @@ var DateRangeField = ({
   const today2 = todayFn();
   const committedStart = value?.start ? isoToDate2(value.start) : null;
   const committedEnd = value?.end ? isoToDate2(value.end) : null;
-  const [open, setOpen] = useState7(false);
-  const [draftStart, setDraftStart] = useState7(committedStart);
-  const [draftEnd, setDraftEnd] = useState7(committedEnd);
-  const [activePreset, setActivePreset] = useState7(
+  const [open, setOpen] = useState8(false);
+  const [draftStart, setDraftStart] = useState8(committedStart);
+  const [draftEnd, setDraftEnd] = useState8(committedEnd);
+  const [activePreset, setActivePreset] = useState8(
     () => detectPreset(committedStart, committedEnd)
   );
-  const [startInputStr, setStartInputStr] = useState7(() => committedStart ? formatShort(committedStart) : "");
-  const [endInputStr, setEndInputStr] = useState7(() => committedEnd ? formatShort(committedEnd) : "");
-  const [inlineCal, setInlineCal] = useState7(null);
-  const [hoverDate, setHoverDate] = useState7(null);
-  const [selecting, setSelecting] = useState7("start");
-  const [leftViewYear, setLeftViewYear] = useState7(() => today2.getFullYear());
-  const [leftViewMonth, setLeftViewMonth] = useState7(() => today2.getMonth());
-  const containerRef = useRef6(null);
-  const inputId = useRef6(`rf-dr-${Math.random().toString(36).substr(2, 9)}`).current;
-  useEffect7(() => {
+  const [startInputStr, setStartInputStr] = useState8(() => committedStart ? formatShort(committedStart) : "");
+  const [endInputStr, setEndInputStr] = useState8(() => committedEnd ? formatShort(committedEnd) : "");
+  const [inlineCal, setInlineCal] = useState8(null);
+  const [hoverDate, setHoverDate] = useState8(null);
+  const [selecting, setSelecting] = useState8("start");
+  const [leftViewYear, setLeftViewYear] = useState8(() => today2.getFullYear());
+  const [leftViewMonth, setLeftViewMonth] = useState8(() => today2.getMonth());
+  const containerRef = useRef7(null);
+  const inputId = useRef7(`rf-dr-${Math.random().toString(36).substr(2, 9)}`).current;
+  useEffect8(() => {
     const s2 = value?.start ? isoToDate2(value.start) : null;
     const e = value?.end ? isoToDate2(value.end) : null;
     setDraftStart(s2);
@@ -3513,10 +3782,10 @@ var DateRangeField = ({
     setEndInputStr(e ? formatShort(e) : "");
     setActivePreset(detectPreset(s2, e));
   }, [value?.start, value?.end]);
-  useEffect7(() => {
+  useEffect8(() => {
     setActivePreset(detectPreset(draftStart, draftEnd));
   }, [draftStart?.getTime(), draftEnd?.getTime()]);
-  useEffect7(() => {
+  useEffect8(() => {
     if (!open) return;
     const handler = (e) => {
       if (containerRef.current && !containerRef.current.contains(e.target)) {
@@ -3658,7 +3927,7 @@ var DateRangeField = ({
     className
   ].filter(Boolean).join(" ");
   const inputPlaceholder = variant === "outlined" ? " " : void 0;
-  return /* @__PURE__ */ React72.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React72.createElement(
+  return /* @__PURE__ */ React73.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React73.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React73.createElement(
     "div",
     {
       className: "rf-text-field__wrapper",
@@ -3667,7 +3936,7 @@ var DateRangeField = ({
       },
       style: { cursor: disabled ? "default" : "pointer" }
     },
-    /* @__PURE__ */ React72.createElement(
+    /* @__PURE__ */ React73.createElement(
       "input",
       {
         id: inputId,
@@ -3683,7 +3952,7 @@ var DateRangeField = ({
         }
       }
     ),
-    /* @__PURE__ */ React72.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React72.createElement(
+    /* @__PURE__ */ React73.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React73.createElement(
       "button",
       {
         type: "button",
@@ -3696,13 +3965,13 @@ var DateRangeField = ({
         },
         "aria-label": "Pick date range"
       },
-      /* @__PURE__ */ React72.createElement(CalendarIcon2, null)
+      /* @__PURE__ */ React73.createElement(CalendarIcon2, null)
     )),
-    label && /* @__PURE__ */ React72.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React72.createElement("span", { className: "rf-text-field__asterisk" }, "*")),
-    variant === "outlined" && /* @__PURE__ */ React72.createElement("fieldset", { className: "rf-text-field__notch" }, label ? /* @__PURE__ */ React72.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React72.createElement("span", null, label, required ? " *" : "")) : /* @__PURE__ */ React72.createElement("legend", { className: "rf-text-field__legend--empty" }))
+    label && /* @__PURE__ */ React73.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React73.createElement("span", { className: "rf-text-field__asterisk" }, "*")),
+    variant === "outlined" && /* @__PURE__ */ React73.createElement("fieldset", { className: "rf-text-field__notch" }, label ? /* @__PURE__ */ React73.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React73.createElement("span", null, label, required ? " *" : "")) : /* @__PURE__ */ React73.createElement("legend", { className: "rf-text-field__legend--empty" }))
   ), open && !disabled && (pickerType === "panel" ? (
     /* ── Panel Mode ── */
-    /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker rf-dr-picker--panel", onMouseDown: (e) => e.preventDefault() }, /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__presets" }, PRESETS.map((p, i) => /* @__PURE__ */ React72.createElement(React72.Fragment, { key: p.id }, i > 0 && /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__preset-sep" }), /* @__PURE__ */ React72.createElement(
+    /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker rf-dr-picker--panel", onMouseDown: (e) => e.preventDefault() }, /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__presets" }, PRESETS.map((p, i) => /* @__PURE__ */ React73.createElement(React73.Fragment, { key: p.id }, i > 0 && /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__preset-sep" }), /* @__PURE__ */ React73.createElement(
       "button",
       {
         type: "button",
@@ -3713,7 +3982,7 @@ var DateRangeField = ({
         onClick: () => handlePreset(p.id)
       },
       p.label
-    )))), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__manual" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React72.createElement(
+    )))), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__manual" }, /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React73.createElement(
       "div",
       {
         className: [
@@ -3721,8 +3990,8 @@ var DateRangeField = ({
           inlineCal === "start" ? "rf-dr-picker__date-field--active" : ""
         ].filter(Boolean).join(" ")
       },
-      /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-picker__date-floating-label" }, "Start Date"),
-      /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__date-display" }, /* @__PURE__ */ React72.createElement(
+      /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-picker__date-floating-label" }, "Start Date"),
+      /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__date-display" }, /* @__PURE__ */ React73.createElement(
         "input",
         {
           type: "text",
@@ -3733,7 +4002,7 @@ var DateRangeField = ({
           onBlur: handleStartInputBlur,
           onMouseDown: (e) => e.stopPropagation()
         }
-      ), /* @__PURE__ */ React72.createElement(
+      ), /* @__PURE__ */ React73.createElement(
         "button",
         {
           type: "button",
@@ -3742,9 +4011,9 @@ var DateRangeField = ({
           onClick: () => setInlineCal((v) => v === "start" ? null : "start"),
           "aria-label": "Pick start date"
         },
-        /* @__PURE__ */ React72.createElement(CalendarIcon2, null)
+        /* @__PURE__ */ React73.createElement(CalendarIcon2, null)
       ))
-    ), inlineCal === "start" && /* @__PURE__ */ React72.createElement(
+    ), inlineCal === "start" && /* @__PURE__ */ React73.createElement(
       MiniCalendar,
       {
         selectedDate: draftStart,
@@ -3755,7 +4024,7 @@ var DateRangeField = ({
         },
         onClose: () => setInlineCal(null)
       }
-    )), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React72.createElement(
+    )), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React73.createElement(
       "div",
       {
         className: [
@@ -3763,8 +4032,8 @@ var DateRangeField = ({
           inlineCal === "end" ? "rf-dr-picker__date-field--active" : ""
         ].filter(Boolean).join(" ")
       },
-      /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-picker__date-floating-label" }, "End Date"),
-      /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__date-display" }, /* @__PURE__ */ React72.createElement(
+      /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-picker__date-floating-label" }, "End Date"),
+      /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__date-display" }, /* @__PURE__ */ React73.createElement(
         "input",
         {
           type: "text",
@@ -3775,7 +4044,7 @@ var DateRangeField = ({
           onBlur: handleEndInputBlur,
           onMouseDown: (e) => e.stopPropagation()
         }
-      ), /* @__PURE__ */ React72.createElement(
+      ), /* @__PURE__ */ React73.createElement(
         "button",
         {
           type: "button",
@@ -3784,9 +4053,9 @@ var DateRangeField = ({
           onClick: () => setInlineCal((v) => v === "end" ? null : "end"),
           "aria-label": "Pick end date"
         },
-        /* @__PURE__ */ React72.createElement(CalendarIcon2, null)
+        /* @__PURE__ */ React73.createElement(CalendarIcon2, null)
       ))
-    ), inlineCal === "end" && /* @__PURE__ */ React72.createElement(
+    ), inlineCal === "end" && /* @__PURE__ */ React73.createElement(
       MiniCalendar,
       {
         selectedDate: draftEnd,
@@ -3797,7 +4066,7 @@ var DateRangeField = ({
         },
         onClose: () => setInlineCal(null)
       }
-    )), !inlineCal && /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__days-section" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__days-row" }, /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-picker__days-label" }, "Days until today"), /* @__PURE__ */ React72.createElement(
+    )), !inlineCal && /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__days-section" }, /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__days-row" }, /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-picker__days-label" }, "Days until today"), /* @__PURE__ */ React73.createElement(
       "input",
       {
         type: "number",
@@ -3808,7 +4077,7 @@ var DateRangeField = ({
         onMouseDown: (e) => e.stopPropagation(),
         placeholder: "\u2014"
       }
-    )), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__days-row" }, /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-picker__days-label" }, "Days from today"), /* @__PURE__ */ React72.createElement(
+    )), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__days-row" }, /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-picker__days-label" }, "Days from today"), /* @__PURE__ */ React73.createElement(
       "input",
       {
         type: "number",
@@ -3819,10 +4088,10 @@ var DateRangeField = ({
         onMouseDown: (e) => e.stopPropagation(),
         placeholder: "\u2014"
       }
-    ))), /* @__PURE__ */ React72.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__footer" }, /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-dr-picker__close-btn", onClick: handleClose }, "CLOSE"), /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-dr-picker__apply-btn", onClick: handleApply }, "APPLY"))))
+    ))), /* @__PURE__ */ React73.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__footer" }, /* @__PURE__ */ React73.createElement("button", { type: "button", className: "rf-dr-picker__close-btn", onClick: handleClose }, "CLOSE"), /* @__PURE__ */ React73.createElement("button", { type: "button", className: "rf-dr-picker__apply-btn", onClick: handleApply }, "APPLY"))))
   ) : (
     /* ── Calendar Mode ── */
-    /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker rf-dr-picker--calendar", onMouseDown: (e) => e.preventDefault() }, /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__calendars" }, /* @__PURE__ */ React72.createElement(
+    /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker rf-dr-picker--calendar", onMouseDown: (e) => e.preventDefault() }, /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__calendars" }, /* @__PURE__ */ React73.createElement(
       RangeCalendarBody,
       {
         viewYear: leftViewYear,
@@ -3837,7 +4106,7 @@ var DateRangeField = ({
         onNext: nextMonth,
         showNext: false
       }
-    ), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__cal-col-divider" }), /* @__PURE__ */ React72.createElement(
+    ), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__cal-col-divider" }), /* @__PURE__ */ React73.createElement(
       RangeCalendarBody,
       {
         viewYear: rightViewYear,
@@ -3852,19 +4121,19 @@ var DateRangeField = ({
         onNext: nextMonth,
         showPrev: false
       }
-    )), selecting === "end" && draftStart && /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__cal-hint" }, /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-picker__cal-hint-dot" }), /* @__PURE__ */ React72.createElement("span", null, "Select end date \xB7 started from ", /* @__PURE__ */ React72.createElement("strong", null, formatShort(draftStart)))), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__divider" }), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__cal-footer" }, draftStart && draftEnd && /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-picker__cal-range-label" }, formatShort(draftStart <= draftEnd ? draftStart : draftEnd), " \u2013 ", formatShort(draftStart <= draftEnd ? draftEnd : draftStart), /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-picker__cal-range-days" }, " ", "(", Math.abs(daysBetween(draftStart, draftEnd)) + 1, " days)")), /* @__PURE__ */ React72.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-dr-picker__close-btn", onClick: handleClose }, "CLOSE"), /* @__PURE__ */ React72.createElement("button", { type: "button", className: "rf-dr-picker__apply-btn", onClick: handleApply }, "APPLY")))
-  ))), helperText && /* @__PURE__ */ React72.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
+    )), selecting === "end" && draftStart && /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__cal-hint" }, /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-picker__cal-hint-dot" }), /* @__PURE__ */ React73.createElement("span", null, "Select end date \xB7 started from ", /* @__PURE__ */ React73.createElement("strong", null, formatShort(draftStart)))), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__divider" }), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__cal-footer" }, draftStart && draftEnd && /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-picker__cal-range-label" }, formatShort(draftStart <= draftEnd ? draftStart : draftEnd), " \u2013 ", formatShort(draftStart <= draftEnd ? draftEnd : draftStart), /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-picker__cal-range-days" }, " ", "(", Math.abs(daysBetween(draftStart, draftEnd)) + 1, " days)")), /* @__PURE__ */ React73.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React73.createElement("button", { type: "button", className: "rf-dr-picker__close-btn", onClick: handleClose }, "CLOSE"), /* @__PURE__ */ React73.createElement("button", { type: "button", className: "rf-dr-picker__apply-btn", onClick: handleApply }, "APPLY")))
+  ))), helperText && /* @__PURE__ */ React73.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
 };
 DateRangeField.displayName = "DateRangeField";
 
 // lib/Progress/RufousLogoLoader.tsx
-import * as React73 from "react";
+import * as React74 from "react";
 var _uid = 0;
 var RufousLogoLoader = ({ size = 80, sx, className }) => {
-  const clipId = React73.useRef(`rll-${++_uid}`).current;
+  const clipId = React74.useRef(`rll-${++_uid}`).current;
   const height = size * (38.795 / 54.585);
   const sxClass = useSx(sx);
-  return /* @__PURE__ */ React73.createElement("div", { className: ["rufous-logo-loader", sxClass, className].filter(Boolean).join(" "), style: { width: size, height } }, /* @__PURE__ */ React73.createElement(
+  return /* @__PURE__ */ React74.createElement("div", { className: ["rufous-logo-loader", sxClass, className].filter(Boolean).join(" "), style: { width: size, height } }, /* @__PURE__ */ React74.createElement(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -3873,14 +4142,14 @@ var RufousLogoLoader = ({ size = 80, sx, className }) => {
       height,
       className: "rufous-logo-loader__svg"
     },
-    /* @__PURE__ */ React73.createElement("defs", null, /* @__PURE__ */ React73.createElement("clipPath", { id: clipId }, /* @__PURE__ */ React73.createElement(
+    /* @__PURE__ */ React74.createElement("defs", null, /* @__PURE__ */ React74.createElement("clipPath", { id: clipId }, /* @__PURE__ */ React74.createElement(
       "path",
       {
         transform: "translate(2208 18.205)",
         d: "M.7,38.8a3.783,3.783,0,0,1-.5-.045l-.031,0A.26.26,0,0,1,0,38.564a.279.279,0,0,1,.14-.2c.222-.126.45-.251.671-.371l.047-.026c.357-.194.8-.435,1.209-.685.783-.479,1.565-.993,2.32-1.489l.033-.022.218-.143.49-.32c.575-.374,1.226-.8,1.824-1.241.98-.726,1.834-1.407,2.611-2.081a22.444,22.444,0,0,0,1.783-1.774A14.2,14.2,0,0,0,12.5,28.749l.012-.016a15.8,15.8,0,0,0,1.151-1.8,10.351,10.351,0,0,0,.586-1.511l0-.011.092-.278a4.425,4.425,0,0,0,.14-.583l.007-.036c.024-.119.048-.243.079-.363a4.639,4.639,0,0,0-.034-2.566c-.064-.212-.126-.43-.184-.636l-.008-.028c-.111-.391-.225-.8-.369-1.181a8.71,8.71,0,0,0-2.279-3.24,14.363,14.363,0,0,0-3.239-2.326c-.75-.4-1.553-.727-2.329-1.046L6.1,13.114l-.157-.065c-.294-.122-.6-.221-.9-.318l-.025-.008c-.19-.061-.427-.136-.649-.218-.108-.04-.265-.172-.252-.229a.7.7,0,0,1,.235-.4.915.915,0,0,1,.449-.112c.383-.029.77-.063,1.165-.1.969-.085,1.971-.174,2.962-.181h.119a13.145,13.145,0,0,1,2.907.315,11.888,11.888,0,0,1,3.128,1.123,10.286,10.286,0,0,1,2.3,1.554.92.92,0,0,1,.273.4,12.722,12.722,0,0,1,.458,3.3c-.009,1.494-.014,2.867-.014,4.2,0,.309.013.588.039.852a1.013,1.013,0,0,0,.078.26l0,.01c.027.067.051.129.077.207.029-.064.054-.116.076-.161l.009-.017.006-.012a.823.823,0,0,0,.076-.189c.051-.247.1-.494.164-.767.136-.618.276-1.257.359-1.9a24.362,24.362,0,0,0,0-6.777,13.01,13.01,0,0,0-.559-2.1c-.061-.185-.125-.382-.187-.579a9.42,9.42,0,0,0-.583-1.469c-.367-.727-.786-1.449-1.184-2.126a9.376,9.376,0,0,0-.643-.918c-.076-.1-.151-.2-.224-.3L15.548,6.3a8.128,8.128,0,0,0-.865-1.057,32.021,32.021,0,0,0-2.466-2.183,12.673,12.673,0,0,0-1.905-1.188c-.48-.256-1-.485-1.462-.687-.221-.1-.457-.2-.683-.306a.663.663,0,0,1-.11-.071L8.039.795c-.027-.02-.058-.043-.1-.069L8.062.667,8.108.644a1.786,1.786,0,0,1,.27-.12A11.679,11.679,0,0,1,11.866,0a13.332,13.332,0,0,1,1.769.121A13.927,13.927,0,0,1,15.9.693l.471.147a10.775,10.775,0,0,1,1.656.658,9.622,9.622,0,0,1,1.768,1.041,32.024,32.024,0,0,1,3.092,2.717,25.62,25.62,0,0,1,2.245,2.829l.084.117c.617.86,1.171,1.777,1.678,2.641.255.435.484.9.687,1.3.14.281.285.572.436.854.262.491.534.977.835,1.516l.005.01q.169.3.337.6c.064.116.13.232.2.347l.027.047c.12.212.244.431.357.651a8.518,8.518,0,0,0,2.121,2.695c.065.024.137.054.212.086l.013.006a1.268,1.268,0,0,0,.376.123.087.087,0,0,0,.063-.02.209.209,0,0,0,.083-.151c0-.083-.08-.153-.157-.22a.694.694,0,0,1-.135-.142c-.134-.216-.273-.436-.407-.649l-.063-.1c-.373-.587-.8-1.251-1.157-1.923s-.666-1.373-.964-2.057l0-.008q-.123-.284-.247-.564a1.707,1.707,0,0,1,.239-1.554l.026-.046.005-.009A12.918,12.918,0,0,1,31.408,9.3,7.814,7.814,0,0,1,33.75,7.612a5.391,5.391,0,0,1,2.218-.444,11.369,11.369,0,0,1,1.882.186,9.211,9.211,0,0,1,2.845,1.022c.138.071.261.135.373.188a4.155,4.155,0,0,0,1.849.464h.093c1.993-.052,4-.14,5.95-.224l.846-.036c.9-.038,1.808-.066,2.682-.093L52.7,8.67l1.007-.031h.041a1.787,1.787,0,0,1,.73.163c.1.051.109.256.109.318,0,.081-.147.169-.257.175-.466.028-.994.043-1.485.043a37.855,37.855,0,0,0-6.3.577A9.221,9.221,0,0,0,42.7,11.3a7.884,7.884,0,0,0-1.565,1.5c-.593.743-1.116,1.545-1.621,2.321l-.121.185c-.228.35-.435.709-.662,1.109l-.041.071c-.136.236-.276.481-.42.717l-.007.012c-.349.572-.709,1.162-1.1,1.716l-.216.307-.01.014a21.585,21.585,0,0,1-1.451,1.907c-1.317,1.485-2.538,2.8-3.734,4.006a30.822,30.822,0,0,1-2.5,2.207c-.548.446-1.139.86-1.71,1.26l-.01.007q-.254.177-.5.355c-.536.379-1.109.78-1.7,1.157-.545.35-1.143.71-1.828,1.1-.842.483-1.586.9-2.275,1.26-.271.144-.553.272-.868.412-.13.058-.3.135-.467.213a6.838,6.838,0,0,1-1.18.3,5.079,5.079,0,0,1,.647-.771l.008-.008c.132-.136.251-.26.365-.393l.048-.056c.566-.667,1.151-1.357,1.7-2.059s1.126-1.439,1.649-2.2c.4-.579.749-1.2,1.134-1.888l.016-.028c.406-.734.826-1.493,1.181-2.266.274-.6.733-1.787.866-2.189l.023-.07c.13-.389.215-.646-.013-.916a.369.369,0,0,1-.041.031l0,0c-.028.021-.055.041-.058.065a2.307,2.307,0,0,1-.146.5,5.257,5.257,0,0,1-.374.709c-.281.468-.536.959-.782,1.434-.2.385-.379.731-.57,1.069a20.042,20.042,0,0,1-1.161,1.871,30.689,30.689,0,0,1-1.985,2.531c-.74.821-1.567,1.648-2.6,2.6a21.448,21.448,0,0,1-2.1,1.669c-.85.606-1.754,1.2-2.688,1.768a17.867,17.867,0,0,1-1.993,1.037c-.994.445-2.066.891-3.185,1.324a12.127,12.127,0,0,1-1.714.514c-.955.213-1.969.413-3.1.611-1.023.18-2.054.328-2.927.449A1.41,1.41,0,0,1,.7,38.8ZM37.945,10.58l-.007,0a.583.583,0,0,0-.223.048.677.677,0,0,0-.437.555.637.637,0,0,0,.426.527.621.621,0,0,0,.209.046h.016a.72.72,0,0,0,.464-.194.676.676,0,0,0,.194-.282l0-.011,0-.005,0-.006,0-.009a.415.415,0,0,0,.014-.109.734.734,0,0,0-.657-.56Z"
       }
     ))),
-    /* @__PURE__ */ React73.createElement("g", { transform: "translate(-123.275 -24)" }, /* @__PURE__ */ React73.createElement("g", { transform: "translate(-2084.725 5.795)", clipPath: `url(#${clipId})` }, /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-1", width: "40", height: "6", transform: "translate(2208 58) rotate(-90)", fill: "#d07f6f" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-2", width: "40", height: "6", transform: "translate(2214 58) rotate(-90)", fill: "#c66958" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-3", width: "40", height: "7", transform: "translate(2220 58) rotate(-90)", fill: "#bb5341" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-4", width: "40", height: "6", transform: "translate(2227 58) rotate(-90)", fill: "#b03a28" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-5", width: "40", height: "6", transform: "translate(2233 58) rotate(-90)", fill: "#a41b06" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-6", width: "40", height: "6", transform: "translate(2239 58) rotate(-90)", fill: "#8e1604" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-7", width: "40", height: "6", transform: "translate(2245 58) rotate(-90)", fill: "#791103" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-8", width: "40", height: "5", transform: "translate(2251 58) rotate(-90)", fill: "#640c02" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-9", width: "40", height: "7", transform: "translate(2256 58) rotate(-90)", fill: "#500801" })))
+    /* @__PURE__ */ React74.createElement("g", { transform: "translate(-123.275 -24)" }, /* @__PURE__ */ React74.createElement("g", { transform: "translate(-2084.725 5.795)", clipPath: `url(#${clipId})` }, /* @__PURE__ */ React74.createElement("rect", { className: "rufous-ls rufous-ls-1", width: "40", height: "6", transform: "translate(2208 58) rotate(-90)", fill: "#d07f6f" }), /* @__PURE__ */ React74.createElement("rect", { className: "rufous-ls rufous-ls-2", width: "40", height: "6", transform: "translate(2214 58) rotate(-90)", fill: "#c66958" }), /* @__PURE__ */ React74.createElement("rect", { className: "rufous-ls rufous-ls-3", width: "40", height: "7", transform: "translate(2220 58) rotate(-90)", fill: "#bb5341" }), /* @__PURE__ */ React74.createElement("rect", { className: "rufous-ls rufous-ls-4", width: "40", height: "6", transform: "translate(2227 58) rotate(-90)", fill: "#b03a28" }), /* @__PURE__ */ React74.createElement("rect", { className: "rufous-ls rufous-ls-5", width: "40", height: "6", transform: "translate(2233 58) rotate(-90)", fill: "#a41b06" }), /* @__PURE__ */ React74.createElement("rect", { className: "rufous-ls rufous-ls-6", width: "40", height: "6", transform: "translate(2239 58) rotate(-90)", fill: "#8e1604" }), /* @__PURE__ */ React74.createElement("rect", { className: "rufous-ls rufous-ls-7", width: "40", height: "6", transform: "translate(2245 58) rotate(-90)", fill: "#791103" }), /* @__PURE__ */ React74.createElement("rect", { className: "rufous-ls rufous-ls-8", width: "40", height: "5", transform: "translate(2251 58) rotate(-90)", fill: "#640c02" }), /* @__PURE__ */ React74.createElement("rect", { className: "rufous-ls rufous-ls-9", width: "40", height: "7", transform: "translate(2256 58) rotate(-90)", fill: "#500801" })))
   ));
 };
 
@@ -3904,238 +4173,6 @@ import {
   Trash2,
   Plus
 } from "lucide-react";
-
-// lib/Tooltip/Tooltip.tsx
-import React74, {
-  useCallback as useCallback3,
-  useEffect as useEffect8,
-  useRef as useRef8,
-  useState as useState8
-} from "react";
-import ReactDOM3 from "react-dom";
-var GAP = 8;
-function computePosition(anchor, tooltip, placement) {
-  const { top: aTop, left: aLeft, width: aW, height: aH } = anchor;
-  const { width: tW, height: tH } = tooltip;
-  let top = 0;
-  let left = 0;
-  let arrowLeft;
-  let arrowTop;
-  switch (placement) {
-    case "top":
-      top = aTop - tH - GAP;
-      left = aLeft + aW / 2 - tW / 2;
-      arrowLeft = tW / 2 - 4;
-      break;
-    case "top-start":
-      top = aTop - tH - GAP;
-      left = aLeft;
-      arrowLeft = Math.min(aW / 2, tW - 16);
-      break;
-    case "top-end":
-      top = aTop - tH - GAP;
-      left = aLeft + aW - tW;
-      arrowLeft = Math.max(tW - aW / 2 - 4, 8);
-      break;
-    case "bottom":
-      top = aTop + aH + GAP;
-      left = aLeft + aW / 2 - tW / 2;
-      arrowLeft = tW / 2 - 4;
-      break;
-    case "bottom-start":
-      top = aTop + aH + GAP;
-      left = aLeft;
-      arrowLeft = Math.min(aW / 2, tW - 16);
-      break;
-    case "bottom-end":
-      top = aTop + aH + GAP;
-      left = aLeft + aW - tW;
-      arrowLeft = Math.max(tW - aW / 2 - 4, 8);
-      break;
-    case "left":
-      top = aTop + aH / 2 - tH / 2;
-      left = aLeft - tW - GAP;
-      arrowTop = tH / 2 - 4;
-      break;
-    case "left-start":
-      top = aTop;
-      left = aLeft - tW - GAP;
-      arrowTop = Math.min(aH / 2, tH - 16);
-      break;
-    case "left-end":
-      top = aTop + aH - tH;
-      left = aLeft - tW - GAP;
-      arrowTop = Math.max(tH - aH / 2 - 4, 8);
-      break;
-    case "right":
-      top = aTop + aH / 2 - tH / 2;
-      left = aLeft + aW + GAP;
-      arrowTop = tH / 2 - 4;
-      break;
-    case "right-start":
-      top = aTop;
-      left = aLeft + aW + GAP;
-      arrowTop = Math.min(aH / 2, tH - 16);
-      break;
-    case "right-end":
-      top = aTop + aH - tH;
-      left = aLeft + aW + GAP;
-      arrowTop = Math.max(tH - aH / 2 - 4, 8);
-      break;
-    default:
-      top = aTop - tH - GAP;
-      left = aLeft + aW / 2 - tW / 2;
-  }
-  const vw = window.innerWidth;
-  const vh = window.innerHeight;
-  left = Math.max(8, Math.min(left, vw - tW - 8));
-  top = Math.max(8, Math.min(top, vh - tH - 8));
-  return { top, left, arrowLeft, arrowTop };
-}
-var Tooltip = ({
-  title,
-  placement = "top",
-  arrow = false,
-  open: controlledOpen,
-  disableHoverListener = false,
-  disableFocusListener = false,
-  enterDelay = 100,
-  leaveDelay = 0,
-  children,
-  followCursor = false,
-  className = "",
-  style,
-  sx
-}) => {
-  const sxClass = useSx(sx);
-  const [internalOpen, setInternalOpen] = useState8(false);
-  const [position, setPosition] = useState8({ top: 0, left: 0 });
-  const anchorRef = useRef8(null);
-  const tooltipRef = useRef8(null);
-  const enterTimer = useRef8(null);
-  const leaveTimer = useRef8(null);
-  const cursorPos = useRef8({ x: 0, y: 0 });
-  const isOpen = controlledOpen !== void 0 ? controlledOpen : internalOpen;
-  const clearTimers = useCallback3(() => {
-    if (enterTimer.current) clearTimeout(enterTimer.current);
-    if (leaveTimer.current) clearTimeout(leaveTimer.current);
-  }, []);
-  const updatePosition = useCallback3(() => {
-    if (!anchorRef.current || !tooltipRef.current) return;
-    const anchorRect = anchorRef.current.getBoundingClientRect();
-    const tooltipRect = tooltipRef.current.getBoundingClientRect();
-    if (followCursor) {
-      const fakeRect = {
-        top: cursorPos.current.y,
-        left: cursorPos.current.x,
-        right: cursorPos.current.x,
-        bottom: cursorPos.current.y,
-        width: 0,
-        height: 0,
-        x: cursorPos.current.x,
-        y: cursorPos.current.y,
-        toJSON: () => ({})
-      };
-      setPosition(computePosition(fakeRect, tooltipRect, placement));
-    } else {
-      setPosition(computePosition(anchorRect, tooltipRect, placement));
-    }
-  }, [placement, followCursor]);
-  useEffect8(() => {
-    if (isOpen) {
-      requestAnimationFrame(() => {
-        updatePosition();
-      });
-    }
-  }, [isOpen, updatePosition]);
-  const handleOpen = useCallback3(() => {
-    clearTimers();
-    if (enterDelay > 0) {
-      enterTimer.current = setTimeout(() => {
-        setInternalOpen(true);
-      }, enterDelay);
-    } else {
-      setInternalOpen(true);
-    }
-  }, [enterDelay, clearTimers]);
-  const handleClose = useCallback3(() => {
-    clearTimers();
-    if (leaveDelay > 0) {
-      leaveTimer.current = setTimeout(() => {
-        setInternalOpen(false);
-      }, leaveDelay);
-    } else {
-      setInternalOpen(false);
-    }
-  }, [leaveDelay, clearTimers]);
-  const handleMouseMove = useCallback3(
-    (e) => {
-      cursorPos.current = { x: e.clientX, y: e.clientY };
-      if (isOpen && followCursor) {
-        updatePosition();
-      }
-    },
-    [isOpen, followCursor, updatePosition]
-  );
-  useEffect8(() => {
-    return () => clearTimers();
-  }, [clearTimers]);
-  const childProps = {};
-  if (!disableHoverListener) {
-    childProps.onMouseEnter = handleOpen;
-    childProps.onMouseLeave = handleClose;
-    childProps.onMouseMove = followCursor ? handleMouseMove : void 0;
-  }
-  if (!disableFocusListener) {
-    childProps.onFocus = handleOpen;
-    childProps.onBlur = handleClose;
-  }
-  const tooltipClasses = [
-    "rf-tooltip",
-    `rf-tooltip--placement-${placement}`,
-    isOpen ? "rf-tooltip--visible" : "",
-    sxClass,
-    className
-  ].filter(Boolean).join(" ");
-  const tooltipElement = /* @__PURE__ */ React74.createElement(
-    "div",
-    {
-      ref: tooltipRef,
-      className: tooltipClasses,
-      style: {
-        top: position.top,
-        left: position.left,
-        ...style
-      },
-      role: "tooltip",
-      "aria-hidden": !isOpen
-    },
-    title,
-    arrow && /* @__PURE__ */ React74.createElement(
-      "span",
-      {
-        className: "rf-tooltip__arrow",
-        style: {
-          ...position.arrowLeft !== void 0 ? { left: position.arrowLeft } : {},
-          ...position.arrowTop !== void 0 ? { top: position.arrowTop } : {}
-        }
-      }
-    )
-  );
-  return /* @__PURE__ */ React74.createElement(React74.Fragment, null, /* @__PURE__ */ React74.createElement(
-    "span",
-    {
-      ref: anchorRef,
-      style: { display: "inline-flex", position: "relative" },
-      "aria-describedby": isOpen ? "rf-tooltip" : void 0,
-      ...childProps
-    },
-    React74.cloneElement(children)
-  ), ReactDOM3.createPortal(tooltipElement, document.body));
-};
-Tooltip.displayName = "Tooltip";
-
-// lib/DataGrid/DataGrid.tsx
 var getOperatorsForType = (type) => {
   if (type === "date") return [
     { value: "is", label: "is" },