@rufous/ui 0.2.92 → 0.2.94

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/main.cjs +432 -411
  2. package/dist/main.js +445 -424
  3. package/package.json +1 -1
package/dist/main.js CHANGED
@@ -1742,21 +1742,253 @@ var TextField = forwardRef3(({
1742
1742
  TextField.displayName = "TextField";
1743
1743
 
1744
1744
  // lib/TextFields/AddressLookup.tsx
1745
- import React70, { useState as useState5, useRef as useRef4, useEffect as useEffect5 } from "react";
1745
+ import React71, { useState as useState6, useRef as useRef5, useEffect as useEffect6 } from "react";
1746
1746
  import Axios from "axios";
1747
1747
  import { Country, State, City } from "country-state-city";
1748
1748
 
1749
1749
  // lib/TextFields/Autocomplete.tsx
1750
+ import React70, {
1751
+ useState as useState5,
1752
+ useRef as useRef4,
1753
+ useEffect as useEffect5,
1754
+ useCallback as useCallback2
1755
+ } from "react";
1756
+ import ReactDOM3 from "react-dom";
1757
+
1758
+ // lib/Tooltip/Tooltip.tsx
1750
1759
  import React69, {
1751
- useState as useState4,
1752
- useRef as useRef3,
1760
+ useCallback,
1753
1761
  useEffect as useEffect4,
1754
- useCallback
1762
+ useRef as useRef3,
1763
+ useState as useState4
1755
1764
  } from "react";
1756
1765
  import ReactDOM2 from "react-dom";
1757
- 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" }));
1758
- 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" }));
1759
- 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" }));
1766
+ var GAP = 8;
1767
+ function computePosition(anchor, tooltip, placement) {
1768
+ const { top: aTop, left: aLeft, width: aW, height: aH } = anchor;
1769
+ const { width: tW, height: tH } = tooltip;
1770
+ let top = 0;
1771
+ let left = 0;
1772
+ let arrowLeft;
1773
+ let arrowTop;
1774
+ switch (placement) {
1775
+ case "top":
1776
+ top = aTop - tH - GAP;
1777
+ left = aLeft + aW / 2 - tW / 2;
1778
+ arrowLeft = tW / 2 - 4;
1779
+ break;
1780
+ case "top-start":
1781
+ top = aTop - tH - GAP;
1782
+ left = aLeft;
1783
+ arrowLeft = Math.min(aW / 2, tW - 16);
1784
+ break;
1785
+ case "top-end":
1786
+ top = aTop - tH - GAP;
1787
+ left = aLeft + aW - tW;
1788
+ arrowLeft = Math.max(tW - aW / 2 - 4, 8);
1789
+ break;
1790
+ case "bottom":
1791
+ top = aTop + aH + GAP;
1792
+ left = aLeft + aW / 2 - tW / 2;
1793
+ arrowLeft = tW / 2 - 4;
1794
+ break;
1795
+ case "bottom-start":
1796
+ top = aTop + aH + GAP;
1797
+ left = aLeft;
1798
+ arrowLeft = Math.min(aW / 2, tW - 16);
1799
+ break;
1800
+ case "bottom-end":
1801
+ top = aTop + aH + GAP;
1802
+ left = aLeft + aW - tW;
1803
+ arrowLeft = Math.max(tW - aW / 2 - 4, 8);
1804
+ break;
1805
+ case "left":
1806
+ top = aTop + aH / 2 - tH / 2;
1807
+ left = aLeft - tW - GAP;
1808
+ arrowTop = tH / 2 - 4;
1809
+ break;
1810
+ case "left-start":
1811
+ top = aTop;
1812
+ left = aLeft - tW - GAP;
1813
+ arrowTop = Math.min(aH / 2, tH - 16);
1814
+ break;
1815
+ case "left-end":
1816
+ top = aTop + aH - tH;
1817
+ left = aLeft - tW - GAP;
1818
+ arrowTop = Math.max(tH - aH / 2 - 4, 8);
1819
+ break;
1820
+ case "right":
1821
+ top = aTop + aH / 2 - tH / 2;
1822
+ left = aLeft + aW + GAP;
1823
+ arrowTop = tH / 2 - 4;
1824
+ break;
1825
+ case "right-start":
1826
+ top = aTop;
1827
+ left = aLeft + aW + GAP;
1828
+ arrowTop = Math.min(aH / 2, tH - 16);
1829
+ break;
1830
+ case "right-end":
1831
+ top = aTop + aH - tH;
1832
+ left = aLeft + aW + GAP;
1833
+ arrowTop = Math.max(tH - aH / 2 - 4, 8);
1834
+ break;
1835
+ default:
1836
+ top = aTop - tH - GAP;
1837
+ left = aLeft + aW / 2 - tW / 2;
1838
+ }
1839
+ const vw = window.innerWidth;
1840
+ const vh = window.innerHeight;
1841
+ left = Math.max(8, Math.min(left, vw - tW - 8));
1842
+ top = Math.max(8, Math.min(top, vh - tH - 8));
1843
+ return { top, left, arrowLeft, arrowTop };
1844
+ }
1845
+ var Tooltip = ({
1846
+ title,
1847
+ placement = "top",
1848
+ arrow = false,
1849
+ open: controlledOpen,
1850
+ disableHoverListener = false,
1851
+ disableFocusListener = false,
1852
+ enterDelay = 100,
1853
+ leaveDelay = 0,
1854
+ children,
1855
+ followCursor = false,
1856
+ className = "",
1857
+ style,
1858
+ sx
1859
+ }) => {
1860
+ const sxClass = useSx(sx);
1861
+ const [internalOpen, setInternalOpen] = useState4(false);
1862
+ const [position, setPosition] = useState4({ top: 0, left: 0 });
1863
+ const anchorRef = useRef3(null);
1864
+ const tooltipRef = useRef3(null);
1865
+ const enterTimer = useRef3(null);
1866
+ const leaveTimer = useRef3(null);
1867
+ const cursorPos = useRef3({ x: 0, y: 0 });
1868
+ const isOpen = controlledOpen !== void 0 ? controlledOpen : internalOpen;
1869
+ const clearTimers = useCallback(() => {
1870
+ if (enterTimer.current) clearTimeout(enterTimer.current);
1871
+ if (leaveTimer.current) clearTimeout(leaveTimer.current);
1872
+ }, []);
1873
+ const updatePosition = useCallback(() => {
1874
+ if (!anchorRef.current || !tooltipRef.current) return;
1875
+ const anchorRect = anchorRef.current.getBoundingClientRect();
1876
+ const tooltipRect = tooltipRef.current.getBoundingClientRect();
1877
+ if (followCursor) {
1878
+ const fakeRect = {
1879
+ top: cursorPos.current.y,
1880
+ left: cursorPos.current.x,
1881
+ right: cursorPos.current.x,
1882
+ bottom: cursorPos.current.y,
1883
+ width: 0,
1884
+ height: 0,
1885
+ x: cursorPos.current.x,
1886
+ y: cursorPos.current.y,
1887
+ toJSON: () => ({})
1888
+ };
1889
+ setPosition(computePosition(fakeRect, tooltipRect, placement));
1890
+ } else {
1891
+ setPosition(computePosition(anchorRect, tooltipRect, placement));
1892
+ }
1893
+ }, [placement, followCursor]);
1894
+ useEffect4(() => {
1895
+ if (isOpen) {
1896
+ requestAnimationFrame(() => {
1897
+ updatePosition();
1898
+ });
1899
+ }
1900
+ }, [isOpen, updatePosition]);
1901
+ const handleOpen = useCallback(() => {
1902
+ clearTimers();
1903
+ if (enterDelay > 0) {
1904
+ enterTimer.current = setTimeout(() => {
1905
+ setInternalOpen(true);
1906
+ }, enterDelay);
1907
+ } else {
1908
+ setInternalOpen(true);
1909
+ }
1910
+ }, [enterDelay, clearTimers]);
1911
+ const handleClose = useCallback(() => {
1912
+ clearTimers();
1913
+ if (leaveDelay > 0) {
1914
+ leaveTimer.current = setTimeout(() => {
1915
+ setInternalOpen(false);
1916
+ }, leaveDelay);
1917
+ } else {
1918
+ setInternalOpen(false);
1919
+ }
1920
+ }, [leaveDelay, clearTimers]);
1921
+ const handleMouseMove = useCallback(
1922
+ (e) => {
1923
+ cursorPos.current = { x: e.clientX, y: e.clientY };
1924
+ if (isOpen && followCursor) {
1925
+ updatePosition();
1926
+ }
1927
+ },
1928
+ [isOpen, followCursor, updatePosition]
1929
+ );
1930
+ useEffect4(() => {
1931
+ return () => clearTimers();
1932
+ }, [clearTimers]);
1933
+ const childProps = {};
1934
+ if (!disableHoverListener) {
1935
+ childProps.onMouseEnter = handleOpen;
1936
+ childProps.onMouseLeave = handleClose;
1937
+ childProps.onMouseMove = followCursor ? handleMouseMove : void 0;
1938
+ }
1939
+ if (!disableFocusListener) {
1940
+ childProps.onFocus = handleOpen;
1941
+ childProps.onBlur = handleClose;
1942
+ }
1943
+ const tooltipClasses = [
1944
+ "rf-tooltip",
1945
+ `rf-tooltip--placement-${placement}`,
1946
+ isOpen ? "rf-tooltip--visible" : "",
1947
+ sxClass,
1948
+ className
1949
+ ].filter(Boolean).join(" ");
1950
+ const tooltipElement = /* @__PURE__ */ React69.createElement(
1951
+ "div",
1952
+ {
1953
+ ref: tooltipRef,
1954
+ className: tooltipClasses,
1955
+ style: {
1956
+ top: position.top,
1957
+ left: position.left,
1958
+ ...style
1959
+ },
1960
+ role: "tooltip",
1961
+ "aria-hidden": !isOpen
1962
+ },
1963
+ title,
1964
+ arrow && /* @__PURE__ */ React69.createElement(
1965
+ "span",
1966
+ {
1967
+ className: "rf-tooltip__arrow",
1968
+ style: {
1969
+ ...position.arrowLeft !== void 0 ? { left: position.arrowLeft } : {},
1970
+ ...position.arrowTop !== void 0 ? { top: position.arrowTop } : {}
1971
+ }
1972
+ }
1973
+ )
1974
+ );
1975
+ return /* @__PURE__ */ React69.createElement(React69.Fragment, null, /* @__PURE__ */ React69.createElement(
1976
+ "span",
1977
+ {
1978
+ ref: anchorRef,
1979
+ style: { display: "inline-flex", position: "relative" },
1980
+ "aria-describedby": isOpen ? "rf-tooltip" : void 0,
1981
+ ...childProps
1982
+ },
1983
+ React69.cloneElement(children)
1984
+ ), ReactDOM2.createPortal(tooltipElement, document.body));
1985
+ };
1986
+ Tooltip.displayName = "Tooltip";
1987
+
1988
+ // lib/TextFields/Autocomplete.tsx
1989
+ 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" }));
1990
+ 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" }));
1991
+ 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" }));
1760
1992
  function defaultGetLabel(option) {
1761
1993
  if (option === null || option === void 0) return "";
1762
1994
  if (typeof option === "string") return option;
@@ -1766,11 +1998,19 @@ function defaultGetLabel(option) {
1766
1998
  }
1767
1999
  function defaultIsEqual(a, b) {
1768
2000
  if (a === b) return true;
1769
- if (a !== null && b !== null && typeof a === "object" && typeof b === "object") {
2001
+ if (a == null || b == null) return false;
2002
+ const aIsObj = typeof a === "object";
2003
+ const bIsObj = typeof b === "object";
2004
+ if (aIsObj && bIsObj) {
1770
2005
  const aVal = a.value;
1771
2006
  const bVal = b.value;
1772
2007
  if (aVal !== void 0 && bVal !== void 0) return aVal === bVal;
2008
+ const aId = a.id;
2009
+ const bId = b.id;
2010
+ if (aId !== void 0 && bId !== void 0) return aId === bId;
1773
2011
  }
2012
+ if (aIsObj && !bIsObj) return a.value === b;
2013
+ if (!aIsObj && bIsObj) return a === b.value;
1774
2014
  return false;
1775
2015
  }
1776
2016
  function defaultFilter(options, inputValue, getLabel) {
@@ -1813,17 +2053,18 @@ function AutocompleteInner(props, _ref) {
1813
2053
  onOpen,
1814
2054
  onClose
1815
2055
  } = props;
1816
- const [open, setOpen] = useState4(false);
1817
- const [inputStr, setInputStr] = useState4("");
1818
- const [focusedIdx, setFocusedIdx] = useState4(-1);
1819
- const [popupStyle, setPopupStyle] = useState4({});
1820
- const containerRef = useRef3(null);
1821
- const popupRef = useRef3(null);
1822
- const inputRef = useRef3(null);
1823
- const listRef = useRef3(null);
1824
- const inputId = useRef3(`rf-ac-${Math.random().toString(36).slice(2, 9)}`).current;
2056
+ const [open, setOpen] = useState5(false);
2057
+ const [inputStr, setInputStr] = useState5("");
2058
+ const [filterQuery, setFilterQuery] = useState5("");
2059
+ const [focusedIdx, setFocusedIdx] = useState5(-1);
2060
+ const [popupStyle, setPopupStyle] = useState5({});
2061
+ const containerRef = useRef4(null);
2062
+ const popupRef = useRef4(null);
2063
+ const inputRef = useRef4(null);
2064
+ const listRef = useRef4(null);
2065
+ const inputId = useRef4(`rf-ac-${Math.random().toString(36).slice(2, 9)}`).current;
1825
2066
  const sxClass = useSx(sx);
1826
- const calcPopupStyle = useCallback(() => {
2067
+ const calcPopupStyle = useCallback2(() => {
1827
2068
  if (!containerRef.current) return;
1828
2069
  const rect = containerRef.current.getBoundingClientRect();
1829
2070
  const POPUP_MAX_HEIGHT = 280;
@@ -1854,15 +2095,15 @@ function AutocompleteInner(props, _ref) {
1854
2095
  }, []);
1855
2096
  const activeInput = controlledInput !== void 0 ? controlledInput : inputStr;
1856
2097
  const selectedValues = multiple ? Array.isArray(value) ? value : [] : value != null ? [value] : [];
1857
- const isEqual = useCallback(
2098
+ const isEqual = useCallback2(
1858
2099
  (a, b) => isOptionEqualToValue ? isOptionEqualToValue(a, b) : defaultIsEqual(a, b),
1859
2100
  [isOptionEqualToValue]
1860
2101
  );
1861
- const isSelected = useCallback(
2102
+ const isSelected = useCallback2(
1862
2103
  (opt) => selectedValues.some((v) => isEqual(opt, v)),
1863
2104
  [selectedValues, isEqual]
1864
2105
  );
1865
- const filtered = filterOptions ? filterOptions(options, activeInput) : defaultFilter(options, activeInput, getOptionLabel);
2106
+ const filtered = filterOptions ? filterOptions(options, activeInput) : defaultFilter(options, filterQuery, getOptionLabel);
1866
2107
  const flatEntries = [];
1867
2108
  if (groupBy) {
1868
2109
  const groups = {};
@@ -1885,14 +2126,15 @@ function AutocompleteInner(props, _ref) {
1885
2126
  filtered.forEach((opt, i) => flatEntries.push({ kind: "option", option: opt, flatIdx: i }));
1886
2127
  }
1887
2128
  const selectableOptions = flatEntries.filter((e) => e.kind === "option");
1888
- const openPopup = useCallback(() => {
2129
+ const openPopup = useCallback2(() => {
1889
2130
  if (disabled) return;
1890
2131
  calcPopupStyle();
1891
2132
  setOpen(true);
1892
2133
  setFocusedIdx(-1);
2134
+ setFilterQuery("");
1893
2135
  onOpen?.();
1894
2136
  }, [disabled, calcPopupStyle, onOpen]);
1895
- const closePopup = useCallback((justSelected = false) => {
2137
+ const closePopup = useCallback2((justSelected = false) => {
1896
2138
  setOpen(false);
1897
2139
  setFocusedIdx(-1);
1898
2140
  onClose?.();
@@ -1901,7 +2143,7 @@ function AutocompleteInner(props, _ref) {
1901
2143
  onInputChange?.("");
1902
2144
  }
1903
2145
  }, [freeSolo, multiple, value, onInputChange, onClose]);
1904
- useEffect4(() => {
2146
+ useEffect5(() => {
1905
2147
  if (!open) return;
1906
2148
  const handleOutside = (e) => {
1907
2149
  const target = e.target;
@@ -1920,7 +2162,7 @@ function AutocompleteInner(props, _ref) {
1920
2162
  window.removeEventListener("resize", calcPopupStyle);
1921
2163
  };
1922
2164
  }, [open, closePopup, calcPopupStyle]);
1923
- useEffect4(() => {
2165
+ useEffect5(() => {
1924
2166
  if (controlledInput !== void 0) return;
1925
2167
  if (!multiple) {
1926
2168
  const v = value;
@@ -1934,11 +2176,13 @@ function AutocompleteInner(props, _ref) {
1934
2176
  const next = already ? selectedValues.filter((v) => !isEqual(v, opt)) : [...selectedValues, opt];
1935
2177
  onChange?.(event, next, already ? "removeOption" : "selectOption");
1936
2178
  setInputStr("");
2179
+ setFilterQuery("");
1937
2180
  onInputChange?.("");
1938
2181
  inputRef.current?.focus();
1939
2182
  } else {
1940
2183
  onChange?.(event, opt, "selectOption");
1941
2184
  setInputStr(getOptionLabel(opt));
2185
+ setFilterQuery("");
1942
2186
  onInputChange?.(getOptionLabel(opt));
1943
2187
  closePopup(true);
1944
2188
  }
@@ -1948,6 +2192,7 @@ function AutocompleteInner(props, _ref) {
1948
2192
  e.stopPropagation();
1949
2193
  onChange?.(e, multiple ? [] : null, "clear");
1950
2194
  setInputStr("");
2195
+ setFilterQuery("");
1951
2196
  onInputChange?.("");
1952
2197
  inputRef.current?.focus();
1953
2198
  };
@@ -1959,6 +2204,7 @@ function AutocompleteInner(props, _ref) {
1959
2204
  const handleInputChange = (e) => {
1960
2205
  const v = e.target.value;
1961
2206
  setInputStr(v);
2207
+ setFilterQuery(v);
1962
2208
  onInputChange?.(v);
1963
2209
  if (!open) openPopup();
1964
2210
  };
@@ -2032,7 +2278,7 @@ function AutocompleteInner(props, _ref) {
2032
2278
  className
2033
2279
  ].filter(Boolean).join(" ");
2034
2280
  const inputPlaceholder = placeholder || (variant === "outlined" ? " " : void 0);
2035
- return /* @__PURE__ */ React69.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React69.createElement(
2281
+ return /* @__PURE__ */ React70.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React70.createElement(
2036
2282
  "div",
2037
2283
  {
2038
2284
  className: "rf-text-field__wrapper",
@@ -2043,7 +2289,7 @@ function AutocompleteInner(props, _ref) {
2043
2289
  }
2044
2290
  }
2045
2291
  },
2046
- 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(
2292
+ 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(
2047
2293
  "button",
2048
2294
  {
2049
2295
  type: "button",
@@ -2052,10 +2298,17 @@ function AutocompleteInner(props, _ref) {
2052
2298
  onClick: (e) => removeTag(opt, e),
2053
2299
  tabIndex: -1
2054
2300
  },
2055
- /* @__PURE__ */ React69.createElement(CloseSmIcon, { size: 12 })
2301
+ /* @__PURE__ */ React70.createElement(CloseSmIcon, { size: 12 })
2056
2302
  ))),
2057
- hiddenCount > 0 && /* @__PURE__ */ React69.createElement("span", { className: "rf-autocomplete__tag-more" }, "+", hiddenCount, " more"),
2058
- /* @__PURE__ */ React69.createElement(
2303
+ hiddenCount > 0 && /* @__PURE__ */ React70.createElement(
2304
+ Tooltip,
2305
+ {
2306
+ title: selectedValues.slice(limitTags).map((o) => getOptionLabel(o)).join(", "),
2307
+ placement: "top"
2308
+ },
2309
+ /* @__PURE__ */ React70.createElement("span", { className: "rf-autocomplete__tag-more" }, "+", hiddenCount, " more")
2310
+ ),
2311
+ /* @__PURE__ */ React70.createElement(
2059
2312
  "input",
2060
2313
  {
2061
2314
  ref: inputRef,
@@ -2077,9 +2330,9 @@ function AutocompleteInner(props, _ref) {
2077
2330
  "aria-autocomplete": "list"
2078
2331
  }
2079
2332
  ),
2080
- label && /* @__PURE__ */ React69.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, required && /* @__PURE__ */ React69.createElement("span", { className: "rf-text-field__asterisk" }, " *")),
2081
- 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" })),
2082
- /* @__PURE__ */ React69.createElement("div", { className: "rf-autocomplete__endgroup" }, hasClearable && /* @__PURE__ */ React69.createElement(
2333
+ label && /* @__PURE__ */ React70.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, required && /* @__PURE__ */ React70.createElement("span", { className: "rf-text-field__asterisk" }, " *")),
2334
+ 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" })),
2335
+ /* @__PURE__ */ React70.createElement("div", { className: "rf-autocomplete__endgroup" }, hasClearable && /* @__PURE__ */ React70.createElement(
2083
2336
  "button",
2084
2337
  {
2085
2338
  type: "button",
@@ -2089,8 +2342,8 @@ function AutocompleteInner(props, _ref) {
2089
2342
  tabIndex: -1,
2090
2343
  "aria-label": "Clear"
2091
2344
  },
2092
- /* @__PURE__ */ React69.createElement(CloseSmIcon, { size: 16 })
2093
- ), !freeSolo && /* @__PURE__ */ React69.createElement(
2345
+ /* @__PURE__ */ React70.createElement(CloseSmIcon, { size: 16 })
2346
+ ), !freeSolo && /* @__PURE__ */ React70.createElement(
2094
2347
  "button",
2095
2348
  {
2096
2349
  type: "button",
@@ -2102,10 +2355,10 @@ function AutocompleteInner(props, _ref) {
2102
2355
  tabIndex: -1,
2103
2356
  "aria-label": open ? "Close" : "Open"
2104
2357
  },
2105
- /* @__PURE__ */ React69.createElement(ChevronDownIcon, null)
2358
+ /* @__PURE__ */ React70.createElement(ChevronDownIcon, null)
2106
2359
  ))
2107
- ), helperText && /* @__PURE__ */ React69.createElement("div", { className: `rf-text-field__helper-text${error ? " rf-text-field__helper-text--error" : ""}` }, helperText), open && !disabled && ReactDOM2.createPortal(
2108
- /* @__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 ? (
2360
+ ), helperText && /* @__PURE__ */ React70.createElement("div", { className: `rf-text-field__helper-text${error ? " rf-text-field__helper-text--error" : ""}` }, helperText), open && !disabled && ReactDOM3.createPortal(
2361
+ /* @__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 ? (
2109
2362
  // Grouped render
2110
2363
  (() => {
2111
2364
  const rendered = [];
@@ -2115,7 +2368,7 @@ function AutocompleteInner(props, _ref) {
2115
2368
  if (entry.kind === "group") {
2116
2369
  if (groupItems.length > 0) {
2117
2370
  rendered.push(
2118
- /* @__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))
2371
+ /* @__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))
2119
2372
  );
2120
2373
  groupItems = [];
2121
2374
  }
@@ -2126,7 +2379,7 @@ function AutocompleteInner(props, _ref) {
2126
2379
  }
2127
2380
  if (ei === flatEntries.length - 1 && groupItems.length > 0) {
2128
2381
  rendered.push(
2129
- /* @__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))
2382
+ /* @__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))
2130
2383
  );
2131
2384
  }
2132
2385
  });
@@ -2140,7 +2393,7 @@ function AutocompleteInner(props, _ref) {
2140
2393
  const focused = focusedIdx === flatIdx;
2141
2394
  const optDisabled = getOptionDisabled?.(option) ?? false;
2142
2395
  const label2 = getOptionLabel(option);
2143
- return /* @__PURE__ */ React69.createElement(
2396
+ return /* @__PURE__ */ React70.createElement(
2144
2397
  "li",
2145
2398
  {
2146
2399
  key: label2 + flatIdx,
@@ -2159,12 +2412,12 @@ function AutocompleteInner(props, _ref) {
2159
2412
  onMouseDown: (e) => e.preventDefault(),
2160
2413
  onClick: (e) => selectOption(option, e)
2161
2414
  },
2162
- renderOption ? renderOption(option, { selected, focused, index: flatIdx }) : /* @__PURE__ */ React69.createElement("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, label2),
2163
- !renderOption && /* @__PURE__ */ React69.createElement("span", { className: "rf-autocomplete__option-check" }, /* @__PURE__ */ React69.createElement(CheckIcon, null))
2415
+ renderOption ? renderOption(option, { selected, focused, index: flatIdx }) : /* @__PURE__ */ React70.createElement("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, label2),
2416
+ !renderOption && /* @__PURE__ */ React70.createElement("span", { className: "rf-autocomplete__option-check" }, /* @__PURE__ */ React70.createElement(CheckIcon, null))
2164
2417
  );
2165
2418
  }
2166
2419
  }
2167
- var Autocomplete = React69.forwardRef(AutocompleteInner);
2420
+ var Autocomplete = React70.forwardRef(AutocompleteInner);
2168
2421
  Autocomplete.displayName = "Autocomplete";
2169
2422
 
2170
2423
  // lib/TextFields/AddressLookup.tsx
@@ -2181,16 +2434,16 @@ var AddressLookup = ({
2181
2434
  token = ""
2182
2435
  }) => {
2183
2436
  const { theme } = useRufousTheme();
2184
- const [suggestions, setSuggestions] = useState5([]);
2185
- const [loading, setLoading] = useState5(false);
2186
- const [showSuggestions, setShowSuggestions] = useState5(false);
2187
- const debounceTimeout = useRef4(null);
2188
- const containerRef = useRef4(null);
2437
+ const [suggestions, setSuggestions] = useState6([]);
2438
+ const [loading, setLoading] = useState6(false);
2439
+ const [showSuggestions, setShowSuggestions] = useState6(false);
2440
+ const debounceTimeout = useRef5(null);
2441
+ const containerRef = useRef5(null);
2189
2442
  const apiKey = token || "";
2190
2443
  const countries = Country.getAllCountries();
2191
- const [states, setStates] = useState5([]);
2192
- const [cities, setCities] = useState5([]);
2193
- useEffect5(() => {
2444
+ const [states, setStates] = useState6([]);
2445
+ const [cities, setCities] = useState6([]);
2446
+ useEffect6(() => {
2194
2447
  const handleClickOutside = (event) => {
2195
2448
  if (containerRef.current && !containerRef.current.contains(event.target)) {
2196
2449
  setShowSuggestions(false);
@@ -2199,7 +2452,7 @@ var AddressLookup = ({
2199
2452
  document.addEventListener("mousedown", handleClickOutside);
2200
2453
  return () => document.removeEventListener("mousedown", handleClickOutside);
2201
2454
  }, []);
2202
- useEffect5(() => {
2455
+ useEffect6(() => {
2203
2456
  if (value.country) {
2204
2457
  const country = countries.find((c) => c.name === value.country);
2205
2458
  if (country) {
@@ -2212,7 +2465,7 @@ var AddressLookup = ({
2212
2465
  setStates([]);
2213
2466
  }
2214
2467
  }, [value.country]);
2215
- useEffect5(() => {
2468
+ useEffect6(() => {
2216
2469
  if (value.state && value.country) {
2217
2470
  const country = countries.find((c) => c.name === value.country);
2218
2471
  if (country) {
@@ -2317,7 +2570,7 @@ var AddressLookup = ({
2317
2570
  city: ""
2318
2571
  });
2319
2572
  };
2320
- 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(
2573
+ 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(
2321
2574
  TextField,
2322
2575
  {
2323
2576
  label,
@@ -2349,7 +2602,7 @@ var AddressLookup = ({
2349
2602
  },
2350
2603
  onFocus: () => suggestions.length > 0 && setShowSuggestions(true)
2351
2604
  }
2352
- ), 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(
2605
+ ), 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(
2353
2606
  "div",
2354
2607
  {
2355
2608
  key: idx,
@@ -2360,9 +2613,9 @@ var AddressLookup = ({
2360
2613
  fetchPlaceDetails(option.placePrediction.placeId, mainText);
2361
2614
  }
2362
2615
  },
2363
- /* @__PURE__ */ React70.createElement("div", { className: "autocomplete-main-text" }, option?.placePrediction?.structuredFormat?.mainText?.text),
2364
- /* @__PURE__ */ React70.createElement("div", { className: "autocomplete-secondary-text" }, option?.placePrediction?.structuredFormat?.secondaryText?.text)
2365
- ))), 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(
2616
+ /* @__PURE__ */ React71.createElement("div", { className: "autocomplete-main-text" }, option?.placePrediction?.structuredFormat?.mainText?.text),
2617
+ /* @__PURE__ */ React71.createElement("div", { className: "autocomplete-secondary-text" }, option?.placePrediction?.structuredFormat?.secondaryText?.text)
2618
+ ))), 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(
2366
2619
  TextField,
2367
2620
  {
2368
2621
  label: "Address Line 2",
@@ -2371,7 +2624,7 @@ var AddressLookup = ({
2371
2624
  value: value.addressLine2 || "",
2372
2625
  onChange: (e) => handleChange("addressLine2", e.target.value)
2373
2626
  }
2374
- )), layout !== "compact" && /* @__PURE__ */ React70.createElement("div", { className: "address-lookup-grid-item col-l2" }, /* @__PURE__ */ React70.createElement(
2627
+ )), layout !== "compact" && /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-l2" }, /* @__PURE__ */ React71.createElement(
2375
2628
  TextField,
2376
2629
  {
2377
2630
  label: "Address Line 2",
@@ -2380,7 +2633,7 @@ var AddressLookup = ({
2380
2633
  value: value.addressLine2 || "",
2381
2634
  onChange: (e) => handleChange("addressLine2", e.target.value)
2382
2635
  }
2383
- )), /* @__PURE__ */ React70.createElement("div", { className: "address-lookup-grid-item col-country" }, /* @__PURE__ */ React70.createElement(
2636
+ )), /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-country" }, /* @__PURE__ */ React71.createElement(
2384
2637
  Autocomplete,
2385
2638
  {
2386
2639
  options: countries.map((c) => c.name),
@@ -2391,7 +2644,7 @@ var AddressLookup = ({
2391
2644
  required,
2392
2645
  error: !!error.country
2393
2646
  }
2394
- ), 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(
2647
+ ), 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(
2395
2648
  Autocomplete,
2396
2649
  {
2397
2650
  options: states.map((s2) => s2.name),
@@ -2402,7 +2655,7 @@ var AddressLookup = ({
2402
2655
  required,
2403
2656
  error: !!error.state
2404
2657
  }
2405
- ), 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(
2658
+ ), 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(
2406
2659
  Autocomplete,
2407
2660
  {
2408
2661
  options: cities.map((c) => c.name),
@@ -2413,7 +2666,7 @@ var AddressLookup = ({
2413
2666
  required,
2414
2667
  error: !!error.city
2415
2668
  }
2416
- ), 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(
2669
+ ), 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(
2417
2670
  TextField,
2418
2671
  {
2419
2672
  label: "Pincode",
@@ -2423,16 +2676,16 @@ var AddressLookup = ({
2423
2676
  required,
2424
2677
  onChange: (e) => handleChange("pincode", e.target.value)
2425
2678
  }
2426
- ), error.pincode && /* @__PURE__ */ React70.createElement("div", { className: "field-error-text" }, error.pincode))));
2679
+ ), error.pincode && /* @__PURE__ */ React71.createElement("div", { className: "field-error-text" }, error.pincode))));
2427
2680
  };
2428
2681
  var AddressLookup_default = AddressLookup;
2429
2682
 
2430
2683
  // lib/TextFields/DateField.tsx
2431
- import React71, {
2432
- useState as useState6,
2433
- useRef as useRef5,
2434
- useEffect as useEffect6,
2435
- useCallback as useCallback2
2684
+ import React72, {
2685
+ useState as useState7,
2686
+ useRef as useRef6,
2687
+ useEffect as useEffect7,
2688
+ useCallback as useCallback3
2436
2689
  } from "react";
2437
2690
  import { createPortal } from "react-dom";
2438
2691
  var WEEKDAYS = ["SU", "MO", "TU", "WE", "TH", "FR", "SA"];
@@ -2594,25 +2847,25 @@ var parseTimeFromISO = (iso) => {
2594
2847
  if (h === 0) h = 12;
2595
2848
  return { h, m, ampm };
2596
2849
  };
2597
- 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" }));
2598
- 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" }));
2599
- 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" }));
2850
+ 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" }));
2851
+ 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" }));
2852
+ 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" }));
2600
2853
  var ITEM_H = 36;
2601
2854
  var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
2602
- const listRef = useRef5(null);
2603
- const isInternalScroll = useRef5(false);
2604
- const scrollTimeout = useRef5(null);
2855
+ const listRef = useRef6(null);
2856
+ const isInternalScroll = useRef6(false);
2857
+ const scrollTimeout = useRef6(null);
2605
2858
  const MULTIPLIER = infinite ? 100 : 1;
2606
2859
  const virtualItems = infinite ? Array(MULTIPLIER).fill(items).flat() : items;
2607
2860
  const centerOffset = infinite ? Math.floor(MULTIPLIER / 2) * items.length : 0;
2608
2861
  const VISUAL_OFFSET = 54;
2609
- useEffect6(() => {
2862
+ useEffect7(() => {
2610
2863
  if (listRef.current) {
2611
2864
  const targetIndex = centerOffset + selected;
2612
2865
  listRef.current.scrollTop = targetIndex * ITEM_H - (infinite ? VISUAL_OFFSET : 0);
2613
2866
  }
2614
2867
  }, [centerOffset, infinite, selected]);
2615
- useEffect6(() => {
2868
+ useEffect7(() => {
2616
2869
  if (listRef.current && !isInternalScroll.current) {
2617
2870
  const targetIndex = centerOffset + selected;
2618
2871
  listRef.current.scrollTo({
@@ -2644,15 +2897,15 @@ var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
2644
2897
  }
2645
2898
  }, 100);
2646
2899
  };
2647
- return /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__col-wrapper" }, /* @__PURE__ */ React71.createElement(
2900
+ return /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__col-wrapper" }, /* @__PURE__ */ React72.createElement(
2648
2901
  "div",
2649
2902
  {
2650
2903
  className: "rf-timescroll__col",
2651
2904
  ref: listRef,
2652
2905
  onScroll: handleScroll
2653
2906
  },
2654
- !infinite && /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__spacer" }),
2655
- virtualItems.map((label, idx) => /* @__PURE__ */ React71.createElement(
2907
+ !infinite && /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__spacer" }),
2908
+ virtualItems.map((label, idx) => /* @__PURE__ */ React72.createElement(
2656
2909
  "div",
2657
2910
  {
2658
2911
  key: `${label}-${idx}`,
@@ -2660,8 +2913,8 @@ var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
2660
2913
  },
2661
2914
  label
2662
2915
  )),
2663
- !infinite && /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__spacer" })
2664
- ), /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__mask rf-timescroll__mask--top" }), /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__mask rf-timescroll__mask--bottom" }));
2916
+ !infinite && /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__spacer" })
2917
+ ), /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__mask rf-timescroll__mask--top" }), /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__mask rf-timescroll__mask--bottom" }));
2665
2918
  };
2666
2919
  var SpinnerPanel = ({
2667
2920
  hour,
@@ -2672,7 +2925,7 @@ var SpinnerPanel = ({
2672
2925
  onHourInput,
2673
2926
  onMinuteInput,
2674
2927
  onAmpmToggle
2675
- }) => /* @__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(
2928
+ }) => /* @__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(
2676
2929
  "input",
2677
2930
  {
2678
2931
  type: "number",
@@ -2683,7 +2936,7 @@ var SpinnerPanel = ({
2683
2936
  onChange: onHourInput,
2684
2937
  onMouseDown: (e) => e.stopPropagation()
2685
2938
  }
2686
- ), /* @__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(
2939
+ ), /* @__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(
2687
2940
  "input",
2688
2941
  {
2689
2942
  type: "number",
@@ -2694,7 +2947,7 @@ var SpinnerPanel = ({
2694
2947
  onChange: onMinuteInput,
2695
2948
  onMouseDown: (e) => e.stopPropagation()
2696
2949
  }
2697
- ), /* @__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(
2950
+ ), /* @__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(
2698
2951
  "button",
2699
2952
  {
2700
2953
  type: "button",
@@ -2703,7 +2956,7 @@ var SpinnerPanel = ({
2703
2956
  onClick: () => onAmpmToggle("AM")
2704
2957
  },
2705
2958
  "AM"
2706
- ), /* @__PURE__ */ React71.createElement(
2959
+ ), /* @__PURE__ */ React72.createElement(
2707
2960
  "button",
2708
2961
  {
2709
2962
  type: "button",
@@ -2725,7 +2978,7 @@ var CalendarBody = ({
2725
2978
  onMonthSelect,
2726
2979
  onYearSelect
2727
2980
  }) => {
2728
- const [pickerView, setPickerView] = useState6("calendar");
2981
+ const [pickerView, setPickerView] = useState7("calendar");
2729
2982
  const handleMonthClick = () => {
2730
2983
  setPickerView(pickerView === "month" ? "calendar" : "month");
2731
2984
  };
@@ -2743,21 +2996,21 @@ var CalendarBody = ({
2743
2996
  const currentYear = todayDate.getFullYear();
2744
2997
  const yearStart = viewYear - 6;
2745
2998
  const years = Array.from({ length: 16 }, (_, i) => yearStart + i);
2746
- 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(
2999
+ 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(
2747
3000
  "span",
2748
3001
  {
2749
3002
  className: `rf-date-picker__month-label ${pickerView === "month" ? "rf-date-picker__month-label--active" : ""}`,
2750
3003
  onClick: handleMonthClick
2751
3004
  },
2752
3005
  MONTHS[viewMonth]
2753
- ), /* @__PURE__ */ React71.createElement(
3006
+ ), /* @__PURE__ */ React72.createElement(
2754
3007
  "span",
2755
3008
  {
2756
3009
  className: `rf-date-picker__year-label ${pickerView === "year" ? "rf-date-picker__year-label--active" : ""}`,
2757
3010
  onClick: handleYearClick
2758
3011
  },
2759
3012
  viewYear
2760
- )), /* @__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(
3013
+ )), /* @__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(
2761
3014
  "button",
2762
3015
  {
2763
3016
  key: m,
@@ -2770,7 +3023,7 @@ var CalendarBody = ({
2770
3023
  onClick: () => handleMonthPick(idx)
2771
3024
  },
2772
3025
  m
2773
- ))), pickerView === "year" && /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__year-grid" }, years.map((y) => /* @__PURE__ */ React71.createElement(
3026
+ ))), pickerView === "year" && /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__year-grid" }, years.map((y) => /* @__PURE__ */ React72.createElement(
2774
3027
  "button",
2775
3028
  {
2776
3029
  key: y,
@@ -2783,12 +3036,12 @@ var CalendarBody = ({
2783
3036
  onClick: () => handleYearPick(y)
2784
3037
  },
2785
3038
  y
2786
- ))), 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) => {
2787
- if (day === null) return /* @__PURE__ */ React71.createElement("div", { key: `e-${idx}`, className: "rf-date-picker__day rf-date-picker__day--empty" });
3039
+ ))), 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) => {
3040
+ if (day === null) return /* @__PURE__ */ React72.createElement("div", { key: `e-${idx}`, className: "rf-date-picker__day rf-date-picker__day--empty" });
2788
3041
  const cellDate = new Date(viewYear, viewMonth, day);
2789
3042
  const isSelected = selectedDate ? isSameDay(cellDate, selectedDate) : false;
2790
3043
  const isToday = isSameDay(cellDate, todayDate);
2791
- return /* @__PURE__ */ React71.createElement(
3044
+ return /* @__PURE__ */ React72.createElement(
2792
3045
  "button",
2793
3046
  {
2794
3047
  key: day,
@@ -2824,29 +3077,29 @@ var DateField = ({
2824
3077
  sx
2825
3078
  }) => {
2826
3079
  const sxClass = useSx(sx);
2827
- const [open, setOpen] = useState6(false);
2828
- const [selectedDate, setSelectedDate] = useState6(() => value ? isoToDate(value) : null);
2829
- const [hour, setHour] = useState6(() => {
3080
+ const [open, setOpen] = useState7(false);
3081
+ const [selectedDate, setSelectedDate] = useState7(() => value ? isoToDate(value) : null);
3082
+ const [hour, setHour] = useState7(() => {
2830
3083
  if (value && isDatetimeType(type)) return parseTimeFromISO(value).h;
2831
3084
  return 12;
2832
3085
  });
2833
- const [minute, setMinute] = useState6(() => {
3086
+ const [minute, setMinute] = useState7(() => {
2834
3087
  if (value && isDatetimeType(type)) return parseTimeFromISO(value).m;
2835
3088
  return 0;
2836
3089
  });
2837
- const [ampm, setAmpm] = useState6(() => {
3090
+ const [ampm, setAmpm] = useState7(() => {
2838
3091
  if (value && isDatetimeType(type)) return parseTimeFromISO(value).ampm;
2839
3092
  return "AM";
2840
3093
  });
2841
- const [viewYear, setViewYear] = useState6(() => {
3094
+ const [viewYear, setViewYear] = useState7(() => {
2842
3095
  const base = value ? isoToDate(value) : null;
2843
3096
  return base ? base.getFullYear() : today().getFullYear();
2844
3097
  });
2845
- const [viewMonth, setViewMonth] = useState6(() => {
3098
+ const [viewMonth, setViewMonth] = useState7(() => {
2846
3099
  const base = value ? isoToDate(value) : null;
2847
3100
  return base ? base.getMonth() : today().getMonth();
2848
3101
  });
2849
- const [inputStr, setInputStr] = useState6(() => {
3102
+ const [inputStr, setInputStr] = useState7(() => {
2850
3103
  if (!value) return "";
2851
3104
  const d = isoToDate(value);
2852
3105
  if (!d) return "";
@@ -2860,12 +3113,12 @@ var DateField = ({
2860
3113
  const HOURS = Array.from({ length: 12 }, (_, i) => String(i + 1).padStart(2, "0"));
2861
3114
  const MINUTES = Array.from({ length: 60 }, (_, i) => String(i).padStart(2, "0"));
2862
3115
  const AMPMS = ["AM", "PM"];
2863
- const containerRef = useRef5(null);
2864
- const pickerRef = useRef5(null);
2865
- const [dropUp, setDropUp] = useState6(false);
2866
- const inputId = useRef5(`rf-df-${Math.random().toString(36).substring(2, 11)}`).current;
2867
- const isInternalChange = useRef5(false);
2868
- useEffect6(() => {
3116
+ const containerRef = useRef6(null);
3117
+ const pickerRef = useRef6(null);
3118
+ const [dropUp, setDropUp] = useState7(false);
3119
+ const inputId = useRef6(`rf-df-${Math.random().toString(36).substring(2, 11)}`).current;
3120
+ const isInternalChange = useRef6(false);
3121
+ useEffect7(() => {
2869
3122
  if (value === void 0) return;
2870
3123
  if (isInternalChange.current) {
2871
3124
  isInternalChange.current = false;
@@ -2892,7 +3145,7 @@ var DateField = ({
2892
3145
  setInputStr(str);
2893
3146
  }
2894
3147
  }, [value, type]);
2895
- useEffect6(() => {
3148
+ useEffect7(() => {
2896
3149
  if (!open) return;
2897
3150
  const handler = (e) => {
2898
3151
  const target = e.target;
@@ -2903,14 +3156,14 @@ var DateField = ({
2903
3156
  document.addEventListener("mousedown", handler);
2904
3157
  return () => document.removeEventListener("mousedown", handler);
2905
3158
  }, [open]);
2906
- useEffect6(() => {
3159
+ useEffect7(() => {
2907
3160
  if (!open || !containerRef.current) return;
2908
3161
  const rect = containerRef.current.getBoundingClientRect();
2909
3162
  const spaceBelow = window.innerHeight - rect.bottom;
2910
3163
  const pickerHeight = 400;
2911
3164
  setDropUp(spaceBelow < pickerHeight && rect.top > pickerHeight);
2912
3165
  }, [open]);
2913
- const commitDate = useCallback2((d, h, m, ap) => {
3166
+ const commitDate = useCallback3((d, h, m, ap) => {
2914
3167
  setSelectedDate(d);
2915
3168
  if (!d) {
2916
3169
  setInputStr("");
@@ -3061,7 +3314,7 @@ var DateField = ({
3061
3314
  const inputPlaceholder = placeholder || (variant === "outlined" ? " " : void 0);
3062
3315
  const todayDate = today();
3063
3316
  const isSideVariant = type === "datetime-side" || type === "datetime-scroll";
3064
- return /* @__PURE__ */ React71.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React71.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React71.createElement(
3317
+ return /* @__PURE__ */ React72.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React72.createElement(
3065
3318
  "div",
3066
3319
  {
3067
3320
  className: "rf-text-field__wrapper",
@@ -3070,7 +3323,7 @@ var DateField = ({
3070
3323
  },
3071
3324
  style: { cursor: disabled ? "default" : "pointer" }
3072
3325
  },
3073
- /* @__PURE__ */ React71.createElement(
3326
+ /* @__PURE__ */ React72.createElement(
3074
3327
  "input",
3075
3328
  {
3076
3329
  id: inputId,
@@ -3086,7 +3339,7 @@ var DateField = ({
3086
3339
  }
3087
3340
  }
3088
3341
  ),
3089
- /* @__PURE__ */ React71.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React71.createElement(
3342
+ /* @__PURE__ */ React72.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React72.createElement(
3090
3343
  "button",
3091
3344
  {
3092
3345
  type: "button",
@@ -3099,12 +3352,12 @@ var DateField = ({
3099
3352
  },
3100
3353
  "aria-label": "Pick date"
3101
3354
  },
3102
- /* @__PURE__ */ React71.createElement(CalendarIcon, null)
3355
+ /* @__PURE__ */ React72.createElement(CalendarIcon, null)
3103
3356
  )),
3104
- label && /* @__PURE__ */ React71.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React71.createElement("span", { className: "rf-text-field__asterisk" }, "*")),
3105
- 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 ? " *" : "")))
3357
+ label && /* @__PURE__ */ React72.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React72.createElement("span", { className: "rf-text-field__asterisk" }, "*")),
3358
+ 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 ? " *" : "")))
3106
3359
  ), open && !disabled && createPortal(
3107
- /* @__PURE__ */ React71.createElement(
3360
+ /* @__PURE__ */ React72.createElement(
3108
3361
  "div",
3109
3362
  {
3110
3363
  ref: pickerRef,
@@ -3129,7 +3382,7 @@ var DateField = ({
3129
3382
  })(),
3130
3383
  onMouseDown: (e) => e.preventDefault()
3131
3384
  },
3132
- /* @__PURE__ */ React71.createElement("div", { className: isSideVariant ? "rf-date-picker__cal-col" : void 0 }, /* @__PURE__ */ React71.createElement(
3385
+ /* @__PURE__ */ React72.createElement("div", { className: isSideVariant ? "rf-date-picker__cal-col" : void 0 }, /* @__PURE__ */ React72.createElement(
3133
3386
  CalendarBody,
3134
3387
  {
3135
3388
  viewMonth,
@@ -3143,7 +3396,7 @@ var DateField = ({
3143
3396
  onMonthSelect: setViewMonth,
3144
3397
  onYearSelect: setViewYear
3145
3398
  }
3146
- ), 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(
3399
+ ), 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(
3147
3400
  SpinnerPanel,
3148
3401
  {
3149
3402
  hour,
@@ -3155,8 +3408,8 @@ var DateField = ({
3155
3408
  onMinuteInput: handleMinuteInput,
3156
3409
  onAmpmToggle: handleAmpmToggle
3157
3410
  }
3158
- )), /* @__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"))),
3159
- 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(
3411
+ )), /* @__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"))),
3412
+ 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(
3160
3413
  SpinnerPanel,
3161
3414
  {
3162
3415
  hour,
@@ -3168,22 +3421,22 @@ var DateField = ({
3168
3421
  onMinuteInput: handleMinuteInput,
3169
3422
  onAmpmToggle: handleAmpmToggle
3170
3423
  }
3171
- )), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm)),
3172
- 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(
3424
+ )), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm)),
3425
+ 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(
3173
3426
  ScrollColumn,
3174
3427
  {
3175
3428
  items: HOURS,
3176
3429
  selected: hour - 1,
3177
3430
  onSelect: handleScrollHour
3178
3431
  }
3179
- ), /* @__PURE__ */ React71.createElement("div", { className: "rf-timescroll__colon" }, ":"), /* @__PURE__ */ React71.createElement(
3432
+ ), /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__colon" }, ":"), /* @__PURE__ */ React72.createElement(
3180
3433
  ScrollColumn,
3181
3434
  {
3182
3435
  items: MINUTES,
3183
3436
  selected: minute,
3184
3437
  onSelect: handleScrollMinute
3185
3438
  }
3186
- ), /* @__PURE__ */ React71.createElement(
3439
+ ), /* @__PURE__ */ React72.createElement(
3187
3440
  ScrollColumn,
3188
3441
  {
3189
3442
  items: AMPMS,
@@ -3191,18 +3444,18 @@ var DateField = ({
3191
3444
  onSelect: handleScrollAmpm,
3192
3445
  infinite: false
3193
3446
  }
3194
- )), /* @__PURE__ */ React71.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm))
3447
+ )), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm))
3195
3448
  ),
3196
3449
  document.body
3197
- )), helperText && /* @__PURE__ */ React71.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
3450
+ )), helperText && /* @__PURE__ */ React72.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
3198
3451
  };
3199
3452
  DateField.displayName = "DateField";
3200
3453
 
3201
3454
  // lib/TextFields/DateRangeField.tsx
3202
- import React72, {
3203
- useState as useState7,
3204
- useRef as useRef6,
3205
- useEffect as useEffect7
3455
+ import React73, {
3456
+ useState as useState8,
3457
+ useRef as useRef7,
3458
+ useEffect as useEffect8
3206
3459
  } from "react";
3207
3460
  var WEEKDAYS2 = ["SU", "MO", "TU", "WE", "TH", "FR", "SA"];
3208
3461
  var MONTHS2 = [
@@ -3328,7 +3581,7 @@ var detectPreset = (start, end) => {
3328
3581
  if (isSameDay2(start, new Date(2e3, 0, 1)) && isSameDay2(end, today2)) return "all";
3329
3582
  return null;
3330
3583
  };
3331
- 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" }));
3584
+ 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" }));
3332
3585
  var RangeCalendarBody = ({
3333
3586
  viewYear,
3334
3587
  viewMonth,
@@ -3353,7 +3606,7 @@ var RangeCalendarBody = ({
3353
3606
  const hasRange = startDate != null && effectiveEnd != null && !isSameDay2(startDate, effectiveEnd);
3354
3607
  const lo = startDate && effectiveEnd ? startDate <= effectiveEnd ? startDate : effectiveEnd : null;
3355
3608
  const hi = startDate && effectiveEnd ? startDate <= effectiveEnd ? effectiveEnd : startDate : null;
3356
- return /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-calendar" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-calendar__header" }, /* @__PURE__ */ React72.createElement(
3609
+ return /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-calendar" }, /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-calendar__header" }, /* @__PURE__ */ React73.createElement(
3357
3610
  "button",
3358
3611
  {
3359
3612
  type: "button",
@@ -3363,7 +3616,7 @@ var RangeCalendarBody = ({
3363
3616
  "aria-label": "Previous month"
3364
3617
  },
3365
3618
  "\u2039"
3366
- ), /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-calendar__month-label" }, MONTHS2[viewMonth], " ", viewYear), /* @__PURE__ */ React72.createElement(
3619
+ ), /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-calendar__month-label" }, MONTHS2[viewMonth], " ", viewYear), /* @__PURE__ */ React73.createElement(
3367
3620
  "button",
3368
3621
  {
3369
3622
  type: "button",
@@ -3373,9 +3626,9 @@ var RangeCalendarBody = ({
3373
3626
  "aria-label": "Next month"
3374
3627
  },
3375
3628
  "\u203A"
3376
- )), /* @__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) => {
3629
+ )), /* @__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) => {
3377
3630
  if (day === null) {
3378
- return /* @__PURE__ */ React72.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
3631
+ return /* @__PURE__ */ React73.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
3379
3632
  }
3380
3633
  const cellDate = new Date(viewYear, viewMonth, day);
3381
3634
  const isStart = startDate ? isSameDay2(cellDate, startDate) : false;
@@ -3395,7 +3648,7 @@ var RangeCalendarBody = ({
3395
3648
  isStart || isEnd ? "rf-dr-calendar__day--selected" : "",
3396
3649
  isToday && !isStart && !isEnd ? "rf-dr-calendar__day--today" : ""
3397
3650
  ].filter(Boolean).join(" ");
3398
- return /* @__PURE__ */ React72.createElement(
3651
+ return /* @__PURE__ */ React73.createElement(
3399
3652
  "div",
3400
3653
  {
3401
3654
  key: day,
@@ -3403,7 +3656,7 @@ var RangeCalendarBody = ({
3403
3656
  onMouseEnter: () => onDayHover(cellDate),
3404
3657
  onMouseLeave: () => onDayHover(null)
3405
3658
  },
3406
- /* @__PURE__ */ React72.createElement(
3659
+ /* @__PURE__ */ React73.createElement(
3407
3660
  "button",
3408
3661
  {
3409
3662
  type: "button",
@@ -3417,8 +3670,8 @@ var RangeCalendarBody = ({
3417
3670
  };
3418
3671
  var MiniCalendar = ({ selectedDate, todayDate, onSelect, onClose }) => {
3419
3672
  const init = selectedDate ?? todayDate;
3420
- const [viewYear, setViewYear] = useState7(init.getFullYear());
3421
- const [viewMonth, setViewMonth] = useState7(init.getMonth());
3673
+ const [viewYear, setViewYear] = useState8(init.getFullYear());
3674
+ const [viewMonth, setViewMonth] = useState8(init.getMonth());
3422
3675
  const firstDay = new Date(viewYear, viewMonth, 1).getDay();
3423
3676
  const daysInMonth = new Date(viewYear, viewMonth + 1, 0).getDate();
3424
3677
  const dayCells = [
@@ -3437,14 +3690,14 @@ var MiniCalendar = ({ selectedDate, todayDate, onSelect, onClose }) => {
3437
3690
  setViewYear((y) => y + 1);
3438
3691
  } else setViewMonth((m) => m + 1);
3439
3692
  };
3440
- 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) => {
3693
+ 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) => {
3441
3694
  if (day === null) {
3442
- return /* @__PURE__ */ React72.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
3695
+ return /* @__PURE__ */ React73.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
3443
3696
  }
3444
3697
  const cellDate = new Date(viewYear, viewMonth, day);
3445
3698
  const isSel = selectedDate ? isSameDay2(cellDate, selectedDate) : false;
3446
3699
  const isToday = isSameDay2(cellDate, todayDate);
3447
- return /* @__PURE__ */ React72.createElement("div", { key: day, className: "rf-dr-calendar__cell" }, /* @__PURE__ */ React72.createElement(
3700
+ return /* @__PURE__ */ React73.createElement("div", { key: day, className: "rf-dr-calendar__cell" }, /* @__PURE__ */ React73.createElement(
3448
3701
  "button",
3449
3702
  {
3450
3703
  type: "button",
@@ -3483,22 +3736,22 @@ var DateRangeField = ({
3483
3736
  const today2 = todayFn();
3484
3737
  const committedStart = value?.start ? isoToDate2(value.start) : null;
3485
3738
  const committedEnd = value?.end ? isoToDate2(value.end) : null;
3486
- const [open, setOpen] = useState7(false);
3487
- const [draftStart, setDraftStart] = useState7(committedStart);
3488
- const [draftEnd, setDraftEnd] = useState7(committedEnd);
3489
- const [activePreset, setActivePreset] = useState7(
3739
+ const [open, setOpen] = useState8(false);
3740
+ const [draftStart, setDraftStart] = useState8(committedStart);
3741
+ const [draftEnd, setDraftEnd] = useState8(committedEnd);
3742
+ const [activePreset, setActivePreset] = useState8(
3490
3743
  () => detectPreset(committedStart, committedEnd)
3491
3744
  );
3492
- const [startInputStr, setStartInputStr] = useState7(() => committedStart ? formatShort(committedStart) : "");
3493
- const [endInputStr, setEndInputStr] = useState7(() => committedEnd ? formatShort(committedEnd) : "");
3494
- const [inlineCal, setInlineCal] = useState7(null);
3495
- const [hoverDate, setHoverDate] = useState7(null);
3496
- const [selecting, setSelecting] = useState7("start");
3497
- const [leftViewYear, setLeftViewYear] = useState7(() => today2.getFullYear());
3498
- const [leftViewMonth, setLeftViewMonth] = useState7(() => today2.getMonth());
3499
- const containerRef = useRef6(null);
3500
- const inputId = useRef6(`rf-dr-${Math.random().toString(36).substr(2, 9)}`).current;
3501
- useEffect7(() => {
3745
+ const [startInputStr, setStartInputStr] = useState8(() => committedStart ? formatShort(committedStart) : "");
3746
+ const [endInputStr, setEndInputStr] = useState8(() => committedEnd ? formatShort(committedEnd) : "");
3747
+ const [inlineCal, setInlineCal] = useState8(null);
3748
+ const [hoverDate, setHoverDate] = useState8(null);
3749
+ const [selecting, setSelecting] = useState8("start");
3750
+ const [leftViewYear, setLeftViewYear] = useState8(() => today2.getFullYear());
3751
+ const [leftViewMonth, setLeftViewMonth] = useState8(() => today2.getMonth());
3752
+ const containerRef = useRef7(null);
3753
+ const inputId = useRef7(`rf-dr-${Math.random().toString(36).substr(2, 9)}`).current;
3754
+ useEffect8(() => {
3502
3755
  const s2 = value?.start ? isoToDate2(value.start) : null;
3503
3756
  const e = value?.end ? isoToDate2(value.end) : null;
3504
3757
  setDraftStart(s2);
@@ -3507,10 +3760,10 @@ var DateRangeField = ({
3507
3760
  setEndInputStr(e ? formatShort(e) : "");
3508
3761
  setActivePreset(detectPreset(s2, e));
3509
3762
  }, [value?.start, value?.end]);
3510
- useEffect7(() => {
3763
+ useEffect8(() => {
3511
3764
  setActivePreset(detectPreset(draftStart, draftEnd));
3512
3765
  }, [draftStart?.getTime(), draftEnd?.getTime()]);
3513
- useEffect7(() => {
3766
+ useEffect8(() => {
3514
3767
  if (!open) return;
3515
3768
  const handler = (e) => {
3516
3769
  if (containerRef.current && !containerRef.current.contains(e.target)) {
@@ -3652,7 +3905,7 @@ var DateRangeField = ({
3652
3905
  className
3653
3906
  ].filter(Boolean).join(" ");
3654
3907
  const inputPlaceholder = variant === "outlined" ? " " : void 0;
3655
- return /* @__PURE__ */ React72.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React72.createElement(
3908
+ return /* @__PURE__ */ React73.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React73.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React73.createElement(
3656
3909
  "div",
3657
3910
  {
3658
3911
  className: "rf-text-field__wrapper",
@@ -3661,7 +3914,7 @@ var DateRangeField = ({
3661
3914
  },
3662
3915
  style: { cursor: disabled ? "default" : "pointer" }
3663
3916
  },
3664
- /* @__PURE__ */ React72.createElement(
3917
+ /* @__PURE__ */ React73.createElement(
3665
3918
  "input",
3666
3919
  {
3667
3920
  id: inputId,
@@ -3677,7 +3930,7 @@ var DateRangeField = ({
3677
3930
  }
3678
3931
  }
3679
3932
  ),
3680
- /* @__PURE__ */ React72.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React72.createElement(
3933
+ /* @__PURE__ */ React73.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React73.createElement(
3681
3934
  "button",
3682
3935
  {
3683
3936
  type: "button",
@@ -3690,13 +3943,13 @@ var DateRangeField = ({
3690
3943
  },
3691
3944
  "aria-label": "Pick date range"
3692
3945
  },
3693
- /* @__PURE__ */ React72.createElement(CalendarIcon2, null)
3946
+ /* @__PURE__ */ React73.createElement(CalendarIcon2, null)
3694
3947
  )),
3695
- label && /* @__PURE__ */ React72.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React72.createElement("span", { className: "rf-text-field__asterisk" }, "*")),
3696
- 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" }))
3948
+ label && /* @__PURE__ */ React73.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React73.createElement("span", { className: "rf-text-field__asterisk" }, "*")),
3949
+ 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" }))
3697
3950
  ), open && !disabled && (pickerType === "panel" ? (
3698
3951
  /* ── Panel Mode ── */
3699
- /* @__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(
3952
+ /* @__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(
3700
3953
  "button",
3701
3954
  {
3702
3955
  type: "button",
@@ -3707,7 +3960,7 @@ var DateRangeField = ({
3707
3960
  onClick: () => handlePreset(p.id)
3708
3961
  },
3709
3962
  p.label
3710
- )))), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__manual" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React72.createElement(
3963
+ )))), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__manual" }, /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React73.createElement(
3711
3964
  "div",
3712
3965
  {
3713
3966
  className: [
@@ -3715,8 +3968,8 @@ var DateRangeField = ({
3715
3968
  inlineCal === "start" ? "rf-dr-picker__date-field--active" : ""
3716
3969
  ].filter(Boolean).join(" ")
3717
3970
  },
3718
- /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-picker__date-floating-label" }, "Start Date"),
3719
- /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__date-display" }, /* @__PURE__ */ React72.createElement(
3971
+ /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-picker__date-floating-label" }, "Start Date"),
3972
+ /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__date-display" }, /* @__PURE__ */ React73.createElement(
3720
3973
  "input",
3721
3974
  {
3722
3975
  type: "text",
@@ -3727,7 +3980,7 @@ var DateRangeField = ({
3727
3980
  onBlur: handleStartInputBlur,
3728
3981
  onMouseDown: (e) => e.stopPropagation()
3729
3982
  }
3730
- ), /* @__PURE__ */ React72.createElement(
3983
+ ), /* @__PURE__ */ React73.createElement(
3731
3984
  "button",
3732
3985
  {
3733
3986
  type: "button",
@@ -3736,9 +3989,9 @@ var DateRangeField = ({
3736
3989
  onClick: () => setInlineCal((v) => v === "start" ? null : "start"),
3737
3990
  "aria-label": "Pick start date"
3738
3991
  },
3739
- /* @__PURE__ */ React72.createElement(CalendarIcon2, null)
3992
+ /* @__PURE__ */ React73.createElement(CalendarIcon2, null)
3740
3993
  ))
3741
- ), inlineCal === "start" && /* @__PURE__ */ React72.createElement(
3994
+ ), inlineCal === "start" && /* @__PURE__ */ React73.createElement(
3742
3995
  MiniCalendar,
3743
3996
  {
3744
3997
  selectedDate: draftStart,
@@ -3749,7 +4002,7 @@ var DateRangeField = ({
3749
4002
  },
3750
4003
  onClose: () => setInlineCal(null)
3751
4004
  }
3752
- )), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React72.createElement(
4005
+ )), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React73.createElement(
3753
4006
  "div",
3754
4007
  {
3755
4008
  className: [
@@ -3757,8 +4010,8 @@ var DateRangeField = ({
3757
4010
  inlineCal === "end" ? "rf-dr-picker__date-field--active" : ""
3758
4011
  ].filter(Boolean).join(" ")
3759
4012
  },
3760
- /* @__PURE__ */ React72.createElement("span", { className: "rf-dr-picker__date-floating-label" }, "End Date"),
3761
- /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__date-display" }, /* @__PURE__ */ React72.createElement(
4013
+ /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-picker__date-floating-label" }, "End Date"),
4014
+ /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__date-display" }, /* @__PURE__ */ React73.createElement(
3762
4015
  "input",
3763
4016
  {
3764
4017
  type: "text",
@@ -3769,7 +4022,7 @@ var DateRangeField = ({
3769
4022
  onBlur: handleEndInputBlur,
3770
4023
  onMouseDown: (e) => e.stopPropagation()
3771
4024
  }
3772
- ), /* @__PURE__ */ React72.createElement(
4025
+ ), /* @__PURE__ */ React73.createElement(
3773
4026
  "button",
3774
4027
  {
3775
4028
  type: "button",
@@ -3778,9 +4031,9 @@ var DateRangeField = ({
3778
4031
  onClick: () => setInlineCal((v) => v === "end" ? null : "end"),
3779
4032
  "aria-label": "Pick end date"
3780
4033
  },
3781
- /* @__PURE__ */ React72.createElement(CalendarIcon2, null)
4034
+ /* @__PURE__ */ React73.createElement(CalendarIcon2, null)
3782
4035
  ))
3783
- ), inlineCal === "end" && /* @__PURE__ */ React72.createElement(
4036
+ ), inlineCal === "end" && /* @__PURE__ */ React73.createElement(
3784
4037
  MiniCalendar,
3785
4038
  {
3786
4039
  selectedDate: draftEnd,
@@ -3791,7 +4044,7 @@ var DateRangeField = ({
3791
4044
  },
3792
4045
  onClose: () => setInlineCal(null)
3793
4046
  }
3794
- )), !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(
4047
+ )), !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(
3795
4048
  "input",
3796
4049
  {
3797
4050
  type: "number",
@@ -3802,7 +4055,7 @@ var DateRangeField = ({
3802
4055
  onMouseDown: (e) => e.stopPropagation(),
3803
4056
  placeholder: "\u2014"
3804
4057
  }
3805
- )), /* @__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(
4058
+ )), /* @__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(
3806
4059
  "input",
3807
4060
  {
3808
4061
  type: "number",
@@ -3813,10 +4066,10 @@ var DateRangeField = ({
3813
4066
  onMouseDown: (e) => e.stopPropagation(),
3814
4067
  placeholder: "\u2014"
3815
4068
  }
3816
- ))), /* @__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"))))
4069
+ ))), /* @__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"))))
3817
4070
  ) : (
3818
4071
  /* ── Calendar Mode ── */
3819
- /* @__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(
4072
+ /* @__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(
3820
4073
  RangeCalendarBody,
3821
4074
  {
3822
4075
  viewYear: leftViewYear,
@@ -3831,7 +4084,7 @@ var DateRangeField = ({
3831
4084
  onNext: nextMonth,
3832
4085
  showNext: false
3833
4086
  }
3834
- ), /* @__PURE__ */ React72.createElement("div", { className: "rf-dr-picker__cal-col-divider" }), /* @__PURE__ */ React72.createElement(
4087
+ ), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__cal-col-divider" }), /* @__PURE__ */ React73.createElement(
3835
4088
  RangeCalendarBody,
3836
4089
  {
3837
4090
  viewYear: rightViewYear,
@@ -3846,19 +4099,19 @@ var DateRangeField = ({
3846
4099
  onNext: nextMonth,
3847
4100
  showPrev: false
3848
4101
  }
3849
- )), 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")))
3850
- ))), helperText && /* @__PURE__ */ React72.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
4102
+ )), 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")))
4103
+ ))), helperText && /* @__PURE__ */ React73.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
3851
4104
  };
3852
4105
  DateRangeField.displayName = "DateRangeField";
3853
4106
 
3854
4107
  // lib/Progress/RufousLogoLoader.tsx
3855
- import * as React73 from "react";
4108
+ import * as React74 from "react";
3856
4109
  var _uid = 0;
3857
4110
  var RufousLogoLoader = ({ size = 80, sx, className }) => {
3858
- const clipId = React73.useRef(`rll-${++_uid}`).current;
4111
+ const clipId = React74.useRef(`rll-${++_uid}`).current;
3859
4112
  const height = size * (38.795 / 54.585);
3860
4113
  const sxClass = useSx(sx);
3861
- return /* @__PURE__ */ React73.createElement("div", { className: ["rufous-logo-loader", sxClass, className].filter(Boolean).join(" "), style: { width: size, height } }, /* @__PURE__ */ React73.createElement(
4114
+ return /* @__PURE__ */ React74.createElement("div", { className: ["rufous-logo-loader", sxClass, className].filter(Boolean).join(" "), style: { width: size, height } }, /* @__PURE__ */ React74.createElement(
3862
4115
  "svg",
3863
4116
  {
3864
4117
  xmlns: "http://www.w3.org/2000/svg",
@@ -3867,14 +4120,14 @@ var RufousLogoLoader = ({ size = 80, sx, className }) => {
3867
4120
  height,
3868
4121
  className: "rufous-logo-loader__svg"
3869
4122
  },
3870
- /* @__PURE__ */ React73.createElement("defs", null, /* @__PURE__ */ React73.createElement("clipPath", { id: clipId }, /* @__PURE__ */ React73.createElement(
4123
+ /* @__PURE__ */ React74.createElement("defs", null, /* @__PURE__ */ React74.createElement("clipPath", { id: clipId }, /* @__PURE__ */ React74.createElement(
3871
4124
  "path",
3872
4125
  {
3873
4126
  transform: "translate(2208 18.205)",
3874
4127
  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"
3875
4128
  }
3876
4129
  ))),
3877
- /* @__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" })))
4130
+ /* @__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" })))
3878
4131
  ));
3879
4132
  };
3880
4133
 
@@ -3898,238 +4151,6 @@ import {
3898
4151
  Trash2,
3899
4152
  Plus
3900
4153
  } from "lucide-react";
3901
-
3902
- // lib/Tooltip/Tooltip.tsx
3903
- import React74, {
3904
- useCallback as useCallback3,
3905
- useEffect as useEffect8,
3906
- useRef as useRef8,
3907
- useState as useState8
3908
- } from "react";
3909
- import ReactDOM3 from "react-dom";
3910
- var GAP = 8;
3911
- function computePosition(anchor, tooltip, placement) {
3912
- const { top: aTop, left: aLeft, width: aW, height: aH } = anchor;
3913
- const { width: tW, height: tH } = tooltip;
3914
- let top = 0;
3915
- let left = 0;
3916
- let arrowLeft;
3917
- let arrowTop;
3918
- switch (placement) {
3919
- case "top":
3920
- top = aTop - tH - GAP;
3921
- left = aLeft + aW / 2 - tW / 2;
3922
- arrowLeft = tW / 2 - 4;
3923
- break;
3924
- case "top-start":
3925
- top = aTop - tH - GAP;
3926
- left = aLeft;
3927
- arrowLeft = Math.min(aW / 2, tW - 16);
3928
- break;
3929
- case "top-end":
3930
- top = aTop - tH - GAP;
3931
- left = aLeft + aW - tW;
3932
- arrowLeft = Math.max(tW - aW / 2 - 4, 8);
3933
- break;
3934
- case "bottom":
3935
- top = aTop + aH + GAP;
3936
- left = aLeft + aW / 2 - tW / 2;
3937
- arrowLeft = tW / 2 - 4;
3938
- break;
3939
- case "bottom-start":
3940
- top = aTop + aH + GAP;
3941
- left = aLeft;
3942
- arrowLeft = Math.min(aW / 2, tW - 16);
3943
- break;
3944
- case "bottom-end":
3945
- top = aTop + aH + GAP;
3946
- left = aLeft + aW - tW;
3947
- arrowLeft = Math.max(tW - aW / 2 - 4, 8);
3948
- break;
3949
- case "left":
3950
- top = aTop + aH / 2 - tH / 2;
3951
- left = aLeft - tW - GAP;
3952
- arrowTop = tH / 2 - 4;
3953
- break;
3954
- case "left-start":
3955
- top = aTop;
3956
- left = aLeft - tW - GAP;
3957
- arrowTop = Math.min(aH / 2, tH - 16);
3958
- break;
3959
- case "left-end":
3960
- top = aTop + aH - tH;
3961
- left = aLeft - tW - GAP;
3962
- arrowTop = Math.max(tH - aH / 2 - 4, 8);
3963
- break;
3964
- case "right":
3965
- top = aTop + aH / 2 - tH / 2;
3966
- left = aLeft + aW + GAP;
3967
- arrowTop = tH / 2 - 4;
3968
- break;
3969
- case "right-start":
3970
- top = aTop;
3971
- left = aLeft + aW + GAP;
3972
- arrowTop = Math.min(aH / 2, tH - 16);
3973
- break;
3974
- case "right-end":
3975
- top = aTop + aH - tH;
3976
- left = aLeft + aW + GAP;
3977
- arrowTop = Math.max(tH - aH / 2 - 4, 8);
3978
- break;
3979
- default:
3980
- top = aTop - tH - GAP;
3981
- left = aLeft + aW / 2 - tW / 2;
3982
- }
3983
- const vw = window.innerWidth;
3984
- const vh = window.innerHeight;
3985
- left = Math.max(8, Math.min(left, vw - tW - 8));
3986
- top = Math.max(8, Math.min(top, vh - tH - 8));
3987
- return { top, left, arrowLeft, arrowTop };
3988
- }
3989
- var Tooltip = ({
3990
- title,
3991
- placement = "top",
3992
- arrow = false,
3993
- open: controlledOpen,
3994
- disableHoverListener = false,
3995
- disableFocusListener = false,
3996
- enterDelay = 100,
3997
- leaveDelay = 0,
3998
- children,
3999
- followCursor = false,
4000
- className = "",
4001
- style,
4002
- sx
4003
- }) => {
4004
- const sxClass = useSx(sx);
4005
- const [internalOpen, setInternalOpen] = useState8(false);
4006
- const [position, setPosition] = useState8({ top: 0, left: 0 });
4007
- const anchorRef = useRef8(null);
4008
- const tooltipRef = useRef8(null);
4009
- const enterTimer = useRef8(null);
4010
- const leaveTimer = useRef8(null);
4011
- const cursorPos = useRef8({ x: 0, y: 0 });
4012
- const isOpen = controlledOpen !== void 0 ? controlledOpen : internalOpen;
4013
- const clearTimers = useCallback3(() => {
4014
- if (enterTimer.current) clearTimeout(enterTimer.current);
4015
- if (leaveTimer.current) clearTimeout(leaveTimer.current);
4016
- }, []);
4017
- const updatePosition = useCallback3(() => {
4018
- if (!anchorRef.current || !tooltipRef.current) return;
4019
- const anchorRect = anchorRef.current.getBoundingClientRect();
4020
- const tooltipRect = tooltipRef.current.getBoundingClientRect();
4021
- if (followCursor) {
4022
- const fakeRect = {
4023
- top: cursorPos.current.y,
4024
- left: cursorPos.current.x,
4025
- right: cursorPos.current.x,
4026
- bottom: cursorPos.current.y,
4027
- width: 0,
4028
- height: 0,
4029
- x: cursorPos.current.x,
4030
- y: cursorPos.current.y,
4031
- toJSON: () => ({})
4032
- };
4033
- setPosition(computePosition(fakeRect, tooltipRect, placement));
4034
- } else {
4035
- setPosition(computePosition(anchorRect, tooltipRect, placement));
4036
- }
4037
- }, [placement, followCursor]);
4038
- useEffect8(() => {
4039
- if (isOpen) {
4040
- requestAnimationFrame(() => {
4041
- updatePosition();
4042
- });
4043
- }
4044
- }, [isOpen, updatePosition]);
4045
- const handleOpen = useCallback3(() => {
4046
- clearTimers();
4047
- if (enterDelay > 0) {
4048
- enterTimer.current = setTimeout(() => {
4049
- setInternalOpen(true);
4050
- }, enterDelay);
4051
- } else {
4052
- setInternalOpen(true);
4053
- }
4054
- }, [enterDelay, clearTimers]);
4055
- const handleClose = useCallback3(() => {
4056
- clearTimers();
4057
- if (leaveDelay > 0) {
4058
- leaveTimer.current = setTimeout(() => {
4059
- setInternalOpen(false);
4060
- }, leaveDelay);
4061
- } else {
4062
- setInternalOpen(false);
4063
- }
4064
- }, [leaveDelay, clearTimers]);
4065
- const handleMouseMove = useCallback3(
4066
- (e) => {
4067
- cursorPos.current = { x: e.clientX, y: e.clientY };
4068
- if (isOpen && followCursor) {
4069
- updatePosition();
4070
- }
4071
- },
4072
- [isOpen, followCursor, updatePosition]
4073
- );
4074
- useEffect8(() => {
4075
- return () => clearTimers();
4076
- }, [clearTimers]);
4077
- const childProps = {};
4078
- if (!disableHoverListener) {
4079
- childProps.onMouseEnter = handleOpen;
4080
- childProps.onMouseLeave = handleClose;
4081
- childProps.onMouseMove = followCursor ? handleMouseMove : void 0;
4082
- }
4083
- if (!disableFocusListener) {
4084
- childProps.onFocus = handleOpen;
4085
- childProps.onBlur = handleClose;
4086
- }
4087
- const tooltipClasses = [
4088
- "rf-tooltip",
4089
- `rf-tooltip--placement-${placement}`,
4090
- isOpen ? "rf-tooltip--visible" : "",
4091
- sxClass,
4092
- className
4093
- ].filter(Boolean).join(" ");
4094
- const tooltipElement = /* @__PURE__ */ React74.createElement(
4095
- "div",
4096
- {
4097
- ref: tooltipRef,
4098
- className: tooltipClasses,
4099
- style: {
4100
- top: position.top,
4101
- left: position.left,
4102
- ...style
4103
- },
4104
- role: "tooltip",
4105
- "aria-hidden": !isOpen
4106
- },
4107
- title,
4108
- arrow && /* @__PURE__ */ React74.createElement(
4109
- "span",
4110
- {
4111
- className: "rf-tooltip__arrow",
4112
- style: {
4113
- ...position.arrowLeft !== void 0 ? { left: position.arrowLeft } : {},
4114
- ...position.arrowTop !== void 0 ? { top: position.arrowTop } : {}
4115
- }
4116
- }
4117
- )
4118
- );
4119
- return /* @__PURE__ */ React74.createElement(React74.Fragment, null, /* @__PURE__ */ React74.createElement(
4120
- "span",
4121
- {
4122
- ref: anchorRef,
4123
- style: { display: "inline-flex", position: "relative" },
4124
- "aria-describedby": isOpen ? "rf-tooltip" : void 0,
4125
- ...childProps
4126
- },
4127
- React74.cloneElement(children)
4128
- ), ReactDOM3.createPortal(tooltipElement, document.body));
4129
- };
4130
- Tooltip.displayName = "Tooltip";
4131
-
4132
- // lib/DataGrid/DataGrid.tsx
4133
4154
  var getOperatorsForType = (type) => {
4134
4155
  if (type === "date") return [
4135
4156
  { value: "is", label: "is" },