@rufous/ui 0.2.93 → 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.
- package/dist/main.cjs +426 -411
- package/dist/main.js +439 -424
- 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
|
|
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
|
-
|
|
1752
|
-
useRef as useRef3,
|
|
1760
|
+
useCallback,
|
|
1753
1761
|
useEffect as useEffect4,
|
|
1754
|
-
|
|
1762
|
+
useRef as useRef3,
|
|
1763
|
+
useState as useState4
|
|
1755
1764
|
} from "react";
|
|
1756
1765
|
import ReactDOM2 from "react-dom";
|
|
1757
|
-
var
|
|
1758
|
-
|
|
1759
|
-
|
|
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
|
|
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,18 +2053,18 @@ function AutocompleteInner(props, _ref) {
|
|
|
1813
2053
|
onOpen,
|
|
1814
2054
|
onClose
|
|
1815
2055
|
} = props;
|
|
1816
|
-
const [open, setOpen] =
|
|
1817
|
-
const [inputStr, setInputStr] =
|
|
1818
|
-
const [filterQuery, setFilterQuery] =
|
|
1819
|
-
const [focusedIdx, setFocusedIdx] =
|
|
1820
|
-
const [popupStyle, setPopupStyle] =
|
|
1821
|
-
const containerRef =
|
|
1822
|
-
const popupRef =
|
|
1823
|
-
const inputRef =
|
|
1824
|
-
const listRef =
|
|
1825
|
-
const inputId =
|
|
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;
|
|
1826
2066
|
const sxClass = useSx(sx);
|
|
1827
|
-
const calcPopupStyle =
|
|
2067
|
+
const calcPopupStyle = useCallback2(() => {
|
|
1828
2068
|
if (!containerRef.current) return;
|
|
1829
2069
|
const rect = containerRef.current.getBoundingClientRect();
|
|
1830
2070
|
const POPUP_MAX_HEIGHT = 280;
|
|
@@ -1855,11 +2095,11 @@ function AutocompleteInner(props, _ref) {
|
|
|
1855
2095
|
}, []);
|
|
1856
2096
|
const activeInput = controlledInput !== void 0 ? controlledInput : inputStr;
|
|
1857
2097
|
const selectedValues = multiple ? Array.isArray(value) ? value : [] : value != null ? [value] : [];
|
|
1858
|
-
const isEqual =
|
|
2098
|
+
const isEqual = useCallback2(
|
|
1859
2099
|
(a, b) => isOptionEqualToValue ? isOptionEqualToValue(a, b) : defaultIsEqual(a, b),
|
|
1860
2100
|
[isOptionEqualToValue]
|
|
1861
2101
|
);
|
|
1862
|
-
const isSelected =
|
|
2102
|
+
const isSelected = useCallback2(
|
|
1863
2103
|
(opt) => selectedValues.some((v) => isEqual(opt, v)),
|
|
1864
2104
|
[selectedValues, isEqual]
|
|
1865
2105
|
);
|
|
@@ -1886,7 +2126,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
1886
2126
|
filtered.forEach((opt, i) => flatEntries.push({ kind: "option", option: opt, flatIdx: i }));
|
|
1887
2127
|
}
|
|
1888
2128
|
const selectableOptions = flatEntries.filter((e) => e.kind === "option");
|
|
1889
|
-
const openPopup =
|
|
2129
|
+
const openPopup = useCallback2(() => {
|
|
1890
2130
|
if (disabled) return;
|
|
1891
2131
|
calcPopupStyle();
|
|
1892
2132
|
setOpen(true);
|
|
@@ -1894,7 +2134,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
1894
2134
|
setFilterQuery("");
|
|
1895
2135
|
onOpen?.();
|
|
1896
2136
|
}, [disabled, calcPopupStyle, onOpen]);
|
|
1897
|
-
const closePopup =
|
|
2137
|
+
const closePopup = useCallback2((justSelected = false) => {
|
|
1898
2138
|
setOpen(false);
|
|
1899
2139
|
setFocusedIdx(-1);
|
|
1900
2140
|
onClose?.();
|
|
@@ -1903,7 +2143,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
1903
2143
|
onInputChange?.("");
|
|
1904
2144
|
}
|
|
1905
2145
|
}, [freeSolo, multiple, value, onInputChange, onClose]);
|
|
1906
|
-
|
|
2146
|
+
useEffect5(() => {
|
|
1907
2147
|
if (!open) return;
|
|
1908
2148
|
const handleOutside = (e) => {
|
|
1909
2149
|
const target = e.target;
|
|
@@ -1922,7 +2162,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
1922
2162
|
window.removeEventListener("resize", calcPopupStyle);
|
|
1923
2163
|
};
|
|
1924
2164
|
}, [open, closePopup, calcPopupStyle]);
|
|
1925
|
-
|
|
2165
|
+
useEffect5(() => {
|
|
1926
2166
|
if (controlledInput !== void 0) return;
|
|
1927
2167
|
if (!multiple) {
|
|
1928
2168
|
const v = value;
|
|
@@ -2038,7 +2278,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
2038
2278
|
className
|
|
2039
2279
|
].filter(Boolean).join(" ");
|
|
2040
2280
|
const inputPlaceholder = placeholder || (variant === "outlined" ? " " : void 0);
|
|
2041
|
-
return /* @__PURE__ */
|
|
2281
|
+
return /* @__PURE__ */ React70.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React70.createElement(
|
|
2042
2282
|
"div",
|
|
2043
2283
|
{
|
|
2044
2284
|
className: "rf-text-field__wrapper",
|
|
@@ -2049,7 +2289,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
2049
2289
|
}
|
|
2050
2290
|
}
|
|
2051
2291
|
},
|
|
2052
|
-
multiple && visibleTags.map((opt, i) => /* @__PURE__ */
|
|
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(
|
|
2053
2293
|
"button",
|
|
2054
2294
|
{
|
|
2055
2295
|
type: "button",
|
|
@@ -2058,10 +2298,17 @@ function AutocompleteInner(props, _ref) {
|
|
|
2058
2298
|
onClick: (e) => removeTag(opt, e),
|
|
2059
2299
|
tabIndex: -1
|
|
2060
2300
|
},
|
|
2061
|
-
/* @__PURE__ */
|
|
2301
|
+
/* @__PURE__ */ React70.createElement(CloseSmIcon, { size: 12 })
|
|
2062
2302
|
))),
|
|
2063
|
-
hiddenCount > 0 && /* @__PURE__ */
|
|
2064
|
-
|
|
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(
|
|
2065
2312
|
"input",
|
|
2066
2313
|
{
|
|
2067
2314
|
ref: inputRef,
|
|
@@ -2083,9 +2330,9 @@ function AutocompleteInner(props, _ref) {
|
|
|
2083
2330
|
"aria-autocomplete": "list"
|
|
2084
2331
|
}
|
|
2085
2332
|
),
|
|
2086
|
-
label && /* @__PURE__ */
|
|
2087
|
-
variant === "outlined" && /* @__PURE__ */
|
|
2088
|
-
/* @__PURE__ */
|
|
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(
|
|
2089
2336
|
"button",
|
|
2090
2337
|
{
|
|
2091
2338
|
type: "button",
|
|
@@ -2095,8 +2342,8 @@ function AutocompleteInner(props, _ref) {
|
|
|
2095
2342
|
tabIndex: -1,
|
|
2096
2343
|
"aria-label": "Clear"
|
|
2097
2344
|
},
|
|
2098
|
-
/* @__PURE__ */
|
|
2099
|
-
), !freeSolo && /* @__PURE__ */
|
|
2345
|
+
/* @__PURE__ */ React70.createElement(CloseSmIcon, { size: 16 })
|
|
2346
|
+
), !freeSolo && /* @__PURE__ */ React70.createElement(
|
|
2100
2347
|
"button",
|
|
2101
2348
|
{
|
|
2102
2349
|
type: "button",
|
|
@@ -2108,10 +2355,10 @@ function AutocompleteInner(props, _ref) {
|
|
|
2108
2355
|
tabIndex: -1,
|
|
2109
2356
|
"aria-label": open ? "Close" : "Open"
|
|
2110
2357
|
},
|
|
2111
|
-
/* @__PURE__ */
|
|
2358
|
+
/* @__PURE__ */ React70.createElement(ChevronDownIcon, null)
|
|
2112
2359
|
))
|
|
2113
|
-
), helperText && /* @__PURE__ */
|
|
2114
|
-
/* @__PURE__ */
|
|
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 ? (
|
|
2115
2362
|
// Grouped render
|
|
2116
2363
|
(() => {
|
|
2117
2364
|
const rendered = [];
|
|
@@ -2121,7 +2368,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
2121
2368
|
if (entry.kind === "group") {
|
|
2122
2369
|
if (groupItems.length > 0) {
|
|
2123
2370
|
rendered.push(
|
|
2124
|
-
/* @__PURE__ */
|
|
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))
|
|
2125
2372
|
);
|
|
2126
2373
|
groupItems = [];
|
|
2127
2374
|
}
|
|
@@ -2132,7 +2379,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
2132
2379
|
}
|
|
2133
2380
|
if (ei === flatEntries.length - 1 && groupItems.length > 0) {
|
|
2134
2381
|
rendered.push(
|
|
2135
|
-
/* @__PURE__ */
|
|
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))
|
|
2136
2383
|
);
|
|
2137
2384
|
}
|
|
2138
2385
|
});
|
|
@@ -2146,7 +2393,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
2146
2393
|
const focused = focusedIdx === flatIdx;
|
|
2147
2394
|
const optDisabled = getOptionDisabled?.(option) ?? false;
|
|
2148
2395
|
const label2 = getOptionLabel(option);
|
|
2149
|
-
return /* @__PURE__ */
|
|
2396
|
+
return /* @__PURE__ */ React70.createElement(
|
|
2150
2397
|
"li",
|
|
2151
2398
|
{
|
|
2152
2399
|
key: label2 + flatIdx,
|
|
@@ -2165,12 +2412,12 @@ function AutocompleteInner(props, _ref) {
|
|
|
2165
2412
|
onMouseDown: (e) => e.preventDefault(),
|
|
2166
2413
|
onClick: (e) => selectOption(option, e)
|
|
2167
2414
|
},
|
|
2168
|
-
renderOption ? renderOption(option, { selected, focused, index: flatIdx }) : /* @__PURE__ */
|
|
2169
|
-
!renderOption && /* @__PURE__ */
|
|
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))
|
|
2170
2417
|
);
|
|
2171
2418
|
}
|
|
2172
2419
|
}
|
|
2173
|
-
var Autocomplete =
|
|
2420
|
+
var Autocomplete = React70.forwardRef(AutocompleteInner);
|
|
2174
2421
|
Autocomplete.displayName = "Autocomplete";
|
|
2175
2422
|
|
|
2176
2423
|
// lib/TextFields/AddressLookup.tsx
|
|
@@ -2187,16 +2434,16 @@ var AddressLookup = ({
|
|
|
2187
2434
|
token = ""
|
|
2188
2435
|
}) => {
|
|
2189
2436
|
const { theme } = useRufousTheme();
|
|
2190
|
-
const [suggestions, setSuggestions] =
|
|
2191
|
-
const [loading, setLoading] =
|
|
2192
|
-
const [showSuggestions, setShowSuggestions] =
|
|
2193
|
-
const debounceTimeout =
|
|
2194
|
-
const containerRef =
|
|
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);
|
|
2195
2442
|
const apiKey = token || "";
|
|
2196
2443
|
const countries = Country.getAllCountries();
|
|
2197
|
-
const [states, setStates] =
|
|
2198
|
-
const [cities, setCities] =
|
|
2199
|
-
|
|
2444
|
+
const [states, setStates] = useState6([]);
|
|
2445
|
+
const [cities, setCities] = useState6([]);
|
|
2446
|
+
useEffect6(() => {
|
|
2200
2447
|
const handleClickOutside = (event) => {
|
|
2201
2448
|
if (containerRef.current && !containerRef.current.contains(event.target)) {
|
|
2202
2449
|
setShowSuggestions(false);
|
|
@@ -2205,7 +2452,7 @@ var AddressLookup = ({
|
|
|
2205
2452
|
document.addEventListener("mousedown", handleClickOutside);
|
|
2206
2453
|
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
2207
2454
|
}, []);
|
|
2208
|
-
|
|
2455
|
+
useEffect6(() => {
|
|
2209
2456
|
if (value.country) {
|
|
2210
2457
|
const country = countries.find((c) => c.name === value.country);
|
|
2211
2458
|
if (country) {
|
|
@@ -2218,7 +2465,7 @@ var AddressLookup = ({
|
|
|
2218
2465
|
setStates([]);
|
|
2219
2466
|
}
|
|
2220
2467
|
}, [value.country]);
|
|
2221
|
-
|
|
2468
|
+
useEffect6(() => {
|
|
2222
2469
|
if (value.state && value.country) {
|
|
2223
2470
|
const country = countries.find((c) => c.name === value.country);
|
|
2224
2471
|
if (country) {
|
|
@@ -2323,7 +2570,7 @@ var AddressLookup = ({
|
|
|
2323
2570
|
city: ""
|
|
2324
2571
|
});
|
|
2325
2572
|
};
|
|
2326
|
-
return /* @__PURE__ */
|
|
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(
|
|
2327
2574
|
TextField,
|
|
2328
2575
|
{
|
|
2329
2576
|
label,
|
|
@@ -2355,7 +2602,7 @@ var AddressLookup = ({
|
|
|
2355
2602
|
},
|
|
2356
2603
|
onFocus: () => suggestions.length > 0 && setShowSuggestions(true)
|
|
2357
2604
|
}
|
|
2358
|
-
), loading && /* @__PURE__ */
|
|
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(
|
|
2359
2606
|
"div",
|
|
2360
2607
|
{
|
|
2361
2608
|
key: idx,
|
|
@@ -2366,9 +2613,9 @@ var AddressLookup = ({
|
|
|
2366
2613
|
fetchPlaceDetails(option.placePrediction.placeId, mainText);
|
|
2367
2614
|
}
|
|
2368
2615
|
},
|
|
2369
|
-
/* @__PURE__ */
|
|
2370
|
-
/* @__PURE__ */
|
|
2371
|
-
))), error.addressLine1 && /* @__PURE__ */
|
|
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(
|
|
2372
2619
|
TextField,
|
|
2373
2620
|
{
|
|
2374
2621
|
label: "Address Line 2",
|
|
@@ -2377,7 +2624,7 @@ var AddressLookup = ({
|
|
|
2377
2624
|
value: value.addressLine2 || "",
|
|
2378
2625
|
onChange: (e) => handleChange("addressLine2", e.target.value)
|
|
2379
2626
|
}
|
|
2380
|
-
)), layout !== "compact" && /* @__PURE__ */
|
|
2627
|
+
)), layout !== "compact" && /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-l2" }, /* @__PURE__ */ React71.createElement(
|
|
2381
2628
|
TextField,
|
|
2382
2629
|
{
|
|
2383
2630
|
label: "Address Line 2",
|
|
@@ -2386,7 +2633,7 @@ var AddressLookup = ({
|
|
|
2386
2633
|
value: value.addressLine2 || "",
|
|
2387
2634
|
onChange: (e) => handleChange("addressLine2", e.target.value)
|
|
2388
2635
|
}
|
|
2389
|
-
)), /* @__PURE__ */
|
|
2636
|
+
)), /* @__PURE__ */ React71.createElement("div", { className: "address-lookup-grid-item col-country" }, /* @__PURE__ */ React71.createElement(
|
|
2390
2637
|
Autocomplete,
|
|
2391
2638
|
{
|
|
2392
2639
|
options: countries.map((c) => c.name),
|
|
@@ -2397,7 +2644,7 @@ var AddressLookup = ({
|
|
|
2397
2644
|
required,
|
|
2398
2645
|
error: !!error.country
|
|
2399
2646
|
}
|
|
2400
|
-
), error.country && /* @__PURE__ */
|
|
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(
|
|
2401
2648
|
Autocomplete,
|
|
2402
2649
|
{
|
|
2403
2650
|
options: states.map((s2) => s2.name),
|
|
@@ -2408,7 +2655,7 @@ var AddressLookup = ({
|
|
|
2408
2655
|
required,
|
|
2409
2656
|
error: !!error.state
|
|
2410
2657
|
}
|
|
2411
|
-
), error.state && /* @__PURE__ */
|
|
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(
|
|
2412
2659
|
Autocomplete,
|
|
2413
2660
|
{
|
|
2414
2661
|
options: cities.map((c) => c.name),
|
|
@@ -2419,7 +2666,7 @@ var AddressLookup = ({
|
|
|
2419
2666
|
required,
|
|
2420
2667
|
error: !!error.city
|
|
2421
2668
|
}
|
|
2422
|
-
), error.city && /* @__PURE__ */
|
|
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(
|
|
2423
2670
|
TextField,
|
|
2424
2671
|
{
|
|
2425
2672
|
label: "Pincode",
|
|
@@ -2429,16 +2676,16 @@ var AddressLookup = ({
|
|
|
2429
2676
|
required,
|
|
2430
2677
|
onChange: (e) => handleChange("pincode", e.target.value)
|
|
2431
2678
|
}
|
|
2432
|
-
), error.pincode && /* @__PURE__ */
|
|
2679
|
+
), error.pincode && /* @__PURE__ */ React71.createElement("div", { className: "field-error-text" }, error.pincode))));
|
|
2433
2680
|
};
|
|
2434
2681
|
var AddressLookup_default = AddressLookup;
|
|
2435
2682
|
|
|
2436
2683
|
// lib/TextFields/DateField.tsx
|
|
2437
|
-
import
|
|
2438
|
-
useState as
|
|
2439
|
-
useRef as
|
|
2440
|
-
useEffect as
|
|
2441
|
-
useCallback as
|
|
2684
|
+
import React72, {
|
|
2685
|
+
useState as useState7,
|
|
2686
|
+
useRef as useRef6,
|
|
2687
|
+
useEffect as useEffect7,
|
|
2688
|
+
useCallback as useCallback3
|
|
2442
2689
|
} from "react";
|
|
2443
2690
|
import { createPortal } from "react-dom";
|
|
2444
2691
|
var WEEKDAYS = ["SU", "MO", "TU", "WE", "TH", "FR", "SA"];
|
|
@@ -2600,25 +2847,25 @@ var parseTimeFromISO = (iso) => {
|
|
|
2600
2847
|
if (h === 0) h = 12;
|
|
2601
2848
|
return { h, m, ampm };
|
|
2602
2849
|
};
|
|
2603
|
-
var CalendarIcon = () => /* @__PURE__ */
|
|
2604
|
-
var ChevUp = () => /* @__PURE__ */
|
|
2605
|
-
var ChevDown = () => /* @__PURE__ */
|
|
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" }));
|
|
2606
2853
|
var ITEM_H = 36;
|
|
2607
2854
|
var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
|
|
2608
|
-
const listRef =
|
|
2609
|
-
const isInternalScroll =
|
|
2610
|
-
const scrollTimeout =
|
|
2855
|
+
const listRef = useRef6(null);
|
|
2856
|
+
const isInternalScroll = useRef6(false);
|
|
2857
|
+
const scrollTimeout = useRef6(null);
|
|
2611
2858
|
const MULTIPLIER = infinite ? 100 : 1;
|
|
2612
2859
|
const virtualItems = infinite ? Array(MULTIPLIER).fill(items).flat() : items;
|
|
2613
2860
|
const centerOffset = infinite ? Math.floor(MULTIPLIER / 2) * items.length : 0;
|
|
2614
2861
|
const VISUAL_OFFSET = 54;
|
|
2615
|
-
|
|
2862
|
+
useEffect7(() => {
|
|
2616
2863
|
if (listRef.current) {
|
|
2617
2864
|
const targetIndex = centerOffset + selected;
|
|
2618
2865
|
listRef.current.scrollTop = targetIndex * ITEM_H - (infinite ? VISUAL_OFFSET : 0);
|
|
2619
2866
|
}
|
|
2620
2867
|
}, [centerOffset, infinite, selected]);
|
|
2621
|
-
|
|
2868
|
+
useEffect7(() => {
|
|
2622
2869
|
if (listRef.current && !isInternalScroll.current) {
|
|
2623
2870
|
const targetIndex = centerOffset + selected;
|
|
2624
2871
|
listRef.current.scrollTo({
|
|
@@ -2650,15 +2897,15 @@ var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
|
|
|
2650
2897
|
}
|
|
2651
2898
|
}, 100);
|
|
2652
2899
|
};
|
|
2653
|
-
return /* @__PURE__ */
|
|
2900
|
+
return /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__col-wrapper" }, /* @__PURE__ */ React72.createElement(
|
|
2654
2901
|
"div",
|
|
2655
2902
|
{
|
|
2656
2903
|
className: "rf-timescroll__col",
|
|
2657
2904
|
ref: listRef,
|
|
2658
2905
|
onScroll: handleScroll
|
|
2659
2906
|
},
|
|
2660
|
-
!infinite && /* @__PURE__ */
|
|
2661
|
-
virtualItems.map((label, idx) => /* @__PURE__ */
|
|
2907
|
+
!infinite && /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__spacer" }),
|
|
2908
|
+
virtualItems.map((label, idx) => /* @__PURE__ */ React72.createElement(
|
|
2662
2909
|
"div",
|
|
2663
2910
|
{
|
|
2664
2911
|
key: `${label}-${idx}`,
|
|
@@ -2666,8 +2913,8 @@ var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
|
|
|
2666
2913
|
},
|
|
2667
2914
|
label
|
|
2668
2915
|
)),
|
|
2669
|
-
!infinite && /* @__PURE__ */
|
|
2670
|
-
), /* @__PURE__ */
|
|
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" }));
|
|
2671
2918
|
};
|
|
2672
2919
|
var SpinnerPanel = ({
|
|
2673
2920
|
hour,
|
|
@@ -2678,7 +2925,7 @@ var SpinnerPanel = ({
|
|
|
2678
2925
|
onHourInput,
|
|
2679
2926
|
onMinuteInput,
|
|
2680
2927
|
onAmpmToggle
|
|
2681
|
-
}) => /* @__PURE__ */
|
|
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(
|
|
2682
2929
|
"input",
|
|
2683
2930
|
{
|
|
2684
2931
|
type: "number",
|
|
@@ -2689,7 +2936,7 @@ var SpinnerPanel = ({
|
|
|
2689
2936
|
onChange: onHourInput,
|
|
2690
2937
|
onMouseDown: (e) => e.stopPropagation()
|
|
2691
2938
|
}
|
|
2692
|
-
), /* @__PURE__ */
|
|
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(
|
|
2693
2940
|
"input",
|
|
2694
2941
|
{
|
|
2695
2942
|
type: "number",
|
|
@@ -2700,7 +2947,7 @@ var SpinnerPanel = ({
|
|
|
2700
2947
|
onChange: onMinuteInput,
|
|
2701
2948
|
onMouseDown: (e) => e.stopPropagation()
|
|
2702
2949
|
}
|
|
2703
|
-
), /* @__PURE__ */
|
|
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(
|
|
2704
2951
|
"button",
|
|
2705
2952
|
{
|
|
2706
2953
|
type: "button",
|
|
@@ -2709,7 +2956,7 @@ var SpinnerPanel = ({
|
|
|
2709
2956
|
onClick: () => onAmpmToggle("AM")
|
|
2710
2957
|
},
|
|
2711
2958
|
"AM"
|
|
2712
|
-
), /* @__PURE__ */
|
|
2959
|
+
), /* @__PURE__ */ React72.createElement(
|
|
2713
2960
|
"button",
|
|
2714
2961
|
{
|
|
2715
2962
|
type: "button",
|
|
@@ -2731,7 +2978,7 @@ var CalendarBody = ({
|
|
|
2731
2978
|
onMonthSelect,
|
|
2732
2979
|
onYearSelect
|
|
2733
2980
|
}) => {
|
|
2734
|
-
const [pickerView, setPickerView] =
|
|
2981
|
+
const [pickerView, setPickerView] = useState7("calendar");
|
|
2735
2982
|
const handleMonthClick = () => {
|
|
2736
2983
|
setPickerView(pickerView === "month" ? "calendar" : "month");
|
|
2737
2984
|
};
|
|
@@ -2749,21 +2996,21 @@ var CalendarBody = ({
|
|
|
2749
2996
|
const currentYear = todayDate.getFullYear();
|
|
2750
2997
|
const yearStart = viewYear - 6;
|
|
2751
2998
|
const years = Array.from({ length: 16 }, (_, i) => yearStart + i);
|
|
2752
|
-
return /* @__PURE__ */
|
|
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(
|
|
2753
3000
|
"span",
|
|
2754
3001
|
{
|
|
2755
3002
|
className: `rf-date-picker__month-label ${pickerView === "month" ? "rf-date-picker__month-label--active" : ""}`,
|
|
2756
3003
|
onClick: handleMonthClick
|
|
2757
3004
|
},
|
|
2758
3005
|
MONTHS[viewMonth]
|
|
2759
|
-
), /* @__PURE__ */
|
|
3006
|
+
), /* @__PURE__ */ React72.createElement(
|
|
2760
3007
|
"span",
|
|
2761
3008
|
{
|
|
2762
3009
|
className: `rf-date-picker__year-label ${pickerView === "year" ? "rf-date-picker__year-label--active" : ""}`,
|
|
2763
3010
|
onClick: handleYearClick
|
|
2764
3011
|
},
|
|
2765
3012
|
viewYear
|
|
2766
|
-
)), /* @__PURE__ */
|
|
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(
|
|
2767
3014
|
"button",
|
|
2768
3015
|
{
|
|
2769
3016
|
key: m,
|
|
@@ -2776,7 +3023,7 @@ var CalendarBody = ({
|
|
|
2776
3023
|
onClick: () => handleMonthPick(idx)
|
|
2777
3024
|
},
|
|
2778
3025
|
m
|
|
2779
|
-
))), pickerView === "year" && /* @__PURE__ */
|
|
3026
|
+
))), pickerView === "year" && /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__year-grid" }, years.map((y) => /* @__PURE__ */ React72.createElement(
|
|
2780
3027
|
"button",
|
|
2781
3028
|
{
|
|
2782
3029
|
key: y,
|
|
@@ -2789,12 +3036,12 @@ var CalendarBody = ({
|
|
|
2789
3036
|
onClick: () => handleYearPick(y)
|
|
2790
3037
|
},
|
|
2791
3038
|
y
|
|
2792
|
-
))), pickerView === "calendar" && /* @__PURE__ */
|
|
2793
|
-
if (day === null) return /* @__PURE__ */
|
|
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" });
|
|
2794
3041
|
const cellDate = new Date(viewYear, viewMonth, day);
|
|
2795
3042
|
const isSelected = selectedDate ? isSameDay(cellDate, selectedDate) : false;
|
|
2796
3043
|
const isToday = isSameDay(cellDate, todayDate);
|
|
2797
|
-
return /* @__PURE__ */
|
|
3044
|
+
return /* @__PURE__ */ React72.createElement(
|
|
2798
3045
|
"button",
|
|
2799
3046
|
{
|
|
2800
3047
|
key: day,
|
|
@@ -2830,29 +3077,29 @@ var DateField = ({
|
|
|
2830
3077
|
sx
|
|
2831
3078
|
}) => {
|
|
2832
3079
|
const sxClass = useSx(sx);
|
|
2833
|
-
const [open, setOpen] =
|
|
2834
|
-
const [selectedDate, setSelectedDate] =
|
|
2835
|
-
const [hour, setHour] =
|
|
3080
|
+
const [open, setOpen] = useState7(false);
|
|
3081
|
+
const [selectedDate, setSelectedDate] = useState7(() => value ? isoToDate(value) : null);
|
|
3082
|
+
const [hour, setHour] = useState7(() => {
|
|
2836
3083
|
if (value && isDatetimeType(type)) return parseTimeFromISO(value).h;
|
|
2837
3084
|
return 12;
|
|
2838
3085
|
});
|
|
2839
|
-
const [minute, setMinute] =
|
|
3086
|
+
const [minute, setMinute] = useState7(() => {
|
|
2840
3087
|
if (value && isDatetimeType(type)) return parseTimeFromISO(value).m;
|
|
2841
3088
|
return 0;
|
|
2842
3089
|
});
|
|
2843
|
-
const [ampm, setAmpm] =
|
|
3090
|
+
const [ampm, setAmpm] = useState7(() => {
|
|
2844
3091
|
if (value && isDatetimeType(type)) return parseTimeFromISO(value).ampm;
|
|
2845
3092
|
return "AM";
|
|
2846
3093
|
});
|
|
2847
|
-
const [viewYear, setViewYear] =
|
|
3094
|
+
const [viewYear, setViewYear] = useState7(() => {
|
|
2848
3095
|
const base = value ? isoToDate(value) : null;
|
|
2849
3096
|
return base ? base.getFullYear() : today().getFullYear();
|
|
2850
3097
|
});
|
|
2851
|
-
const [viewMonth, setViewMonth] =
|
|
3098
|
+
const [viewMonth, setViewMonth] = useState7(() => {
|
|
2852
3099
|
const base = value ? isoToDate(value) : null;
|
|
2853
3100
|
return base ? base.getMonth() : today().getMonth();
|
|
2854
3101
|
});
|
|
2855
|
-
const [inputStr, setInputStr] =
|
|
3102
|
+
const [inputStr, setInputStr] = useState7(() => {
|
|
2856
3103
|
if (!value) return "";
|
|
2857
3104
|
const d = isoToDate(value);
|
|
2858
3105
|
if (!d) return "";
|
|
@@ -2866,12 +3113,12 @@ var DateField = ({
|
|
|
2866
3113
|
const HOURS = Array.from({ length: 12 }, (_, i) => String(i + 1).padStart(2, "0"));
|
|
2867
3114
|
const MINUTES = Array.from({ length: 60 }, (_, i) => String(i).padStart(2, "0"));
|
|
2868
3115
|
const AMPMS = ["AM", "PM"];
|
|
2869
|
-
const containerRef =
|
|
2870
|
-
const pickerRef =
|
|
2871
|
-
const [dropUp, setDropUp] =
|
|
2872
|
-
const inputId =
|
|
2873
|
-
const isInternalChange =
|
|
2874
|
-
|
|
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(() => {
|
|
2875
3122
|
if (value === void 0) return;
|
|
2876
3123
|
if (isInternalChange.current) {
|
|
2877
3124
|
isInternalChange.current = false;
|
|
@@ -2898,7 +3145,7 @@ var DateField = ({
|
|
|
2898
3145
|
setInputStr(str);
|
|
2899
3146
|
}
|
|
2900
3147
|
}, [value, type]);
|
|
2901
|
-
|
|
3148
|
+
useEffect7(() => {
|
|
2902
3149
|
if (!open) return;
|
|
2903
3150
|
const handler = (e) => {
|
|
2904
3151
|
const target = e.target;
|
|
@@ -2909,14 +3156,14 @@ var DateField = ({
|
|
|
2909
3156
|
document.addEventListener("mousedown", handler);
|
|
2910
3157
|
return () => document.removeEventListener("mousedown", handler);
|
|
2911
3158
|
}, [open]);
|
|
2912
|
-
|
|
3159
|
+
useEffect7(() => {
|
|
2913
3160
|
if (!open || !containerRef.current) return;
|
|
2914
3161
|
const rect = containerRef.current.getBoundingClientRect();
|
|
2915
3162
|
const spaceBelow = window.innerHeight - rect.bottom;
|
|
2916
3163
|
const pickerHeight = 400;
|
|
2917
3164
|
setDropUp(spaceBelow < pickerHeight && rect.top > pickerHeight);
|
|
2918
3165
|
}, [open]);
|
|
2919
|
-
const commitDate =
|
|
3166
|
+
const commitDate = useCallback3((d, h, m, ap) => {
|
|
2920
3167
|
setSelectedDate(d);
|
|
2921
3168
|
if (!d) {
|
|
2922
3169
|
setInputStr("");
|
|
@@ -3067,7 +3314,7 @@ var DateField = ({
|
|
|
3067
3314
|
const inputPlaceholder = placeholder || (variant === "outlined" ? " " : void 0);
|
|
3068
3315
|
const todayDate = today();
|
|
3069
3316
|
const isSideVariant = type === "datetime-side" || type === "datetime-scroll";
|
|
3070
|
-
return /* @__PURE__ */
|
|
3317
|
+
return /* @__PURE__ */ React72.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React72.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React72.createElement(
|
|
3071
3318
|
"div",
|
|
3072
3319
|
{
|
|
3073
3320
|
className: "rf-text-field__wrapper",
|
|
@@ -3076,7 +3323,7 @@ var DateField = ({
|
|
|
3076
3323
|
},
|
|
3077
3324
|
style: { cursor: disabled ? "default" : "pointer" }
|
|
3078
3325
|
},
|
|
3079
|
-
/* @__PURE__ */
|
|
3326
|
+
/* @__PURE__ */ React72.createElement(
|
|
3080
3327
|
"input",
|
|
3081
3328
|
{
|
|
3082
3329
|
id: inputId,
|
|
@@ -3092,7 +3339,7 @@ var DateField = ({
|
|
|
3092
3339
|
}
|
|
3093
3340
|
}
|
|
3094
3341
|
),
|
|
3095
|
-
/* @__PURE__ */
|
|
3342
|
+
/* @__PURE__ */ React72.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React72.createElement(
|
|
3096
3343
|
"button",
|
|
3097
3344
|
{
|
|
3098
3345
|
type: "button",
|
|
@@ -3105,12 +3352,12 @@ var DateField = ({
|
|
|
3105
3352
|
},
|
|
3106
3353
|
"aria-label": "Pick date"
|
|
3107
3354
|
},
|
|
3108
|
-
/* @__PURE__ */
|
|
3355
|
+
/* @__PURE__ */ React72.createElement(CalendarIcon, null)
|
|
3109
3356
|
)),
|
|
3110
|
-
label && /* @__PURE__ */
|
|
3111
|
-
variant === "outlined" && /* @__PURE__ */
|
|
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 ? " *" : "")))
|
|
3112
3359
|
), open && !disabled && createPortal(
|
|
3113
|
-
/* @__PURE__ */
|
|
3360
|
+
/* @__PURE__ */ React72.createElement(
|
|
3114
3361
|
"div",
|
|
3115
3362
|
{
|
|
3116
3363
|
ref: pickerRef,
|
|
@@ -3135,7 +3382,7 @@ var DateField = ({
|
|
|
3135
3382
|
})(),
|
|
3136
3383
|
onMouseDown: (e) => e.preventDefault()
|
|
3137
3384
|
},
|
|
3138
|
-
/* @__PURE__ */
|
|
3385
|
+
/* @__PURE__ */ React72.createElement("div", { className: isSideVariant ? "rf-date-picker__cal-col" : void 0 }, /* @__PURE__ */ React72.createElement(
|
|
3139
3386
|
CalendarBody,
|
|
3140
3387
|
{
|
|
3141
3388
|
viewMonth,
|
|
@@ -3149,7 +3396,7 @@ var DateField = ({
|
|
|
3149
3396
|
onMonthSelect: setViewMonth,
|
|
3150
3397
|
onYearSelect: setViewYear
|
|
3151
3398
|
}
|
|
3152
|
-
), type === "datetime" && /* @__PURE__ */
|
|
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(
|
|
3153
3400
|
SpinnerPanel,
|
|
3154
3401
|
{
|
|
3155
3402
|
hour,
|
|
@@ -3161,8 +3408,8 @@ var DateField = ({
|
|
|
3161
3408
|
onMinuteInput: handleMinuteInput,
|
|
3162
3409
|
onAmpmToggle: handleAmpmToggle
|
|
3163
3410
|
}
|
|
3164
|
-
)), /* @__PURE__ */
|
|
3165
|
-
type === "datetime-side" && /* @__PURE__ */
|
|
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(
|
|
3166
3413
|
SpinnerPanel,
|
|
3167
3414
|
{
|
|
3168
3415
|
hour,
|
|
@@ -3174,22 +3421,22 @@ var DateField = ({
|
|
|
3174
3421
|
onMinuteInput: handleMinuteInput,
|
|
3175
3422
|
onAmpmToggle: handleAmpmToggle
|
|
3176
3423
|
}
|
|
3177
|
-
)), /* @__PURE__ */
|
|
3178
|
-
type === "datetime-scroll" && /* @__PURE__ */
|
|
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(
|
|
3179
3426
|
ScrollColumn,
|
|
3180
3427
|
{
|
|
3181
3428
|
items: HOURS,
|
|
3182
3429
|
selected: hour - 1,
|
|
3183
3430
|
onSelect: handleScrollHour
|
|
3184
3431
|
}
|
|
3185
|
-
), /* @__PURE__ */
|
|
3432
|
+
), /* @__PURE__ */ React72.createElement("div", { className: "rf-timescroll__colon" }, ":"), /* @__PURE__ */ React72.createElement(
|
|
3186
3433
|
ScrollColumn,
|
|
3187
3434
|
{
|
|
3188
3435
|
items: MINUTES,
|
|
3189
3436
|
selected: minute,
|
|
3190
3437
|
onSelect: handleScrollMinute
|
|
3191
3438
|
}
|
|
3192
|
-
), /* @__PURE__ */
|
|
3439
|
+
), /* @__PURE__ */ React72.createElement(
|
|
3193
3440
|
ScrollColumn,
|
|
3194
3441
|
{
|
|
3195
3442
|
items: AMPMS,
|
|
@@ -3197,18 +3444,18 @@ var DateField = ({
|
|
|
3197
3444
|
onSelect: handleScrollAmpm,
|
|
3198
3445
|
infinite: false
|
|
3199
3446
|
}
|
|
3200
|
-
)), /* @__PURE__ */
|
|
3447
|
+
)), /* @__PURE__ */ React72.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm))
|
|
3201
3448
|
),
|
|
3202
3449
|
document.body
|
|
3203
|
-
)), helperText && /* @__PURE__ */
|
|
3450
|
+
)), helperText && /* @__PURE__ */ React72.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
|
|
3204
3451
|
};
|
|
3205
3452
|
DateField.displayName = "DateField";
|
|
3206
3453
|
|
|
3207
3454
|
// lib/TextFields/DateRangeField.tsx
|
|
3208
|
-
import
|
|
3209
|
-
useState as
|
|
3210
|
-
useRef as
|
|
3211
|
-
useEffect as
|
|
3455
|
+
import React73, {
|
|
3456
|
+
useState as useState8,
|
|
3457
|
+
useRef as useRef7,
|
|
3458
|
+
useEffect as useEffect8
|
|
3212
3459
|
} from "react";
|
|
3213
3460
|
var WEEKDAYS2 = ["SU", "MO", "TU", "WE", "TH", "FR", "SA"];
|
|
3214
3461
|
var MONTHS2 = [
|
|
@@ -3334,7 +3581,7 @@ var detectPreset = (start, end) => {
|
|
|
3334
3581
|
if (isSameDay2(start, new Date(2e3, 0, 1)) && isSameDay2(end, today2)) return "all";
|
|
3335
3582
|
return null;
|
|
3336
3583
|
};
|
|
3337
|
-
var CalendarIcon2 = () => /* @__PURE__ */
|
|
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" }));
|
|
3338
3585
|
var RangeCalendarBody = ({
|
|
3339
3586
|
viewYear,
|
|
3340
3587
|
viewMonth,
|
|
@@ -3359,7 +3606,7 @@ var RangeCalendarBody = ({
|
|
|
3359
3606
|
const hasRange = startDate != null && effectiveEnd != null && !isSameDay2(startDate, effectiveEnd);
|
|
3360
3607
|
const lo = startDate && effectiveEnd ? startDate <= effectiveEnd ? startDate : effectiveEnd : null;
|
|
3361
3608
|
const hi = startDate && effectiveEnd ? startDate <= effectiveEnd ? effectiveEnd : startDate : null;
|
|
3362
|
-
return /* @__PURE__ */
|
|
3609
|
+
return /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-calendar" }, /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-calendar__header" }, /* @__PURE__ */ React73.createElement(
|
|
3363
3610
|
"button",
|
|
3364
3611
|
{
|
|
3365
3612
|
type: "button",
|
|
@@ -3369,7 +3616,7 @@ var RangeCalendarBody = ({
|
|
|
3369
3616
|
"aria-label": "Previous month"
|
|
3370
3617
|
},
|
|
3371
3618
|
"\u2039"
|
|
3372
|
-
), /* @__PURE__ */
|
|
3619
|
+
), /* @__PURE__ */ React73.createElement("span", { className: "rf-dr-calendar__month-label" }, MONTHS2[viewMonth], " ", viewYear), /* @__PURE__ */ React73.createElement(
|
|
3373
3620
|
"button",
|
|
3374
3621
|
{
|
|
3375
3622
|
type: "button",
|
|
@@ -3379,9 +3626,9 @@ var RangeCalendarBody = ({
|
|
|
3379
3626
|
"aria-label": "Next month"
|
|
3380
3627
|
},
|
|
3381
3628
|
"\u203A"
|
|
3382
|
-
)), /* @__PURE__ */
|
|
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) => {
|
|
3383
3630
|
if (day === null) {
|
|
3384
|
-
return /* @__PURE__ */
|
|
3631
|
+
return /* @__PURE__ */ React73.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
|
|
3385
3632
|
}
|
|
3386
3633
|
const cellDate = new Date(viewYear, viewMonth, day);
|
|
3387
3634
|
const isStart = startDate ? isSameDay2(cellDate, startDate) : false;
|
|
@@ -3401,7 +3648,7 @@ var RangeCalendarBody = ({
|
|
|
3401
3648
|
isStart || isEnd ? "rf-dr-calendar__day--selected" : "",
|
|
3402
3649
|
isToday && !isStart && !isEnd ? "rf-dr-calendar__day--today" : ""
|
|
3403
3650
|
].filter(Boolean).join(" ");
|
|
3404
|
-
return /* @__PURE__ */
|
|
3651
|
+
return /* @__PURE__ */ React73.createElement(
|
|
3405
3652
|
"div",
|
|
3406
3653
|
{
|
|
3407
3654
|
key: day,
|
|
@@ -3409,7 +3656,7 @@ var RangeCalendarBody = ({
|
|
|
3409
3656
|
onMouseEnter: () => onDayHover(cellDate),
|
|
3410
3657
|
onMouseLeave: () => onDayHover(null)
|
|
3411
3658
|
},
|
|
3412
|
-
/* @__PURE__ */
|
|
3659
|
+
/* @__PURE__ */ React73.createElement(
|
|
3413
3660
|
"button",
|
|
3414
3661
|
{
|
|
3415
3662
|
type: "button",
|
|
@@ -3423,8 +3670,8 @@ var RangeCalendarBody = ({
|
|
|
3423
3670
|
};
|
|
3424
3671
|
var MiniCalendar = ({ selectedDate, todayDate, onSelect, onClose }) => {
|
|
3425
3672
|
const init = selectedDate ?? todayDate;
|
|
3426
|
-
const [viewYear, setViewYear] =
|
|
3427
|
-
const [viewMonth, setViewMonth] =
|
|
3673
|
+
const [viewYear, setViewYear] = useState8(init.getFullYear());
|
|
3674
|
+
const [viewMonth, setViewMonth] = useState8(init.getMonth());
|
|
3428
3675
|
const firstDay = new Date(viewYear, viewMonth, 1).getDay();
|
|
3429
3676
|
const daysInMonth = new Date(viewYear, viewMonth + 1, 0).getDate();
|
|
3430
3677
|
const dayCells = [
|
|
@@ -3443,14 +3690,14 @@ var MiniCalendar = ({ selectedDate, todayDate, onSelect, onClose }) => {
|
|
|
3443
3690
|
setViewYear((y) => y + 1);
|
|
3444
3691
|
} else setViewMonth((m) => m + 1);
|
|
3445
3692
|
};
|
|
3446
|
-
return /* @__PURE__ */
|
|
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) => {
|
|
3447
3694
|
if (day === null) {
|
|
3448
|
-
return /* @__PURE__ */
|
|
3695
|
+
return /* @__PURE__ */ React73.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
|
|
3449
3696
|
}
|
|
3450
3697
|
const cellDate = new Date(viewYear, viewMonth, day);
|
|
3451
3698
|
const isSel = selectedDate ? isSameDay2(cellDate, selectedDate) : false;
|
|
3452
3699
|
const isToday = isSameDay2(cellDate, todayDate);
|
|
3453
|
-
return /* @__PURE__ */
|
|
3700
|
+
return /* @__PURE__ */ React73.createElement("div", { key: day, className: "rf-dr-calendar__cell" }, /* @__PURE__ */ React73.createElement(
|
|
3454
3701
|
"button",
|
|
3455
3702
|
{
|
|
3456
3703
|
type: "button",
|
|
@@ -3489,22 +3736,22 @@ var DateRangeField = ({
|
|
|
3489
3736
|
const today2 = todayFn();
|
|
3490
3737
|
const committedStart = value?.start ? isoToDate2(value.start) : null;
|
|
3491
3738
|
const committedEnd = value?.end ? isoToDate2(value.end) : null;
|
|
3492
|
-
const [open, setOpen] =
|
|
3493
|
-
const [draftStart, setDraftStart] =
|
|
3494
|
-
const [draftEnd, setDraftEnd] =
|
|
3495
|
-
const [activePreset, setActivePreset] =
|
|
3739
|
+
const [open, setOpen] = useState8(false);
|
|
3740
|
+
const [draftStart, setDraftStart] = useState8(committedStart);
|
|
3741
|
+
const [draftEnd, setDraftEnd] = useState8(committedEnd);
|
|
3742
|
+
const [activePreset, setActivePreset] = useState8(
|
|
3496
3743
|
() => detectPreset(committedStart, committedEnd)
|
|
3497
3744
|
);
|
|
3498
|
-
const [startInputStr, setStartInputStr] =
|
|
3499
|
-
const [endInputStr, setEndInputStr] =
|
|
3500
|
-
const [inlineCal, setInlineCal] =
|
|
3501
|
-
const [hoverDate, setHoverDate] =
|
|
3502
|
-
const [selecting, setSelecting] =
|
|
3503
|
-
const [leftViewYear, setLeftViewYear] =
|
|
3504
|
-
const [leftViewMonth, setLeftViewMonth] =
|
|
3505
|
-
const containerRef =
|
|
3506
|
-
const inputId =
|
|
3507
|
-
|
|
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(() => {
|
|
3508
3755
|
const s2 = value?.start ? isoToDate2(value.start) : null;
|
|
3509
3756
|
const e = value?.end ? isoToDate2(value.end) : null;
|
|
3510
3757
|
setDraftStart(s2);
|
|
@@ -3513,10 +3760,10 @@ var DateRangeField = ({
|
|
|
3513
3760
|
setEndInputStr(e ? formatShort(e) : "");
|
|
3514
3761
|
setActivePreset(detectPreset(s2, e));
|
|
3515
3762
|
}, [value?.start, value?.end]);
|
|
3516
|
-
|
|
3763
|
+
useEffect8(() => {
|
|
3517
3764
|
setActivePreset(detectPreset(draftStart, draftEnd));
|
|
3518
3765
|
}, [draftStart?.getTime(), draftEnd?.getTime()]);
|
|
3519
|
-
|
|
3766
|
+
useEffect8(() => {
|
|
3520
3767
|
if (!open) return;
|
|
3521
3768
|
const handler = (e) => {
|
|
3522
3769
|
if (containerRef.current && !containerRef.current.contains(e.target)) {
|
|
@@ -3658,7 +3905,7 @@ var DateRangeField = ({
|
|
|
3658
3905
|
className
|
|
3659
3906
|
].filter(Boolean).join(" ");
|
|
3660
3907
|
const inputPlaceholder = variant === "outlined" ? " " : void 0;
|
|
3661
|
-
return /* @__PURE__ */
|
|
3908
|
+
return /* @__PURE__ */ React73.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React73.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React73.createElement(
|
|
3662
3909
|
"div",
|
|
3663
3910
|
{
|
|
3664
3911
|
className: "rf-text-field__wrapper",
|
|
@@ -3667,7 +3914,7 @@ var DateRangeField = ({
|
|
|
3667
3914
|
},
|
|
3668
3915
|
style: { cursor: disabled ? "default" : "pointer" }
|
|
3669
3916
|
},
|
|
3670
|
-
/* @__PURE__ */
|
|
3917
|
+
/* @__PURE__ */ React73.createElement(
|
|
3671
3918
|
"input",
|
|
3672
3919
|
{
|
|
3673
3920
|
id: inputId,
|
|
@@ -3683,7 +3930,7 @@ var DateRangeField = ({
|
|
|
3683
3930
|
}
|
|
3684
3931
|
}
|
|
3685
3932
|
),
|
|
3686
|
-
/* @__PURE__ */
|
|
3933
|
+
/* @__PURE__ */ React73.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React73.createElement(
|
|
3687
3934
|
"button",
|
|
3688
3935
|
{
|
|
3689
3936
|
type: "button",
|
|
@@ -3696,13 +3943,13 @@ var DateRangeField = ({
|
|
|
3696
3943
|
},
|
|
3697
3944
|
"aria-label": "Pick date range"
|
|
3698
3945
|
},
|
|
3699
|
-
/* @__PURE__ */
|
|
3946
|
+
/* @__PURE__ */ React73.createElement(CalendarIcon2, null)
|
|
3700
3947
|
)),
|
|
3701
|
-
label && /* @__PURE__ */
|
|
3702
|
-
variant === "outlined" && /* @__PURE__ */
|
|
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" }))
|
|
3703
3950
|
), open && !disabled && (pickerType === "panel" ? (
|
|
3704
3951
|
/* ── Panel Mode ── */
|
|
3705
|
-
/* @__PURE__ */
|
|
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(
|
|
3706
3953
|
"button",
|
|
3707
3954
|
{
|
|
3708
3955
|
type: "button",
|
|
@@ -3713,7 +3960,7 @@ var DateRangeField = ({
|
|
|
3713
3960
|
onClick: () => handlePreset(p.id)
|
|
3714
3961
|
},
|
|
3715
3962
|
p.label
|
|
3716
|
-
)))), /* @__PURE__ */
|
|
3963
|
+
)))), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__manual" }, /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React73.createElement(
|
|
3717
3964
|
"div",
|
|
3718
3965
|
{
|
|
3719
3966
|
className: [
|
|
@@ -3721,8 +3968,8 @@ var DateRangeField = ({
|
|
|
3721
3968
|
inlineCal === "start" ? "rf-dr-picker__date-field--active" : ""
|
|
3722
3969
|
].filter(Boolean).join(" ")
|
|
3723
3970
|
},
|
|
3724
|
-
/* @__PURE__ */
|
|
3725
|
-
/* @__PURE__ */
|
|
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(
|
|
3726
3973
|
"input",
|
|
3727
3974
|
{
|
|
3728
3975
|
type: "text",
|
|
@@ -3733,7 +3980,7 @@ var DateRangeField = ({
|
|
|
3733
3980
|
onBlur: handleStartInputBlur,
|
|
3734
3981
|
onMouseDown: (e) => e.stopPropagation()
|
|
3735
3982
|
}
|
|
3736
|
-
), /* @__PURE__ */
|
|
3983
|
+
), /* @__PURE__ */ React73.createElement(
|
|
3737
3984
|
"button",
|
|
3738
3985
|
{
|
|
3739
3986
|
type: "button",
|
|
@@ -3742,9 +3989,9 @@ var DateRangeField = ({
|
|
|
3742
3989
|
onClick: () => setInlineCal((v) => v === "start" ? null : "start"),
|
|
3743
3990
|
"aria-label": "Pick start date"
|
|
3744
3991
|
},
|
|
3745
|
-
/* @__PURE__ */
|
|
3992
|
+
/* @__PURE__ */ React73.createElement(CalendarIcon2, null)
|
|
3746
3993
|
))
|
|
3747
|
-
), inlineCal === "start" && /* @__PURE__ */
|
|
3994
|
+
), inlineCal === "start" && /* @__PURE__ */ React73.createElement(
|
|
3748
3995
|
MiniCalendar,
|
|
3749
3996
|
{
|
|
3750
3997
|
selectedDate: draftStart,
|
|
@@ -3755,7 +4002,7 @@ var DateRangeField = ({
|
|
|
3755
4002
|
},
|
|
3756
4003
|
onClose: () => setInlineCal(null)
|
|
3757
4004
|
}
|
|
3758
|
-
)), /* @__PURE__ */
|
|
4005
|
+
)), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React73.createElement(
|
|
3759
4006
|
"div",
|
|
3760
4007
|
{
|
|
3761
4008
|
className: [
|
|
@@ -3763,8 +4010,8 @@ var DateRangeField = ({
|
|
|
3763
4010
|
inlineCal === "end" ? "rf-dr-picker__date-field--active" : ""
|
|
3764
4011
|
].filter(Boolean).join(" ")
|
|
3765
4012
|
},
|
|
3766
|
-
/* @__PURE__ */
|
|
3767
|
-
/* @__PURE__ */
|
|
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(
|
|
3768
4015
|
"input",
|
|
3769
4016
|
{
|
|
3770
4017
|
type: "text",
|
|
@@ -3775,7 +4022,7 @@ var DateRangeField = ({
|
|
|
3775
4022
|
onBlur: handleEndInputBlur,
|
|
3776
4023
|
onMouseDown: (e) => e.stopPropagation()
|
|
3777
4024
|
}
|
|
3778
|
-
), /* @__PURE__ */
|
|
4025
|
+
), /* @__PURE__ */ React73.createElement(
|
|
3779
4026
|
"button",
|
|
3780
4027
|
{
|
|
3781
4028
|
type: "button",
|
|
@@ -3784,9 +4031,9 @@ var DateRangeField = ({
|
|
|
3784
4031
|
onClick: () => setInlineCal((v) => v === "end" ? null : "end"),
|
|
3785
4032
|
"aria-label": "Pick end date"
|
|
3786
4033
|
},
|
|
3787
|
-
/* @__PURE__ */
|
|
4034
|
+
/* @__PURE__ */ React73.createElement(CalendarIcon2, null)
|
|
3788
4035
|
))
|
|
3789
|
-
), inlineCal === "end" && /* @__PURE__ */
|
|
4036
|
+
), inlineCal === "end" && /* @__PURE__ */ React73.createElement(
|
|
3790
4037
|
MiniCalendar,
|
|
3791
4038
|
{
|
|
3792
4039
|
selectedDate: draftEnd,
|
|
@@ -3797,7 +4044,7 @@ var DateRangeField = ({
|
|
|
3797
4044
|
},
|
|
3798
4045
|
onClose: () => setInlineCal(null)
|
|
3799
4046
|
}
|
|
3800
|
-
)), !inlineCal && /* @__PURE__ */
|
|
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(
|
|
3801
4048
|
"input",
|
|
3802
4049
|
{
|
|
3803
4050
|
type: "number",
|
|
@@ -3808,7 +4055,7 @@ var DateRangeField = ({
|
|
|
3808
4055
|
onMouseDown: (e) => e.stopPropagation(),
|
|
3809
4056
|
placeholder: "\u2014"
|
|
3810
4057
|
}
|
|
3811
|
-
)), /* @__PURE__ */
|
|
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(
|
|
3812
4059
|
"input",
|
|
3813
4060
|
{
|
|
3814
4061
|
type: "number",
|
|
@@ -3819,10 +4066,10 @@ var DateRangeField = ({
|
|
|
3819
4066
|
onMouseDown: (e) => e.stopPropagation(),
|
|
3820
4067
|
placeholder: "\u2014"
|
|
3821
4068
|
}
|
|
3822
|
-
))), /* @__PURE__ */
|
|
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"))))
|
|
3823
4070
|
) : (
|
|
3824
4071
|
/* ── Calendar Mode ── */
|
|
3825
|
-
/* @__PURE__ */
|
|
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(
|
|
3826
4073
|
RangeCalendarBody,
|
|
3827
4074
|
{
|
|
3828
4075
|
viewYear: leftViewYear,
|
|
@@ -3837,7 +4084,7 @@ var DateRangeField = ({
|
|
|
3837
4084
|
onNext: nextMonth,
|
|
3838
4085
|
showNext: false
|
|
3839
4086
|
}
|
|
3840
|
-
), /* @__PURE__ */
|
|
4087
|
+
), /* @__PURE__ */ React73.createElement("div", { className: "rf-dr-picker__cal-col-divider" }), /* @__PURE__ */ React73.createElement(
|
|
3841
4088
|
RangeCalendarBody,
|
|
3842
4089
|
{
|
|
3843
4090
|
viewYear: rightViewYear,
|
|
@@ -3852,19 +4099,19 @@ var DateRangeField = ({
|
|
|
3852
4099
|
onNext: nextMonth,
|
|
3853
4100
|
showPrev: false
|
|
3854
4101
|
}
|
|
3855
|
-
)), selecting === "end" && draftStart && /* @__PURE__ */
|
|
3856
|
-
))), helperText && /* @__PURE__ */
|
|
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));
|
|
3857
4104
|
};
|
|
3858
4105
|
DateRangeField.displayName = "DateRangeField";
|
|
3859
4106
|
|
|
3860
4107
|
// lib/Progress/RufousLogoLoader.tsx
|
|
3861
|
-
import * as
|
|
4108
|
+
import * as React74 from "react";
|
|
3862
4109
|
var _uid = 0;
|
|
3863
4110
|
var RufousLogoLoader = ({ size = 80, sx, className }) => {
|
|
3864
|
-
const clipId =
|
|
4111
|
+
const clipId = React74.useRef(`rll-${++_uid}`).current;
|
|
3865
4112
|
const height = size * (38.795 / 54.585);
|
|
3866
4113
|
const sxClass = useSx(sx);
|
|
3867
|
-
return /* @__PURE__ */
|
|
4114
|
+
return /* @__PURE__ */ React74.createElement("div", { className: ["rufous-logo-loader", sxClass, className].filter(Boolean).join(" "), style: { width: size, height } }, /* @__PURE__ */ React74.createElement(
|
|
3868
4115
|
"svg",
|
|
3869
4116
|
{
|
|
3870
4117
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -3873,14 +4120,14 @@ var RufousLogoLoader = ({ size = 80, sx, className }) => {
|
|
|
3873
4120
|
height,
|
|
3874
4121
|
className: "rufous-logo-loader__svg"
|
|
3875
4122
|
},
|
|
3876
|
-
/* @__PURE__ */
|
|
4123
|
+
/* @__PURE__ */ React74.createElement("defs", null, /* @__PURE__ */ React74.createElement("clipPath", { id: clipId }, /* @__PURE__ */ React74.createElement(
|
|
3877
4124
|
"path",
|
|
3878
4125
|
{
|
|
3879
4126
|
transform: "translate(2208 18.205)",
|
|
3880
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"
|
|
3881
4128
|
}
|
|
3882
4129
|
))),
|
|
3883
|
-
/* @__PURE__ */
|
|
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" })))
|
|
3884
4131
|
));
|
|
3885
4132
|
};
|
|
3886
4133
|
|
|
@@ -3904,238 +4151,6 @@ import {
|
|
|
3904
4151
|
Trash2,
|
|
3905
4152
|
Plus
|
|
3906
4153
|
} from "lucide-react";
|
|
3907
|
-
|
|
3908
|
-
// lib/Tooltip/Tooltip.tsx
|
|
3909
|
-
import React74, {
|
|
3910
|
-
useCallback as useCallback3,
|
|
3911
|
-
useEffect as useEffect8,
|
|
3912
|
-
useRef as useRef8,
|
|
3913
|
-
useState as useState8
|
|
3914
|
-
} from "react";
|
|
3915
|
-
import ReactDOM3 from "react-dom";
|
|
3916
|
-
var GAP = 8;
|
|
3917
|
-
function computePosition(anchor, tooltip, placement) {
|
|
3918
|
-
const { top: aTop, left: aLeft, width: aW, height: aH } = anchor;
|
|
3919
|
-
const { width: tW, height: tH } = tooltip;
|
|
3920
|
-
let top = 0;
|
|
3921
|
-
let left = 0;
|
|
3922
|
-
let arrowLeft;
|
|
3923
|
-
let arrowTop;
|
|
3924
|
-
switch (placement) {
|
|
3925
|
-
case "top":
|
|
3926
|
-
top = aTop - tH - GAP;
|
|
3927
|
-
left = aLeft + aW / 2 - tW / 2;
|
|
3928
|
-
arrowLeft = tW / 2 - 4;
|
|
3929
|
-
break;
|
|
3930
|
-
case "top-start":
|
|
3931
|
-
top = aTop - tH - GAP;
|
|
3932
|
-
left = aLeft;
|
|
3933
|
-
arrowLeft = Math.min(aW / 2, tW - 16);
|
|
3934
|
-
break;
|
|
3935
|
-
case "top-end":
|
|
3936
|
-
top = aTop - tH - GAP;
|
|
3937
|
-
left = aLeft + aW - tW;
|
|
3938
|
-
arrowLeft = Math.max(tW - aW / 2 - 4, 8);
|
|
3939
|
-
break;
|
|
3940
|
-
case "bottom":
|
|
3941
|
-
top = aTop + aH + GAP;
|
|
3942
|
-
left = aLeft + aW / 2 - tW / 2;
|
|
3943
|
-
arrowLeft = tW / 2 - 4;
|
|
3944
|
-
break;
|
|
3945
|
-
case "bottom-start":
|
|
3946
|
-
top = aTop + aH + GAP;
|
|
3947
|
-
left = aLeft;
|
|
3948
|
-
arrowLeft = Math.min(aW / 2, tW - 16);
|
|
3949
|
-
break;
|
|
3950
|
-
case "bottom-end":
|
|
3951
|
-
top = aTop + aH + GAP;
|
|
3952
|
-
left = aLeft + aW - tW;
|
|
3953
|
-
arrowLeft = Math.max(tW - aW / 2 - 4, 8);
|
|
3954
|
-
break;
|
|
3955
|
-
case "left":
|
|
3956
|
-
top = aTop + aH / 2 - tH / 2;
|
|
3957
|
-
left = aLeft - tW - GAP;
|
|
3958
|
-
arrowTop = tH / 2 - 4;
|
|
3959
|
-
break;
|
|
3960
|
-
case "left-start":
|
|
3961
|
-
top = aTop;
|
|
3962
|
-
left = aLeft - tW - GAP;
|
|
3963
|
-
arrowTop = Math.min(aH / 2, tH - 16);
|
|
3964
|
-
break;
|
|
3965
|
-
case "left-end":
|
|
3966
|
-
top = aTop + aH - tH;
|
|
3967
|
-
left = aLeft - tW - GAP;
|
|
3968
|
-
arrowTop = Math.max(tH - aH / 2 - 4, 8);
|
|
3969
|
-
break;
|
|
3970
|
-
case "right":
|
|
3971
|
-
top = aTop + aH / 2 - tH / 2;
|
|
3972
|
-
left = aLeft + aW + GAP;
|
|
3973
|
-
arrowTop = tH / 2 - 4;
|
|
3974
|
-
break;
|
|
3975
|
-
case "right-start":
|
|
3976
|
-
top = aTop;
|
|
3977
|
-
left = aLeft + aW + GAP;
|
|
3978
|
-
arrowTop = Math.min(aH / 2, tH - 16);
|
|
3979
|
-
break;
|
|
3980
|
-
case "right-end":
|
|
3981
|
-
top = aTop + aH - tH;
|
|
3982
|
-
left = aLeft + aW + GAP;
|
|
3983
|
-
arrowTop = Math.max(tH - aH / 2 - 4, 8);
|
|
3984
|
-
break;
|
|
3985
|
-
default:
|
|
3986
|
-
top = aTop - tH - GAP;
|
|
3987
|
-
left = aLeft + aW / 2 - tW / 2;
|
|
3988
|
-
}
|
|
3989
|
-
const vw = window.innerWidth;
|
|
3990
|
-
const vh = window.innerHeight;
|
|
3991
|
-
left = Math.max(8, Math.min(left, vw - tW - 8));
|
|
3992
|
-
top = Math.max(8, Math.min(top, vh - tH - 8));
|
|
3993
|
-
return { top, left, arrowLeft, arrowTop };
|
|
3994
|
-
}
|
|
3995
|
-
var Tooltip = ({
|
|
3996
|
-
title,
|
|
3997
|
-
placement = "top",
|
|
3998
|
-
arrow = false,
|
|
3999
|
-
open: controlledOpen,
|
|
4000
|
-
disableHoverListener = false,
|
|
4001
|
-
disableFocusListener = false,
|
|
4002
|
-
enterDelay = 100,
|
|
4003
|
-
leaveDelay = 0,
|
|
4004
|
-
children,
|
|
4005
|
-
followCursor = false,
|
|
4006
|
-
className = "",
|
|
4007
|
-
style,
|
|
4008
|
-
sx
|
|
4009
|
-
}) => {
|
|
4010
|
-
const sxClass = useSx(sx);
|
|
4011
|
-
const [internalOpen, setInternalOpen] = useState8(false);
|
|
4012
|
-
const [position, setPosition] = useState8({ top: 0, left: 0 });
|
|
4013
|
-
const anchorRef = useRef8(null);
|
|
4014
|
-
const tooltipRef = useRef8(null);
|
|
4015
|
-
const enterTimer = useRef8(null);
|
|
4016
|
-
const leaveTimer = useRef8(null);
|
|
4017
|
-
const cursorPos = useRef8({ x: 0, y: 0 });
|
|
4018
|
-
const isOpen = controlledOpen !== void 0 ? controlledOpen : internalOpen;
|
|
4019
|
-
const clearTimers = useCallback3(() => {
|
|
4020
|
-
if (enterTimer.current) clearTimeout(enterTimer.current);
|
|
4021
|
-
if (leaveTimer.current) clearTimeout(leaveTimer.current);
|
|
4022
|
-
}, []);
|
|
4023
|
-
const updatePosition = useCallback3(() => {
|
|
4024
|
-
if (!anchorRef.current || !tooltipRef.current) return;
|
|
4025
|
-
const anchorRect = anchorRef.current.getBoundingClientRect();
|
|
4026
|
-
const tooltipRect = tooltipRef.current.getBoundingClientRect();
|
|
4027
|
-
if (followCursor) {
|
|
4028
|
-
const fakeRect = {
|
|
4029
|
-
top: cursorPos.current.y,
|
|
4030
|
-
left: cursorPos.current.x,
|
|
4031
|
-
right: cursorPos.current.x,
|
|
4032
|
-
bottom: cursorPos.current.y,
|
|
4033
|
-
width: 0,
|
|
4034
|
-
height: 0,
|
|
4035
|
-
x: cursorPos.current.x,
|
|
4036
|
-
y: cursorPos.current.y,
|
|
4037
|
-
toJSON: () => ({})
|
|
4038
|
-
};
|
|
4039
|
-
setPosition(computePosition(fakeRect, tooltipRect, placement));
|
|
4040
|
-
} else {
|
|
4041
|
-
setPosition(computePosition(anchorRect, tooltipRect, placement));
|
|
4042
|
-
}
|
|
4043
|
-
}, [placement, followCursor]);
|
|
4044
|
-
useEffect8(() => {
|
|
4045
|
-
if (isOpen) {
|
|
4046
|
-
requestAnimationFrame(() => {
|
|
4047
|
-
updatePosition();
|
|
4048
|
-
});
|
|
4049
|
-
}
|
|
4050
|
-
}, [isOpen, updatePosition]);
|
|
4051
|
-
const handleOpen = useCallback3(() => {
|
|
4052
|
-
clearTimers();
|
|
4053
|
-
if (enterDelay > 0) {
|
|
4054
|
-
enterTimer.current = setTimeout(() => {
|
|
4055
|
-
setInternalOpen(true);
|
|
4056
|
-
}, enterDelay);
|
|
4057
|
-
} else {
|
|
4058
|
-
setInternalOpen(true);
|
|
4059
|
-
}
|
|
4060
|
-
}, [enterDelay, clearTimers]);
|
|
4061
|
-
const handleClose = useCallback3(() => {
|
|
4062
|
-
clearTimers();
|
|
4063
|
-
if (leaveDelay > 0) {
|
|
4064
|
-
leaveTimer.current = setTimeout(() => {
|
|
4065
|
-
setInternalOpen(false);
|
|
4066
|
-
}, leaveDelay);
|
|
4067
|
-
} else {
|
|
4068
|
-
setInternalOpen(false);
|
|
4069
|
-
}
|
|
4070
|
-
}, [leaveDelay, clearTimers]);
|
|
4071
|
-
const handleMouseMove = useCallback3(
|
|
4072
|
-
(e) => {
|
|
4073
|
-
cursorPos.current = { x: e.clientX, y: e.clientY };
|
|
4074
|
-
if (isOpen && followCursor) {
|
|
4075
|
-
updatePosition();
|
|
4076
|
-
}
|
|
4077
|
-
},
|
|
4078
|
-
[isOpen, followCursor, updatePosition]
|
|
4079
|
-
);
|
|
4080
|
-
useEffect8(() => {
|
|
4081
|
-
return () => clearTimers();
|
|
4082
|
-
}, [clearTimers]);
|
|
4083
|
-
const childProps = {};
|
|
4084
|
-
if (!disableHoverListener) {
|
|
4085
|
-
childProps.onMouseEnter = handleOpen;
|
|
4086
|
-
childProps.onMouseLeave = handleClose;
|
|
4087
|
-
childProps.onMouseMove = followCursor ? handleMouseMove : void 0;
|
|
4088
|
-
}
|
|
4089
|
-
if (!disableFocusListener) {
|
|
4090
|
-
childProps.onFocus = handleOpen;
|
|
4091
|
-
childProps.onBlur = handleClose;
|
|
4092
|
-
}
|
|
4093
|
-
const tooltipClasses = [
|
|
4094
|
-
"rf-tooltip",
|
|
4095
|
-
`rf-tooltip--placement-${placement}`,
|
|
4096
|
-
isOpen ? "rf-tooltip--visible" : "",
|
|
4097
|
-
sxClass,
|
|
4098
|
-
className
|
|
4099
|
-
].filter(Boolean).join(" ");
|
|
4100
|
-
const tooltipElement = /* @__PURE__ */ React74.createElement(
|
|
4101
|
-
"div",
|
|
4102
|
-
{
|
|
4103
|
-
ref: tooltipRef,
|
|
4104
|
-
className: tooltipClasses,
|
|
4105
|
-
style: {
|
|
4106
|
-
top: position.top,
|
|
4107
|
-
left: position.left,
|
|
4108
|
-
...style
|
|
4109
|
-
},
|
|
4110
|
-
role: "tooltip",
|
|
4111
|
-
"aria-hidden": !isOpen
|
|
4112
|
-
},
|
|
4113
|
-
title,
|
|
4114
|
-
arrow && /* @__PURE__ */ React74.createElement(
|
|
4115
|
-
"span",
|
|
4116
|
-
{
|
|
4117
|
-
className: "rf-tooltip__arrow",
|
|
4118
|
-
style: {
|
|
4119
|
-
...position.arrowLeft !== void 0 ? { left: position.arrowLeft } : {},
|
|
4120
|
-
...position.arrowTop !== void 0 ? { top: position.arrowTop } : {}
|
|
4121
|
-
}
|
|
4122
|
-
}
|
|
4123
|
-
)
|
|
4124
|
-
);
|
|
4125
|
-
return /* @__PURE__ */ React74.createElement(React74.Fragment, null, /* @__PURE__ */ React74.createElement(
|
|
4126
|
-
"span",
|
|
4127
|
-
{
|
|
4128
|
-
ref: anchorRef,
|
|
4129
|
-
style: { display: "inline-flex", position: "relative" },
|
|
4130
|
-
"aria-describedby": isOpen ? "rf-tooltip" : void 0,
|
|
4131
|
-
...childProps
|
|
4132
|
-
},
|
|
4133
|
-
React74.cloneElement(children)
|
|
4134
|
-
), ReactDOM3.createPortal(tooltipElement, document.body));
|
|
4135
|
-
};
|
|
4136
|
-
Tooltip.displayName = "Tooltip";
|
|
4137
|
-
|
|
4138
|
-
// lib/DataGrid/DataGrid.tsx
|
|
4139
4154
|
var getOperatorsForType = (type) => {
|
|
4140
4155
|
if (type === "date") return [
|
|
4141
4156
|
{ value: "is", label: "is" },
|