@l3mpire/ui 2.9.0 → 2.10.0
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/USAGE.md +32 -1
- package/dist/index.d.mts +10 -1
- package/dist/index.d.ts +10 -1
- package/dist/index.js +752 -661
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +750 -661
- package/dist/index.mjs.map +1 -1
- package/package.json +6 -5
- package/src/styles/globals.css +15 -0
package/dist/index.mjs
CHANGED
|
@@ -1759,11 +1759,97 @@ var Checkbox = React14.forwardRef(({ className, label, disabled, id, ...props },
|
|
|
1759
1759
|
});
|
|
1760
1760
|
Checkbox.displayName = "Checkbox";
|
|
1761
1761
|
|
|
1762
|
-
// src/components/ui/
|
|
1762
|
+
// src/components/ui/radio.tsx
|
|
1763
1763
|
import * as React15 from "react";
|
|
1764
|
+
import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
|
|
1765
|
+
import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1766
|
+
var itemStyles = {
|
|
1767
|
+
base: "peer shrink-0 size-4 rounded-full inline-flex items-center justify-center transition-colors cursor-pointer focus-visible:outline-none",
|
|
1768
|
+
unselected: [
|
|
1769
|
+
"bg-radio-unselected-bg",
|
|
1770
|
+
"border border-radio-unselected-border-default",
|
|
1771
|
+
"hover:border-radio-unselected-border-hover",
|
|
1772
|
+
"active:border-radio-unselected-border-pressed",
|
|
1773
|
+
"active:[box-shadow:0_0_0_3px_#316bff26]"
|
|
1774
|
+
],
|
|
1775
|
+
selected: [
|
|
1776
|
+
"data-[state=checked]:bg-radio-selected-bg-default",
|
|
1777
|
+
"data-[state=checked]:border-transparent",
|
|
1778
|
+
"data-[state=checked]:hover:bg-radio-selected-bg-hover",
|
|
1779
|
+
"data-[state=checked]:active:bg-radio-selected-bg-pressed",
|
|
1780
|
+
"data-[state=checked]:active:[box-shadow:0_0_0_3px_#316bff26]"
|
|
1781
|
+
],
|
|
1782
|
+
disabled: [
|
|
1783
|
+
"disabled:pointer-events-none",
|
|
1784
|
+
"disabled:bg-radio-disabled-bg",
|
|
1785
|
+
"disabled:border-radio-disabled-border",
|
|
1786
|
+
"data-[state=checked]:disabled:bg-radio-disabled-bg",
|
|
1787
|
+
"data-[state=checked]:disabled:border-transparent"
|
|
1788
|
+
]
|
|
1789
|
+
};
|
|
1790
|
+
var dotStyle = {
|
|
1791
|
+
default: "bg-radio-selected-dot",
|
|
1792
|
+
disabled: "bg-radio-disabled-dot"
|
|
1793
|
+
};
|
|
1794
|
+
var labelBase3 = "cursor-pointer select-none overflow-hidden text-ellipsis whitespace-nowrap text-sm font-medium leading-sm";
|
|
1795
|
+
var labelColor3 = {
|
|
1796
|
+
default: "text-radio-label-default",
|
|
1797
|
+
disabled: "pointer-events-none text-radio-label-disabled"
|
|
1798
|
+
};
|
|
1799
|
+
var RadioGroup = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
|
|
1800
|
+
RadioGroupPrimitive.Root,
|
|
1801
|
+
{
|
|
1802
|
+
ref,
|
|
1803
|
+
className: cn("flex flex-col gap-base", className),
|
|
1804
|
+
...props
|
|
1805
|
+
}
|
|
1806
|
+
));
|
|
1807
|
+
RadioGroup.displayName = "RadioGroup";
|
|
1808
|
+
var RadioGroupItem = React15.forwardRef(({ className, label, disabled, id, ...props }, ref) => {
|
|
1809
|
+
const innerId = id ?? React15.useId();
|
|
1810
|
+
return /* @__PURE__ */ jsxs14("div", { className: "inline-flex items-center gap-base", children: [
|
|
1811
|
+
/* @__PURE__ */ jsx15(
|
|
1812
|
+
RadioGroupPrimitive.Item,
|
|
1813
|
+
{
|
|
1814
|
+
ref,
|
|
1815
|
+
id: innerId,
|
|
1816
|
+
disabled,
|
|
1817
|
+
className: cn(
|
|
1818
|
+
itemStyles.base,
|
|
1819
|
+
itemStyles.unselected,
|
|
1820
|
+
itemStyles.selected,
|
|
1821
|
+
itemStyles.disabled,
|
|
1822
|
+
className
|
|
1823
|
+
),
|
|
1824
|
+
...props,
|
|
1825
|
+
children: /* @__PURE__ */ jsx15(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx15(
|
|
1826
|
+
"span",
|
|
1827
|
+
{
|
|
1828
|
+
className: cn(
|
|
1829
|
+
"size-1.5 rounded-full transition-opacity",
|
|
1830
|
+
dotStyle[disabled ? "disabled" : "default"]
|
|
1831
|
+
)
|
|
1832
|
+
}
|
|
1833
|
+
) })
|
|
1834
|
+
}
|
|
1835
|
+
),
|
|
1836
|
+
label && /* @__PURE__ */ jsx15(
|
|
1837
|
+
"label",
|
|
1838
|
+
{
|
|
1839
|
+
htmlFor: innerId,
|
|
1840
|
+
className: cn(labelBase3, labelColor3[disabled ? "disabled" : "default"]),
|
|
1841
|
+
children: label
|
|
1842
|
+
}
|
|
1843
|
+
)
|
|
1844
|
+
] });
|
|
1845
|
+
});
|
|
1846
|
+
RadioGroupItem.displayName = "RadioGroupItem";
|
|
1847
|
+
|
|
1848
|
+
// src/components/ui/dropdown-menu.tsx
|
|
1849
|
+
import * as React16 from "react";
|
|
1764
1850
|
import * as DropdownMenuPrimitive2 from "@radix-ui/react-dropdown-menu";
|
|
1765
1851
|
import { Icon as Icon11 } from "@l3mpire/icons";
|
|
1766
|
-
import { jsx as
|
|
1852
|
+
import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1767
1853
|
var textSm = "text-sm font-regular leading-sm";
|
|
1768
1854
|
var textXs = "text-xs font-regular leading-xs";
|
|
1769
1855
|
var textXsMedium = "text-xs font-medium leading-xs";
|
|
@@ -1776,13 +1862,13 @@ var containerStyle = [
|
|
|
1776
1862
|
"p-base",
|
|
1777
1863
|
"shadow-lg"
|
|
1778
1864
|
];
|
|
1779
|
-
var DropdownMenu =
|
|
1780
|
-
({ className, children, ...props }, ref) => /* @__PURE__ */
|
|
1865
|
+
var DropdownMenu = React16.forwardRef(
|
|
1866
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx16("div", { ref, className: cn(containerStyle, className), ...props, children })
|
|
1781
1867
|
);
|
|
1782
1868
|
DropdownMenu.displayName = "DropdownMenu";
|
|
1783
1869
|
var DropdownMenuRoot = DropdownMenuPrimitive2.Root;
|
|
1784
1870
|
var DropdownMenuTrigger = DropdownMenuPrimitive2.Trigger;
|
|
1785
|
-
var DropdownMenuContent =
|
|
1871
|
+
var DropdownMenuContent = React16.forwardRef(({ className, sideOffset = 4, children, ...props }, ref) => /* @__PURE__ */ jsx16(DropdownMenuPrimitive2.Portal, { children: /* @__PURE__ */ jsx16(
|
|
1786
1872
|
DropdownMenuPrimitive2.Content,
|
|
1787
1873
|
{
|
|
1788
1874
|
ref,
|
|
@@ -1801,12 +1887,12 @@ var DropdownMenuContent = React15.forwardRef(({ className, sideOffset = 4, child
|
|
|
1801
1887
|
}
|
|
1802
1888
|
) }));
|
|
1803
1889
|
DropdownMenuContent.displayName = "DropdownMenuContent";
|
|
1804
|
-
var DropdownMenuList =
|
|
1805
|
-
({ className, children, ...props }, ref) => /* @__PURE__ */
|
|
1890
|
+
var DropdownMenuList = React16.forwardRef(
|
|
1891
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx16("div", { ref, className: cn("flex flex-col", className), role: "listbox", ...props, children })
|
|
1806
1892
|
);
|
|
1807
1893
|
DropdownMenuList.displayName = "DropdownMenuList";
|
|
1808
1894
|
var itemStyle = "flex items-center gap-base p-base rounded-base cursor-pointer hover:bg-dropdown-item-hover";
|
|
1809
|
-
var DropdownMenuItem =
|
|
1895
|
+
var DropdownMenuItem = React16.forwardRef(
|
|
1810
1896
|
({
|
|
1811
1897
|
className,
|
|
1812
1898
|
icon,
|
|
@@ -1821,7 +1907,7 @@ var DropdownMenuItem = React15.forwardRef(
|
|
|
1821
1907
|
onClick,
|
|
1822
1908
|
...props
|
|
1823
1909
|
}, ref) => {
|
|
1824
|
-
const handleClick =
|
|
1910
|
+
const handleClick = React16.useCallback(
|
|
1825
1911
|
(e) => {
|
|
1826
1912
|
const target = e.target;
|
|
1827
1913
|
if (!target.closest("button[role='checkbox']")) {
|
|
@@ -1834,7 +1920,7 @@ var DropdownMenuItem = React15.forwardRef(
|
|
|
1834
1920
|
},
|
|
1835
1921
|
[onClick]
|
|
1836
1922
|
);
|
|
1837
|
-
return /* @__PURE__ */
|
|
1923
|
+
return /* @__PURE__ */ jsxs15(
|
|
1838
1924
|
"div",
|
|
1839
1925
|
{
|
|
1840
1926
|
ref,
|
|
@@ -1851,7 +1937,7 @@ var DropdownMenuItem = React15.forwardRef(
|
|
|
1851
1937
|
children,
|
|
1852
1938
|
avatar,
|
|
1853
1939
|
flag,
|
|
1854
|
-
icon && /* @__PURE__ */
|
|
1940
|
+
icon && /* @__PURE__ */ jsx16(
|
|
1855
1941
|
Icon11,
|
|
1856
1942
|
{
|
|
1857
1943
|
icon,
|
|
@@ -1859,9 +1945,9 @@ var DropdownMenuItem = React15.forwardRef(
|
|
|
1859
1945
|
className: "shrink-0 text-dropdown-item-icon"
|
|
1860
1946
|
}
|
|
1861
1947
|
),
|
|
1862
|
-
/* @__PURE__ */
|
|
1863
|
-
/* @__PURE__ */
|
|
1864
|
-
description && /* @__PURE__ */
|
|
1948
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex flex-1 items-center gap-sm min-w-0", children: [
|
|
1949
|
+
/* @__PURE__ */ jsx16("span", { className: cn("truncate shrink-0", textSm, "text-dropdown-item-text"), children: label }),
|
|
1950
|
+
description && /* @__PURE__ */ jsx16("span", { className: cn("truncate", textXs, "text-dropdown-item-secondary"), children: description })
|
|
1865
1951
|
] }),
|
|
1866
1952
|
badge,
|
|
1867
1953
|
action
|
|
@@ -1871,7 +1957,7 @@ var DropdownMenuItem = React15.forwardRef(
|
|
|
1871
1957
|
}
|
|
1872
1958
|
);
|
|
1873
1959
|
DropdownMenuItem.displayName = "DropdownMenuItem";
|
|
1874
|
-
var DropdownMenuRadixItem =
|
|
1960
|
+
var DropdownMenuRadixItem = React16.forwardRef(
|
|
1875
1961
|
({
|
|
1876
1962
|
className,
|
|
1877
1963
|
icon,
|
|
@@ -1883,7 +1969,7 @@ var DropdownMenuRadixItem = React15.forwardRef(
|
|
|
1883
1969
|
action,
|
|
1884
1970
|
children,
|
|
1885
1971
|
...props
|
|
1886
|
-
}, ref) => /* @__PURE__ */
|
|
1972
|
+
}, ref) => /* @__PURE__ */ jsxs15(
|
|
1887
1973
|
DropdownMenuPrimitive2.Item,
|
|
1888
1974
|
{
|
|
1889
1975
|
ref,
|
|
@@ -1897,7 +1983,7 @@ var DropdownMenuRadixItem = React15.forwardRef(
|
|
|
1897
1983
|
children,
|
|
1898
1984
|
avatar,
|
|
1899
1985
|
flag,
|
|
1900
|
-
icon && /* @__PURE__ */
|
|
1986
|
+
icon && /* @__PURE__ */ jsx16(
|
|
1901
1987
|
Icon11,
|
|
1902
1988
|
{
|
|
1903
1989
|
icon,
|
|
@@ -1905,9 +1991,9 @@ var DropdownMenuRadixItem = React15.forwardRef(
|
|
|
1905
1991
|
className: "shrink-0 text-dropdown-item-icon"
|
|
1906
1992
|
}
|
|
1907
1993
|
),
|
|
1908
|
-
/* @__PURE__ */
|
|
1909
|
-
/* @__PURE__ */
|
|
1910
|
-
description && /* @__PURE__ */
|
|
1994
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex flex-1 items-center gap-sm min-w-0", children: [
|
|
1995
|
+
/* @__PURE__ */ jsx16("span", { className: cn("truncate shrink-0", textSm, "text-dropdown-item-text"), children: label }),
|
|
1996
|
+
description && /* @__PURE__ */ jsx16("span", { className: cn("truncate", textXs, "text-dropdown-item-secondary"), children: description })
|
|
1911
1997
|
] }),
|
|
1912
1998
|
badge,
|
|
1913
1999
|
action
|
|
@@ -1916,7 +2002,7 @@ var DropdownMenuRadixItem = React15.forwardRef(
|
|
|
1916
2002
|
)
|
|
1917
2003
|
);
|
|
1918
2004
|
DropdownMenuRadixItem.displayName = "DropdownMenuRadixItem";
|
|
1919
|
-
var DropdownMenuHeading =
|
|
2005
|
+
var DropdownMenuHeading = React16.forwardRef(({ className, action, children, ...props }, ref) => /* @__PURE__ */ jsxs15(
|
|
1920
2006
|
"div",
|
|
1921
2007
|
{
|
|
1922
2008
|
ref,
|
|
@@ -1926,7 +2012,7 @@ var DropdownMenuHeading = React15.forwardRef(({ className, action, children, ...
|
|
|
1926
2012
|
),
|
|
1927
2013
|
...props,
|
|
1928
2014
|
children: [
|
|
1929
|
-
/* @__PURE__ */
|
|
2015
|
+
/* @__PURE__ */ jsx16("span", { className: cn("flex-1 truncate uppercase", textXsMedium, "text-dropdown-heading-text"), children }),
|
|
1930
2016
|
action
|
|
1931
2017
|
]
|
|
1932
2018
|
}
|
|
@@ -1941,7 +2027,7 @@ var clearStyle = [
|
|
|
1941
2027
|
"shadow-sm",
|
|
1942
2028
|
"cursor-pointer"
|
|
1943
2029
|
];
|
|
1944
|
-
var DropdownMenuClear =
|
|
2030
|
+
var DropdownMenuClear = React16.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx16(
|
|
1945
2031
|
"button",
|
|
1946
2032
|
{
|
|
1947
2033
|
ref,
|
|
@@ -1954,15 +2040,15 @@ var DropdownMenuClear = React15.forwardRef(({ className, children, ...props }, r
|
|
|
1954
2040
|
DropdownMenuClear.displayName = "DropdownMenuClear";
|
|
1955
2041
|
|
|
1956
2042
|
// src/components/ui/sidebar-heading-item.tsx
|
|
1957
|
-
import * as
|
|
1958
|
-
import { jsx as
|
|
1959
|
-
var SidebarHeadingItem =
|
|
2043
|
+
import * as React17 from "react";
|
|
2044
|
+
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
2045
|
+
var SidebarHeadingItem = React17.forwardRef(
|
|
1960
2046
|
({ className, label, ...props }, ref) => {
|
|
1961
2047
|
const { isCollapsed } = useSidebarContext();
|
|
1962
2048
|
if (isCollapsed) {
|
|
1963
|
-
return /* @__PURE__ */
|
|
2049
|
+
return /* @__PURE__ */ jsx17("div", { ref, className: "h-xs w-full", ...props });
|
|
1964
2050
|
}
|
|
1965
|
-
return /* @__PURE__ */
|
|
2051
|
+
return /* @__PURE__ */ jsx17(
|
|
1966
2052
|
"div",
|
|
1967
2053
|
{
|
|
1968
2054
|
ref,
|
|
@@ -1980,10 +2066,10 @@ var SidebarHeadingItem = React16.forwardRef(
|
|
|
1980
2066
|
SidebarHeadingItem.displayName = "SidebarHeadingItem";
|
|
1981
2067
|
|
|
1982
2068
|
// src/components/ui/sidebar-item.tsx
|
|
1983
|
-
import * as
|
|
2069
|
+
import * as React18 from "react";
|
|
1984
2070
|
import { cva as cva10 } from "class-variance-authority";
|
|
1985
2071
|
import { Icon as Icon12, faChevronDownSolid as faChevronDownSolid2, faStarsOutline } from "@l3mpire/icons";
|
|
1986
|
-
import { Fragment as Fragment3, jsx as
|
|
2072
|
+
import { Fragment as Fragment3, jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1987
2073
|
var sidebarItemVariants = cva10(
|
|
1988
2074
|
[
|
|
1989
2075
|
"flex items-center gap-base rounded-base transition-colors cursor-pointer"
|
|
@@ -2006,7 +2092,7 @@ var sidebarItemVariants = cva10(
|
|
|
2006
2092
|
}
|
|
2007
2093
|
}
|
|
2008
2094
|
);
|
|
2009
|
-
var SidebarItem =
|
|
2095
|
+
var SidebarItem = React18.forwardRef(
|
|
2010
2096
|
({
|
|
2011
2097
|
className,
|
|
2012
2098
|
state = "default",
|
|
@@ -2021,7 +2107,7 @@ var SidebarItem = React17.forwardRef(
|
|
|
2021
2107
|
isNew = false,
|
|
2022
2108
|
...props
|
|
2023
2109
|
}, ref) => {
|
|
2024
|
-
const [isHovered, setIsHovered] =
|
|
2110
|
+
const [isHovered, setIsHovered] = React18.useState(false);
|
|
2025
2111
|
const sidebarCtx = useSidebarContext();
|
|
2026
2112
|
const isActive = state === "active";
|
|
2027
2113
|
const resolvedType = type ?? (sidebarCtx.isCollapsed ? "collapsed" : "default");
|
|
@@ -2029,7 +2115,7 @@ var SidebarItem = React17.forwardRef(
|
|
|
2029
2115
|
const useSolid = isActive || state === "hover" || isHovered;
|
|
2030
2116
|
const iconColorClass = isActive ? "text-sidebar-item-active-icon" : "text-sidebar-item-default-icon";
|
|
2031
2117
|
const textColorClass = isActive ? "text-sidebar-item-active-text" : "text-sidebar-item-default-text";
|
|
2032
|
-
return /* @__PURE__ */
|
|
2118
|
+
return /* @__PURE__ */ jsxs16(
|
|
2033
2119
|
"div",
|
|
2034
2120
|
{
|
|
2035
2121
|
ref,
|
|
@@ -2043,7 +2129,7 @@ var SidebarItem = React17.forwardRef(
|
|
|
2043
2129
|
),
|
|
2044
2130
|
...props,
|
|
2045
2131
|
children: [
|
|
2046
|
-
avatar ? /* @__PURE__ */
|
|
2132
|
+
avatar ? /* @__PURE__ */ jsx18("span", { className: "shrink-0", children: avatar }) : icon ? /* @__PURE__ */ jsx18(
|
|
2047
2133
|
Icon12,
|
|
2048
2134
|
{
|
|
2049
2135
|
icon,
|
|
@@ -2053,8 +2139,8 @@ var SidebarItem = React17.forwardRef(
|
|
|
2053
2139
|
className: cn("shrink-0", iconColorClass)
|
|
2054
2140
|
}
|
|
2055
2141
|
) : null,
|
|
2056
|
-
!isCollapsed && /* @__PURE__ */
|
|
2057
|
-
/* @__PURE__ */
|
|
2142
|
+
!isCollapsed && /* @__PURE__ */ jsxs16(Fragment3, { children: [
|
|
2143
|
+
/* @__PURE__ */ jsx18(
|
|
2058
2144
|
"span",
|
|
2059
2145
|
{
|
|
2060
2146
|
className: cn(
|
|
@@ -2064,11 +2150,11 @@ var SidebarItem = React17.forwardRef(
|
|
|
2064
2150
|
children: label
|
|
2065
2151
|
}
|
|
2066
2152
|
),
|
|
2067
|
-
(isNew || hasBadge) && /* @__PURE__ */
|
|
2068
|
-
isNew && /* @__PURE__ */
|
|
2069
|
-
hasBadge && /* @__PURE__ */
|
|
2153
|
+
(isNew || hasBadge) && /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-xs shrink-0", children: [
|
|
2154
|
+
isNew && /* @__PURE__ */ jsx18(Badge, { variant: "light", type: "primary", size: "sm", icon: faStarsOutline, children: "New" }),
|
|
2155
|
+
hasBadge && /* @__PURE__ */ jsx18(Badge, { variant: "solid", type: "critical", size: "sm", children: badgeCount })
|
|
2070
2156
|
] }),
|
|
2071
|
-
hasSubItems && /* @__PURE__ */
|
|
2157
|
+
hasSubItems && /* @__PURE__ */ jsx18(
|
|
2072
2158
|
Icon12,
|
|
2073
2159
|
{
|
|
2074
2160
|
icon: faChevronDownSolid2,
|
|
@@ -2085,7 +2171,7 @@ var SidebarItem = React17.forwardRef(
|
|
|
2085
2171
|
SidebarItem.displayName = "SidebarItem";
|
|
2086
2172
|
|
|
2087
2173
|
// src/components/ui/select.tsx
|
|
2088
|
-
import * as
|
|
2174
|
+
import * as React19 from "react";
|
|
2089
2175
|
import * as PopoverPrimitive from "@radix-ui/react-popover";
|
|
2090
2176
|
import * as TooltipPrimitive2 from "@radix-ui/react-tooltip";
|
|
2091
2177
|
import { cva as cva11 } from "class-variance-authority";
|
|
@@ -2096,7 +2182,7 @@ import {
|
|
|
2096
2182
|
faCircleExclamationOutline,
|
|
2097
2183
|
faXmarkSolid as faXmarkSolid4
|
|
2098
2184
|
} from "@l3mpire/icons";
|
|
2099
|
-
import { jsx as
|
|
2185
|
+
import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2100
2186
|
var selectVariants = cva11(
|
|
2101
2187
|
[
|
|
2102
2188
|
"flex items-center w-full border cursor-pointer transition-colors",
|
|
@@ -2155,10 +2241,10 @@ var errorGuidance = {
|
|
|
2155
2241
|
text: "text-xs font-medium leading-xs text-select-error-text"
|
|
2156
2242
|
};
|
|
2157
2243
|
function SelectChips({ tags, onTagRemove, chipHeightPx }) {
|
|
2158
|
-
const containerRef =
|
|
2159
|
-
const measureRef =
|
|
2160
|
-
const [visibleCount, setVisibleCount] =
|
|
2161
|
-
|
|
2244
|
+
const containerRef = React19.useRef(null);
|
|
2245
|
+
const measureRef = React19.useRef(null);
|
|
2246
|
+
const [visibleCount, setVisibleCount] = React19.useState(tags.length);
|
|
2247
|
+
React19.useLayoutEffect(() => {
|
|
2162
2248
|
const container = containerRef.current;
|
|
2163
2249
|
const measureRow = measureRef.current;
|
|
2164
2250
|
if (!container || !measureRow) return;
|
|
@@ -2200,29 +2286,29 @@ function SelectChips({ tags, onTagRemove, chipHeightPx }) {
|
|
|
2200
2286
|
"text-xs font-medium leading-xs",
|
|
2201
2287
|
"whitespace-nowrap"
|
|
2202
2288
|
);
|
|
2203
|
-
return /* @__PURE__ */
|
|
2204
|
-
/* @__PURE__ */
|
|
2289
|
+
return /* @__PURE__ */ jsxs17("div", { className: "flex flex-1 items-center gap-xs min-w-0 overflow-hidden relative", children: [
|
|
2290
|
+
/* @__PURE__ */ jsx19(
|
|
2205
2291
|
"div",
|
|
2206
2292
|
{
|
|
2207
2293
|
ref: measureRef,
|
|
2208
2294
|
"aria-hidden": true,
|
|
2209
2295
|
className: "absolute flex items-center gap-xs pointer-events-none",
|
|
2210
2296
|
style: { visibility: "hidden", whiteSpace: "nowrap", top: 0, left: 0 },
|
|
2211
|
-
children: tags.map((tag) => /* @__PURE__ */
|
|
2212
|
-
/* @__PURE__ */
|
|
2213
|
-
onTagRemove && /* @__PURE__ */
|
|
2297
|
+
children: tags.map((tag) => /* @__PURE__ */ jsxs17("span", { className: chipClass, style: { height: chipHeightPx }, children: [
|
|
2298
|
+
/* @__PURE__ */ jsx19("span", { className: "truncate max-w-[100px]", children: tag }),
|
|
2299
|
+
onTagRemove && /* @__PURE__ */ jsx19("span", { className: "inline-flex shrink-0 w-3 h-3" })
|
|
2214
2300
|
] }, tag))
|
|
2215
2301
|
}
|
|
2216
2302
|
),
|
|
2217
|
-
/* @__PURE__ */
|
|
2218
|
-
tags.slice(0, visibleCount).map((tag) => /* @__PURE__ */
|
|
2303
|
+
/* @__PURE__ */ jsxs17("div", { ref: containerRef, className: "flex flex-1 items-center gap-xs overflow-hidden", children: [
|
|
2304
|
+
tags.slice(0, visibleCount).map((tag) => /* @__PURE__ */ jsxs17(
|
|
2219
2305
|
"span",
|
|
2220
2306
|
{
|
|
2221
2307
|
className: chipClass,
|
|
2222
2308
|
style: { height: chipHeightPx },
|
|
2223
2309
|
children: [
|
|
2224
|
-
/* @__PURE__ */
|
|
2225
|
-
onTagRemove && /* @__PURE__ */
|
|
2310
|
+
/* @__PURE__ */ jsx19("span", { className: "truncate max-w-[100px]", children: tag }),
|
|
2311
|
+
onTagRemove && /* @__PURE__ */ jsx19(
|
|
2226
2312
|
"button",
|
|
2227
2313
|
{
|
|
2228
2314
|
type: "button",
|
|
@@ -2233,15 +2319,15 @@ function SelectChips({ tags, onTagRemove, chipHeightPx }) {
|
|
|
2233
2319
|
e.preventDefault();
|
|
2234
2320
|
onTagRemove(tag);
|
|
2235
2321
|
},
|
|
2236
|
-
children: /* @__PURE__ */
|
|
2322
|
+
children: /* @__PURE__ */ jsx19(Icon13, { icon: faXmarkSolid4, size: "xs" })
|
|
2237
2323
|
}
|
|
2238
2324
|
)
|
|
2239
2325
|
]
|
|
2240
2326
|
},
|
|
2241
2327
|
tag
|
|
2242
2328
|
)),
|
|
2243
|
-
overflowCount > 0 && /* @__PURE__ */
|
|
2244
|
-
/* @__PURE__ */
|
|
2329
|
+
overflowCount > 0 && /* @__PURE__ */ jsx19(TooltipPrimitive2.Provider, { children: /* @__PURE__ */ jsxs17(TooltipPrimitive2.Root, { children: [
|
|
2330
|
+
/* @__PURE__ */ jsx19(TooltipPrimitive2.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs17(
|
|
2245
2331
|
"span",
|
|
2246
2332
|
{
|
|
2247
2333
|
className: cn(chipClass, "cursor-default"),
|
|
@@ -2252,7 +2338,7 @@ function SelectChips({ tags, onTagRemove, chipHeightPx }) {
|
|
|
2252
2338
|
]
|
|
2253
2339
|
}
|
|
2254
2340
|
) }),
|
|
2255
|
-
/* @__PURE__ */
|
|
2341
|
+
/* @__PURE__ */ jsx19(TooltipPrimitive2.Portal, { children: /* @__PURE__ */ jsxs17(
|
|
2256
2342
|
TooltipPrimitive2.Content,
|
|
2257
2343
|
{
|
|
2258
2344
|
sideOffset: 4,
|
|
@@ -2265,8 +2351,8 @@ function SelectChips({ tags, onTagRemove, chipHeightPx }) {
|
|
|
2265
2351
|
"data-[state=closed]:animate-[tooltip-out_100ms_ease-in]"
|
|
2266
2352
|
),
|
|
2267
2353
|
children: [
|
|
2268
|
-
overflowTags.map((t) => /* @__PURE__ */
|
|
2269
|
-
/* @__PURE__ */
|
|
2354
|
+
overflowTags.map((t) => /* @__PURE__ */ jsx19("span", { children: t }, t)),
|
|
2355
|
+
/* @__PURE__ */ jsx19(TooltipPrimitive2.Arrow, { className: "fill-tooltip-default-bg" })
|
|
2270
2356
|
]
|
|
2271
2357
|
}
|
|
2272
2358
|
) })
|
|
@@ -2274,7 +2360,7 @@ function SelectChips({ tags, onTagRemove, chipHeightPx }) {
|
|
|
2274
2360
|
] })
|
|
2275
2361
|
] });
|
|
2276
2362
|
}
|
|
2277
|
-
var Select =
|
|
2363
|
+
var Select = React19.forwardRef(
|
|
2278
2364
|
({
|
|
2279
2365
|
className,
|
|
2280
2366
|
size,
|
|
@@ -2296,10 +2382,10 @@ var Select = React18.forwardRef(
|
|
|
2296
2382
|
children,
|
|
2297
2383
|
...props
|
|
2298
2384
|
}, ref) => {
|
|
2299
|
-
const autoId =
|
|
2385
|
+
const autoId = React19.useId();
|
|
2300
2386
|
const triggerId = props.id ?? autoId;
|
|
2301
2387
|
const errorId = error && errorMessage ? `${triggerId}-error` : void 0;
|
|
2302
|
-
const [internalOpen, setInternalOpen] =
|
|
2388
|
+
const [internalOpen, setInternalOpen] = React19.useState(false);
|
|
2303
2389
|
const isOpen = controlledOpen ?? internalOpen;
|
|
2304
2390
|
const handleOpenChange = (open) => {
|
|
2305
2391
|
if (disabled) return;
|
|
@@ -2313,15 +2399,15 @@ var Select = React18.forwardRef(
|
|
|
2313
2399
|
const icColor = iconColor[disabled ? "disabled" : "default"];
|
|
2314
2400
|
const triggerState = disabled ? triggerStates.disabled : error ? triggerStates.error : triggerStates.default;
|
|
2315
2401
|
const heightPx = selectHeight[resolvedSize];
|
|
2316
|
-
return /* @__PURE__ */
|
|
2402
|
+
return /* @__PURE__ */ jsxs17(
|
|
2317
2403
|
PopoverPrimitive.Root,
|
|
2318
2404
|
{
|
|
2319
2405
|
open: isOpen,
|
|
2320
2406
|
onOpenChange: handleOpenChange,
|
|
2321
2407
|
children: [
|
|
2322
|
-
/* @__PURE__ */
|
|
2323
|
-
label && /* @__PURE__ */
|
|
2324
|
-
/* @__PURE__ */
|
|
2408
|
+
/* @__PURE__ */ jsxs17("div", { className: "relative flex flex-col gap-xs", children: [
|
|
2409
|
+
label && /* @__PURE__ */ jsx19(InputLabel, { type: labelType, disabled, children: label }),
|
|
2410
|
+
/* @__PURE__ */ jsx19(PopoverPrimitive.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs17(
|
|
2325
2411
|
"button",
|
|
2326
2412
|
{
|
|
2327
2413
|
ref,
|
|
@@ -2343,15 +2429,15 @@ var Select = React18.forwardRef(
|
|
|
2343
2429
|
children: [
|
|
2344
2430
|
avatar,
|
|
2345
2431
|
flag,
|
|
2346
|
-
icon && /* @__PURE__ */
|
|
2347
|
-
tags && tags.length > 0 ? /* @__PURE__ */
|
|
2432
|
+
icon && /* @__PURE__ */ jsx19(Icon13, { icon, size: "sm", className: cn("shrink-0", icColor) }),
|
|
2433
|
+
tags && tags.length > 0 ? /* @__PURE__ */ jsx19(
|
|
2348
2434
|
SelectChips,
|
|
2349
2435
|
{
|
|
2350
2436
|
tags,
|
|
2351
2437
|
onTagRemove,
|
|
2352
2438
|
chipHeightPx: chipHeight[resolvedSize]
|
|
2353
2439
|
}
|
|
2354
|
-
) : /* @__PURE__ */
|
|
2440
|
+
) : /* @__PURE__ */ jsx19(
|
|
2355
2441
|
"span",
|
|
2356
2442
|
{
|
|
2357
2443
|
className: cn(
|
|
@@ -2361,12 +2447,12 @@ var Select = React18.forwardRef(
|
|
|
2361
2447
|
children: hasValue ? value : placeholder
|
|
2362
2448
|
}
|
|
2363
2449
|
),
|
|
2364
|
-
!hasTags && multiCount != null && multiCount > 0 && /* @__PURE__ */
|
|
2450
|
+
!hasTags && multiCount != null && multiCount > 0 && /* @__PURE__ */ jsxs17("span", { className: "shrink-0 text-xs leading-normal text-select-text-multi", children: [
|
|
2365
2451
|
"+",
|
|
2366
2452
|
multiCount,
|
|
2367
2453
|
" others"
|
|
2368
2454
|
] }),
|
|
2369
|
-
/* @__PURE__ */
|
|
2455
|
+
/* @__PURE__ */ jsx19(
|
|
2370
2456
|
Icon13,
|
|
2371
2457
|
{
|
|
2372
2458
|
icon: isOpen ? faChevronUpSolid : faChevronDownSolid3,
|
|
@@ -2377,12 +2463,12 @@ var Select = React18.forwardRef(
|
|
|
2377
2463
|
]
|
|
2378
2464
|
}
|
|
2379
2465
|
) }),
|
|
2380
|
-
error && errorMessage && /* @__PURE__ */
|
|
2381
|
-
/* @__PURE__ */
|
|
2382
|
-
/* @__PURE__ */
|
|
2466
|
+
error && errorMessage && /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-xs", children: [
|
|
2467
|
+
/* @__PURE__ */ jsx19(Icon13, { icon: faCircleExclamationOutline, size: "xs", className: errorGuidance.icon }),
|
|
2468
|
+
/* @__PURE__ */ jsx19("span", { id: errorId, className: errorGuidance.text, children: errorMessage })
|
|
2383
2469
|
] })
|
|
2384
2470
|
] }),
|
|
2385
|
-
children && /* @__PURE__ */
|
|
2471
|
+
children && /* @__PURE__ */ jsx19(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx19(
|
|
2386
2472
|
PopoverPrimitive.Content,
|
|
2387
2473
|
{
|
|
2388
2474
|
align: "start",
|
|
@@ -2405,12 +2491,12 @@ var Select = React18.forwardRef(
|
|
|
2405
2491
|
Select.displayName = "Select";
|
|
2406
2492
|
|
|
2407
2493
|
// src/components/ui/tab.tsx
|
|
2408
|
-
import * as
|
|
2494
|
+
import * as React20 from "react";
|
|
2409
2495
|
import * as TabsPrimitive from "@radix-ui/react-tabs";
|
|
2410
|
-
import { jsx as
|
|
2411
|
-
var Tabs =
|
|
2496
|
+
import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
2497
|
+
var Tabs = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx20(TabsPrimitive.Root, { ref, className: cn("flex flex-col", className), ...props }));
|
|
2412
2498
|
Tabs.displayName = "Tabs";
|
|
2413
|
-
var TabList =
|
|
2499
|
+
var TabList = React20.forwardRef(({ className, hasOffset = false, ...props }, ref) => /* @__PURE__ */ jsx20(
|
|
2414
2500
|
TabsPrimitive.List,
|
|
2415
2501
|
{
|
|
2416
2502
|
ref,
|
|
@@ -2423,7 +2509,7 @@ var TabList = React19.forwardRef(({ className, hasOffset = false, ...props }, re
|
|
|
2423
2509
|
}
|
|
2424
2510
|
));
|
|
2425
2511
|
TabList.displayName = "TabList";
|
|
2426
|
-
var TabTrigger =
|
|
2512
|
+
var TabTrigger = React20.forwardRef(({ className, badge, children, ...props }, ref) => /* @__PURE__ */ jsx20(
|
|
2427
2513
|
TabsPrimitive.Trigger,
|
|
2428
2514
|
{
|
|
2429
2515
|
ref,
|
|
@@ -2434,7 +2520,7 @@ var TabTrigger = React19.forwardRef(({ className, badge, children, ...props }, r
|
|
|
2434
2520
|
className
|
|
2435
2521
|
),
|
|
2436
2522
|
...props,
|
|
2437
|
-
children: /* @__PURE__ */
|
|
2523
|
+
children: /* @__PURE__ */ jsxs18(
|
|
2438
2524
|
"div",
|
|
2439
2525
|
{
|
|
2440
2526
|
className: cn(
|
|
@@ -2443,7 +2529,7 @@ var TabTrigger = React19.forwardRef(({ className, badge, children, ...props }, r
|
|
|
2443
2529
|
"group-data-[state=active]:bg-tab-item-active-bg"
|
|
2444
2530
|
),
|
|
2445
2531
|
children: [
|
|
2446
|
-
/* @__PURE__ */
|
|
2532
|
+
/* @__PURE__ */ jsx20(
|
|
2447
2533
|
"span",
|
|
2448
2534
|
{
|
|
2449
2535
|
className: cn(
|
|
@@ -2454,14 +2540,14 @@ var TabTrigger = React19.forwardRef(({ className, badge, children, ...props }, r
|
|
|
2454
2540
|
children
|
|
2455
2541
|
}
|
|
2456
2542
|
),
|
|
2457
|
-
badge && /* @__PURE__ */
|
|
2543
|
+
badge && /* @__PURE__ */ jsx20(Badge, { variant: "light", type: "neutral", size: "sm", children: badge })
|
|
2458
2544
|
]
|
|
2459
2545
|
}
|
|
2460
2546
|
)
|
|
2461
2547
|
}
|
|
2462
2548
|
));
|
|
2463
2549
|
TabTrigger.displayName = "TabTrigger";
|
|
2464
|
-
var TabContent =
|
|
2550
|
+
var TabContent = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx20(
|
|
2465
2551
|
TabsPrimitive.Content,
|
|
2466
2552
|
{
|
|
2467
2553
|
ref,
|
|
@@ -2472,10 +2558,10 @@ var TabContent = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
2472
2558
|
TabContent.displayName = "TabContent";
|
|
2473
2559
|
|
|
2474
2560
|
// src/components/ui/tag.tsx
|
|
2475
|
-
import * as
|
|
2561
|
+
import * as React21 from "react";
|
|
2476
2562
|
import { cva as cva12 } from "class-variance-authority";
|
|
2477
2563
|
import { Icon as Icon14, faXmarkSolid as faXmarkSolid5 } from "@l3mpire/icons";
|
|
2478
|
-
import { jsx as
|
|
2564
|
+
import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
2479
2565
|
var tagVariants = cva12(
|
|
2480
2566
|
[
|
|
2481
2567
|
"inline-flex items-center",
|
|
@@ -2516,19 +2602,19 @@ var tagVariants = cva12(
|
|
|
2516
2602
|
}
|
|
2517
2603
|
);
|
|
2518
2604
|
var iconSizeMap3 = { sm: "xs", md: "sm" };
|
|
2519
|
-
var Tag =
|
|
2605
|
+
var Tag = React21.forwardRef(
|
|
2520
2606
|
({ className, variant, size, icon, onClose, children, ...props }, ref) => {
|
|
2521
2607
|
const iconSize = iconSizeMap3[size ?? "sm"];
|
|
2522
|
-
return /* @__PURE__ */
|
|
2608
|
+
return /* @__PURE__ */ jsxs19(
|
|
2523
2609
|
"span",
|
|
2524
2610
|
{
|
|
2525
2611
|
ref,
|
|
2526
2612
|
className: cn(tagVariants({ variant, size }), className),
|
|
2527
2613
|
...props,
|
|
2528
2614
|
children: [
|
|
2529
|
-
icon && /* @__PURE__ */
|
|
2615
|
+
icon && /* @__PURE__ */ jsx21(Icon14, { icon, size: iconSize, className: "shrink-0" }),
|
|
2530
2616
|
children,
|
|
2531
|
-
onClose && /* @__PURE__ */
|
|
2617
|
+
onClose && /* @__PURE__ */ jsx21(
|
|
2532
2618
|
"button",
|
|
2533
2619
|
{
|
|
2534
2620
|
type: "button",
|
|
@@ -2540,7 +2626,7 @@ var Tag = React20.forwardRef(
|
|
|
2540
2626
|
size === "md" && "p-sm rounded-md"
|
|
2541
2627
|
),
|
|
2542
2628
|
"aria-label": "Remove",
|
|
2543
|
-
children: /* @__PURE__ */
|
|
2629
|
+
children: /* @__PURE__ */ jsx21(Icon14, { icon: faXmarkSolid5, size: iconSize })
|
|
2544
2630
|
}
|
|
2545
2631
|
)
|
|
2546
2632
|
]
|
|
@@ -2551,9 +2637,9 @@ var Tag = React20.forwardRef(
|
|
|
2551
2637
|
Tag.displayName = "Tag";
|
|
2552
2638
|
|
|
2553
2639
|
// src/components/ui/textarea.tsx
|
|
2554
|
-
import * as
|
|
2640
|
+
import * as React22 from "react";
|
|
2555
2641
|
import { Icon as Icon15, faCircleExclamationOutline as faCircleExclamationOutline2 } from "@l3mpire/icons";
|
|
2556
|
-
import { jsx as
|
|
2642
|
+
import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
2557
2643
|
var fieldStates = {
|
|
2558
2644
|
default: [
|
|
2559
2645
|
"bg-textarea-bg-default",
|
|
@@ -2595,7 +2681,7 @@ function resolveState(error, success, disabled) {
|
|
|
2595
2681
|
if (success) return "success";
|
|
2596
2682
|
return "default";
|
|
2597
2683
|
}
|
|
2598
|
-
var TextArea =
|
|
2684
|
+
var TextArea = React22.forwardRef(
|
|
2599
2685
|
({
|
|
2600
2686
|
className,
|
|
2601
2687
|
label,
|
|
@@ -2607,13 +2693,13 @@ var TextArea = React21.forwardRef(
|
|
|
2607
2693
|
disabled,
|
|
2608
2694
|
...props
|
|
2609
2695
|
}, ref) => {
|
|
2610
|
-
const autoId =
|
|
2696
|
+
const autoId = React22.useId();
|
|
2611
2697
|
const textareaId = props.id ?? autoId;
|
|
2612
2698
|
const errorId = error && errorMessage ? `${textareaId}-error` : void 0;
|
|
2613
2699
|
const state = resolveState(error, success, disabled);
|
|
2614
|
-
return /* @__PURE__ */
|
|
2615
|
-
label && /* @__PURE__ */
|
|
2616
|
-
/* @__PURE__ */
|
|
2700
|
+
return /* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-[4px]", children: [
|
|
2701
|
+
label && /* @__PURE__ */ jsx22(InputLabel, { type: labelType, disabled, children: label }),
|
|
2702
|
+
/* @__PURE__ */ jsx22(
|
|
2617
2703
|
"textarea",
|
|
2618
2704
|
{
|
|
2619
2705
|
ref,
|
|
@@ -2634,12 +2720,12 @@ var TextArea = React21.forwardRef(
|
|
|
2634
2720
|
...props
|
|
2635
2721
|
}
|
|
2636
2722
|
),
|
|
2637
|
-
error && errorMessage || characterLimit ? /* @__PURE__ */
|
|
2638
|
-
error && errorMessage && /* @__PURE__ */
|
|
2639
|
-
/* @__PURE__ */
|
|
2640
|
-
/* @__PURE__ */
|
|
2723
|
+
error && errorMessage || characterLimit ? /* @__PURE__ */ jsxs20("div", { className: "flex gap-base items-start w-full", children: [
|
|
2724
|
+
error && errorMessage && /* @__PURE__ */ jsxs20("div", { className: "flex flex-1 items-center gap-xs", children: [
|
|
2725
|
+
/* @__PURE__ */ jsx22(Icon15, { icon: faCircleExclamationOutline2, size: "xs", className: errorGuidance2.icon }),
|
|
2726
|
+
/* @__PURE__ */ jsx22("span", { id: errorId, className: errorGuidance2.text, children: errorMessage })
|
|
2641
2727
|
] }),
|
|
2642
|
-
characterLimit && /* @__PURE__ */
|
|
2728
|
+
characterLimit && /* @__PURE__ */ jsx22("span", { className: cn(charLimitStyle, !error && "w-full"), children: characterLimit })
|
|
2643
2729
|
] }) : null
|
|
2644
2730
|
] });
|
|
2645
2731
|
}
|
|
@@ -2647,7 +2733,7 @@ var TextArea = React21.forwardRef(
|
|
|
2647
2733
|
TextArea.displayName = "TextArea";
|
|
2648
2734
|
|
|
2649
2735
|
// src/components/ui/text-input.tsx
|
|
2650
|
-
import * as
|
|
2736
|
+
import * as React23 from "react";
|
|
2651
2737
|
import { cva as cva13 } from "class-variance-authority";
|
|
2652
2738
|
import {
|
|
2653
2739
|
Icon as Icon16,
|
|
@@ -2655,7 +2741,7 @@ import {
|
|
|
2655
2741
|
faCircleXmarkSolid,
|
|
2656
2742
|
faPlusSolid as faPlusSolid2
|
|
2657
2743
|
} from "@l3mpire/icons";
|
|
2658
|
-
import { jsx as
|
|
2744
|
+
import { jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2659
2745
|
var textInputVariants = cva13(
|
|
2660
2746
|
[
|
|
2661
2747
|
"flex items-center w-full border transition-colors",
|
|
@@ -2726,7 +2812,7 @@ function resolveState2(error, success, disabled) {
|
|
|
2726
2812
|
if (success) return "success";
|
|
2727
2813
|
return "default";
|
|
2728
2814
|
}
|
|
2729
|
-
var TextInput =
|
|
2815
|
+
var TextInput = React23.forwardRef(
|
|
2730
2816
|
({
|
|
2731
2817
|
className,
|
|
2732
2818
|
size,
|
|
@@ -2748,11 +2834,11 @@ var TextInput = React22.forwardRef(
|
|
|
2748
2834
|
onChange,
|
|
2749
2835
|
...props
|
|
2750
2836
|
}, ref) => {
|
|
2751
|
-
const autoId =
|
|
2837
|
+
const autoId = React23.useId();
|
|
2752
2838
|
const inputId = props.id ?? autoId;
|
|
2753
2839
|
const errorId = error && errorMessage ? `${inputId}-error` : void 0;
|
|
2754
2840
|
const isControlled = value !== void 0;
|
|
2755
|
-
const [uncontrolledValue, setUncontrolledValue] =
|
|
2841
|
+
const [uncontrolledValue, setUncontrolledValue] = React23.useState(
|
|
2756
2842
|
defaultValue ?? ""
|
|
2757
2843
|
);
|
|
2758
2844
|
const displayValue = isControlled ? value : uncontrolledValue;
|
|
@@ -2763,10 +2849,10 @@ var TextInput = React22.forwardRef(
|
|
|
2763
2849
|
if (!isControlled) setUncontrolledValue(e.target.value);
|
|
2764
2850
|
onChange?.(e);
|
|
2765
2851
|
};
|
|
2766
|
-
return /* @__PURE__ */
|
|
2767
|
-
label && /* @__PURE__ */
|
|
2768
|
-
/* @__PURE__ */
|
|
2769
|
-
/* @__PURE__ */
|
|
2852
|
+
return /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-xs", children: [
|
|
2853
|
+
label && /* @__PURE__ */ jsx23(InputLabel, { type: labelType, disabled, children: label }),
|
|
2854
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex", children: [
|
|
2855
|
+
/* @__PURE__ */ jsxs21(
|
|
2770
2856
|
"div",
|
|
2771
2857
|
{
|
|
2772
2858
|
className: cn(
|
|
@@ -2776,8 +2862,8 @@ var TextInput = React22.forwardRef(
|
|
|
2776
2862
|
className
|
|
2777
2863
|
),
|
|
2778
2864
|
children: [
|
|
2779
|
-
iconLeft && /* @__PURE__ */
|
|
2780
|
-
/* @__PURE__ */
|
|
2865
|
+
iconLeft && /* @__PURE__ */ jsx23(Icon16, { icon: iconLeft, size: "sm", className: cn("shrink-0", icColor) }),
|
|
2866
|
+
/* @__PURE__ */ jsx23(
|
|
2781
2867
|
"input",
|
|
2782
2868
|
{
|
|
2783
2869
|
ref,
|
|
@@ -2797,20 +2883,20 @@ var TextInput = React22.forwardRef(
|
|
|
2797
2883
|
...props
|
|
2798
2884
|
}
|
|
2799
2885
|
),
|
|
2800
|
-
showClear ? /* @__PURE__ */
|
|
2886
|
+
showClear ? /* @__PURE__ */ jsx23(
|
|
2801
2887
|
"button",
|
|
2802
2888
|
{
|
|
2803
2889
|
type: "button",
|
|
2804
2890
|
onClick: onClear,
|
|
2805
2891
|
className: "shrink-0 flex items-center justify-center",
|
|
2806
2892
|
tabIndex: -1,
|
|
2807
|
-
children: /* @__PURE__ */
|
|
2893
|
+
children: /* @__PURE__ */ jsx23(Icon16, { icon: faCircleXmarkSolid, size: "xs", className: iconColor2.default })
|
|
2808
2894
|
}
|
|
2809
|
-
) : iconRight && !onClear && /* @__PURE__ */
|
|
2895
|
+
) : iconRight && !onClear && /* @__PURE__ */ jsx23(Icon16, { icon: iconRight, size: "xs", className: cn("shrink-0", icColor) })
|
|
2810
2896
|
]
|
|
2811
2897
|
}
|
|
2812
2898
|
),
|
|
2813
|
-
hasButton && /* @__PURE__ */
|
|
2899
|
+
hasButton && /* @__PURE__ */ jsx23(
|
|
2814
2900
|
"button",
|
|
2815
2901
|
{
|
|
2816
2902
|
type: "button",
|
|
@@ -2821,13 +2907,13 @@ var TextInput = React22.forwardRef(
|
|
|
2821
2907
|
size === "sm" ? "px-base rounded-r-base" : "px-md rounded-r-md",
|
|
2822
2908
|
attachedButtonStyles[disabled ? "disabled" : "enabled"]
|
|
2823
2909
|
),
|
|
2824
|
-
children: /* @__PURE__ */
|
|
2910
|
+
children: /* @__PURE__ */ jsx23(Icon16, { icon: buttonIcon ?? faPlusSolid2, size: "sm", className: icColor })
|
|
2825
2911
|
}
|
|
2826
2912
|
)
|
|
2827
2913
|
] }),
|
|
2828
|
-
error && errorMessage && /* @__PURE__ */
|
|
2829
|
-
/* @__PURE__ */
|
|
2830
|
-
/* @__PURE__ */
|
|
2914
|
+
error && errorMessage && /* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-xs", children: [
|
|
2915
|
+
/* @__PURE__ */ jsx23(Icon16, { icon: faCircleExclamationOutline3, size: "xs", className: errorGuidance3.icon }),
|
|
2916
|
+
/* @__PURE__ */ jsx23("span", { id: errorId, className: errorGuidance3.text, children: errorMessage })
|
|
2831
2917
|
] })
|
|
2832
2918
|
] });
|
|
2833
2919
|
}
|
|
@@ -2835,14 +2921,14 @@ var TextInput = React22.forwardRef(
|
|
|
2835
2921
|
TextInput.displayName = "TextInput";
|
|
2836
2922
|
|
|
2837
2923
|
// src/components/ui/chip-input.tsx
|
|
2838
|
-
import * as
|
|
2924
|
+
import * as React24 from "react";
|
|
2839
2925
|
import { cva as cva14 } from "class-variance-authority";
|
|
2840
2926
|
import {
|
|
2841
2927
|
Icon as Icon17,
|
|
2842
2928
|
faCircleExclamationOutline as faCircleExclamationOutline4,
|
|
2843
2929
|
faXmarkSolid as faXmarkSolid6
|
|
2844
2930
|
} from "@l3mpire/icons";
|
|
2845
|
-
import { jsx as
|
|
2931
|
+
import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2846
2932
|
var chipInputVariants = cva14(
|
|
2847
2933
|
[
|
|
2848
2934
|
"flex flex-wrap items-center w-full border transition-colors",
|
|
@@ -2893,7 +2979,7 @@ var errorGuidance4 = {
|
|
|
2893
2979
|
icon: "shrink-0 text-text-input-error-icon",
|
|
2894
2980
|
text: "text-xs font-medium leading-xs text-text-input-error-text"
|
|
2895
2981
|
};
|
|
2896
|
-
var ChipInput =
|
|
2982
|
+
var ChipInput = React24.forwardRef(
|
|
2897
2983
|
({
|
|
2898
2984
|
className,
|
|
2899
2985
|
size,
|
|
@@ -2909,11 +2995,11 @@ var ChipInput = React23.forwardRef(
|
|
|
2909
2995
|
max = 0,
|
|
2910
2996
|
...props
|
|
2911
2997
|
}, ref) => {
|
|
2912
|
-
const autoId =
|
|
2998
|
+
const autoId = React24.useId();
|
|
2913
2999
|
const inputId = props.id ?? autoId;
|
|
2914
3000
|
const errorId = error && errorMessage ? `${inputId}-error` : void 0;
|
|
2915
|
-
const inputRef =
|
|
2916
|
-
const [inputValue, setInputValue] =
|
|
3001
|
+
const inputRef = React24.useRef(null);
|
|
3002
|
+
const [inputValue, setInputValue] = React24.useState("");
|
|
2917
3003
|
const state = disabled ? "disabled" : error ? "error" : "default";
|
|
2918
3004
|
const addChip = (val) => {
|
|
2919
3005
|
const trimmed = val.trim();
|
|
@@ -2937,9 +3023,9 @@ var ChipInput = React23.forwardRef(
|
|
|
2937
3023
|
const handleWrapperClick = () => {
|
|
2938
3024
|
inputRef.current?.focus();
|
|
2939
3025
|
};
|
|
2940
|
-
return /* @__PURE__ */
|
|
2941
|
-
label && /* @__PURE__ */
|
|
2942
|
-
/* @__PURE__ */
|
|
3026
|
+
return /* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-xs", children: [
|
|
3027
|
+
label && /* @__PURE__ */ jsx24(InputLabel, { type: labelType, disabled, children: label }),
|
|
3028
|
+
/* @__PURE__ */ jsxs22(
|
|
2943
3029
|
"div",
|
|
2944
3030
|
{
|
|
2945
3031
|
ref,
|
|
@@ -2954,7 +3040,7 @@ var ChipInput = React23.forwardRef(
|
|
|
2954
3040
|
onClick: handleWrapperClick,
|
|
2955
3041
|
...props,
|
|
2956
3042
|
children: [
|
|
2957
|
-
iconLeft && /* @__PURE__ */
|
|
3043
|
+
iconLeft && /* @__PURE__ */ jsx24(
|
|
2958
3044
|
Icon17,
|
|
2959
3045
|
{
|
|
2960
3046
|
icon: iconLeft,
|
|
@@ -2965,9 +3051,9 @@ var ChipInput = React23.forwardRef(
|
|
|
2965
3051
|
)
|
|
2966
3052
|
}
|
|
2967
3053
|
),
|
|
2968
|
-
values.map((val) => /* @__PURE__ */
|
|
2969
|
-
/* @__PURE__ */
|
|
2970
|
-
!disabled && /* @__PURE__ */
|
|
3054
|
+
values.map((val) => /* @__PURE__ */ jsxs22("span", { className: cn(chipStyle), children: [
|
|
3055
|
+
/* @__PURE__ */ jsx24("span", { className: "truncate max-w-[150px]", children: val }),
|
|
3056
|
+
!disabled && /* @__PURE__ */ jsx24(
|
|
2971
3057
|
"button",
|
|
2972
3058
|
{
|
|
2973
3059
|
type: "button",
|
|
@@ -2977,11 +3063,11 @@ var ChipInput = React23.forwardRef(
|
|
|
2977
3063
|
e.stopPropagation();
|
|
2978
3064
|
removeChip(val);
|
|
2979
3065
|
},
|
|
2980
|
-
children: /* @__PURE__ */
|
|
3066
|
+
children: /* @__PURE__ */ jsx24(Icon17, { icon: faXmarkSolid6, size: "xs" })
|
|
2981
3067
|
}
|
|
2982
3068
|
)
|
|
2983
3069
|
] }, val)),
|
|
2984
|
-
/* @__PURE__ */
|
|
3070
|
+
/* @__PURE__ */ jsx24(
|
|
2985
3071
|
"input",
|
|
2986
3072
|
{
|
|
2987
3073
|
ref: inputRef,
|
|
@@ -3004,9 +3090,9 @@ var ChipInput = React23.forwardRef(
|
|
|
3004
3090
|
]
|
|
3005
3091
|
}
|
|
3006
3092
|
),
|
|
3007
|
-
error && errorMessage && /* @__PURE__ */
|
|
3008
|
-
/* @__PURE__ */
|
|
3009
|
-
/* @__PURE__ */
|
|
3093
|
+
error && errorMessage && /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-xs", children: [
|
|
3094
|
+
/* @__PURE__ */ jsx24(Icon17, { icon: faCircleExclamationOutline4, size: "xs", className: errorGuidance4.icon }),
|
|
3095
|
+
/* @__PURE__ */ jsx24("span", { id: errorId, className: errorGuidance4.text, children: errorMessage })
|
|
3010
3096
|
] })
|
|
3011
3097
|
] });
|
|
3012
3098
|
}
|
|
@@ -3014,7 +3100,7 @@ var ChipInput = React23.forwardRef(
|
|
|
3014
3100
|
ChipInput.displayName = "ChipInput";
|
|
3015
3101
|
|
|
3016
3102
|
// src/components/ui/number-input.tsx
|
|
3017
|
-
import * as
|
|
3103
|
+
import * as React25 from "react";
|
|
3018
3104
|
import { cva as cva15 } from "class-variance-authority";
|
|
3019
3105
|
import {
|
|
3020
3106
|
Icon as Icon18,
|
|
@@ -3022,7 +3108,7 @@ import {
|
|
|
3022
3108
|
faPlusOutline,
|
|
3023
3109
|
faCircleExclamationOutline as faCircleExclamationOutline5
|
|
3024
3110
|
} from "@l3mpire/icons";
|
|
3025
|
-
import { jsx as
|
|
3111
|
+
import { jsx as jsx25, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
3026
3112
|
var stepperButtonVariants = cva15(
|
|
3027
3113
|
[
|
|
3028
3114
|
"shrink-0 flex items-center justify-center",
|
|
@@ -3088,7 +3174,7 @@ var errorGuidance5 = {
|
|
|
3088
3174
|
icon: "shrink-0 text-text-input-error-icon",
|
|
3089
3175
|
text: "text-xs font-medium leading-xs text-text-input-error-text"
|
|
3090
3176
|
};
|
|
3091
|
-
var NumberInput =
|
|
3177
|
+
var NumberInput = React25.forwardRef(
|
|
3092
3178
|
({
|
|
3093
3179
|
className,
|
|
3094
3180
|
size,
|
|
@@ -3106,11 +3192,11 @@ var NumberInput = React24.forwardRef(
|
|
|
3106
3192
|
id,
|
|
3107
3193
|
...props
|
|
3108
3194
|
}, ref) => {
|
|
3109
|
-
const autoId =
|
|
3195
|
+
const autoId = React25.useId();
|
|
3110
3196
|
const inputId = id ?? autoId;
|
|
3111
3197
|
const errorId = error && errorMessage ? `${inputId}-error` : void 0;
|
|
3112
3198
|
const isControlled = controlledValue !== void 0;
|
|
3113
|
-
const [internalValue, setInternalValue] =
|
|
3199
|
+
const [internalValue, setInternalValue] = React25.useState(defaultValue);
|
|
3114
3200
|
const currentValue = isControlled ? controlledValue : internalValue;
|
|
3115
3201
|
const resolvedSize = size ?? "md";
|
|
3116
3202
|
const state = disabled ? "disabled" : error ? "error" : "default";
|
|
@@ -3149,9 +3235,9 @@ var NumberInput = React24.forwardRef(
|
|
|
3149
3235
|
const valueStr = String(currentValue);
|
|
3150
3236
|
const charCount = valueStr.length;
|
|
3151
3237
|
const inputWidth = charCount > 3 ? `${48 + (charCount - 3) * 9}px` : void 0;
|
|
3152
|
-
return /* @__PURE__ */
|
|
3153
|
-
label && /* @__PURE__ */
|
|
3154
|
-
/* @__PURE__ */
|
|
3238
|
+
return /* @__PURE__ */ jsxs23("div", { className: cn("flex flex-col gap-xs", className), children: [
|
|
3239
|
+
label && /* @__PURE__ */ jsx25(InputLabel, { type: labelType, disabled, children: label }),
|
|
3240
|
+
/* @__PURE__ */ jsxs23(
|
|
3155
3241
|
"div",
|
|
3156
3242
|
{
|
|
3157
3243
|
className: cn(
|
|
@@ -3159,7 +3245,7 @@ var NumberInput = React24.forwardRef(
|
|
|
3159
3245
|
wrapperStates3[state]
|
|
3160
3246
|
),
|
|
3161
3247
|
children: [
|
|
3162
|
-
/* @__PURE__ */
|
|
3248
|
+
/* @__PURE__ */ jsx25(
|
|
3163
3249
|
"button",
|
|
3164
3250
|
{
|
|
3165
3251
|
type: "button",
|
|
@@ -3171,7 +3257,7 @@ var NumberInput = React24.forwardRef(
|
|
|
3171
3257
|
"rounded-l-md -mr-px",
|
|
3172
3258
|
stepperButtonStates[disabled || atMin ? "disabled" : "enabled"]
|
|
3173
3259
|
),
|
|
3174
|
-
children: /* @__PURE__ */
|
|
3260
|
+
children: /* @__PURE__ */ jsx25(
|
|
3175
3261
|
Icon18,
|
|
3176
3262
|
{
|
|
3177
3263
|
icon: faMinusOutline,
|
|
@@ -3183,7 +3269,7 @@ var NumberInput = React24.forwardRef(
|
|
|
3183
3269
|
)
|
|
3184
3270
|
}
|
|
3185
3271
|
),
|
|
3186
|
-
/* @__PURE__ */
|
|
3272
|
+
/* @__PURE__ */ jsx25(
|
|
3187
3273
|
"input",
|
|
3188
3274
|
{
|
|
3189
3275
|
ref,
|
|
@@ -3213,7 +3299,7 @@ var NumberInput = React24.forwardRef(
|
|
|
3213
3299
|
...props
|
|
3214
3300
|
}
|
|
3215
3301
|
),
|
|
3216
|
-
/* @__PURE__ */
|
|
3302
|
+
/* @__PURE__ */ jsx25(
|
|
3217
3303
|
"button",
|
|
3218
3304
|
{
|
|
3219
3305
|
type: "button",
|
|
@@ -3225,7 +3311,7 @@ var NumberInput = React24.forwardRef(
|
|
|
3225
3311
|
"rounded-r-md -ml-px",
|
|
3226
3312
|
stepperButtonStates[disabled || atMax ? "disabled" : "enabled"]
|
|
3227
3313
|
),
|
|
3228
|
-
children: /* @__PURE__ */
|
|
3314
|
+
children: /* @__PURE__ */ jsx25(
|
|
3229
3315
|
Icon18,
|
|
3230
3316
|
{
|
|
3231
3317
|
icon: faPlusOutline,
|
|
@@ -3240,9 +3326,9 @@ var NumberInput = React24.forwardRef(
|
|
|
3240
3326
|
]
|
|
3241
3327
|
}
|
|
3242
3328
|
),
|
|
3243
|
-
error && errorMessage && /* @__PURE__ */
|
|
3244
|
-
/* @__PURE__ */
|
|
3245
|
-
/* @__PURE__ */
|
|
3329
|
+
error && errorMessage && /* @__PURE__ */ jsxs23("div", { className: "flex items-center gap-xs", children: [
|
|
3330
|
+
/* @__PURE__ */ jsx25(Icon18, { icon: faCircleExclamationOutline5, size: "xs", className: errorGuidance5.icon }),
|
|
3331
|
+
/* @__PURE__ */ jsx25("span", { id: errorId, className: errorGuidance5.text, children: errorMessage })
|
|
3246
3332
|
] })
|
|
3247
3333
|
] });
|
|
3248
3334
|
}
|
|
@@ -3250,10 +3336,10 @@ var NumberInput = React24.forwardRef(
|
|
|
3250
3336
|
NumberInput.displayName = "NumberInput";
|
|
3251
3337
|
|
|
3252
3338
|
// src/components/ui/typography.tsx
|
|
3253
|
-
import * as
|
|
3339
|
+
import * as React26 from "react";
|
|
3254
3340
|
import { cva as cva16 } from "class-variance-authority";
|
|
3255
3341
|
import { Slot as Slot3 } from "@radix-ui/react-slot";
|
|
3256
|
-
import { jsx as
|
|
3342
|
+
import { jsx as jsx26 } from "react/jsx-runtime";
|
|
3257
3343
|
var typographyVariants = cva16("", {
|
|
3258
3344
|
variants: {
|
|
3259
3345
|
variant: {
|
|
@@ -3285,10 +3371,10 @@ var defaultElementMap = {
|
|
|
3285
3371
|
sm: "p",
|
|
3286
3372
|
xs: "p"
|
|
3287
3373
|
};
|
|
3288
|
-
var Typography =
|
|
3374
|
+
var Typography = React26.forwardRef(
|
|
3289
3375
|
({ className, variant = "md", weight, as, asChild = false, ...props }, ref) => {
|
|
3290
3376
|
const Comp = asChild ? Slot3 : as ?? defaultElementMap[variant ?? "md"] ?? "p";
|
|
3291
|
-
return /* @__PURE__ */
|
|
3377
|
+
return /* @__PURE__ */ jsx26(
|
|
3292
3378
|
Comp,
|
|
3293
3379
|
{
|
|
3294
3380
|
ref,
|
|
@@ -3301,10 +3387,10 @@ var Typography = React25.forwardRef(
|
|
|
3301
3387
|
Typography.displayName = "Typography";
|
|
3302
3388
|
|
|
3303
3389
|
// src/components/ui/user-menu.tsx
|
|
3304
|
-
import * as
|
|
3305
|
-
import { jsx as
|
|
3306
|
-
var UserMenu =
|
|
3307
|
-
({ className, children, ...props }, ref) => /* @__PURE__ */
|
|
3390
|
+
import * as React27 from "react";
|
|
3391
|
+
import { jsx as jsx27, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
3392
|
+
var UserMenu = React27.forwardRef(
|
|
3393
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx27(
|
|
3308
3394
|
"div",
|
|
3309
3395
|
{
|
|
3310
3396
|
ref,
|
|
@@ -3323,8 +3409,8 @@ var UserMenu = React26.forwardRef(
|
|
|
3323
3409
|
)
|
|
3324
3410
|
);
|
|
3325
3411
|
UserMenu.displayName = "UserMenu";
|
|
3326
|
-
var UserMenuInfoRow =
|
|
3327
|
-
({ className, avatar, name, subtitle, action, ...props }, ref) => /* @__PURE__ */
|
|
3412
|
+
var UserMenuInfoRow = React27.forwardRef(
|
|
3413
|
+
({ className, avatar, name, subtitle, action, ...props }, ref) => /* @__PURE__ */ jsxs24(
|
|
3328
3414
|
"div",
|
|
3329
3415
|
{
|
|
3330
3416
|
ref,
|
|
@@ -3332,9 +3418,9 @@ var UserMenuInfoRow = React26.forwardRef(
|
|
|
3332
3418
|
...props,
|
|
3333
3419
|
children: [
|
|
3334
3420
|
avatar,
|
|
3335
|
-
/* @__PURE__ */
|
|
3336
|
-
/* @__PURE__ */
|
|
3337
|
-
subtitle && /* @__PURE__ */
|
|
3421
|
+
/* @__PURE__ */ jsxs24("div", { className: "flex flex-1 flex-col min-w-0", children: [
|
|
3422
|
+
/* @__PURE__ */ jsx27("span", { className: "text-sm font-medium leading-sm text-user-menu-name truncate", children: name }),
|
|
3423
|
+
subtitle && /* @__PURE__ */ jsx27("span", { className: "text-xs font-regular leading-xs text-user-menu-subtitle truncate", children: subtitle })
|
|
3338
3424
|
] }),
|
|
3339
3425
|
action
|
|
3340
3426
|
]
|
|
@@ -3342,8 +3428,8 @@ var UserMenuInfoRow = React26.forwardRef(
|
|
|
3342
3428
|
)
|
|
3343
3429
|
);
|
|
3344
3430
|
UserMenuInfoRow.displayName = "UserMenuInfoRow";
|
|
3345
|
-
var UserMenuSection =
|
|
3346
|
-
({ className, children, ...props }, ref) => /* @__PURE__ */
|
|
3431
|
+
var UserMenuSection = React27.forwardRef(
|
|
3432
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx27(
|
|
3347
3433
|
"div",
|
|
3348
3434
|
{
|
|
3349
3435
|
ref,
|
|
@@ -3356,11 +3442,11 @@ var UserMenuSection = React26.forwardRef(
|
|
|
3356
3442
|
UserMenuSection.displayName = "UserMenuSection";
|
|
3357
3443
|
|
|
3358
3444
|
// src/components/ui/modal.tsx
|
|
3359
|
-
import * as
|
|
3445
|
+
import * as React28 from "react";
|
|
3360
3446
|
import * as DialogPrimitive from "@radix-ui/react-dialog";
|
|
3361
3447
|
import { cva as cva17 } from "class-variance-authority";
|
|
3362
3448
|
import { Icon as Icon19, faXmarkSolid as faXmarkSolid7, faCircleInfoSolid as faCircleInfoSolid4 } from "@l3mpire/icons";
|
|
3363
|
-
import { jsx as
|
|
3449
|
+
import { jsx as jsx28, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3364
3450
|
var modalVariants = cva17(
|
|
3365
3451
|
[
|
|
3366
3452
|
"fixed top-[50%] left-[50%] -translate-x-1/2 -translate-y-1/2 z-50",
|
|
@@ -3384,7 +3470,7 @@ var modalVariants = cva17(
|
|
|
3384
3470
|
var Modal = DialogPrimitive.Root;
|
|
3385
3471
|
var ModalTrigger = DialogPrimitive.Trigger;
|
|
3386
3472
|
var ModalClose = DialogPrimitive.Close;
|
|
3387
|
-
var ModalOverlay =
|
|
3473
|
+
var ModalOverlay = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
|
|
3388
3474
|
DialogPrimitive.Overlay,
|
|
3389
3475
|
{
|
|
3390
3476
|
ref,
|
|
@@ -3397,9 +3483,9 @@ var ModalOverlay = React27.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
3397
3483
|
}
|
|
3398
3484
|
));
|
|
3399
3485
|
ModalOverlay.displayName = "ModalOverlay";
|
|
3400
|
-
var ModalContent =
|
|
3401
|
-
/* @__PURE__ */
|
|
3402
|
-
/* @__PURE__ */
|
|
3486
|
+
var ModalContent = React28.forwardRef(({ className, size, children, ...props }, ref) => /* @__PURE__ */ jsxs25(DialogPrimitive.Portal, { children: [
|
|
3487
|
+
/* @__PURE__ */ jsx28(ModalOverlay, {}),
|
|
3488
|
+
/* @__PURE__ */ jsx28(
|
|
3403
3489
|
DialogPrimitive.Content,
|
|
3404
3490
|
{
|
|
3405
3491
|
ref,
|
|
@@ -3410,8 +3496,8 @@ var ModalContent = React27.forwardRef(({ className, size, children, ...props },
|
|
|
3410
3496
|
)
|
|
3411
3497
|
] }));
|
|
3412
3498
|
ModalContent.displayName = "ModalContent";
|
|
3413
|
-
var ModalHeader =
|
|
3414
|
-
({ className, showBorder = true, onClose, children, ...props }, ref) => /* @__PURE__ */
|
|
3499
|
+
var ModalHeader = React28.forwardRef(
|
|
3500
|
+
({ className, showBorder = true, onClose, children, ...props }, ref) => /* @__PURE__ */ jsxs25(
|
|
3415
3501
|
"div",
|
|
3416
3502
|
{
|
|
3417
3503
|
ref,
|
|
@@ -3422,15 +3508,15 @@ var ModalHeader = React27.forwardRef(
|
|
|
3422
3508
|
),
|
|
3423
3509
|
...props,
|
|
3424
3510
|
children: [
|
|
3425
|
-
/* @__PURE__ */
|
|
3426
|
-
onClose && /* @__PURE__ */
|
|
3511
|
+
/* @__PURE__ */ jsx28("div", { className: "flex flex-1 flex-col gap-2xs", children }),
|
|
3512
|
+
onClose && /* @__PURE__ */ jsx28(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx28(
|
|
3427
3513
|
"button",
|
|
3428
3514
|
{
|
|
3429
3515
|
type: "button",
|
|
3430
3516
|
onClick: onClose,
|
|
3431
3517
|
className: "inline-flex shrink-0 items-center justify-center p-xs rounded-base text-modal-header-close hover:bg-black/5 transition-colors cursor-pointer",
|
|
3432
3518
|
"aria-label": "Close",
|
|
3433
|
-
children: /* @__PURE__ */
|
|
3519
|
+
children: /* @__PURE__ */ jsx28(Icon19, { icon: faXmarkSolid7, size: "sm" })
|
|
3434
3520
|
}
|
|
3435
3521
|
) })
|
|
3436
3522
|
]
|
|
@@ -3438,7 +3524,7 @@ var ModalHeader = React27.forwardRef(
|
|
|
3438
3524
|
)
|
|
3439
3525
|
);
|
|
3440
3526
|
ModalHeader.displayName = "ModalHeader";
|
|
3441
|
-
var ModalTitle =
|
|
3527
|
+
var ModalTitle = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
|
|
3442
3528
|
DialogPrimitive.Title,
|
|
3443
3529
|
{
|
|
3444
3530
|
ref,
|
|
@@ -3447,7 +3533,7 @@ var ModalTitle = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
3447
3533
|
}
|
|
3448
3534
|
));
|
|
3449
3535
|
ModalTitle.displayName = "ModalTitle";
|
|
3450
|
-
var ModalDescription =
|
|
3536
|
+
var ModalDescription = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
|
|
3451
3537
|
DialogPrimitive.Description,
|
|
3452
3538
|
{
|
|
3453
3539
|
ref,
|
|
@@ -3456,7 +3542,7 @@ var ModalDescription = React27.forwardRef(({ className, ...props }, ref) => /* @
|
|
|
3456
3542
|
}
|
|
3457
3543
|
));
|
|
3458
3544
|
ModalDescription.displayName = "ModalDescription";
|
|
3459
|
-
var ModalBody =
|
|
3545
|
+
var ModalBody = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
|
|
3460
3546
|
"div",
|
|
3461
3547
|
{
|
|
3462
3548
|
ref,
|
|
@@ -3465,8 +3551,8 @@ var ModalBody = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE_
|
|
|
3465
3551
|
}
|
|
3466
3552
|
));
|
|
3467
3553
|
ModalBody.displayName = "ModalBody";
|
|
3468
|
-
var ModalFooter =
|
|
3469
|
-
({ className, showBorder = true, infoMessage, children, ...props }, ref) => /* @__PURE__ */
|
|
3554
|
+
var ModalFooter = React28.forwardRef(
|
|
3555
|
+
({ className, showBorder = true, infoMessage, children, ...props }, ref) => /* @__PURE__ */ jsxs25(
|
|
3470
3556
|
"div",
|
|
3471
3557
|
{
|
|
3472
3558
|
ref,
|
|
@@ -3477,9 +3563,9 @@ var ModalFooter = React27.forwardRef(
|
|
|
3477
3563
|
),
|
|
3478
3564
|
...props,
|
|
3479
3565
|
children: [
|
|
3480
|
-
infoMessage && /* @__PURE__ */
|
|
3481
|
-
/* @__PURE__ */
|
|
3482
|
-
/* @__PURE__ */
|
|
3566
|
+
infoMessage && /* @__PURE__ */ jsxs25("div", { className: "flex flex-1 items-center gap-base", children: [
|
|
3567
|
+
/* @__PURE__ */ jsx28(Icon19, { icon: faCircleInfoSolid4, size: "sm", className: "shrink-0 text-modal-footer-icon" }),
|
|
3568
|
+
/* @__PURE__ */ jsx28("span", { className: "text-sm font-regular leading-sm text-modal-footer-text", children: infoMessage })
|
|
3483
3569
|
] }),
|
|
3484
3570
|
children
|
|
3485
3571
|
]
|
|
@@ -3489,9 +3575,9 @@ var ModalFooter = React27.forwardRef(
|
|
|
3489
3575
|
ModalFooter.displayName = "ModalFooter";
|
|
3490
3576
|
|
|
3491
3577
|
// src/components/ui/dialog.tsx
|
|
3492
|
-
import * as
|
|
3493
|
-
import { jsx as
|
|
3494
|
-
var Dialog =
|
|
3578
|
+
import * as React29 from "react";
|
|
3579
|
+
import { jsx as jsx29, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3580
|
+
var Dialog = React29.forwardRef(
|
|
3495
3581
|
({
|
|
3496
3582
|
open,
|
|
3497
3583
|
onOpenChange,
|
|
@@ -3508,16 +3594,16 @@ var Dialog = React28.forwardRef(
|
|
|
3508
3594
|
className
|
|
3509
3595
|
}, ref) => {
|
|
3510
3596
|
const handleCancel = onCancel ?? (() => onOpenChange?.(false));
|
|
3511
|
-
return /* @__PURE__ */
|
|
3512
|
-
/* @__PURE__ */
|
|
3513
|
-
/* @__PURE__ */
|
|
3514
|
-
description && /* @__PURE__ */
|
|
3597
|
+
return /* @__PURE__ */ jsx29(Modal, { open, onOpenChange, children: /* @__PURE__ */ jsxs26(ModalContent, { size: "sm", ref, className, children: [
|
|
3598
|
+
/* @__PURE__ */ jsxs26(ModalHeader, { showBorder: false, onClose: handleCancel, children: [
|
|
3599
|
+
/* @__PURE__ */ jsx29(ModalTitle, { children: title }),
|
|
3600
|
+
description && /* @__PURE__ */ jsx29(ModalDescription, { children: description })
|
|
3515
3601
|
] }),
|
|
3516
|
-
/* @__PURE__ */
|
|
3517
|
-
/* @__PURE__ */
|
|
3518
|
-
/* @__PURE__ */
|
|
3519
|
-
secondaryLabel && /* @__PURE__ */
|
|
3520
|
-
/* @__PURE__ */
|
|
3602
|
+
/* @__PURE__ */ jsxs26(ModalFooter, { children: [
|
|
3603
|
+
/* @__PURE__ */ jsx29(ModalClose, { asChild: true, children: /* @__PURE__ */ jsx29(Button, { appearance: "ghost", intent: "brand", size: "md", onClick: handleCancel, children: cancelLabel }) }),
|
|
3604
|
+
/* @__PURE__ */ jsxs26("div", { className: "flex items-center gap-md", children: [
|
|
3605
|
+
secondaryLabel && /* @__PURE__ */ jsx29(Button, { appearance: "outlined", intent: "brand", size: "md", onClick: onSecondaryAction, children: secondaryLabel }),
|
|
3606
|
+
/* @__PURE__ */ jsx29(
|
|
3521
3607
|
Button,
|
|
3522
3608
|
{
|
|
3523
3609
|
appearance: "solid",
|
|
@@ -3536,10 +3622,10 @@ var Dialog = React28.forwardRef(
|
|
|
3536
3622
|
Dialog.displayName = "Dialog";
|
|
3537
3623
|
|
|
3538
3624
|
// src/components/ui/empty-state.tsx
|
|
3539
|
-
import * as
|
|
3625
|
+
import * as React30 from "react";
|
|
3540
3626
|
import { cva as cva18 } from "class-variance-authority";
|
|
3541
3627
|
import { Icon as Icon20 } from "@l3mpire/icons";
|
|
3542
|
-
import { jsx as
|
|
3628
|
+
import { jsx as jsx30, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3543
3629
|
var emptyStateVariants = cva18(
|
|
3544
3630
|
"flex flex-col items-center text-center",
|
|
3545
3631
|
{
|
|
@@ -3572,7 +3658,7 @@ var iconContainerVariants2 = cva18(
|
|
|
3572
3658
|
}
|
|
3573
3659
|
}
|
|
3574
3660
|
);
|
|
3575
|
-
var EmptyState =
|
|
3661
|
+
var EmptyState = React30.forwardRef(
|
|
3576
3662
|
({
|
|
3577
3663
|
className,
|
|
3578
3664
|
size = "md",
|
|
@@ -3584,14 +3670,14 @@ var EmptyState = React29.forwardRef(
|
|
|
3584
3670
|
...props
|
|
3585
3671
|
}, ref) => {
|
|
3586
3672
|
const isMd = size === "md";
|
|
3587
|
-
return /* @__PURE__ */
|
|
3673
|
+
return /* @__PURE__ */ jsxs27(
|
|
3588
3674
|
"div",
|
|
3589
3675
|
{
|
|
3590
3676
|
ref,
|
|
3591
3677
|
className: cn(emptyStateVariants({ size }), className),
|
|
3592
3678
|
...props,
|
|
3593
3679
|
children: [
|
|
3594
|
-
icon && /* @__PURE__ */
|
|
3680
|
+
icon && /* @__PURE__ */ jsx30("div", { className: iconContainerVariants2({ size }), children: /* @__PURE__ */ jsx30(
|
|
3595
3681
|
Icon20,
|
|
3596
3682
|
{
|
|
3597
3683
|
icon,
|
|
@@ -3599,8 +3685,8 @@ var EmptyState = React29.forwardRef(
|
|
|
3599
3685
|
className: "text-table-cell-text-secondary"
|
|
3600
3686
|
}
|
|
3601
3687
|
) }),
|
|
3602
|
-
/* @__PURE__ */
|
|
3603
|
-
/* @__PURE__ */
|
|
3688
|
+
/* @__PURE__ */ jsxs27("div", { className: "flex flex-col gap-xs w-full", children: [
|
|
3689
|
+
/* @__PURE__ */ jsx30(
|
|
3604
3690
|
"p",
|
|
3605
3691
|
{
|
|
3606
3692
|
className: cn(
|
|
@@ -3610,7 +3696,7 @@ var EmptyState = React29.forwardRef(
|
|
|
3610
3696
|
children: title
|
|
3611
3697
|
}
|
|
3612
3698
|
),
|
|
3613
|
-
description && /* @__PURE__ */
|
|
3699
|
+
description && /* @__PURE__ */ jsx30(
|
|
3614
3700
|
"p",
|
|
3615
3701
|
{
|
|
3616
3702
|
className: cn(
|
|
@@ -3621,7 +3707,7 @@ var EmptyState = React29.forwardRef(
|
|
|
3621
3707
|
}
|
|
3622
3708
|
)
|
|
3623
3709
|
] }),
|
|
3624
|
-
(primaryAction || secondaryAction) && /* @__PURE__ */
|
|
3710
|
+
(primaryAction || secondaryAction) && /* @__PURE__ */ jsxs27(
|
|
3625
3711
|
"div",
|
|
3626
3712
|
{
|
|
3627
3713
|
className: cn(
|
|
@@ -3629,7 +3715,7 @@ var EmptyState = React29.forwardRef(
|
|
|
3629
3715
|
isMd ? "gap-lg" : "gap-base"
|
|
3630
3716
|
),
|
|
3631
3717
|
children: [
|
|
3632
|
-
secondaryAction && /* @__PURE__ */
|
|
3718
|
+
secondaryAction && /* @__PURE__ */ jsx30(
|
|
3633
3719
|
Button,
|
|
3634
3720
|
{
|
|
3635
3721
|
appearance: "outlined",
|
|
@@ -3639,7 +3725,7 @@ var EmptyState = React29.forwardRef(
|
|
|
3639
3725
|
children: secondaryAction.label
|
|
3640
3726
|
}
|
|
3641
3727
|
),
|
|
3642
|
-
primaryAction && /* @__PURE__ */
|
|
3728
|
+
primaryAction && /* @__PURE__ */ jsx30(
|
|
3643
3729
|
Button,
|
|
3644
3730
|
{
|
|
3645
3731
|
appearance: "solid",
|
|
@@ -3660,8 +3746,8 @@ var EmptyState = React29.forwardRef(
|
|
|
3660
3746
|
EmptyState.displayName = "EmptyState";
|
|
3661
3747
|
|
|
3662
3748
|
// src/components/ui/table-cells.tsx
|
|
3663
|
-
import * as
|
|
3664
|
-
import { jsx as
|
|
3749
|
+
import * as React31 from "react";
|
|
3750
|
+
import { jsx as jsx31, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3665
3751
|
function getInitials(name) {
|
|
3666
3752
|
return name.split(" ").map((part) => part[0]).filter(Boolean).slice(0, 2).join("").toUpperCase();
|
|
3667
3753
|
}
|
|
@@ -3670,11 +3756,11 @@ var AvatarCell = ({
|
|
|
3670
3756
|
subtitle,
|
|
3671
3757
|
src,
|
|
3672
3758
|
className
|
|
3673
|
-
}) => /* @__PURE__ */
|
|
3674
|
-
/* @__PURE__ */
|
|
3675
|
-
/* @__PURE__ */
|
|
3676
|
-
/* @__PURE__ */
|
|
3677
|
-
subtitle && /* @__PURE__ */
|
|
3759
|
+
}) => /* @__PURE__ */ jsxs28("div", { className: cn("flex items-center gap-md", className), children: [
|
|
3760
|
+
/* @__PURE__ */ jsx31(Avatar, { initials: getInitials(name), src, alt: name, size: "lg", shape: "rounded" }),
|
|
3761
|
+
/* @__PURE__ */ jsxs28("div", { className: "flex flex-col", children: [
|
|
3762
|
+
/* @__PURE__ */ jsx31("span", { className: "text-sm font-medium text-table-cell-text-primary leading-sm", children: name }),
|
|
3763
|
+
subtitle && /* @__PURE__ */ jsx31("span", { className: "text-xs font-regular text-table-cell-text-secondary leading-xs", children: subtitle })
|
|
3678
3764
|
] })
|
|
3679
3765
|
] });
|
|
3680
3766
|
AvatarCell.displayName = "AvatarCell";
|
|
@@ -3684,7 +3770,7 @@ var StatusCell = ({
|
|
|
3684
3770
|
type = "primary",
|
|
3685
3771
|
size = "sm",
|
|
3686
3772
|
className
|
|
3687
|
-
}) => /* @__PURE__ */
|
|
3773
|
+
}) => /* @__PURE__ */ jsx31("div", { className: cn("flex items-center", className), children: /* @__PURE__ */ jsx31(Badge, { variant, type, size, children: label }) });
|
|
3688
3774
|
StatusCell.displayName = "StatusCell";
|
|
3689
3775
|
var secondaryIntentColors = {
|
|
3690
3776
|
success: "text-badge-light-success-text",
|
|
@@ -3702,7 +3788,7 @@ var NumberCell = ({
|
|
|
3702
3788
|
className
|
|
3703
3789
|
}) => {
|
|
3704
3790
|
const formatted = typeof value === "number" && formatOptions ? new Intl.NumberFormat(locale, formatOptions).format(value) : String(value);
|
|
3705
|
-
return /* @__PURE__ */
|
|
3791
|
+
return /* @__PURE__ */ jsxs28(
|
|
3706
3792
|
"div",
|
|
3707
3793
|
{
|
|
3708
3794
|
className: cn(
|
|
@@ -3711,8 +3797,8 @@ var NumberCell = ({
|
|
|
3711
3797
|
className
|
|
3712
3798
|
),
|
|
3713
3799
|
children: [
|
|
3714
|
-
/* @__PURE__ */
|
|
3715
|
-
secondaryStat && /* @__PURE__ */
|
|
3800
|
+
/* @__PURE__ */ jsx31("span", { className: "text-sm font-medium text-table-cell-text-primary", children: formatted }),
|
|
3801
|
+
secondaryStat && /* @__PURE__ */ jsx31(
|
|
3716
3802
|
"span",
|
|
3717
3803
|
{
|
|
3718
3804
|
className: cn(
|
|
@@ -3740,7 +3826,7 @@ var DateCell = ({
|
|
|
3740
3826
|
}) => {
|
|
3741
3827
|
const d = typeof date === "string" ? new Date(date) : date;
|
|
3742
3828
|
const formatted = d.toLocaleDateString(locale, format);
|
|
3743
|
-
return /* @__PURE__ */
|
|
3829
|
+
return /* @__PURE__ */ jsx31(
|
|
3744
3830
|
"span",
|
|
3745
3831
|
{
|
|
3746
3832
|
className: cn(
|
|
@@ -3752,7 +3838,7 @@ var DateCell = ({
|
|
|
3752
3838
|
);
|
|
3753
3839
|
};
|
|
3754
3840
|
DateCell.displayName = "DateCell";
|
|
3755
|
-
var EmailCell = ({ email, className }) => /* @__PURE__ */
|
|
3841
|
+
var EmailCell = ({ email, className }) => /* @__PURE__ */ jsx31(
|
|
3756
3842
|
Link,
|
|
3757
3843
|
{
|
|
3758
3844
|
intent: "neutral",
|
|
@@ -3768,13 +3854,13 @@ var LinkCell = ({
|
|
|
3768
3854
|
label,
|
|
3769
3855
|
target = "_blank",
|
|
3770
3856
|
className
|
|
3771
|
-
}) => /* @__PURE__ */
|
|
3857
|
+
}) => /* @__PURE__ */ jsx31(Link, { intent: "brand", size: "sm", href, target, className, children: label ?? href });
|
|
3772
3858
|
LinkCell.displayName = "LinkCell";
|
|
3773
3859
|
var TextCell = ({
|
|
3774
3860
|
value,
|
|
3775
3861
|
secondary = false,
|
|
3776
3862
|
className
|
|
3777
|
-
}) => /* @__PURE__ */
|
|
3863
|
+
}) => /* @__PURE__ */ jsx31(
|
|
3778
3864
|
"span",
|
|
3779
3865
|
{
|
|
3780
3866
|
className: cn(
|
|
@@ -3790,20 +3876,20 @@ var ButtonCell = ({
|
|
|
3790
3876
|
className,
|
|
3791
3877
|
children,
|
|
3792
3878
|
...props
|
|
3793
|
-
}) => /* @__PURE__ */
|
|
3879
|
+
}) => /* @__PURE__ */ jsx31("div", { className: cn("flex items-center", className), children: /* @__PURE__ */ jsx31(Button, { size: "sm", appearance: "ghost", intent: "brand", ...props, children }) });
|
|
3794
3880
|
ButtonCell.displayName = "ButtonCell";
|
|
3795
3881
|
var EditableCell = ({
|
|
3796
3882
|
value,
|
|
3797
3883
|
onSave,
|
|
3798
3884
|
className
|
|
3799
3885
|
}) => {
|
|
3800
|
-
const [isEditing, setIsEditing] =
|
|
3801
|
-
const [draft, setDraft] =
|
|
3802
|
-
const inputRef =
|
|
3803
|
-
|
|
3886
|
+
const [isEditing, setIsEditing] = React31.useState(false);
|
|
3887
|
+
const [draft, setDraft] = React31.useState(value);
|
|
3888
|
+
const inputRef = React31.useRef(null);
|
|
3889
|
+
React31.useEffect(() => {
|
|
3804
3890
|
setDraft(value);
|
|
3805
3891
|
}, [value]);
|
|
3806
|
-
|
|
3892
|
+
React31.useEffect(() => {
|
|
3807
3893
|
if (isEditing) {
|
|
3808
3894
|
inputRef.current?.focus();
|
|
3809
3895
|
inputRef.current?.select();
|
|
@@ -3823,7 +3909,7 @@ var EditableCell = ({
|
|
|
3823
3909
|
}
|
|
3824
3910
|
};
|
|
3825
3911
|
if (isEditing) {
|
|
3826
|
-
return /* @__PURE__ */
|
|
3912
|
+
return /* @__PURE__ */ jsx31(
|
|
3827
3913
|
"input",
|
|
3828
3914
|
{
|
|
3829
3915
|
ref: inputRef,
|
|
@@ -3839,7 +3925,7 @@ var EditableCell = ({
|
|
|
3839
3925
|
}
|
|
3840
3926
|
);
|
|
3841
3927
|
}
|
|
3842
|
-
return /* @__PURE__ */
|
|
3928
|
+
return /* @__PURE__ */ jsx31(
|
|
3843
3929
|
"span",
|
|
3844
3930
|
{
|
|
3845
3931
|
role: "button",
|
|
@@ -3861,7 +3947,7 @@ var EditableCell = ({
|
|
|
3861
3947
|
);
|
|
3862
3948
|
};
|
|
3863
3949
|
EditableCell.displayName = "EditableCell";
|
|
3864
|
-
var RowActions = ({ children, className }) => /* @__PURE__ */
|
|
3950
|
+
var RowActions = ({ children, className }) => /* @__PURE__ */ jsx31(
|
|
3865
3951
|
"div",
|
|
3866
3952
|
{
|
|
3867
3953
|
className: cn(
|
|
@@ -3875,7 +3961,7 @@ var RowActions = ({ children, className }) => /* @__PURE__ */ jsx30(
|
|
|
3875
3961
|
RowActions.displayName = "RowActions";
|
|
3876
3962
|
|
|
3877
3963
|
// src/components/ui/data-table.tsx
|
|
3878
|
-
import * as
|
|
3964
|
+
import * as React33 from "react";
|
|
3879
3965
|
import {
|
|
3880
3966
|
flexRender,
|
|
3881
3967
|
getCoreRowModel,
|
|
@@ -3914,9 +4000,9 @@ import {
|
|
|
3914
4000
|
import * as PopoverPrimitive2 from "@radix-ui/react-popover";
|
|
3915
4001
|
|
|
3916
4002
|
// src/components/ui/table.tsx
|
|
3917
|
-
import * as
|
|
3918
|
-
import { jsx as
|
|
3919
|
-
var Table =
|
|
4003
|
+
import * as React32 from "react";
|
|
4004
|
+
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
4005
|
+
var Table = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx32(
|
|
3920
4006
|
"table",
|
|
3921
4007
|
{
|
|
3922
4008
|
ref,
|
|
@@ -3925,7 +4011,7 @@ var Table = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
|
3925
4011
|
}
|
|
3926
4012
|
) }));
|
|
3927
4013
|
Table.displayName = "Table";
|
|
3928
|
-
var TableHeader =
|
|
4014
|
+
var TableHeader = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
|
|
3929
4015
|
"thead",
|
|
3930
4016
|
{
|
|
3931
4017
|
ref,
|
|
@@ -3934,9 +4020,9 @@ var TableHeader = React31.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
3934
4020
|
}
|
|
3935
4021
|
));
|
|
3936
4022
|
TableHeader.displayName = "TableHeader";
|
|
3937
|
-
var TableBody =
|
|
4023
|
+
var TableBody = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32("tbody", { ref, className: cn("[&_tr:last-child_td]:border-b-0", className), ...props }));
|
|
3938
4024
|
TableBody.displayName = "TableBody";
|
|
3939
|
-
var TableFooter =
|
|
4025
|
+
var TableFooter = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
|
|
3940
4026
|
"tfoot",
|
|
3941
4027
|
{
|
|
3942
4028
|
ref,
|
|
@@ -3948,7 +4034,7 @@ var TableFooter = React31.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
3948
4034
|
}
|
|
3949
4035
|
));
|
|
3950
4036
|
TableFooter.displayName = "TableFooter";
|
|
3951
|
-
var TableRow =
|
|
4037
|
+
var TableRow = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
|
|
3952
4038
|
"tr",
|
|
3953
4039
|
{
|
|
3954
4040
|
ref,
|
|
@@ -3962,7 +4048,7 @@ var TableRow = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__
|
|
|
3962
4048
|
}
|
|
3963
4049
|
));
|
|
3964
4050
|
TableRow.displayName = "TableRow";
|
|
3965
|
-
var TableHead =
|
|
4051
|
+
var TableHead = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
|
|
3966
4052
|
"th",
|
|
3967
4053
|
{
|
|
3968
4054
|
ref,
|
|
@@ -3978,7 +4064,7 @@ var TableHead = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE_
|
|
|
3978
4064
|
}
|
|
3979
4065
|
));
|
|
3980
4066
|
TableHead.displayName = "TableHead";
|
|
3981
|
-
var TableCell =
|
|
4067
|
+
var TableCell = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
|
|
3982
4068
|
"td",
|
|
3983
4069
|
{
|
|
3984
4070
|
ref,
|
|
@@ -3993,7 +4079,7 @@ var TableCell = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE_
|
|
|
3993
4079
|
}
|
|
3994
4080
|
));
|
|
3995
4081
|
TableCell.displayName = "TableCell";
|
|
3996
|
-
var TableCaption =
|
|
4082
|
+
var TableCaption = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
|
|
3997
4083
|
"caption",
|
|
3998
4084
|
{
|
|
3999
4085
|
ref,
|
|
@@ -4004,7 +4090,7 @@ var TableCaption = React31.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
4004
4090
|
TableCaption.displayName = "TableCaption";
|
|
4005
4091
|
|
|
4006
4092
|
// src/components/ui/data-table.tsx
|
|
4007
|
-
import { jsx as
|
|
4093
|
+
import { jsx as jsx33, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
4008
4094
|
var filterOperatorsByType = {
|
|
4009
4095
|
string: [
|
|
4010
4096
|
{ value: "contains", label: "Contains" },
|
|
@@ -4054,12 +4140,12 @@ function ColumnFilterPopover({
|
|
|
4054
4140
|
children
|
|
4055
4141
|
}) {
|
|
4056
4142
|
const operators = filterOperatorsByType[filterType] ?? filterOperatorsByType.string;
|
|
4057
|
-
const [operator, setOperator] =
|
|
4143
|
+
const [operator, setOperator] = React33.useState(
|
|
4058
4144
|
operators[0].value
|
|
4059
4145
|
);
|
|
4060
|
-
const [inputValue, setInputValue] =
|
|
4061
|
-
const [open, setOpen] =
|
|
4062
|
-
|
|
4146
|
+
const [inputValue, setInputValue] = React33.useState("");
|
|
4147
|
+
const [open, setOpen] = React33.useState(false);
|
|
4148
|
+
React33.useEffect(() => {
|
|
4063
4149
|
if (open && filterValue && typeof filterValue === "object") {
|
|
4064
4150
|
const fv = filterValue;
|
|
4065
4151
|
if (fv.operator) setOperator(fv.operator);
|
|
@@ -4069,9 +4155,9 @@ function ColumnFilterPopover({
|
|
|
4069
4155
|
setInputValue("");
|
|
4070
4156
|
}
|
|
4071
4157
|
}, [open, filterValue, operators]);
|
|
4072
|
-
return /* @__PURE__ */
|
|
4073
|
-
/* @__PURE__ */
|
|
4074
|
-
/* @__PURE__ */
|
|
4158
|
+
return /* @__PURE__ */ jsxs29(PopoverPrimitive2.Root, { open, onOpenChange: setOpen, children: [
|
|
4159
|
+
/* @__PURE__ */ jsx33(PopoverPrimitive2.Trigger, { asChild: true, children }),
|
|
4160
|
+
/* @__PURE__ */ jsx33(PopoverPrimitive2.Portal, { children: /* @__PURE__ */ jsx33(
|
|
4075
4161
|
PopoverPrimitive2.Content,
|
|
4076
4162
|
{
|
|
4077
4163
|
align: "start",
|
|
@@ -4081,9 +4167,9 @@ function ColumnFilterPopover({
|
|
|
4081
4167
|
"animate-in fade-in-0 zoom-in-95"
|
|
4082
4168
|
),
|
|
4083
4169
|
onClick: (e) => e.stopPropagation(),
|
|
4084
|
-
children: /* @__PURE__ */
|
|
4085
|
-
/* @__PURE__ */
|
|
4086
|
-
/* @__PURE__ */
|
|
4170
|
+
children: /* @__PURE__ */ jsxs29("div", { className: "flex flex-col gap-sm", children: [
|
|
4171
|
+
/* @__PURE__ */ jsx33("span", { className: "text-xs font-medium text-table-head-text", children: "Filter" }),
|
|
4172
|
+
/* @__PURE__ */ jsx33(
|
|
4087
4173
|
"select",
|
|
4088
4174
|
{
|
|
4089
4175
|
className: cn(
|
|
@@ -4093,10 +4179,10 @@ function ColumnFilterPopover({
|
|
|
4093
4179
|
),
|
|
4094
4180
|
value: operator,
|
|
4095
4181
|
onChange: (e) => setOperator(e.target.value),
|
|
4096
|
-
children: operators.map((op) => /* @__PURE__ */
|
|
4182
|
+
children: operators.map((op) => /* @__PURE__ */ jsx33("option", { value: op.value, children: op.label }, op.value))
|
|
4097
4183
|
}
|
|
4098
4184
|
),
|
|
4099
|
-
!noValueOperators.has(operator) && /* @__PURE__ */
|
|
4185
|
+
!noValueOperators.has(operator) && /* @__PURE__ */ jsx33(
|
|
4100
4186
|
"input",
|
|
4101
4187
|
{
|
|
4102
4188
|
type: filterType === "number" ? "number" : filterType === "date" ? "date" : "text",
|
|
@@ -4116,8 +4202,8 @@ function ColumnFilterPopover({
|
|
|
4116
4202
|
}
|
|
4117
4203
|
}
|
|
4118
4204
|
),
|
|
4119
|
-
/* @__PURE__ */
|
|
4120
|
-
/* @__PURE__ */
|
|
4205
|
+
/* @__PURE__ */ jsxs29("div", { className: "flex items-center justify-end gap-xs pt-xs", children: [
|
|
4206
|
+
/* @__PURE__ */ jsx33(
|
|
4121
4207
|
Button,
|
|
4122
4208
|
{
|
|
4123
4209
|
appearance: "ghost",
|
|
@@ -4130,7 +4216,7 @@ function ColumnFilterPopover({
|
|
|
4130
4216
|
children: "Clear"
|
|
4131
4217
|
}
|
|
4132
4218
|
),
|
|
4133
|
-
/* @__PURE__ */
|
|
4219
|
+
/* @__PURE__ */ jsx33(
|
|
4134
4220
|
Button,
|
|
4135
4221
|
{
|
|
4136
4222
|
appearance: "solid",
|
|
@@ -4163,7 +4249,7 @@ function DraggableHeaderCell({
|
|
|
4163
4249
|
const leadingIcon = meta?.icon;
|
|
4164
4250
|
const canDrag = isDragEnabled && meta?.enableDrag !== false;
|
|
4165
4251
|
const filterType = meta?.filterType ?? "string";
|
|
4166
|
-
const [isHovered, setIsHovered] =
|
|
4252
|
+
const [isHovered, setIsHovered] = React33.useState(false);
|
|
4167
4253
|
const {
|
|
4168
4254
|
attributes,
|
|
4169
4255
|
listeners,
|
|
@@ -4185,7 +4271,7 @@ function DraggableHeaderCell({
|
|
|
4185
4271
|
opacity: isDragging ? 0.5 : 1,
|
|
4186
4272
|
zIndex: isDragging ? 1 : void 0
|
|
4187
4273
|
};
|
|
4188
|
-
return /* @__PURE__ */
|
|
4274
|
+
return /* @__PURE__ */ jsxs29(
|
|
4189
4275
|
TableHead,
|
|
4190
4276
|
{
|
|
4191
4277
|
ref: setNodeRef,
|
|
@@ -4199,15 +4285,15 @@ function DraggableHeaderCell({
|
|
|
4199
4285
|
onMouseEnter: () => setIsHovered(true),
|
|
4200
4286
|
onMouseLeave: () => setIsHovered(false),
|
|
4201
4287
|
children: [
|
|
4202
|
-
/* @__PURE__ */
|
|
4203
|
-
leadingIcon && (canDrag ? /* @__PURE__ */
|
|
4288
|
+
/* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-xs", children: [
|
|
4289
|
+
leadingIcon && (canDrag ? /* @__PURE__ */ jsx33(
|
|
4204
4290
|
"div",
|
|
4205
4291
|
{
|
|
4206
4292
|
...attributes,
|
|
4207
4293
|
...listeners,
|
|
4208
4294
|
className: "shrink-0 flex items-center cursor-grab",
|
|
4209
4295
|
onClick: (e) => e.stopPropagation(),
|
|
4210
|
-
children: /* @__PURE__ */
|
|
4296
|
+
children: /* @__PURE__ */ jsx33(
|
|
4211
4297
|
Icon21,
|
|
4212
4298
|
{
|
|
4213
4299
|
icon: isHovered ? faGripDotsVerticalSolid2 : leadingIcon,
|
|
@@ -4216,7 +4302,7 @@ function DraggableHeaderCell({
|
|
|
4216
4302
|
}
|
|
4217
4303
|
)
|
|
4218
4304
|
}
|
|
4219
|
-
) : /* @__PURE__ */
|
|
4305
|
+
) : /* @__PURE__ */ jsx33(
|
|
4220
4306
|
Icon21,
|
|
4221
4307
|
{
|
|
4222
4308
|
icon: leadingIcon,
|
|
@@ -4224,14 +4310,14 @@ function DraggableHeaderCell({
|
|
|
4224
4310
|
className: "shrink-0 text-table-head-icon"
|
|
4225
4311
|
}
|
|
4226
4312
|
)),
|
|
4227
|
-
!leadingIcon && canDrag && isHovered && /* @__PURE__ */
|
|
4313
|
+
!leadingIcon && canDrag && isHovered && /* @__PURE__ */ jsx33(
|
|
4228
4314
|
"div",
|
|
4229
4315
|
{
|
|
4230
4316
|
...attributes,
|
|
4231
4317
|
...listeners,
|
|
4232
4318
|
className: "shrink-0 flex items-center cursor-grab",
|
|
4233
4319
|
onClick: (e) => e.stopPropagation(),
|
|
4234
|
-
children: /* @__PURE__ */
|
|
4320
|
+
children: /* @__PURE__ */ jsx33(
|
|
4235
4321
|
Icon21,
|
|
4236
4322
|
{
|
|
4237
4323
|
icon: faGripDotsVerticalSolid2,
|
|
@@ -4241,11 +4327,11 @@ function DraggableHeaderCell({
|
|
|
4241
4327
|
)
|
|
4242
4328
|
}
|
|
4243
4329
|
),
|
|
4244
|
-
/* @__PURE__ */
|
|
4330
|
+
/* @__PURE__ */ jsx33("span", { className: "flex-1 truncate", children: header.isPlaceholder ? null : flexRender(
|
|
4245
4331
|
header.column.columnDef.header,
|
|
4246
4332
|
header.getContext()
|
|
4247
4333
|
) }),
|
|
4248
|
-
canSort && (isSorted || isHovered) && /* @__PURE__ */
|
|
4334
|
+
canSort && (isSorted || isHovered) && /* @__PURE__ */ jsx33(
|
|
4249
4335
|
Icon21,
|
|
4250
4336
|
{
|
|
4251
4337
|
icon: isSorted === "asc" ? faSortUpSolid : isSorted === "desc" ? faSortDownSolid : faSortSolid,
|
|
@@ -4253,20 +4339,20 @@ function DraggableHeaderCell({
|
|
|
4253
4339
|
className: "shrink-0 text-table-head-icon"
|
|
4254
4340
|
}
|
|
4255
4341
|
),
|
|
4256
|
-
enableFiltering && (isFiltered || isHovered) && /* @__PURE__ */
|
|
4342
|
+
enableFiltering && (isFiltered || isHovered) && /* @__PURE__ */ jsx33(
|
|
4257
4343
|
ColumnFilterPopover,
|
|
4258
4344
|
{
|
|
4259
4345
|
filterType,
|
|
4260
4346
|
filterValue: header.column.getFilterValue(),
|
|
4261
4347
|
onApply: (val) => header.column.setFilterValue(val),
|
|
4262
4348
|
onClear: () => header.column.setFilterValue(void 0),
|
|
4263
|
-
children: /* @__PURE__ */
|
|
4349
|
+
children: /* @__PURE__ */ jsx33(
|
|
4264
4350
|
"button",
|
|
4265
4351
|
{
|
|
4266
4352
|
type: "button",
|
|
4267
4353
|
onClick: (e) => e.stopPropagation(),
|
|
4268
4354
|
className: "shrink-0 p-0 border-0 bg-transparent cursor-pointer",
|
|
4269
|
-
children: /* @__PURE__ */
|
|
4355
|
+
children: /* @__PURE__ */ jsx33(
|
|
4270
4356
|
Icon21,
|
|
4271
4357
|
{
|
|
4272
4358
|
icon: isFiltered ? faFilterSolid : faFilterOutline,
|
|
@@ -4279,7 +4365,7 @@ function DraggableHeaderCell({
|
|
|
4279
4365
|
}
|
|
4280
4366
|
)
|
|
4281
4367
|
] }),
|
|
4282
|
-
enableColumnResizing && header.column.getCanResize() && /* @__PURE__ */
|
|
4368
|
+
enableColumnResizing && header.column.getCanResize() && /* @__PURE__ */ jsx33(
|
|
4283
4369
|
"div",
|
|
4284
4370
|
{
|
|
4285
4371
|
onMouseDown: header.getResizeHandler(),
|
|
@@ -4397,17 +4483,17 @@ function DataTableInner({
|
|
|
4397
4483
|
emptyMessage = "No results.",
|
|
4398
4484
|
bordered = false
|
|
4399
4485
|
}) {
|
|
4400
|
-
const [internalSorting, setInternalSorting] =
|
|
4401
|
-
const [internalColumnFilters, setInternalColumnFilters] =
|
|
4402
|
-
const [internalPagination, setInternalPagination] =
|
|
4403
|
-
const [internalRowSelection, setInternalRowSelection] =
|
|
4404
|
-
const [internalColumnVisibility, setInternalColumnVisibility] =
|
|
4405
|
-
const [internalColumnOrder, setInternalColumnOrder] =
|
|
4406
|
-
const [internalColumnPinning, setInternalColumnPinning] =
|
|
4407
|
-
const [internalColumnSizing, setInternalColumnSizing] =
|
|
4486
|
+
const [internalSorting, setInternalSorting] = React33.useState([]);
|
|
4487
|
+
const [internalColumnFilters, setInternalColumnFilters] = React33.useState([]);
|
|
4488
|
+
const [internalPagination, setInternalPagination] = React33.useState({ pageIndex: 0, pageSize: 10 });
|
|
4489
|
+
const [internalRowSelection, setInternalRowSelection] = React33.useState({});
|
|
4490
|
+
const [internalColumnVisibility, setInternalColumnVisibility] = React33.useState({});
|
|
4491
|
+
const [internalColumnOrder, setInternalColumnOrder] = React33.useState([]);
|
|
4492
|
+
const [internalColumnPinning, setInternalColumnPinning] = React33.useState({});
|
|
4493
|
+
const [internalColumnSizing, setInternalColumnSizing] = React33.useState({});
|
|
4408
4494
|
const columnOrder = columnOrderProp ?? internalColumnOrder;
|
|
4409
4495
|
const setColumnOrder = onColumnOrderChange ?? setInternalColumnOrder;
|
|
4410
|
-
|
|
4496
|
+
React33.useEffect(() => {
|
|
4411
4497
|
if (enableColumnDrag && columnOrder.length === 0) {
|
|
4412
4498
|
const ids = columns.map((c) => {
|
|
4413
4499
|
if ("accessorKey" in c && c.accessorKey) return String(c.accessorKey);
|
|
@@ -4501,7 +4587,7 @@ function DataTableInner({
|
|
|
4501
4587
|
}),
|
|
4502
4588
|
useSensor(KeyboardSensor)
|
|
4503
4589
|
);
|
|
4504
|
-
const handleDragEnd =
|
|
4590
|
+
const handleDragEnd = React33.useCallback(
|
|
4505
4591
|
(event) => {
|
|
4506
4592
|
const { active, over } = event;
|
|
4507
4593
|
if (!over || active.id === over.id) return;
|
|
@@ -4515,12 +4601,12 @@ function DataTableInner({
|
|
|
4515
4601
|
},
|
|
4516
4602
|
[table, setColumnOrder]
|
|
4517
4603
|
);
|
|
4518
|
-
const columnIds =
|
|
4604
|
+
const columnIds = React33.useMemo(
|
|
4519
4605
|
() => table.getAllLeafColumns().map((c) => c.id),
|
|
4520
4606
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4521
4607
|
[table.getAllLeafColumns().length, columnOrder]
|
|
4522
4608
|
);
|
|
4523
|
-
const columnSizeVars =
|
|
4609
|
+
const columnSizeVars = React33.useMemo(() => {
|
|
4524
4610
|
if (!enableColumnResizing) return {};
|
|
4525
4611
|
const headers = table.getFlatHeaders();
|
|
4526
4612
|
const vars = {};
|
|
@@ -4531,23 +4617,23 @@ function DataTableInner({
|
|
|
4531
4617
|
return vars;
|
|
4532
4618
|
}, [enableColumnResizing, table.getState().columnSizing]);
|
|
4533
4619
|
const totalSize = enableColumnResizing ? table.getTotalSize() : void 0;
|
|
4534
|
-
const tableContent = /* @__PURE__ */
|
|
4535
|
-
/* @__PURE__ */
|
|
4620
|
+
const tableContent = /* @__PURE__ */ jsxs29("div", { className: cn("w-full", className), style: columnSizeVars, children: [
|
|
4621
|
+
/* @__PURE__ */ jsxs29(
|
|
4536
4622
|
Table,
|
|
4537
4623
|
{
|
|
4538
4624
|
style: totalSize ? { width: totalSize, tableLayout: "fixed" } : void 0,
|
|
4539
4625
|
className: totalSize ? "w-auto" : void 0,
|
|
4540
4626
|
children: [
|
|
4541
|
-
/* @__PURE__ */
|
|
4627
|
+
/* @__PURE__ */ jsx33(
|
|
4542
4628
|
TableHeader,
|
|
4543
4629
|
{
|
|
4544
4630
|
className: cn(bordered && "border-t border-table-border"),
|
|
4545
|
-
children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */
|
|
4631
|
+
children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx33(TableRow, { children: enableColumnDrag ? /* @__PURE__ */ jsx33(
|
|
4546
4632
|
SortableContext,
|
|
4547
4633
|
{
|
|
4548
4634
|
items: columnIds,
|
|
4549
4635
|
strategy: horizontalListSortingStrategy,
|
|
4550
|
-
children: headerGroup.headers.map((header) => /* @__PURE__ */
|
|
4636
|
+
children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx33(
|
|
4551
4637
|
DraggableHeaderCell,
|
|
4552
4638
|
{
|
|
4553
4639
|
header,
|
|
@@ -4559,7 +4645,7 @@ function DataTableInner({
|
|
|
4559
4645
|
header.id
|
|
4560
4646
|
))
|
|
4561
4647
|
}
|
|
4562
|
-
) : headerGroup.headers.map((header) => /* @__PURE__ */
|
|
4648
|
+
) : headerGroup.headers.map((header) => /* @__PURE__ */ jsx33(
|
|
4563
4649
|
DraggableHeaderCell,
|
|
4564
4650
|
{
|
|
4565
4651
|
header,
|
|
@@ -4572,11 +4658,11 @@ function DataTableInner({
|
|
|
4572
4658
|
)) }, headerGroup.id))
|
|
4573
4659
|
}
|
|
4574
4660
|
),
|
|
4575
|
-
/* @__PURE__ */
|
|
4661
|
+
/* @__PURE__ */ jsx33(TableBody, { children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx33(
|
|
4576
4662
|
TableRow,
|
|
4577
4663
|
{
|
|
4578
4664
|
"data-state": row.getIsSelected() ? "selected" : void 0,
|
|
4579
|
-
children: row.getVisibleCells().map((cell) => /* @__PURE__ */
|
|
4665
|
+
children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx33(
|
|
4580
4666
|
TableCell,
|
|
4581
4667
|
{
|
|
4582
4668
|
style: enableColumnResizing ? { width: `var(--col-${cell.column.id}-size)` } : void 0,
|
|
@@ -4590,12 +4676,12 @@ function DataTableInner({
|
|
|
4590
4676
|
))
|
|
4591
4677
|
},
|
|
4592
4678
|
row.id
|
|
4593
|
-
)) : /* @__PURE__ */
|
|
4679
|
+
)) : /* @__PURE__ */ jsx33(TableRow, { className: "hover:bg-transparent", children: /* @__PURE__ */ jsx33(
|
|
4594
4680
|
TableCell,
|
|
4595
4681
|
{
|
|
4596
4682
|
colSpan: columns.length,
|
|
4597
4683
|
className: "h-48 text-center border-b-0",
|
|
4598
|
-
children: emptyState ?? /* @__PURE__ */
|
|
4684
|
+
children: emptyState ?? /* @__PURE__ */ jsx33("span", { className: "text-sm text-table-cell-text-secondary", children: emptyMessage })
|
|
4599
4685
|
}
|
|
4600
4686
|
) }) })
|
|
4601
4687
|
]
|
|
@@ -4604,7 +4690,7 @@ function DataTableInner({
|
|
|
4604
4690
|
children?.(table)
|
|
4605
4691
|
] });
|
|
4606
4692
|
if (enableColumnDrag) {
|
|
4607
|
-
return /* @__PURE__ */
|
|
4693
|
+
return /* @__PURE__ */ jsx33(
|
|
4608
4694
|
DndContext,
|
|
4609
4695
|
{
|
|
4610
4696
|
sensors,
|
|
@@ -4625,7 +4711,7 @@ function DataTablePagination({
|
|
|
4625
4711
|
const totalCount = table.getFilteredRowModel().rows.length;
|
|
4626
4712
|
const pageIndex = table.getState().pagination.pageIndex;
|
|
4627
4713
|
const pageCount = table.getPageCount();
|
|
4628
|
-
return /* @__PURE__ */
|
|
4714
|
+
return /* @__PURE__ */ jsxs29(
|
|
4629
4715
|
"div",
|
|
4630
4716
|
{
|
|
4631
4717
|
className: cn(
|
|
@@ -4633,16 +4719,16 @@ function DataTablePagination({
|
|
|
4633
4719
|
className
|
|
4634
4720
|
),
|
|
4635
4721
|
children: [
|
|
4636
|
-
/* @__PURE__ */
|
|
4722
|
+
/* @__PURE__ */ jsx33("div", { className: "text-xs text-table-cell-text-secondary", children: selectedCount > 0 && /* @__PURE__ */ jsxs29("span", { children: [
|
|
4637
4723
|
selectedCount,
|
|
4638
4724
|
" of ",
|
|
4639
4725
|
totalCount,
|
|
4640
4726
|
" row(s) selected"
|
|
4641
4727
|
] }) }),
|
|
4642
|
-
/* @__PURE__ */
|
|
4643
|
-
/* @__PURE__ */
|
|
4644
|
-
/* @__PURE__ */
|
|
4645
|
-
/* @__PURE__ */
|
|
4728
|
+
/* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-lg", children: [
|
|
4729
|
+
/* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-sm", children: [
|
|
4730
|
+
/* @__PURE__ */ jsx33("span", { className: "text-xs text-table-cell-text-secondary whitespace-nowrap", children: "Rows per page" }),
|
|
4731
|
+
/* @__PURE__ */ jsx33(
|
|
4646
4732
|
"select",
|
|
4647
4733
|
{
|
|
4648
4734
|
className: cn(
|
|
@@ -4652,18 +4738,18 @@ function DataTablePagination({
|
|
|
4652
4738
|
),
|
|
4653
4739
|
value: table.getState().pagination.pageSize,
|
|
4654
4740
|
onChange: (e) => table.setPageSize(Number(e.target.value)),
|
|
4655
|
-
children: pageSizeOptions.map((size) => /* @__PURE__ */
|
|
4741
|
+
children: pageSizeOptions.map((size) => /* @__PURE__ */ jsx33("option", { value: size, children: size }, size))
|
|
4656
4742
|
}
|
|
4657
4743
|
)
|
|
4658
4744
|
] }),
|
|
4659
|
-
/* @__PURE__ */
|
|
4745
|
+
/* @__PURE__ */ jsxs29("span", { className: "text-xs text-table-cell-text-secondary whitespace-nowrap", children: [
|
|
4660
4746
|
"Page ",
|
|
4661
4747
|
pageIndex + 1,
|
|
4662
4748
|
" of ",
|
|
4663
4749
|
pageCount
|
|
4664
4750
|
] }),
|
|
4665
|
-
/* @__PURE__ */
|
|
4666
|
-
/* @__PURE__ */
|
|
4751
|
+
/* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-xs", children: [
|
|
4752
|
+
/* @__PURE__ */ jsx33(
|
|
4667
4753
|
Button,
|
|
4668
4754
|
{
|
|
4669
4755
|
appearance: "outlined",
|
|
@@ -4675,7 +4761,7 @@ function DataTablePagination({
|
|
|
4675
4761
|
"aria-label": "Previous page"
|
|
4676
4762
|
}
|
|
4677
4763
|
),
|
|
4678
|
-
/* @__PURE__ */
|
|
4764
|
+
/* @__PURE__ */ jsx33(
|
|
4679
4765
|
Button,
|
|
4680
4766
|
{
|
|
4681
4767
|
appearance: "outlined",
|
|
@@ -4697,15 +4783,15 @@ var DataTable = Object.assign(DataTableInner, { displayName: "DataTable" });
|
|
|
4697
4783
|
Object.assign(DataTablePagination, { displayName: "DataTablePagination" });
|
|
4698
4784
|
|
|
4699
4785
|
// src/components/ui/side-panel.tsx
|
|
4700
|
-
import * as
|
|
4786
|
+
import * as React34 from "react";
|
|
4701
4787
|
import * as DialogPrimitive2 from "@radix-ui/react-dialog";
|
|
4702
|
-
import { jsx as
|
|
4788
|
+
import { jsx as jsx34, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
4703
4789
|
var SidePanel = DialogPrimitive2.Root;
|
|
4704
4790
|
var SidePanelTrigger = DialogPrimitive2.Trigger;
|
|
4705
4791
|
var SidePanelClose = DialogPrimitive2.Close;
|
|
4706
|
-
var SidePanelContent =
|
|
4707
|
-
overlay && /* @__PURE__ */
|
|
4708
|
-
/* @__PURE__ */
|
|
4792
|
+
var SidePanelContent = React34.forwardRef(({ className, overlay = true, children, ...props }, ref) => /* @__PURE__ */ jsxs30(DialogPrimitive2.Portal, { children: [
|
|
4793
|
+
overlay && /* @__PURE__ */ jsx34(ModalOverlay, {}),
|
|
4794
|
+
/* @__PURE__ */ jsx34(
|
|
4709
4795
|
DialogPrimitive2.Content,
|
|
4710
4796
|
{
|
|
4711
4797
|
ref,
|
|
@@ -4726,10 +4812,10 @@ var SidePanelContent = React33.forwardRef(({ className, overlay = true, children
|
|
|
4726
4812
|
SidePanelContent.displayName = "SidePanelContent";
|
|
4727
4813
|
|
|
4728
4814
|
// src/components/ui/filter/filter-chip-segment.tsx
|
|
4729
|
-
import * as
|
|
4815
|
+
import * as React35 from "react";
|
|
4730
4816
|
import { cva as cva19 } from "class-variance-authority";
|
|
4731
4817
|
import { Icon as Icon22 } from "@l3mpire/icons";
|
|
4732
|
-
import { jsx as
|
|
4818
|
+
import { jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
4733
4819
|
var filterChipSegmentVariants = cva19(
|
|
4734
4820
|
["flex items-center shrink-0 transition-colors"],
|
|
4735
4821
|
{
|
|
@@ -4752,7 +4838,7 @@ var filterChipSegmentVariants = cva19(
|
|
|
4752
4838
|
}
|
|
4753
4839
|
}
|
|
4754
4840
|
);
|
|
4755
|
-
var FilterChipSegment =
|
|
4841
|
+
var FilterChipSegment = React35.forwardRef(
|
|
4756
4842
|
({
|
|
4757
4843
|
className,
|
|
4758
4844
|
segmentType = "property",
|
|
@@ -4766,24 +4852,24 @@ var FilterChipSegment = React34.forwardRef(
|
|
|
4766
4852
|
...props
|
|
4767
4853
|
}, ref) => {
|
|
4768
4854
|
if (segmentType === "button") {
|
|
4769
|
-
return /* @__PURE__ */
|
|
4855
|
+
return /* @__PURE__ */ jsxs31(
|
|
4770
4856
|
"div",
|
|
4771
4857
|
{
|
|
4772
4858
|
ref,
|
|
4773
4859
|
className: cn(filterChipSegmentVariants({ type: "button", hasBorder: false }), className),
|
|
4774
4860
|
...props,
|
|
4775
4861
|
children: [
|
|
4776
|
-
/* @__PURE__ */
|
|
4862
|
+
/* @__PURE__ */ jsx35(
|
|
4777
4863
|
"button",
|
|
4778
4864
|
{
|
|
4779
4865
|
type: "button",
|
|
4780
4866
|
onClick: onKebabClick,
|
|
4781
4867
|
className: "flex items-center justify-center p-sm cursor-pointer hover:bg-filter-chip-segment-bg-hover active:bg-filter-chip-segment-bg-pressed transition-colors",
|
|
4782
4868
|
"aria-label": "Filter actions",
|
|
4783
|
-
children: /* @__PURE__ */
|
|
4784
|
-
/* @__PURE__ */
|
|
4785
|
-
/* @__PURE__ */
|
|
4786
|
-
/* @__PURE__ */
|
|
4869
|
+
children: /* @__PURE__ */ jsx35("span", { className: "size-5 flex items-center justify-center text-sm leading-sm text-filter-chip-kebab-text", children: /* @__PURE__ */ jsxs31("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: [
|
|
4870
|
+
/* @__PURE__ */ jsx35("circle", { cx: "10", cy: "4.5", r: "1.5" }),
|
|
4871
|
+
/* @__PURE__ */ jsx35("circle", { cx: "10", cy: "10", r: "1.5" }),
|
|
4872
|
+
/* @__PURE__ */ jsx35("circle", { cx: "10", cy: "15.5", r: "1.5" })
|
|
4787
4873
|
] }) })
|
|
4788
4874
|
}
|
|
4789
4875
|
),
|
|
@@ -4792,7 +4878,7 @@ var FilterChipSegment = React34.forwardRef(
|
|
|
4792
4878
|
}
|
|
4793
4879
|
);
|
|
4794
4880
|
}
|
|
4795
|
-
return /* @__PURE__ */
|
|
4881
|
+
return /* @__PURE__ */ jsxs31(
|
|
4796
4882
|
"div",
|
|
4797
4883
|
{
|
|
4798
4884
|
ref,
|
|
@@ -4803,8 +4889,8 @@ var FilterChipSegment = React34.forwardRef(
|
|
|
4803
4889
|
),
|
|
4804
4890
|
...props,
|
|
4805
4891
|
children: [
|
|
4806
|
-
adornment && segmentType === "value" && /* @__PURE__ */
|
|
4807
|
-
icon && segmentType === "property" && /* @__PURE__ */
|
|
4892
|
+
adornment && segmentType === "value" && /* @__PURE__ */ jsx35("div", { className: "shrink-0 size-5", children: adornment }),
|
|
4893
|
+
icon && segmentType === "property" && /* @__PURE__ */ jsx35(
|
|
4808
4894
|
Icon22,
|
|
4809
4895
|
{
|
|
4810
4896
|
icon,
|
|
@@ -4812,7 +4898,7 @@ var FilterChipSegment = React34.forwardRef(
|
|
|
4812
4898
|
className: "shrink-0 text-filter-chip-segment-icon"
|
|
4813
4899
|
}
|
|
4814
4900
|
),
|
|
4815
|
-
label && /* @__PURE__ */
|
|
4901
|
+
label && /* @__PURE__ */ jsx35(
|
|
4816
4902
|
"span",
|
|
4817
4903
|
{
|
|
4818
4904
|
className: cn(
|
|
@@ -4822,7 +4908,7 @@ var FilterChipSegment = React34.forwardRef(
|
|
|
4822
4908
|
children: label
|
|
4823
4909
|
}
|
|
4824
4910
|
),
|
|
4825
|
-
badgeCount != null && badgeCount > 0 && /* @__PURE__ */
|
|
4911
|
+
badgeCount != null && badgeCount > 0 && /* @__PURE__ */ jsx35("span", { className: "flex items-center gap-2xs p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ jsx35("span", { className: "text-[10px] font-medium leading-2xs text-filter-chip-badge-text", children: badgeCount }) }),
|
|
4826
4912
|
children
|
|
4827
4913
|
]
|
|
4828
4914
|
}
|
|
@@ -4832,9 +4918,9 @@ var FilterChipSegment = React34.forwardRef(
|
|
|
4832
4918
|
FilterChipSegment.displayName = "FilterChipSegment";
|
|
4833
4919
|
|
|
4834
4920
|
// src/components/ui/filter/filter-chip.tsx
|
|
4835
|
-
import * as
|
|
4836
|
-
import { jsx as
|
|
4837
|
-
var FilterChip =
|
|
4921
|
+
import * as React36 from "react";
|
|
4922
|
+
import { jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
4923
|
+
var FilterChip = React36.forwardRef(
|
|
4838
4924
|
({
|
|
4839
4925
|
className,
|
|
4840
4926
|
icon,
|
|
@@ -4851,7 +4937,7 @@ var FilterChip = React35.forwardRef(
|
|
|
4851
4937
|
}, ref) => {
|
|
4852
4938
|
const hasOperator = !!operator;
|
|
4853
4939
|
const hasValue = hasOperator && value != null;
|
|
4854
|
-
return /* @__PURE__ */
|
|
4940
|
+
return /* @__PURE__ */ jsxs32(
|
|
4855
4941
|
"div",
|
|
4856
4942
|
{
|
|
4857
4943
|
ref,
|
|
@@ -4862,7 +4948,7 @@ var FilterChip = React35.forwardRef(
|
|
|
4862
4948
|
),
|
|
4863
4949
|
...props,
|
|
4864
4950
|
children: [
|
|
4865
|
-
/* @__PURE__ */
|
|
4951
|
+
/* @__PURE__ */ jsx36(
|
|
4866
4952
|
FilterChipSegment,
|
|
4867
4953
|
{
|
|
4868
4954
|
segmentType: "property",
|
|
@@ -4872,7 +4958,7 @@ var FilterChip = React35.forwardRef(
|
|
|
4872
4958
|
onClick: onPropertyClick
|
|
4873
4959
|
}
|
|
4874
4960
|
),
|
|
4875
|
-
/* @__PURE__ */
|
|
4961
|
+
/* @__PURE__ */ jsx36(
|
|
4876
4962
|
FilterChipSegment,
|
|
4877
4963
|
{
|
|
4878
4964
|
segmentType: hasOperator ? "operator" : "placeholder",
|
|
@@ -4881,7 +4967,7 @@ var FilterChip = React35.forwardRef(
|
|
|
4881
4967
|
onClick: onOperatorClick
|
|
4882
4968
|
}
|
|
4883
4969
|
),
|
|
4884
|
-
hasOperator && /* @__PURE__ */
|
|
4970
|
+
hasOperator && /* @__PURE__ */ jsx36(
|
|
4885
4971
|
FilterChipSegment,
|
|
4886
4972
|
{
|
|
4887
4973
|
segmentType: hasValue ? "value" : "placeholder",
|
|
@@ -4892,7 +4978,7 @@ var FilterChip = React35.forwardRef(
|
|
|
4892
4978
|
onClick: onValueClick
|
|
4893
4979
|
}
|
|
4894
4980
|
),
|
|
4895
|
-
hasOperator && /* @__PURE__ */
|
|
4981
|
+
hasOperator && /* @__PURE__ */ jsx36(
|
|
4896
4982
|
FilterChipSegment,
|
|
4897
4983
|
{
|
|
4898
4984
|
segmentType: "button",
|
|
@@ -4986,10 +5072,10 @@ function getValueInputType(type, operator) {
|
|
|
4986
5072
|
}
|
|
4987
5073
|
|
|
4988
5074
|
// src/components/ui/filter/filter-bar.tsx
|
|
4989
|
-
import * as
|
|
4990
|
-
import { jsx as
|
|
4991
|
-
var FilterBar =
|
|
4992
|
-
({ className, children, ...props }, ref) => /* @__PURE__ */
|
|
5075
|
+
import * as React37 from "react";
|
|
5076
|
+
import { jsx as jsx37 } from "react/jsx-runtime";
|
|
5077
|
+
var FilterBar = React37.forwardRef(
|
|
5078
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx37(
|
|
4993
5079
|
"div",
|
|
4994
5080
|
{
|
|
4995
5081
|
ref,
|
|
@@ -5006,8 +5092,8 @@ var FilterBar = React36.forwardRef(
|
|
|
5006
5092
|
)
|
|
5007
5093
|
);
|
|
5008
5094
|
FilterBar.displayName = "FilterBar";
|
|
5009
|
-
var FilterBarLeft =
|
|
5010
|
-
({ className, children, ...props }, ref) => /* @__PURE__ */
|
|
5095
|
+
var FilterBarLeft = React37.forwardRef(
|
|
5096
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx37(
|
|
5011
5097
|
"div",
|
|
5012
5098
|
{
|
|
5013
5099
|
ref,
|
|
@@ -5018,8 +5104,8 @@ var FilterBarLeft = React36.forwardRef(
|
|
|
5018
5104
|
)
|
|
5019
5105
|
);
|
|
5020
5106
|
FilterBarLeft.displayName = "FilterBarLeft";
|
|
5021
|
-
var FilterBarRight =
|
|
5022
|
-
({ className, children, ...props }, ref) => /* @__PURE__ */
|
|
5107
|
+
var FilterBarRight = React37.forwardRef(
|
|
5108
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx37(
|
|
5023
5109
|
"div",
|
|
5024
5110
|
{
|
|
5025
5111
|
ref,
|
|
@@ -5032,14 +5118,14 @@ var FilterBarRight = React36.forwardRef(
|
|
|
5032
5118
|
FilterBarRight.displayName = "FilterBarRight";
|
|
5033
5119
|
|
|
5034
5120
|
// src/components/ui/filter/sort-button.tsx
|
|
5035
|
-
import * as
|
|
5121
|
+
import * as React38 from "react";
|
|
5036
5122
|
import * as PopoverPrimitive3 from "@radix-ui/react-popover";
|
|
5037
5123
|
import { Icon as Icon23 } from "@l3mpire/icons";
|
|
5038
5124
|
import {
|
|
5039
5125
|
faArrowUpSmallBigOutline,
|
|
5040
5126
|
faArrowDownBigSmallOutline
|
|
5041
5127
|
} from "@l3mpire/icons";
|
|
5042
|
-
import { jsx as
|
|
5128
|
+
import { jsx as jsx38, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
5043
5129
|
var SortButton = ({
|
|
5044
5130
|
className,
|
|
5045
5131
|
fields,
|
|
@@ -5049,11 +5135,11 @@ var SortButton = ({
|
|
|
5049
5135
|
iconOnly = false,
|
|
5050
5136
|
...props
|
|
5051
5137
|
}) => {
|
|
5052
|
-
const [open, setOpen] =
|
|
5138
|
+
const [open, setOpen] = React38.useState(false);
|
|
5053
5139
|
const activeFieldDef = fields.find((f) => f.id === activeField);
|
|
5054
5140
|
const activeLabel = activeFieldDef?.label ?? activeField;
|
|
5055
|
-
return /* @__PURE__ */
|
|
5056
|
-
/* @__PURE__ */
|
|
5141
|
+
return /* @__PURE__ */ jsxs33(PopoverPrimitive3.Root, { open, onOpenChange: setOpen, children: [
|
|
5142
|
+
/* @__PURE__ */ jsx38(PopoverPrimitive3.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs33(
|
|
5057
5143
|
"button",
|
|
5058
5144
|
{
|
|
5059
5145
|
type: "button",
|
|
@@ -5068,7 +5154,7 @@ var SortButton = ({
|
|
|
5068
5154
|
className
|
|
5069
5155
|
),
|
|
5070
5156
|
children: [
|
|
5071
|
-
/* @__PURE__ */
|
|
5157
|
+
/* @__PURE__ */ jsx38(
|
|
5072
5158
|
Icon23,
|
|
5073
5159
|
{
|
|
5074
5160
|
icon: direction === "asc" ? faArrowUpSmallBigOutline : faArrowDownBigSmallOutline,
|
|
@@ -5076,17 +5162,17 @@ var SortButton = ({
|
|
|
5076
5162
|
className: "shrink-0 text-[var(--color-foreground)]"
|
|
5077
5163
|
}
|
|
5078
5164
|
),
|
|
5079
|
-
!iconOnly && /* @__PURE__ */
|
|
5080
|
-
/* @__PURE__ */
|
|
5165
|
+
!iconOnly && /* @__PURE__ */ jsxs33("span", { className: "text-sm font-medium leading-sm whitespace-nowrap", children: [
|
|
5166
|
+
/* @__PURE__ */ jsxs33("span", { className: "text-[var(--color-muted-foreground)]", children: [
|
|
5081
5167
|
"Sort by",
|
|
5082
5168
|
" "
|
|
5083
5169
|
] }),
|
|
5084
|
-
/* @__PURE__ */
|
|
5170
|
+
/* @__PURE__ */ jsx38("span", { className: "text-[var(--color-foreground)]", children: activeLabel })
|
|
5085
5171
|
] })
|
|
5086
5172
|
]
|
|
5087
5173
|
}
|
|
5088
5174
|
) }),
|
|
5089
|
-
/* @__PURE__ */
|
|
5175
|
+
/* @__PURE__ */ jsx38(PopoverPrimitive3.Portal, { children: /* @__PURE__ */ jsxs33(
|
|
5090
5176
|
PopoverPrimitive3.Content,
|
|
5091
5177
|
{
|
|
5092
5178
|
sideOffset: 4,
|
|
@@ -5100,7 +5186,7 @@ var SortButton = ({
|
|
|
5100
5186
|
"min-w-[180px]"
|
|
5101
5187
|
),
|
|
5102
5188
|
children: [
|
|
5103
|
-
/* @__PURE__ */
|
|
5189
|
+
/* @__PURE__ */ jsx38("div", { className: "flex flex-col", children: fields.map((field) => /* @__PURE__ */ jsxs33(
|
|
5104
5190
|
"button",
|
|
5105
5191
|
{
|
|
5106
5192
|
type: "button",
|
|
@@ -5114,7 +5200,7 @@ var SortButton = ({
|
|
|
5114
5200
|
field.id === activeField ? "bg-[var(--color-dropdown-item-hover)]" : ""
|
|
5115
5201
|
),
|
|
5116
5202
|
children: [
|
|
5117
|
-
/* @__PURE__ */
|
|
5203
|
+
/* @__PURE__ */ jsx38(
|
|
5118
5204
|
Icon23,
|
|
5119
5205
|
{
|
|
5120
5206
|
icon: field.icon,
|
|
@@ -5125,7 +5211,7 @@ var SortButton = ({
|
|
|
5125
5211
|
)
|
|
5126
5212
|
}
|
|
5127
5213
|
),
|
|
5128
|
-
/* @__PURE__ */
|
|
5214
|
+
/* @__PURE__ */ jsx38(
|
|
5129
5215
|
"span",
|
|
5130
5216
|
{
|
|
5131
5217
|
className: cn(
|
|
@@ -5139,9 +5225,9 @@ var SortButton = ({
|
|
|
5139
5225
|
},
|
|
5140
5226
|
field.id
|
|
5141
5227
|
)) }),
|
|
5142
|
-
/* @__PURE__ */
|
|
5143
|
-
/* @__PURE__ */
|
|
5144
|
-
/* @__PURE__ */
|
|
5228
|
+
/* @__PURE__ */ jsx38("div", { className: "h-px bg-[var(--color-border)]" }),
|
|
5229
|
+
/* @__PURE__ */ jsxs33("div", { className: "flex flex-col", children: [
|
|
5230
|
+
/* @__PURE__ */ jsxs33(
|
|
5145
5231
|
"button",
|
|
5146
5232
|
{
|
|
5147
5233
|
type: "button",
|
|
@@ -5155,7 +5241,7 @@ var SortButton = ({
|
|
|
5155
5241
|
direction === "asc" ? "bg-[var(--color-dropdown-item-hover)]" : ""
|
|
5156
5242
|
),
|
|
5157
5243
|
children: [
|
|
5158
|
-
/* @__PURE__ */
|
|
5244
|
+
/* @__PURE__ */ jsx38(
|
|
5159
5245
|
Icon23,
|
|
5160
5246
|
{
|
|
5161
5247
|
icon: faArrowUpSmallBigOutline,
|
|
@@ -5166,7 +5252,7 @@ var SortButton = ({
|
|
|
5166
5252
|
)
|
|
5167
5253
|
}
|
|
5168
5254
|
),
|
|
5169
|
-
/* @__PURE__ */
|
|
5255
|
+
/* @__PURE__ */ jsx38(
|
|
5170
5256
|
"span",
|
|
5171
5257
|
{
|
|
5172
5258
|
className: cn(
|
|
@@ -5179,7 +5265,7 @@ var SortButton = ({
|
|
|
5179
5265
|
]
|
|
5180
5266
|
}
|
|
5181
5267
|
),
|
|
5182
|
-
/* @__PURE__ */
|
|
5268
|
+
/* @__PURE__ */ jsxs33(
|
|
5183
5269
|
"button",
|
|
5184
5270
|
{
|
|
5185
5271
|
type: "button",
|
|
@@ -5193,7 +5279,7 @@ var SortButton = ({
|
|
|
5193
5279
|
direction === "desc" ? "bg-[var(--color-dropdown-item-hover)]" : ""
|
|
5194
5280
|
),
|
|
5195
5281
|
children: [
|
|
5196
|
-
/* @__PURE__ */
|
|
5282
|
+
/* @__PURE__ */ jsx38(
|
|
5197
5283
|
Icon23,
|
|
5198
5284
|
{
|
|
5199
5285
|
icon: faArrowDownBigSmallOutline,
|
|
@@ -5204,7 +5290,7 @@ var SortButton = ({
|
|
|
5204
5290
|
)
|
|
5205
5291
|
}
|
|
5206
5292
|
),
|
|
5207
|
-
/* @__PURE__ */
|
|
5293
|
+
/* @__PURE__ */ jsx38(
|
|
5208
5294
|
"span",
|
|
5209
5295
|
{
|
|
5210
5296
|
className: cn(
|
|
@@ -5226,10 +5312,10 @@ var SortButton = ({
|
|
|
5226
5312
|
SortButton.displayName = "SortButton";
|
|
5227
5313
|
|
|
5228
5314
|
// src/components/ui/filter/filter-bar-button.tsx
|
|
5229
|
-
import * as
|
|
5315
|
+
import * as React39 from "react";
|
|
5230
5316
|
import { Icon as Icon24, faSlidersOutline } from "@l3mpire/icons";
|
|
5231
|
-
import { jsx as
|
|
5232
|
-
var FilterBarButton =
|
|
5317
|
+
import { jsx as jsx39, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
5318
|
+
var FilterBarButton = React39.forwardRef(({ className, count, iconOnly = false, children, ...props }, ref) => /* @__PURE__ */ jsxs34(
|
|
5233
5319
|
"button",
|
|
5234
5320
|
{
|
|
5235
5321
|
ref,
|
|
@@ -5246,7 +5332,7 @@ var FilterBarButton = React38.forwardRef(({ className, count, iconOnly = false,
|
|
|
5246
5332
|
),
|
|
5247
5333
|
...props,
|
|
5248
5334
|
children: [
|
|
5249
|
-
/* @__PURE__ */
|
|
5335
|
+
/* @__PURE__ */ jsx39(
|
|
5250
5336
|
Icon24,
|
|
5251
5337
|
{
|
|
5252
5338
|
icon: faSlidersOutline,
|
|
@@ -5254,18 +5340,18 @@ var FilterBarButton = React38.forwardRef(({ className, count, iconOnly = false,
|
|
|
5254
5340
|
className: "shrink-0 text-[var(--color-foreground)]"
|
|
5255
5341
|
}
|
|
5256
5342
|
),
|
|
5257
|
-
!iconOnly && /* @__PURE__ */
|
|
5258
|
-
count != null && count > 0 && /* @__PURE__ */
|
|
5343
|
+
!iconOnly && /* @__PURE__ */ jsx39("span", { className: "text-sm font-medium leading-sm whitespace-nowrap text-[var(--color-foreground)]", children: children ?? "Filters" }),
|
|
5344
|
+
count != null && count > 0 && /* @__PURE__ */ jsx39("span", { className: "flex items-center p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ jsx39("span", { className: "text-[10px] font-medium leading-2xs text-filter-chip-badge-text", children: count }) })
|
|
5259
5345
|
]
|
|
5260
5346
|
}
|
|
5261
5347
|
));
|
|
5262
5348
|
FilterBarButton.displayName = "FilterBarButton";
|
|
5263
5349
|
|
|
5264
5350
|
// src/components/ui/filter/save-view-button.tsx
|
|
5265
|
-
import * as
|
|
5351
|
+
import * as React40 from "react";
|
|
5266
5352
|
import { Icon as Icon25, faChevronDownOutline } from "@l3mpire/icons";
|
|
5267
|
-
import { jsx as
|
|
5268
|
-
var SaveViewButton =
|
|
5353
|
+
import { jsx as jsx40, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
5354
|
+
var SaveViewButton = React40.forwardRef(
|
|
5269
5355
|
({ className, label = "Save view", onSave, onDropdown, ...props }, ref) => {
|
|
5270
5356
|
const sharedStyle = [
|
|
5271
5357
|
"flex items-center justify-center",
|
|
@@ -5275,14 +5361,14 @@ var SaveViewButton = React39.forwardRef(
|
|
|
5275
5361
|
"shadow-sm cursor-pointer transition-colors",
|
|
5276
5362
|
"hover:from-[var(--color-btn-solid-brand-bg-hover)] hover:to-[var(--color-btn-solid-brand-bg-gradient-to-hover)]"
|
|
5277
5363
|
];
|
|
5278
|
-
return /* @__PURE__ */
|
|
5364
|
+
return /* @__PURE__ */ jsxs35(
|
|
5279
5365
|
"div",
|
|
5280
5366
|
{
|
|
5281
5367
|
ref,
|
|
5282
5368
|
className: cn("flex items-center", className),
|
|
5283
5369
|
...props,
|
|
5284
5370
|
children: [
|
|
5285
|
-
/* @__PURE__ */
|
|
5371
|
+
/* @__PURE__ */ jsxs35(
|
|
5286
5372
|
"button",
|
|
5287
5373
|
{
|
|
5288
5374
|
type: "button",
|
|
@@ -5293,12 +5379,12 @@ var SaveViewButton = React39.forwardRef(
|
|
|
5293
5379
|
"rounded-l-md -mr-px"
|
|
5294
5380
|
),
|
|
5295
5381
|
children: [
|
|
5296
|
-
/* @__PURE__ */
|
|
5297
|
-
/* @__PURE__ */
|
|
5382
|
+
/* @__PURE__ */ jsx40("span", { className: "text-sm font-medium leading-sm whitespace-nowrap text-[var(--color-btn-solid-brand-text-default)]", children: label }),
|
|
5383
|
+
/* @__PURE__ */ jsx40("span", { className: "absolute inset-0 rounded-l-[11px] border border-[var(--color-btn-solid-brand-inner-border-default)] shadow-sm pointer-events-none" })
|
|
5298
5384
|
]
|
|
5299
5385
|
}
|
|
5300
5386
|
),
|
|
5301
|
-
/* @__PURE__ */
|
|
5387
|
+
/* @__PURE__ */ jsxs35(
|
|
5302
5388
|
"button",
|
|
5303
5389
|
{
|
|
5304
5390
|
type: "button",
|
|
@@ -5309,7 +5395,7 @@ var SaveViewButton = React39.forwardRef(
|
|
|
5309
5395
|
"rounded-r-md -ml-px"
|
|
5310
5396
|
),
|
|
5311
5397
|
children: [
|
|
5312
|
-
/* @__PURE__ */
|
|
5398
|
+
/* @__PURE__ */ jsx40(
|
|
5313
5399
|
Icon25,
|
|
5314
5400
|
{
|
|
5315
5401
|
icon: faChevronDownOutline,
|
|
@@ -5317,7 +5403,7 @@ var SaveViewButton = React39.forwardRef(
|
|
|
5317
5403
|
className: "text-[var(--color-btn-solid-brand-text-default)]"
|
|
5318
5404
|
}
|
|
5319
5405
|
),
|
|
5320
|
-
/* @__PURE__ */
|
|
5406
|
+
/* @__PURE__ */ jsx40("span", { className: "absolute inset-0 rounded-r-[11px] border border-[var(--color-btn-solid-brand-inner-border-default)] shadow-sm pointer-events-none" })
|
|
5321
5407
|
]
|
|
5322
5408
|
}
|
|
5323
5409
|
)
|
|
@@ -5330,7 +5416,7 @@ SaveViewButton.displayName = "SaveViewButton";
|
|
|
5330
5416
|
|
|
5331
5417
|
// src/components/ui/filter/operator-selector.tsx
|
|
5332
5418
|
import * as PopoverPrimitive4 from "@radix-ui/react-popover";
|
|
5333
|
-
import { jsx as
|
|
5419
|
+
import { jsx as jsx41, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
5334
5420
|
var OperatorSelector = ({
|
|
5335
5421
|
dataType,
|
|
5336
5422
|
activeOperator,
|
|
@@ -5340,9 +5426,9 @@ var OperatorSelector = ({
|
|
|
5340
5426
|
children
|
|
5341
5427
|
}) => {
|
|
5342
5428
|
const operators = OPERATORS_BY_TYPE[dataType];
|
|
5343
|
-
return /* @__PURE__ */
|
|
5344
|
-
/* @__PURE__ */
|
|
5345
|
-
/* @__PURE__ */
|
|
5429
|
+
return /* @__PURE__ */ jsxs36(PopoverPrimitive4.Root, { open, onOpenChange, children: [
|
|
5430
|
+
/* @__PURE__ */ jsx41(PopoverPrimitive4.Trigger, { asChild: true, children }),
|
|
5431
|
+
/* @__PURE__ */ jsx41(PopoverPrimitive4.Portal, { children: /* @__PURE__ */ jsx41(
|
|
5346
5432
|
PopoverPrimitive4.Content,
|
|
5347
5433
|
{
|
|
5348
5434
|
sideOffset: 4,
|
|
@@ -5355,7 +5441,7 @@ var OperatorSelector = ({
|
|
|
5355
5441
|
"data-[side=bottom]:slide-in-from-top-2",
|
|
5356
5442
|
"min-w-[180px]"
|
|
5357
5443
|
),
|
|
5358
|
-
children: operators.map((op) => /* @__PURE__ */
|
|
5444
|
+
children: operators.map((op) => /* @__PURE__ */ jsxs36(
|
|
5359
5445
|
"button",
|
|
5360
5446
|
{
|
|
5361
5447
|
type: "button",
|
|
@@ -5366,7 +5452,7 @@ var OperatorSelector = ({
|
|
|
5366
5452
|
op === activeOperator && "bg-[var(--color-dropdown-item-hover)]"
|
|
5367
5453
|
),
|
|
5368
5454
|
children: [
|
|
5369
|
-
/* @__PURE__ */
|
|
5455
|
+
/* @__PURE__ */ jsx41(
|
|
5370
5456
|
"span",
|
|
5371
5457
|
{
|
|
5372
5458
|
className: cn(
|
|
@@ -5376,7 +5462,7 @@ var OperatorSelector = ({
|
|
|
5376
5462
|
children: op
|
|
5377
5463
|
}
|
|
5378
5464
|
),
|
|
5379
|
-
isNoValueOperator(op) && /* @__PURE__ */
|
|
5465
|
+
isNoValueOperator(op) && /* @__PURE__ */ jsx41("span", { className: "ml-auto text-xs text-[var(--color-muted-foreground)]", children: "instant" })
|
|
5380
5466
|
]
|
|
5381
5467
|
},
|
|
5382
5468
|
op
|
|
@@ -5392,7 +5478,7 @@ var OperatorList = ({
|
|
|
5392
5478
|
onSelect
|
|
5393
5479
|
}) => {
|
|
5394
5480
|
const operators = OPERATORS_BY_TYPE[dataType];
|
|
5395
|
-
return /* @__PURE__ */
|
|
5481
|
+
return /* @__PURE__ */ jsx41("div", { className: "flex flex-col", children: operators.map((op) => /* @__PURE__ */ jsx41(
|
|
5396
5482
|
"button",
|
|
5397
5483
|
{
|
|
5398
5484
|
type: "button",
|
|
@@ -5402,7 +5488,7 @@ var OperatorList = ({
|
|
|
5402
5488
|
"hover:bg-[var(--color-dropdown-item-hover)]",
|
|
5403
5489
|
op === activeOperator && "bg-[var(--color-dropdown-item-hover)]"
|
|
5404
5490
|
),
|
|
5405
|
-
children: /* @__PURE__ */
|
|
5491
|
+
children: /* @__PURE__ */ jsx41(
|
|
5406
5492
|
"span",
|
|
5407
5493
|
{
|
|
5408
5494
|
className: cn(
|
|
@@ -5419,7 +5505,7 @@ var OperatorList = ({
|
|
|
5419
5505
|
OperatorList.displayName = "OperatorList";
|
|
5420
5506
|
|
|
5421
5507
|
// src/components/ui/filter/value-input.tsx
|
|
5422
|
-
import { jsx as
|
|
5508
|
+
import { jsx as jsx42, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
5423
5509
|
var RELATIVE_DATE_PRESETS = [
|
|
5424
5510
|
{ group: "Past", options: ["Today", "Yesterday", "Last 7 days", "Last 14 days", "Last 30 days", "Last 90 days"] },
|
|
5425
5511
|
{ group: "Current", options: ["This week", "This month", "This quarter", "This year"] },
|
|
@@ -5441,8 +5527,8 @@ var ValueInput = ({
|
|
|
5441
5527
|
};
|
|
5442
5528
|
switch (inputType) {
|
|
5443
5529
|
case "TextInput":
|
|
5444
|
-
return /* @__PURE__ */
|
|
5445
|
-
/* @__PURE__ */
|
|
5530
|
+
return /* @__PURE__ */ jsxs37("div", { className: cn("flex flex-col gap-base p-base", className), children: [
|
|
5531
|
+
/* @__PURE__ */ jsx42(
|
|
5446
5532
|
"input",
|
|
5447
5533
|
{
|
|
5448
5534
|
type: "text",
|
|
@@ -5459,7 +5545,7 @@ var ValueInput = ({
|
|
|
5459
5545
|
)
|
|
5460
5546
|
}
|
|
5461
5547
|
),
|
|
5462
|
-
/* @__PURE__ */
|
|
5548
|
+
/* @__PURE__ */ jsx42(
|
|
5463
5549
|
"button",
|
|
5464
5550
|
{
|
|
5465
5551
|
type: "button",
|
|
@@ -5470,8 +5556,8 @@ var ValueInput = ({
|
|
|
5470
5556
|
)
|
|
5471
5557
|
] });
|
|
5472
5558
|
case "NumberInput":
|
|
5473
|
-
return /* @__PURE__ */
|
|
5474
|
-
/* @__PURE__ */
|
|
5559
|
+
return /* @__PURE__ */ jsxs37("div", { className: cn("flex flex-col gap-base p-base", className), children: [
|
|
5560
|
+
/* @__PURE__ */ jsx42(
|
|
5475
5561
|
"input",
|
|
5476
5562
|
{
|
|
5477
5563
|
type: "number",
|
|
@@ -5488,7 +5574,7 @@ var ValueInput = ({
|
|
|
5488
5574
|
)
|
|
5489
5575
|
}
|
|
5490
5576
|
),
|
|
5491
|
-
/* @__PURE__ */
|
|
5577
|
+
/* @__PURE__ */ jsx42(
|
|
5492
5578
|
"button",
|
|
5493
5579
|
{
|
|
5494
5580
|
type: "button",
|
|
@@ -5500,9 +5586,9 @@ var ValueInput = ({
|
|
|
5500
5586
|
] });
|
|
5501
5587
|
case "NumberRange": {
|
|
5502
5588
|
const rangeVal = value ?? [0, 0];
|
|
5503
|
-
return /* @__PURE__ */
|
|
5504
|
-
/* @__PURE__ */
|
|
5505
|
-
/* @__PURE__ */
|
|
5589
|
+
return /* @__PURE__ */ jsxs37("div", { className: cn("flex flex-col gap-base p-base", className), children: [
|
|
5590
|
+
/* @__PURE__ */ jsxs37("div", { className: "flex items-center gap-base", children: [
|
|
5591
|
+
/* @__PURE__ */ jsx42(
|
|
5506
5592
|
"input",
|
|
5507
5593
|
{
|
|
5508
5594
|
type: "number",
|
|
@@ -5517,8 +5603,8 @@ var ValueInput = ({
|
|
|
5517
5603
|
)
|
|
5518
5604
|
}
|
|
5519
5605
|
),
|
|
5520
|
-
/* @__PURE__ */
|
|
5521
|
-
/* @__PURE__ */
|
|
5606
|
+
/* @__PURE__ */ jsx42("span", { className: "text-sm text-[var(--color-muted-foreground)]", children: "and" }),
|
|
5607
|
+
/* @__PURE__ */ jsx42(
|
|
5522
5608
|
"input",
|
|
5523
5609
|
{
|
|
5524
5610
|
type: "number",
|
|
@@ -5533,7 +5619,7 @@ var ValueInput = ({
|
|
|
5533
5619
|
}
|
|
5534
5620
|
)
|
|
5535
5621
|
] }),
|
|
5536
|
-
/* @__PURE__ */
|
|
5622
|
+
/* @__PURE__ */ jsx42(
|
|
5537
5623
|
"button",
|
|
5538
5624
|
{
|
|
5539
5625
|
type: "button",
|
|
@@ -5545,9 +5631,9 @@ var ValueInput = ({
|
|
|
5545
5631
|
] });
|
|
5546
5632
|
}
|
|
5547
5633
|
case "PresetTags":
|
|
5548
|
-
return /* @__PURE__ */
|
|
5549
|
-
/* @__PURE__ */
|
|
5550
|
-
/* @__PURE__ */
|
|
5634
|
+
return /* @__PURE__ */ jsx42("div", { className: cn("flex flex-col gap-base p-base max-w-[280px]", className), children: RELATIVE_DATE_PRESETS.map((group) => /* @__PURE__ */ jsxs37("div", { className: "flex flex-col gap-xs", children: [
|
|
5635
|
+
/* @__PURE__ */ jsx42("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)] uppercase px-xs", children: group.group }),
|
|
5636
|
+
/* @__PURE__ */ jsx42("div", { className: "flex flex-wrap gap-xs", children: group.options.map((preset) => /* @__PURE__ */ jsx42(
|
|
5551
5637
|
"button",
|
|
5552
5638
|
{
|
|
5553
5639
|
type: "button",
|
|
@@ -5565,7 +5651,7 @@ var ValueInput = ({
|
|
|
5565
5651
|
)) })
|
|
5566
5652
|
] }, group.group)) });
|
|
5567
5653
|
case "SingleSelect":
|
|
5568
|
-
return /* @__PURE__ */
|
|
5654
|
+
return /* @__PURE__ */ jsx42("div", { className: cn("flex flex-col gap-xs p-base max-h-[250px] overflow-y-auto", className), children: options.map((opt) => /* @__PURE__ */ jsx42(
|
|
5569
5655
|
"button",
|
|
5570
5656
|
{
|
|
5571
5657
|
type: "button",
|
|
@@ -5578,16 +5664,16 @@ var ValueInput = ({
|
|
|
5578
5664
|
"hover:bg-[var(--color-dropdown-item-hover)]",
|
|
5579
5665
|
value === opt && "bg-[var(--color-dropdown-item-hover)]"
|
|
5580
5666
|
),
|
|
5581
|
-
children: /* @__PURE__ */
|
|
5667
|
+
children: /* @__PURE__ */ jsx42("span", { className: "text-sm font-regular leading-sm text-[var(--color-foreground)]", children: opt })
|
|
5582
5668
|
},
|
|
5583
5669
|
opt
|
|
5584
5670
|
)) });
|
|
5585
5671
|
case "MultiSelect": {
|
|
5586
5672
|
const selected = Array.isArray(value) ? value : [];
|
|
5587
|
-
return /* @__PURE__ */
|
|
5588
|
-
/* @__PURE__ */
|
|
5673
|
+
return /* @__PURE__ */ jsxs37("div", { className: cn("flex flex-col gap-xs p-base", className), children: [
|
|
5674
|
+
/* @__PURE__ */ jsx42("div", { className: "flex flex-col max-h-[200px] overflow-y-auto", children: options.map((opt) => {
|
|
5589
5675
|
const isSelected = selected.includes(opt);
|
|
5590
|
-
return /* @__PURE__ */
|
|
5676
|
+
return /* @__PURE__ */ jsxs37(
|
|
5591
5677
|
"button",
|
|
5592
5678
|
{
|
|
5593
5679
|
type: "button",
|
|
@@ -5600,23 +5686,23 @@ var ValueInput = ({
|
|
|
5600
5686
|
"hover:bg-[var(--color-dropdown-item-hover)]"
|
|
5601
5687
|
),
|
|
5602
5688
|
children: [
|
|
5603
|
-
/* @__PURE__ */
|
|
5689
|
+
/* @__PURE__ */ jsx42(
|
|
5604
5690
|
"span",
|
|
5605
5691
|
{
|
|
5606
5692
|
className: cn(
|
|
5607
5693
|
"flex items-center justify-center size-4 rounded-xs border transition-colors",
|
|
5608
5694
|
isSelected ? "bg-[var(--color-primary)] border-[var(--color-primary)]" : "border-[var(--color-input)] bg-[var(--color-background)]"
|
|
5609
5695
|
),
|
|
5610
|
-
children: isSelected && /* @__PURE__ */
|
|
5696
|
+
children: isSelected && /* @__PURE__ */ jsx42("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", children: /* @__PURE__ */ jsx42("path", { d: "M2 5L4 7L8 3", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
5611
5697
|
}
|
|
5612
5698
|
),
|
|
5613
|
-
/* @__PURE__ */
|
|
5699
|
+
/* @__PURE__ */ jsx42("span", { className: "text-sm font-regular leading-sm text-[var(--color-foreground)]", children: opt })
|
|
5614
5700
|
]
|
|
5615
5701
|
},
|
|
5616
5702
|
opt
|
|
5617
5703
|
);
|
|
5618
5704
|
}) }),
|
|
5619
|
-
/* @__PURE__ */
|
|
5705
|
+
/* @__PURE__ */ jsx42(
|
|
5620
5706
|
"button",
|
|
5621
5707
|
{
|
|
5622
5708
|
type: "button",
|
|
@@ -5630,8 +5716,8 @@ var ValueInput = ({
|
|
|
5630
5716
|
// DatePicker, DateRange, RelationPicker, MultiRelationPicker
|
|
5631
5717
|
// Stub as text inputs for now — will wire to actual DatePicker/relation components
|
|
5632
5718
|
case "DatePicker":
|
|
5633
|
-
return /* @__PURE__ */
|
|
5634
|
-
/* @__PURE__ */
|
|
5719
|
+
return /* @__PURE__ */ jsxs37("div", { className: cn("flex flex-col gap-base p-base", className), children: [
|
|
5720
|
+
/* @__PURE__ */ jsx42(
|
|
5635
5721
|
"input",
|
|
5636
5722
|
{
|
|
5637
5723
|
type: "date",
|
|
@@ -5645,7 +5731,7 @@ var ValueInput = ({
|
|
|
5645
5731
|
)
|
|
5646
5732
|
}
|
|
5647
5733
|
),
|
|
5648
|
-
/* @__PURE__ */
|
|
5734
|
+
/* @__PURE__ */ jsx42(
|
|
5649
5735
|
"button",
|
|
5650
5736
|
{
|
|
5651
5737
|
type: "button",
|
|
@@ -5656,9 +5742,9 @@ var ValueInput = ({
|
|
|
5656
5742
|
)
|
|
5657
5743
|
] });
|
|
5658
5744
|
case "DateRange":
|
|
5659
|
-
return /* @__PURE__ */
|
|
5660
|
-
/* @__PURE__ */
|
|
5661
|
-
/* @__PURE__ */
|
|
5745
|
+
return /* @__PURE__ */ jsxs37("div", { className: cn("flex flex-col gap-base p-base", className), children: [
|
|
5746
|
+
/* @__PURE__ */ jsxs37("div", { className: "flex items-center gap-base", children: [
|
|
5747
|
+
/* @__PURE__ */ jsx42(
|
|
5662
5748
|
"input",
|
|
5663
5749
|
{
|
|
5664
5750
|
type: "date",
|
|
@@ -5670,8 +5756,8 @@ var ValueInput = ({
|
|
|
5670
5756
|
)
|
|
5671
5757
|
}
|
|
5672
5758
|
),
|
|
5673
|
-
/* @__PURE__ */
|
|
5674
|
-
/* @__PURE__ */
|
|
5759
|
+
/* @__PURE__ */ jsx42("span", { className: "text-sm text-[var(--color-muted-foreground)]", children: "to" }),
|
|
5760
|
+
/* @__PURE__ */ jsx42(
|
|
5675
5761
|
"input",
|
|
5676
5762
|
{
|
|
5677
5763
|
type: "date",
|
|
@@ -5683,7 +5769,7 @@ var ValueInput = ({
|
|
|
5683
5769
|
}
|
|
5684
5770
|
)
|
|
5685
5771
|
] }),
|
|
5686
|
-
/* @__PURE__ */
|
|
5772
|
+
/* @__PURE__ */ jsx42(
|
|
5687
5773
|
"button",
|
|
5688
5774
|
{
|
|
5689
5775
|
type: "button",
|
|
@@ -5695,8 +5781,8 @@ var ValueInput = ({
|
|
|
5695
5781
|
] });
|
|
5696
5782
|
case "RelationPicker":
|
|
5697
5783
|
case "MultiRelationPicker":
|
|
5698
|
-
return /* @__PURE__ */
|
|
5699
|
-
/* @__PURE__ */
|
|
5784
|
+
return /* @__PURE__ */ jsxs37("div", { className: cn("flex flex-col gap-base p-base", className), children: [
|
|
5785
|
+
/* @__PURE__ */ jsx42(
|
|
5700
5786
|
"input",
|
|
5701
5787
|
{
|
|
5702
5788
|
type: "text",
|
|
@@ -5713,7 +5799,7 @@ var ValueInput = ({
|
|
|
5713
5799
|
)
|
|
5714
5800
|
}
|
|
5715
5801
|
),
|
|
5716
|
-
/* @__PURE__ */
|
|
5802
|
+
/* @__PURE__ */ jsx42(
|
|
5717
5803
|
"button",
|
|
5718
5804
|
{
|
|
5719
5805
|
type: "button",
|
|
@@ -5730,10 +5816,10 @@ var ValueInput = ({
|
|
|
5730
5816
|
ValueInput.displayName = "ValueInput";
|
|
5731
5817
|
|
|
5732
5818
|
// src/components/ui/filter/property-selector.tsx
|
|
5733
|
-
import * as
|
|
5819
|
+
import * as React41 from "react";
|
|
5734
5820
|
import * as PopoverPrimitive5 from "@radix-ui/react-popover";
|
|
5735
5821
|
import { Icon as Icon26, faChevronLeftOutline as faChevronLeftOutline2, faChevronRightOutline as faChevronRightOutline2, faMagnifyingGlassOutline } from "@l3mpire/icons";
|
|
5736
|
-
import { jsx as
|
|
5822
|
+
import { jsx as jsx43, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
5737
5823
|
var PropertySelector = ({
|
|
5738
5824
|
properties,
|
|
5739
5825
|
onSelect,
|
|
@@ -5741,15 +5827,15 @@ var PropertySelector = ({
|
|
|
5741
5827
|
onOpenChange,
|
|
5742
5828
|
children
|
|
5743
5829
|
}) => {
|
|
5744
|
-
const [activeGroup, setActiveGroup] =
|
|
5745
|
-
const [search, setSearch] =
|
|
5746
|
-
|
|
5830
|
+
const [activeGroup, setActiveGroup] = React41.useState(null);
|
|
5831
|
+
const [search, setSearch] = React41.useState("");
|
|
5832
|
+
React41.useEffect(() => {
|
|
5747
5833
|
if (!open) {
|
|
5748
5834
|
setActiveGroup(null);
|
|
5749
5835
|
setSearch("");
|
|
5750
5836
|
}
|
|
5751
5837
|
}, [open]);
|
|
5752
|
-
const groups =
|
|
5838
|
+
const groups = React41.useMemo(() => {
|
|
5753
5839
|
const map = /* @__PURE__ */ new Map();
|
|
5754
5840
|
for (const prop of properties) {
|
|
5755
5841
|
const existing = map.get(prop.group);
|
|
@@ -5766,7 +5852,7 @@ var PropertySelector = ({
|
|
|
5766
5852
|
}
|
|
5767
5853
|
return Array.from(map.values());
|
|
5768
5854
|
}, [properties]);
|
|
5769
|
-
const filteredProperties =
|
|
5855
|
+
const filteredProperties = React41.useMemo(() => {
|
|
5770
5856
|
if (!activeGroup) return [];
|
|
5771
5857
|
const groupProps = properties.filter((p) => p.group === activeGroup);
|
|
5772
5858
|
if (!search) return groupProps;
|
|
@@ -5774,9 +5860,9 @@ var PropertySelector = ({
|
|
|
5774
5860
|
return groupProps.filter((p) => p.label.toLowerCase().includes(lower));
|
|
5775
5861
|
}, [properties, activeGroup, search]);
|
|
5776
5862
|
const activeGroupInfo = groups.find((g) => g.group === activeGroup);
|
|
5777
|
-
return /* @__PURE__ */
|
|
5778
|
-
/* @__PURE__ */
|
|
5779
|
-
/* @__PURE__ */
|
|
5863
|
+
return /* @__PURE__ */ jsxs38(PopoverPrimitive5.Root, { open, onOpenChange, children: [
|
|
5864
|
+
/* @__PURE__ */ jsx43(PopoverPrimitive5.Trigger, { asChild: true, children }),
|
|
5865
|
+
/* @__PURE__ */ jsx43(PopoverPrimitive5.Portal, { children: /* @__PURE__ */ jsx43(
|
|
5780
5866
|
PopoverPrimitive5.Content,
|
|
5781
5867
|
{
|
|
5782
5868
|
sideOffset: 4,
|
|
@@ -5791,14 +5877,14 @@ var PropertySelector = ({
|
|
|
5791
5877
|
),
|
|
5792
5878
|
children: activeGroup === null ? (
|
|
5793
5879
|
/* ── Level 1: Categories ─────────────────────────────────── */
|
|
5794
|
-
/* @__PURE__ */
|
|
5880
|
+
/* @__PURE__ */ jsx43("div", { className: "flex flex-col", children: groups.map((g) => /* @__PURE__ */ jsxs38(
|
|
5795
5881
|
"button",
|
|
5796
5882
|
{
|
|
5797
5883
|
type: "button",
|
|
5798
5884
|
onClick: () => setActiveGroup(g.group),
|
|
5799
5885
|
className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-[var(--color-dropdown-item-hover)]",
|
|
5800
5886
|
children: [
|
|
5801
|
-
/* @__PURE__ */
|
|
5887
|
+
/* @__PURE__ */ jsx43(
|
|
5802
5888
|
Icon26,
|
|
5803
5889
|
{
|
|
5804
5890
|
icon: g.groupIcon,
|
|
@@ -5806,9 +5892,9 @@ var PropertySelector = ({
|
|
|
5806
5892
|
className: "shrink-0 text-[var(--color-dropdown-item-icon)]"
|
|
5807
5893
|
}
|
|
5808
5894
|
),
|
|
5809
|
-
/* @__PURE__ */
|
|
5810
|
-
/* @__PURE__ */
|
|
5811
|
-
/* @__PURE__ */
|
|
5895
|
+
/* @__PURE__ */ jsx43("span", { className: "flex-1 text-sm font-regular leading-sm text-[var(--color-dropdown-item-text)] text-left truncate", children: g.groupLabel }),
|
|
5896
|
+
/* @__PURE__ */ jsx43("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)]", children: g.count }),
|
|
5897
|
+
/* @__PURE__ */ jsx43(
|
|
5812
5898
|
Icon26,
|
|
5813
5899
|
{
|
|
5814
5900
|
icon: faChevronRightOutline2,
|
|
@@ -5822,8 +5908,8 @@ var PropertySelector = ({
|
|
|
5822
5908
|
)) })
|
|
5823
5909
|
) : (
|
|
5824
5910
|
/* ── Level 2: Properties ─────────────────────────────────── */
|
|
5825
|
-
/* @__PURE__ */
|
|
5826
|
-
/* @__PURE__ */
|
|
5911
|
+
/* @__PURE__ */ jsxs38("div", { className: "flex flex-col gap-xs", children: [
|
|
5912
|
+
/* @__PURE__ */ jsxs38(
|
|
5827
5913
|
"button",
|
|
5828
5914
|
{
|
|
5829
5915
|
type: "button",
|
|
@@ -5833,7 +5919,7 @@ var PropertySelector = ({
|
|
|
5833
5919
|
},
|
|
5834
5920
|
className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-[var(--color-dropdown-item-hover)]",
|
|
5835
5921
|
children: [
|
|
5836
|
-
/* @__PURE__ */
|
|
5922
|
+
/* @__PURE__ */ jsx43(
|
|
5837
5923
|
Icon26,
|
|
5838
5924
|
{
|
|
5839
5925
|
icon: faChevronLeftOutline2,
|
|
@@ -5841,12 +5927,12 @@ var PropertySelector = ({
|
|
|
5841
5927
|
className: "shrink-0 text-[var(--color-dropdown-item-icon)]"
|
|
5842
5928
|
}
|
|
5843
5929
|
),
|
|
5844
|
-
/* @__PURE__ */
|
|
5930
|
+
/* @__PURE__ */ jsx43("span", { className: "flex-1 text-xs font-medium leading-xs text-[var(--color-muted-foreground)] text-left truncate", children: activeGroupInfo?.groupLabel })
|
|
5845
5931
|
]
|
|
5846
5932
|
}
|
|
5847
5933
|
),
|
|
5848
|
-
/* @__PURE__ */
|
|
5849
|
-
/* @__PURE__ */
|
|
5934
|
+
/* @__PURE__ */ jsxs38("div", { className: "flex items-center gap-base px-md py-base border border-[var(--color-input)] rounded-md", children: [
|
|
5935
|
+
/* @__PURE__ */ jsx43(
|
|
5850
5936
|
Icon26,
|
|
5851
5937
|
{
|
|
5852
5938
|
icon: faMagnifyingGlassOutline,
|
|
@@ -5854,7 +5940,7 @@ var PropertySelector = ({
|
|
|
5854
5940
|
className: "shrink-0 text-[var(--color-muted-foreground)]"
|
|
5855
5941
|
}
|
|
5856
5942
|
),
|
|
5857
|
-
/* @__PURE__ */
|
|
5943
|
+
/* @__PURE__ */ jsx43(
|
|
5858
5944
|
"input",
|
|
5859
5945
|
{
|
|
5860
5946
|
type: "text",
|
|
@@ -5866,8 +5952,8 @@ var PropertySelector = ({
|
|
|
5866
5952
|
}
|
|
5867
5953
|
)
|
|
5868
5954
|
] }),
|
|
5869
|
-
/* @__PURE__ */
|
|
5870
|
-
filteredProperties.map((prop) => /* @__PURE__ */
|
|
5955
|
+
/* @__PURE__ */ jsxs38("div", { className: "flex flex-col max-h-[300px] overflow-y-auto", children: [
|
|
5956
|
+
filteredProperties.map((prop) => /* @__PURE__ */ jsxs38(
|
|
5871
5957
|
"button",
|
|
5872
5958
|
{
|
|
5873
5959
|
type: "button",
|
|
@@ -5877,7 +5963,7 @@ var PropertySelector = ({
|
|
|
5877
5963
|
},
|
|
5878
5964
|
className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-[var(--color-dropdown-item-hover)]",
|
|
5879
5965
|
children: [
|
|
5880
|
-
/* @__PURE__ */
|
|
5966
|
+
/* @__PURE__ */ jsx43(
|
|
5881
5967
|
Icon26,
|
|
5882
5968
|
{
|
|
5883
5969
|
icon: prop.icon,
|
|
@@ -5885,12 +5971,12 @@ var PropertySelector = ({
|
|
|
5885
5971
|
className: "shrink-0 text-[var(--color-dropdown-item-icon)]"
|
|
5886
5972
|
}
|
|
5887
5973
|
),
|
|
5888
|
-
/* @__PURE__ */
|
|
5974
|
+
/* @__PURE__ */ jsx43("span", { className: "flex-1 text-sm font-regular leading-sm text-[var(--color-dropdown-item-text)] text-left truncate", children: prop.label })
|
|
5889
5975
|
]
|
|
5890
5976
|
},
|
|
5891
5977
|
prop.id
|
|
5892
5978
|
)),
|
|
5893
|
-
filteredProperties.length === 0 && /* @__PURE__ */
|
|
5979
|
+
filteredProperties.length === 0 && /* @__PURE__ */ jsx43("span", { className: "p-base text-sm text-[var(--color-muted-foreground)]", children: "No results" })
|
|
5894
5980
|
] })
|
|
5895
5981
|
] })
|
|
5896
5982
|
)
|
|
@@ -5903,16 +5989,16 @@ PropertySelector.displayName = "PropertySelector";
|
|
|
5903
5989
|
// src/components/ui/filter/kebab-menu.tsx
|
|
5904
5990
|
import * as PopoverPrimitive6 from "@radix-ui/react-popover";
|
|
5905
5991
|
import { Icon as Icon27, faArrowRightOutline, faTrashOutline } from "@l3mpire/icons";
|
|
5906
|
-
import { jsx as
|
|
5992
|
+
import { jsx as jsx44, jsxs as jsxs39 } from "react/jsx-runtime";
|
|
5907
5993
|
var KebabMenu = ({
|
|
5908
5994
|
onConvertToAdvanced,
|
|
5909
5995
|
onDelete,
|
|
5910
5996
|
open,
|
|
5911
5997
|
onOpenChange,
|
|
5912
5998
|
children
|
|
5913
|
-
}) => /* @__PURE__ */
|
|
5914
|
-
/* @__PURE__ */
|
|
5915
|
-
/* @__PURE__ */
|
|
5999
|
+
}) => /* @__PURE__ */ jsxs39(PopoverPrimitive6.Root, { open, onOpenChange, children: [
|
|
6000
|
+
/* @__PURE__ */ jsx44(PopoverPrimitive6.Trigger, { asChild: true, children }),
|
|
6001
|
+
/* @__PURE__ */ jsx44(PopoverPrimitive6.Portal, { children: /* @__PURE__ */ jsxs39(
|
|
5916
6002
|
PopoverPrimitive6.Content,
|
|
5917
6003
|
{
|
|
5918
6004
|
sideOffset: 4,
|
|
@@ -5926,7 +6012,7 @@ var KebabMenu = ({
|
|
|
5926
6012
|
"min-w-[210px]"
|
|
5927
6013
|
),
|
|
5928
6014
|
children: [
|
|
5929
|
-
onConvertToAdvanced && /* @__PURE__ */
|
|
6015
|
+
onConvertToAdvanced && /* @__PURE__ */ jsxs39(
|
|
5930
6016
|
"button",
|
|
5931
6017
|
{
|
|
5932
6018
|
type: "button",
|
|
@@ -5936,7 +6022,7 @@ var KebabMenu = ({
|
|
|
5936
6022
|
},
|
|
5937
6023
|
className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-[var(--color-dropdown-item-hover)]",
|
|
5938
6024
|
children: [
|
|
5939
|
-
/* @__PURE__ */
|
|
6025
|
+
/* @__PURE__ */ jsx44(
|
|
5940
6026
|
Icon27,
|
|
5941
6027
|
{
|
|
5942
6028
|
icon: faArrowRightOutline,
|
|
@@ -5944,12 +6030,12 @@ var KebabMenu = ({
|
|
|
5944
6030
|
className: "shrink-0 text-[var(--color-dropdown-item-icon)]"
|
|
5945
6031
|
}
|
|
5946
6032
|
),
|
|
5947
|
-
/* @__PURE__ */
|
|
6033
|
+
/* @__PURE__ */ jsx44("span", { className: "text-sm font-regular leading-sm text-[var(--color-dropdown-item-text)]", children: "Convert to advanced" })
|
|
5948
6034
|
]
|
|
5949
6035
|
}
|
|
5950
6036
|
),
|
|
5951
|
-
onConvertToAdvanced && onDelete && /* @__PURE__ */
|
|
5952
|
-
onDelete && /* @__PURE__ */
|
|
6037
|
+
onConvertToAdvanced && onDelete && /* @__PURE__ */ jsx44("div", { className: "h-px mx-base my-xs bg-[var(--color-border)]" }),
|
|
6038
|
+
onDelete && /* @__PURE__ */ jsxs39(
|
|
5953
6039
|
"button",
|
|
5954
6040
|
{
|
|
5955
6041
|
type: "button",
|
|
@@ -5959,7 +6045,7 @@ var KebabMenu = ({
|
|
|
5959
6045
|
},
|
|
5960
6046
|
className: "flex items-center gap-base p-base rounded-base cursor-pointer transition-colors hover:bg-[var(--color-dropdown-item-hover)]",
|
|
5961
6047
|
children: [
|
|
5962
|
-
/* @__PURE__ */
|
|
6048
|
+
/* @__PURE__ */ jsx44(
|
|
5963
6049
|
Icon27,
|
|
5964
6050
|
{
|
|
5965
6051
|
icon: faTrashOutline,
|
|
@@ -5967,7 +6053,7 @@ var KebabMenu = ({
|
|
|
5967
6053
|
className: "shrink-0 text-[var(--color-destructive)]"
|
|
5968
6054
|
}
|
|
5969
6055
|
),
|
|
5970
|
-
/* @__PURE__ */
|
|
6056
|
+
/* @__PURE__ */ jsx44("span", { className: "text-sm font-regular leading-sm text-[var(--color-destructive)]", children: "Delete filter" })
|
|
5971
6057
|
]
|
|
5972
6058
|
}
|
|
5973
6059
|
)
|
|
@@ -5978,10 +6064,10 @@ var KebabMenu = ({
|
|
|
5978
6064
|
KebabMenu.displayName = "KebabMenu";
|
|
5979
6065
|
|
|
5980
6066
|
// src/components/ui/filter/filter-editor.tsx
|
|
5981
|
-
import * as
|
|
6067
|
+
import * as React42 from "react";
|
|
5982
6068
|
import * as PopoverPrimitive7 from "@radix-ui/react-popover";
|
|
5983
6069
|
import { Icon as Icon28 } from "@l3mpire/icons";
|
|
5984
|
-
import { jsx as
|
|
6070
|
+
import { jsx as jsx45, jsxs as jsxs40 } from "react/jsx-runtime";
|
|
5985
6071
|
var FilterEditor = ({
|
|
5986
6072
|
propertyDef,
|
|
5987
6073
|
condition,
|
|
@@ -5992,16 +6078,16 @@ var FilterEditor = ({
|
|
|
5992
6078
|
onOpenChange,
|
|
5993
6079
|
children
|
|
5994
6080
|
}) => {
|
|
5995
|
-
const [view, setView] =
|
|
6081
|
+
const [view, setView] = React42.useState(
|
|
5996
6082
|
mode === "add" ? "value" : "operator"
|
|
5997
6083
|
);
|
|
5998
|
-
const [localOperator, setLocalOperator] =
|
|
6084
|
+
const [localOperator, setLocalOperator] = React42.useState(
|
|
5999
6085
|
condition.operator
|
|
6000
6086
|
);
|
|
6001
|
-
const [localValue, setLocalValue] =
|
|
6087
|
+
const [localValue, setLocalValue] = React42.useState(
|
|
6002
6088
|
condition.value
|
|
6003
6089
|
);
|
|
6004
|
-
|
|
6090
|
+
React42.useEffect(() => {
|
|
6005
6091
|
if (open) {
|
|
6006
6092
|
setView(mode === "add" ? "value" : "operator");
|
|
6007
6093
|
setLocalOperator(condition.operator);
|
|
@@ -6026,9 +6112,9 @@ var FilterEditor = ({
|
|
|
6026
6112
|
onOpenChange?.(false);
|
|
6027
6113
|
onClose();
|
|
6028
6114
|
};
|
|
6029
|
-
return /* @__PURE__ */
|
|
6030
|
-
/* @__PURE__ */
|
|
6031
|
-
/* @__PURE__ */
|
|
6115
|
+
return /* @__PURE__ */ jsxs40(PopoverPrimitive7.Root, { open, onOpenChange, children: [
|
|
6116
|
+
/* @__PURE__ */ jsx45(PopoverPrimitive7.Trigger, { asChild: true, children }),
|
|
6117
|
+
/* @__PURE__ */ jsx45(PopoverPrimitive7.Portal, { children: /* @__PURE__ */ jsxs40(
|
|
6032
6118
|
PopoverPrimitive7.Content,
|
|
6033
6119
|
{
|
|
6034
6120
|
sideOffset: 4,
|
|
@@ -6042,8 +6128,8 @@ var FilterEditor = ({
|
|
|
6042
6128
|
"min-w-[240px]"
|
|
6043
6129
|
),
|
|
6044
6130
|
children: [
|
|
6045
|
-
/* @__PURE__ */
|
|
6046
|
-
/* @__PURE__ */
|
|
6131
|
+
/* @__PURE__ */ jsxs40("div", { className: "flex items-center gap-base px-base pt-base pb-xs border-b border-[var(--color-border)]", children: [
|
|
6132
|
+
/* @__PURE__ */ jsx45(
|
|
6047
6133
|
Icon28,
|
|
6048
6134
|
{
|
|
6049
6135
|
icon: propertyDef.icon,
|
|
@@ -6051,8 +6137,8 @@ var FilterEditor = ({
|
|
|
6051
6137
|
className: "shrink-0 text-[var(--color-dropdown-item-icon)]"
|
|
6052
6138
|
}
|
|
6053
6139
|
),
|
|
6054
|
-
/* @__PURE__ */
|
|
6055
|
-
localOperator && view === "value" && /* @__PURE__ */
|
|
6140
|
+
/* @__PURE__ */ jsx45("span", { className: "text-sm font-medium leading-sm text-[var(--color-foreground)]", children: propertyDef.label }),
|
|
6141
|
+
localOperator && view === "value" && /* @__PURE__ */ jsxs40(
|
|
6056
6142
|
"button",
|
|
6057
6143
|
{
|
|
6058
6144
|
type: "button",
|
|
@@ -6065,14 +6151,14 @@ var FilterEditor = ({
|
|
|
6065
6151
|
}
|
|
6066
6152
|
)
|
|
6067
6153
|
] }),
|
|
6068
|
-
view === "operator" ? /* @__PURE__ */
|
|
6154
|
+
view === "operator" ? /* @__PURE__ */ jsx45("div", { className: "p-xs", children: /* @__PURE__ */ jsx45(
|
|
6069
6155
|
OperatorList,
|
|
6070
6156
|
{
|
|
6071
6157
|
dataType: propertyDef.type,
|
|
6072
6158
|
activeOperator: localOperator,
|
|
6073
6159
|
onSelect: handleOperatorSelect
|
|
6074
6160
|
}
|
|
6075
|
-
) }) : localOperator && /* @__PURE__ */
|
|
6161
|
+
) }) : localOperator && /* @__PURE__ */ jsx45(
|
|
6076
6162
|
ValueInput,
|
|
6077
6163
|
{
|
|
6078
6164
|
dataType: propertyDef.type,
|
|
@@ -6091,9 +6177,9 @@ var FilterEditor = ({
|
|
|
6091
6177
|
FilterEditor.displayName = "FilterEditor";
|
|
6092
6178
|
|
|
6093
6179
|
// src/components/ui/filter/interactive-filter-chip.tsx
|
|
6094
|
-
import * as
|
|
6180
|
+
import * as React43 from "react";
|
|
6095
6181
|
import * as PopoverPrimitive8 from "@radix-ui/react-popover";
|
|
6096
|
-
import { jsx as
|
|
6182
|
+
import { jsx as jsx46, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
6097
6183
|
function formatFilterValue(value) {
|
|
6098
6184
|
if (value == null) return void 0;
|
|
6099
6185
|
if (typeof value === "boolean") return value ? "Yes" : "No";
|
|
@@ -6126,9 +6212,9 @@ var SegmentPopover = ({
|
|
|
6126
6212
|
children,
|
|
6127
6213
|
align = "start",
|
|
6128
6214
|
minWidth = "240px"
|
|
6129
|
-
}) => /* @__PURE__ */
|
|
6130
|
-
/* @__PURE__ */
|
|
6131
|
-
/* @__PURE__ */
|
|
6215
|
+
}) => /* @__PURE__ */ jsxs41(PopoverPrimitive8.Root, { open, onOpenChange, children: [
|
|
6216
|
+
/* @__PURE__ */ jsx46(PopoverPrimitive8.Trigger, { asChild: true, children: trigger }),
|
|
6217
|
+
/* @__PURE__ */ jsx46(PopoverPrimitive8.Portal, { children: /* @__PURE__ */ jsx46(
|
|
6132
6218
|
PopoverPrimitive8.Content,
|
|
6133
6219
|
{
|
|
6134
6220
|
sideOffset: 4,
|
|
@@ -6157,11 +6243,11 @@ var InteractiveFilterChip = ({
|
|
|
6157
6243
|
onConvertToAdvanced,
|
|
6158
6244
|
className
|
|
6159
6245
|
}) => {
|
|
6160
|
-
const [operatorOpen, setOperatorOpen] =
|
|
6161
|
-
const [valueOpen, setValueOpen] =
|
|
6162
|
-
const [propertyOpen, setPropertyOpen] =
|
|
6163
|
-
const [kebabOpen, setKebabOpen] =
|
|
6164
|
-
|
|
6246
|
+
const [operatorOpen, setOperatorOpen] = React43.useState(false);
|
|
6247
|
+
const [valueOpen, setValueOpen] = React43.useState(false);
|
|
6248
|
+
const [propertyOpen, setPropertyOpen] = React43.useState(false);
|
|
6249
|
+
const [kebabOpen, setKebabOpen] = React43.useState(false);
|
|
6250
|
+
React43.useEffect(() => {
|
|
6165
6251
|
if (autoOpen && condition.operator && !isNoValueOperator(condition.operator)) {
|
|
6166
6252
|
const t = setTimeout(() => setValueOpen(true), 50);
|
|
6167
6253
|
return () => clearTimeout(t);
|
|
@@ -6190,7 +6276,7 @@ var InteractiveFilterChip = ({
|
|
|
6190
6276
|
const displayValue = formatFilterValue(condition.value);
|
|
6191
6277
|
const hasValue = hasOperator && displayValue != null;
|
|
6192
6278
|
const badgeCount = getBadgeCount(condition.value);
|
|
6193
|
-
return /* @__PURE__ */
|
|
6279
|
+
return /* @__PURE__ */ jsxs41(
|
|
6194
6280
|
"div",
|
|
6195
6281
|
{
|
|
6196
6282
|
className: cn(
|
|
@@ -6199,7 +6285,7 @@ var InteractiveFilterChip = ({
|
|
|
6199
6285
|
className
|
|
6200
6286
|
),
|
|
6201
6287
|
children: [
|
|
6202
|
-
properties ? /* @__PURE__ */
|
|
6288
|
+
properties ? /* @__PURE__ */ jsx46(
|
|
6203
6289
|
PropertySelector,
|
|
6204
6290
|
{
|
|
6205
6291
|
properties,
|
|
@@ -6209,7 +6295,7 @@ var InteractiveFilterChip = ({
|
|
|
6209
6295
|
},
|
|
6210
6296
|
open: propertyOpen,
|
|
6211
6297
|
onOpenChange: setPropertyOpen,
|
|
6212
|
-
children: /* @__PURE__ */
|
|
6298
|
+
children: /* @__PURE__ */ jsx46("div", { children: /* @__PURE__ */ jsx46(
|
|
6213
6299
|
FilterChipSegment,
|
|
6214
6300
|
{
|
|
6215
6301
|
segmentType: "property",
|
|
@@ -6220,7 +6306,7 @@ var InteractiveFilterChip = ({
|
|
|
6220
6306
|
}
|
|
6221
6307
|
) })
|
|
6222
6308
|
}
|
|
6223
|
-
) : /* @__PURE__ */
|
|
6309
|
+
) : /* @__PURE__ */ jsx46(
|
|
6224
6310
|
FilterChipSegment,
|
|
6225
6311
|
{
|
|
6226
6312
|
segmentType: "property",
|
|
@@ -6229,13 +6315,13 @@ var InteractiveFilterChip = ({
|
|
|
6229
6315
|
label: propertyDef.label
|
|
6230
6316
|
}
|
|
6231
6317
|
),
|
|
6232
|
-
/* @__PURE__ */
|
|
6318
|
+
/* @__PURE__ */ jsx46(
|
|
6233
6319
|
SegmentPopover,
|
|
6234
6320
|
{
|
|
6235
6321
|
open: operatorOpen,
|
|
6236
6322
|
onOpenChange: setOperatorOpen,
|
|
6237
6323
|
minWidth: "180px",
|
|
6238
|
-
trigger: /* @__PURE__ */
|
|
6324
|
+
trigger: /* @__PURE__ */ jsx46("div", { children: /* @__PURE__ */ jsx46(
|
|
6239
6325
|
FilterChipSegment,
|
|
6240
6326
|
{
|
|
6241
6327
|
segmentType: hasOperator ? "operator" : "placeholder",
|
|
@@ -6244,7 +6330,7 @@ var InteractiveFilterChip = ({
|
|
|
6244
6330
|
onClick: () => setOperatorOpen(true)
|
|
6245
6331
|
}
|
|
6246
6332
|
) }),
|
|
6247
|
-
children: /* @__PURE__ */
|
|
6333
|
+
children: /* @__PURE__ */ jsx46("div", { className: "p-xs", children: /* @__PURE__ */ jsx46(
|
|
6248
6334
|
OperatorList,
|
|
6249
6335
|
{
|
|
6250
6336
|
dataType: propertyDef.type,
|
|
@@ -6254,13 +6340,13 @@ var InteractiveFilterChip = ({
|
|
|
6254
6340
|
) })
|
|
6255
6341
|
}
|
|
6256
6342
|
),
|
|
6257
|
-
hasOperator && condition.operator && !isNoValueOperator(condition.operator) && /* @__PURE__ */
|
|
6343
|
+
hasOperator && condition.operator && !isNoValueOperator(condition.operator) && /* @__PURE__ */ jsx46(
|
|
6258
6344
|
SegmentPopover,
|
|
6259
6345
|
{
|
|
6260
6346
|
open: valueOpen,
|
|
6261
6347
|
onOpenChange: setValueOpen,
|
|
6262
6348
|
minWidth: "240px",
|
|
6263
|
-
trigger: /* @__PURE__ */
|
|
6349
|
+
trigger: /* @__PURE__ */ jsx46("div", { children: /* @__PURE__ */ jsx46(
|
|
6264
6350
|
FilterChipSegment,
|
|
6265
6351
|
{
|
|
6266
6352
|
segmentType: hasValue ? "value" : "placeholder",
|
|
@@ -6270,7 +6356,7 @@ var InteractiveFilterChip = ({
|
|
|
6270
6356
|
onClick: () => setValueOpen(true)
|
|
6271
6357
|
}
|
|
6272
6358
|
) }),
|
|
6273
|
-
children: /* @__PURE__ */
|
|
6359
|
+
children: /* @__PURE__ */ jsx46(
|
|
6274
6360
|
ValueInput,
|
|
6275
6361
|
{
|
|
6276
6362
|
dataType: propertyDef.type,
|
|
@@ -6283,7 +6369,7 @@ var InteractiveFilterChip = ({
|
|
|
6283
6369
|
)
|
|
6284
6370
|
}
|
|
6285
6371
|
),
|
|
6286
|
-
hasOperator && condition.operator && isNoValueOperator(condition.operator) && /* @__PURE__ */
|
|
6372
|
+
hasOperator && condition.operator && isNoValueOperator(condition.operator) && /* @__PURE__ */ jsx46(
|
|
6287
6373
|
FilterChipSegment,
|
|
6288
6374
|
{
|
|
6289
6375
|
segmentType: "value",
|
|
@@ -6291,14 +6377,14 @@ var InteractiveFilterChip = ({
|
|
|
6291
6377
|
label: condition.operator
|
|
6292
6378
|
}
|
|
6293
6379
|
),
|
|
6294
|
-
hasOperator && /* @__PURE__ */
|
|
6380
|
+
hasOperator && /* @__PURE__ */ jsx46(
|
|
6295
6381
|
KebabMenu,
|
|
6296
6382
|
{
|
|
6297
6383
|
open: kebabOpen,
|
|
6298
6384
|
onOpenChange: setKebabOpen,
|
|
6299
6385
|
onConvertToAdvanced,
|
|
6300
6386
|
onDelete,
|
|
6301
|
-
children: /* @__PURE__ */
|
|
6387
|
+
children: /* @__PURE__ */ jsx46("div", { children: /* @__PURE__ */ jsx46(
|
|
6302
6388
|
FilterChipSegment,
|
|
6303
6389
|
{
|
|
6304
6390
|
segmentType: "button",
|
|
@@ -6317,13 +6403,13 @@ var InteractiveFilterChip = ({
|
|
|
6317
6403
|
InteractiveFilterChip.displayName = "InteractiveFilterChip";
|
|
6318
6404
|
|
|
6319
6405
|
// src/components/ui/filter/filter-system.tsx
|
|
6320
|
-
import * as
|
|
6406
|
+
import * as React49 from "react";
|
|
6321
6407
|
import { Icon as Icon33, faXmarkOutline as faXmarkOutline4 } from "@l3mpire/icons";
|
|
6322
6408
|
|
|
6323
6409
|
// src/components/ui/filter/advanced-chip.tsx
|
|
6324
|
-
import * as
|
|
6410
|
+
import * as React44 from "react";
|
|
6325
6411
|
import { Icon as Icon29, faXmarkOutline as faXmarkOutline2 } from "@l3mpire/icons";
|
|
6326
|
-
import { jsx as
|
|
6412
|
+
import { jsx as jsx47, jsxs as jsxs42 } from "react/jsx-runtime";
|
|
6327
6413
|
var btnBase = [
|
|
6328
6414
|
"flex items-center justify-center",
|
|
6329
6415
|
"min-h-[32px] max-h-[32px]",
|
|
@@ -6332,9 +6418,9 @@ var btnBase = [
|
|
|
6332
6418
|
"cursor-pointer transition-colors",
|
|
6333
6419
|
"hover:from-[var(--color-btn-outlined-neutral-bg-hover)] hover:to-[var(--color-btn-outlined-neutral-bg-gradient-to-hover)]"
|
|
6334
6420
|
];
|
|
6335
|
-
var AdvancedChip =
|
|
6336
|
-
({ className, count, onClear, onClick, ...props }, ref) => /* @__PURE__ */
|
|
6337
|
-
/* @__PURE__ */
|
|
6421
|
+
var AdvancedChip = React44.forwardRef(
|
|
6422
|
+
({ className, count, onClear, onClick, ...props }, ref) => /* @__PURE__ */ jsxs42("div", { className: cn("inline-flex items-center", className), children: [
|
|
6423
|
+
/* @__PURE__ */ jsxs42(
|
|
6338
6424
|
"button",
|
|
6339
6425
|
{
|
|
6340
6426
|
ref,
|
|
@@ -6347,12 +6433,12 @@ var AdvancedChip = React43.forwardRef(
|
|
|
6347
6433
|
),
|
|
6348
6434
|
...props,
|
|
6349
6435
|
children: [
|
|
6350
|
-
/* @__PURE__ */
|
|
6351
|
-
/* @__PURE__ */
|
|
6436
|
+
/* @__PURE__ */ jsx47("span", { className: "text-sm font-medium leading-sm whitespace-nowrap text-[var(--color-foreground)]", children: "Advanced filters" }),
|
|
6437
|
+
/* @__PURE__ */ jsx47("span", { className: "flex items-center p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ jsx47("span", { className: "text-[10px] font-medium leading-2xs text-filter-chip-badge-text", children: count }) })
|
|
6352
6438
|
]
|
|
6353
6439
|
}
|
|
6354
6440
|
),
|
|
6355
|
-
onClear && /* @__PURE__ */
|
|
6441
|
+
onClear && /* @__PURE__ */ jsx47(
|
|
6356
6442
|
"button",
|
|
6357
6443
|
{
|
|
6358
6444
|
type: "button",
|
|
@@ -6366,7 +6452,7 @@ var AdvancedChip = React43.forwardRef(
|
|
|
6366
6452
|
"rounded-r-md -ml-px"
|
|
6367
6453
|
),
|
|
6368
6454
|
"aria-label": "Clear all advanced filters",
|
|
6369
|
-
children: /* @__PURE__ */
|
|
6455
|
+
children: /* @__PURE__ */ jsx47(Icon29, { icon: faXmarkOutline2, size: "sm", className: "text-[var(--color-foreground)]" })
|
|
6370
6456
|
}
|
|
6371
6457
|
)
|
|
6372
6458
|
] })
|
|
@@ -6374,15 +6460,15 @@ var AdvancedChip = React43.forwardRef(
|
|
|
6374
6460
|
AdvancedChip.displayName = "AdvancedChip";
|
|
6375
6461
|
|
|
6376
6462
|
// src/components/ui/filter/advanced-popover.tsx
|
|
6377
|
-
import * as
|
|
6463
|
+
import * as React46 from "react";
|
|
6378
6464
|
import * as PopoverPrimitive10 from "@radix-ui/react-popover";
|
|
6379
6465
|
import { Icon as Icon31, faPlusOutline as faPlusOutline2 } from "@l3mpire/icons";
|
|
6380
6466
|
|
|
6381
6467
|
// src/components/ui/filter/advanced-row.tsx
|
|
6382
|
-
import * as
|
|
6468
|
+
import * as React45 from "react";
|
|
6383
6469
|
import * as PopoverPrimitive9 from "@radix-ui/react-popover";
|
|
6384
6470
|
import { Icon as Icon30, faXmarkOutline as faXmarkOutline3, faRefreshOutline, faChevronDownOutline as faChevronDownOutline2 } from "@l3mpire/icons";
|
|
6385
|
-
import { jsx as
|
|
6471
|
+
import { jsx as jsx48, jsxs as jsxs43 } from "react/jsx-runtime";
|
|
6386
6472
|
var selectBtnStyle = [
|
|
6387
6473
|
"flex items-center gap-base",
|
|
6388
6474
|
"px-base py-sm",
|
|
@@ -6401,8 +6487,8 @@ var AdvancedRow = ({
|
|
|
6401
6487
|
onPropertyChange,
|
|
6402
6488
|
onDelete
|
|
6403
6489
|
}) => {
|
|
6404
|
-
const [operatorOpen, setOperatorOpen] =
|
|
6405
|
-
const [propertyOpen, setPropertyOpen] =
|
|
6490
|
+
const [operatorOpen, setOperatorOpen] = React45.useState(false);
|
|
6491
|
+
const [propertyOpen, setPropertyOpen] = React45.useState(false);
|
|
6406
6492
|
const handleOperatorSelect = (op) => {
|
|
6407
6493
|
if (isNoValueOperator(op)) {
|
|
6408
6494
|
onUpdate({ ...condition, operator: op, value: null });
|
|
@@ -6416,8 +6502,8 @@ var AdvancedRow = ({
|
|
|
6416
6502
|
onUpdate({ ...condition, value: val });
|
|
6417
6503
|
};
|
|
6418
6504
|
const displayValue = condition.value == null ? "" : typeof condition.value === "string" ? condition.value : String(condition.value);
|
|
6419
|
-
return /* @__PURE__ */
|
|
6420
|
-
connector === "Where" ? /* @__PURE__ */
|
|
6505
|
+
return /* @__PURE__ */ jsxs43("div", { className: "flex items-center gap-base w-full min-w-0", children: [
|
|
6506
|
+
connector === "Where" ? /* @__PURE__ */ jsx48("div", { className: "shrink-0 w-[64px] flex items-center justify-end", children: /* @__PURE__ */ jsx48("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)]", children: "Where" }) }) : /* @__PURE__ */ jsxs43(
|
|
6421
6507
|
"button",
|
|
6422
6508
|
{
|
|
6423
6509
|
type: "button",
|
|
@@ -6432,21 +6518,21 @@ var AdvancedRow = ({
|
|
|
6432
6518
|
),
|
|
6433
6519
|
children: [
|
|
6434
6520
|
connector,
|
|
6435
|
-
/* @__PURE__ */
|
|
6521
|
+
/* @__PURE__ */ jsx48(Icon30, { icon: faRefreshOutline, size: "xs", className: "text-[var(--color-foreground)]" })
|
|
6436
6522
|
]
|
|
6437
6523
|
}
|
|
6438
6524
|
),
|
|
6439
|
-
/* @__PURE__ */
|
|
6440
|
-
/* @__PURE__ */
|
|
6441
|
-
/* @__PURE__ */
|
|
6442
|
-
/* @__PURE__ */
|
|
6525
|
+
/* @__PURE__ */ jsxs43(PopoverPrimitive9.Root, { open: propertyOpen, onOpenChange: setPropertyOpen, children: [
|
|
6526
|
+
/* @__PURE__ */ jsx48(PopoverPrimitive9.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs43("button", { type: "button", className: cn(selectBtnStyle, "min-w-0"), children: [
|
|
6527
|
+
/* @__PURE__ */ jsx48(Icon30, { icon: propertyDef.icon, size: "sm", className: "shrink-0 text-[var(--color-muted-foreground)]" }),
|
|
6528
|
+
/* @__PURE__ */ jsxs43("span", { className: "text-sm font-regular leading-sm text-[var(--color-foreground)] whitespace-nowrap truncate", children: [
|
|
6443
6529
|
propertyDef.groupLabel,
|
|
6444
6530
|
" > ",
|
|
6445
6531
|
propertyDef.label
|
|
6446
6532
|
] }),
|
|
6447
|
-
/* @__PURE__ */
|
|
6533
|
+
/* @__PURE__ */ jsx48(Icon30, { icon: faChevronDownOutline2, size: "xs", className: "shrink-0 text-[var(--color-foreground)]" })
|
|
6448
6534
|
] }) }),
|
|
6449
|
-
/* @__PURE__ */
|
|
6535
|
+
/* @__PURE__ */ jsx48(PopoverPrimitive9.Portal, { children: /* @__PURE__ */ jsx48(
|
|
6450
6536
|
PopoverPrimitive9.Content,
|
|
6451
6537
|
{
|
|
6452
6538
|
sideOffset: 4,
|
|
@@ -6458,7 +6544,7 @@ var AdvancedRow = ({
|
|
|
6458
6544
|
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0",
|
|
6459
6545
|
"min-w-[200px]"
|
|
6460
6546
|
),
|
|
6461
|
-
children: properties.map((p) => /* @__PURE__ */
|
|
6547
|
+
children: properties.map((p) => /* @__PURE__ */ jsxs43(
|
|
6462
6548
|
"button",
|
|
6463
6549
|
{
|
|
6464
6550
|
type: "button",
|
|
@@ -6472,8 +6558,8 @@ var AdvancedRow = ({
|
|
|
6472
6558
|
p.id === condition.propertyId && "bg-[var(--color-dropdown-item-hover)]"
|
|
6473
6559
|
),
|
|
6474
6560
|
children: [
|
|
6475
|
-
/* @__PURE__ */
|
|
6476
|
-
/* @__PURE__ */
|
|
6561
|
+
/* @__PURE__ */ jsx48(Icon30, { icon: p.icon, size: "sm", className: "shrink-0 text-[var(--color-dropdown-item-icon)]" }),
|
|
6562
|
+
/* @__PURE__ */ jsx48("span", { className: "text-sm font-regular leading-sm text-[var(--color-dropdown-item-text)] truncate", children: p.label })
|
|
6477
6563
|
]
|
|
6478
6564
|
},
|
|
6479
6565
|
p.id
|
|
@@ -6481,12 +6567,12 @@ var AdvancedRow = ({
|
|
|
6481
6567
|
}
|
|
6482
6568
|
) })
|
|
6483
6569
|
] }),
|
|
6484
|
-
/* @__PURE__ */
|
|
6485
|
-
/* @__PURE__ */
|
|
6486
|
-
/* @__PURE__ */
|
|
6487
|
-
/* @__PURE__ */
|
|
6570
|
+
/* @__PURE__ */ jsxs43(PopoverPrimitive9.Root, { open: operatorOpen, onOpenChange: setOperatorOpen, children: [
|
|
6571
|
+
/* @__PURE__ */ jsx48(PopoverPrimitive9.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs43("button", { type: "button", className: cn(selectBtnStyle, "min-w-0"), children: [
|
|
6572
|
+
/* @__PURE__ */ jsx48("span", { className: "text-sm font-regular leading-sm text-[var(--color-foreground)] whitespace-nowrap truncate text-left", children: condition.operator ?? "Select" }),
|
|
6573
|
+
/* @__PURE__ */ jsx48(Icon30, { icon: faChevronDownOutline2, size: "xs", className: "shrink-0 text-[var(--color-foreground)]" })
|
|
6488
6574
|
] }) }),
|
|
6489
|
-
/* @__PURE__ */
|
|
6575
|
+
/* @__PURE__ */ jsx48(PopoverPrimitive9.Portal, { children: /* @__PURE__ */ jsx48(
|
|
6490
6576
|
PopoverPrimitive9.Content,
|
|
6491
6577
|
{
|
|
6492
6578
|
sideOffset: 4,
|
|
@@ -6498,7 +6584,7 @@ var AdvancedRow = ({
|
|
|
6498
6584
|
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0",
|
|
6499
6585
|
"min-w-[160px]"
|
|
6500
6586
|
),
|
|
6501
|
-
children: /* @__PURE__ */
|
|
6587
|
+
children: /* @__PURE__ */ jsx48(
|
|
6502
6588
|
OperatorList,
|
|
6503
6589
|
{
|
|
6504
6590
|
dataType: propertyDef.type,
|
|
@@ -6509,7 +6595,7 @@ var AdvancedRow = ({
|
|
|
6509
6595
|
}
|
|
6510
6596
|
) })
|
|
6511
6597
|
] }),
|
|
6512
|
-
condition.operator && !isNoValueOperator(condition.operator) && /* @__PURE__ */
|
|
6598
|
+
condition.operator && !isNoValueOperator(condition.operator) && /* @__PURE__ */ jsx48(
|
|
6513
6599
|
"input",
|
|
6514
6600
|
{
|
|
6515
6601
|
type: "text",
|
|
@@ -6517,7 +6603,7 @@ var AdvancedRow = ({
|
|
|
6517
6603
|
onChange: (e) => handleValueChange(e.target.value),
|
|
6518
6604
|
placeholder: "Placeholder",
|
|
6519
6605
|
className: cn(
|
|
6520
|
-
"w-[
|
|
6606
|
+
"flex-1 min-w-[80px] px-base py-sm rounded-md",
|
|
6521
6607
|
"border border-[var(--color-input)]",
|
|
6522
6608
|
"bg-[var(--color-background)] text-sm font-regular leading-sm text-[var(--color-foreground)]",
|
|
6523
6609
|
"placeholder:text-[var(--color-muted-foreground)]",
|
|
@@ -6525,14 +6611,14 @@ var AdvancedRow = ({
|
|
|
6525
6611
|
)
|
|
6526
6612
|
}
|
|
6527
6613
|
),
|
|
6528
|
-
/* @__PURE__ */
|
|
6614
|
+
/* @__PURE__ */ jsx48(
|
|
6529
6615
|
"button",
|
|
6530
6616
|
{
|
|
6531
6617
|
type: "button",
|
|
6532
6618
|
onClick: onDelete,
|
|
6533
6619
|
className: "ml-auto shrink-0 flex items-center justify-center p-sm rounded-md cursor-pointer transition-colors hover:bg-[var(--color-accent)]",
|
|
6534
6620
|
"aria-label": "Remove filter",
|
|
6535
|
-
children: /* @__PURE__ */
|
|
6621
|
+
children: /* @__PURE__ */ jsx48(Icon30, { icon: faXmarkOutline3, size: "sm", className: "text-[var(--color-foreground)]" })
|
|
6536
6622
|
}
|
|
6537
6623
|
)
|
|
6538
6624
|
] });
|
|
@@ -6540,7 +6626,7 @@ var AdvancedRow = ({
|
|
|
6540
6626
|
AdvancedRow.displayName = "AdvancedRow";
|
|
6541
6627
|
|
|
6542
6628
|
// src/components/ui/filter/advanced-popover.tsx
|
|
6543
|
-
import { jsx as
|
|
6629
|
+
import { jsx as jsx49, jsxs as jsxs44 } from "react/jsx-runtime";
|
|
6544
6630
|
var outlinedBtn = [
|
|
6545
6631
|
"flex items-center gap-sm px-base py-sm",
|
|
6546
6632
|
"min-h-[32px] max-h-[32px] min-w-[80px]",
|
|
@@ -6557,8 +6643,8 @@ var AdvancedPopover = ({
|
|
|
6557
6643
|
onOpenChange,
|
|
6558
6644
|
children
|
|
6559
6645
|
}) => {
|
|
6560
|
-
const [addSelectorOpen, setAddSelectorOpen] =
|
|
6561
|
-
const [logicOps, setLogicOps] =
|
|
6646
|
+
const [addSelectorOpen, setAddSelectorOpen] = React46.useState(false);
|
|
6647
|
+
const [logicOps, setLogicOps] = React46.useState({});
|
|
6562
6648
|
const getPropertyDef = (propertyId) => properties.find((p) => p.id === propertyId);
|
|
6563
6649
|
const handleUpdateFilter = (updated) => {
|
|
6564
6650
|
onFiltersChange(filters.map((f) => f.id === updated.id ? updated : f));
|
|
@@ -6587,26 +6673,28 @@ var AdvancedPopover = ({
|
|
|
6587
6673
|
[filterId]: (prev[filterId] ?? "and") === "and" ? "or" : "and"
|
|
6588
6674
|
}));
|
|
6589
6675
|
};
|
|
6590
|
-
return /* @__PURE__ */
|
|
6591
|
-
/* @__PURE__ */
|
|
6592
|
-
/* @__PURE__ */
|
|
6676
|
+
return /* @__PURE__ */ jsxs44(PopoverPrimitive10.Root, { open, onOpenChange, children: [
|
|
6677
|
+
/* @__PURE__ */ jsx49(PopoverPrimitive10.Trigger, { asChild: true, children }),
|
|
6678
|
+
/* @__PURE__ */ jsx49(PopoverPrimitive10.Portal, { children: /* @__PURE__ */ jsxs44(
|
|
6593
6679
|
PopoverPrimitive10.Content,
|
|
6594
6680
|
{
|
|
6595
6681
|
sideOffset: 4,
|
|
6596
6682
|
align: "start",
|
|
6683
|
+
collisionPadding: 16,
|
|
6597
6684
|
className: cn(
|
|
6598
6685
|
"z-50 flex flex-col",
|
|
6599
6686
|
"bg-[var(--color-background)] rounded-md shadow-lg",
|
|
6600
6687
|
"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
|
|
6601
6688
|
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
|
|
6602
|
-
"data-[side=bottom]:slide-in-from-top-2"
|
|
6689
|
+
"data-[side=bottom]:slide-in-from-top-2",
|
|
6690
|
+
"w-[min(520px,calc(100vw-32px))]"
|
|
6603
6691
|
),
|
|
6604
6692
|
children: [
|
|
6605
|
-
/* @__PURE__ */
|
|
6693
|
+
/* @__PURE__ */ jsxs44("div", { className: "flex flex-col gap-base p-base", children: [
|
|
6606
6694
|
filters.map((filter, i) => {
|
|
6607
6695
|
const propDef = getPropertyDef(filter.propertyId);
|
|
6608
6696
|
if (!propDef) return null;
|
|
6609
|
-
return /* @__PURE__ */
|
|
6697
|
+
return /* @__PURE__ */ jsx49(
|
|
6610
6698
|
AdvancedRow,
|
|
6611
6699
|
{
|
|
6612
6700
|
connector: i === 0 ? "Where" : (logicOps[filter.id] ?? "and") === "and" ? "And" : "Or",
|
|
@@ -6621,23 +6709,23 @@ var AdvancedPopover = ({
|
|
|
6621
6709
|
filter.id
|
|
6622
6710
|
);
|
|
6623
6711
|
}),
|
|
6624
|
-
filters.length === 0 && /* @__PURE__ */
|
|
6712
|
+
filters.length === 0 && /* @__PURE__ */ jsx49("p", { className: "py-base text-sm text-[var(--color-muted-foreground)]", children: "No advanced filters yet." })
|
|
6625
6713
|
] }),
|
|
6626
|
-
/* @__PURE__ */
|
|
6627
|
-
/* @__PURE__ */
|
|
6714
|
+
/* @__PURE__ */ jsxs44("div", { className: "flex items-center justify-between p-base border-t border-[var(--color-border)]", children: [
|
|
6715
|
+
/* @__PURE__ */ jsx49(
|
|
6628
6716
|
PropertySelector,
|
|
6629
6717
|
{
|
|
6630
6718
|
properties,
|
|
6631
6719
|
onSelect: handleAddFilter,
|
|
6632
6720
|
open: addSelectorOpen,
|
|
6633
6721
|
onOpenChange: setAddSelectorOpen,
|
|
6634
|
-
children: /* @__PURE__ */
|
|
6635
|
-
/* @__PURE__ */
|
|
6722
|
+
children: /* @__PURE__ */ jsxs44("button", { type: "button", className: cn(outlinedBtn), children: [
|
|
6723
|
+
/* @__PURE__ */ jsx49(Icon31, { icon: faPlusOutline2, size: "sm", className: "text-[var(--color-foreground)]" }),
|
|
6636
6724
|
"Add filter"
|
|
6637
6725
|
] })
|
|
6638
6726
|
}
|
|
6639
6727
|
),
|
|
6640
|
-
/* @__PURE__ */
|
|
6728
|
+
/* @__PURE__ */ jsx49(
|
|
6641
6729
|
"button",
|
|
6642
6730
|
{
|
|
6643
6731
|
type: "button",
|
|
@@ -6655,10 +6743,10 @@ var AdvancedPopover = ({
|
|
|
6655
6743
|
AdvancedPopover.displayName = "AdvancedPopover";
|
|
6656
6744
|
|
|
6657
6745
|
// src/components/ui/filter/summary-chip.tsx
|
|
6658
|
-
import * as
|
|
6746
|
+
import * as React47 from "react";
|
|
6659
6747
|
import * as PopoverPrimitive11 from "@radix-ui/react-popover";
|
|
6660
6748
|
import { Icon as Icon32, faSlidersOutline as faSlidersOutline2, faPlusOutline as faPlusOutline3 } from "@l3mpire/icons";
|
|
6661
|
-
import { jsx as
|
|
6749
|
+
import { jsx as jsx50, jsxs as jsxs45 } from "react/jsx-runtime";
|
|
6662
6750
|
var SummaryChip = ({
|
|
6663
6751
|
count,
|
|
6664
6752
|
filters,
|
|
@@ -6667,9 +6755,9 @@ var SummaryChip = ({
|
|
|
6667
6755
|
onClearAll,
|
|
6668
6756
|
className
|
|
6669
6757
|
}) => {
|
|
6670
|
-
const [open, setOpen] =
|
|
6671
|
-
const [addSelectorOpen, setAddSelectorOpen] =
|
|
6672
|
-
const [logicOps, setLogicOps] =
|
|
6758
|
+
const [open, setOpen] = React47.useState(false);
|
|
6759
|
+
const [addSelectorOpen, setAddSelectorOpen] = React47.useState(false);
|
|
6760
|
+
const [logicOps, setLogicOps] = React47.useState({});
|
|
6673
6761
|
const getPropertyDef = (propertyId) => properties.find((p) => p.id === propertyId);
|
|
6674
6762
|
const handleUpdateFilter = (updated) => {
|
|
6675
6763
|
onFiltersChange(filters.map((f) => f.id === updated.id ? updated : f));
|
|
@@ -6690,8 +6778,8 @@ var SummaryChip = ({
|
|
|
6690
6778
|
onFiltersChange([...filters, newFilter]);
|
|
6691
6779
|
setAddSelectorOpen(false);
|
|
6692
6780
|
};
|
|
6693
|
-
return /* @__PURE__ */
|
|
6694
|
-
/* @__PURE__ */
|
|
6781
|
+
return /* @__PURE__ */ jsxs45(PopoverPrimitive11.Root, { open, onOpenChange: setOpen, children: [
|
|
6782
|
+
/* @__PURE__ */ jsx50(PopoverPrimitive11.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs45(
|
|
6695
6783
|
"button",
|
|
6696
6784
|
{
|
|
6697
6785
|
type: "button",
|
|
@@ -6705,7 +6793,7 @@ var SummaryChip = ({
|
|
|
6705
6793
|
className
|
|
6706
6794
|
),
|
|
6707
6795
|
children: [
|
|
6708
|
-
/* @__PURE__ */
|
|
6796
|
+
/* @__PURE__ */ jsx50(
|
|
6709
6797
|
Icon32,
|
|
6710
6798
|
{
|
|
6711
6799
|
icon: faSlidersOutline2,
|
|
@@ -6713,30 +6801,31 @@ var SummaryChip = ({
|
|
|
6713
6801
|
className: "shrink-0 text-[var(--color-foreground)]"
|
|
6714
6802
|
}
|
|
6715
6803
|
),
|
|
6716
|
-
/* @__PURE__ */
|
|
6717
|
-
count > 0 && /* @__PURE__ */
|
|
6804
|
+
/* @__PURE__ */ jsx50("span", { className: "text-sm font-medium leading-sm whitespace-nowrap text-[var(--color-foreground)]", children: "Filters" }),
|
|
6805
|
+
count > 0 && /* @__PURE__ */ jsx50("span", { className: "flex items-center p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ jsx50("span", { className: "text-[10px] font-medium leading-2xs text-filter-chip-badge-text", children: count }) })
|
|
6718
6806
|
]
|
|
6719
6807
|
}
|
|
6720
6808
|
) }),
|
|
6721
|
-
/* @__PURE__ */
|
|
6809
|
+
/* @__PURE__ */ jsx50(PopoverPrimitive11.Portal, { children: /* @__PURE__ */ jsxs45(
|
|
6722
6810
|
PopoverPrimitive11.Content,
|
|
6723
6811
|
{
|
|
6724
6812
|
sideOffset: 4,
|
|
6725
6813
|
align: "start",
|
|
6814
|
+
collisionPadding: 16,
|
|
6726
6815
|
className: cn(
|
|
6727
6816
|
"z-50 flex flex-col overflow-clip",
|
|
6728
6817
|
"bg-[var(--color-dropdown-bg)] border border-[var(--color-dropdown-border)] rounded-md shadow-lg",
|
|
6729
6818
|
"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
|
|
6730
6819
|
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
|
|
6731
6820
|
"data-[side=bottom]:slide-in-from-top-2",
|
|
6732
|
-
"
|
|
6821
|
+
"w-[min(520px,calc(100vw-32px))]"
|
|
6733
6822
|
),
|
|
6734
6823
|
children: [
|
|
6735
|
-
/* @__PURE__ */
|
|
6824
|
+
/* @__PURE__ */ jsxs45("div", { className: "flex flex-col gap-base p-base", children: [
|
|
6736
6825
|
filters.map((filter, i) => {
|
|
6737
6826
|
const propDef = getPropertyDef(filter.propertyId);
|
|
6738
6827
|
if (!propDef) return null;
|
|
6739
|
-
return /* @__PURE__ */
|
|
6828
|
+
return /* @__PURE__ */ jsx50(
|
|
6740
6829
|
AdvancedRow,
|
|
6741
6830
|
{
|
|
6742
6831
|
connector: i === 0 ? "Where" : (logicOps[filter.id] ?? "and") === "and" ? "And" : "Or",
|
|
@@ -6751,17 +6840,17 @@ var SummaryChip = ({
|
|
|
6751
6840
|
filter.id
|
|
6752
6841
|
);
|
|
6753
6842
|
}),
|
|
6754
|
-
filters.length === 0 && /* @__PURE__ */
|
|
6843
|
+
filters.length === 0 && /* @__PURE__ */ jsx50("p", { className: "py-base text-sm text-[var(--color-muted-foreground)]", children: "No active filters." })
|
|
6755
6844
|
] }),
|
|
6756
|
-
/* @__PURE__ */
|
|
6757
|
-
/* @__PURE__ */
|
|
6845
|
+
/* @__PURE__ */ jsxs45("div", { className: "flex items-center justify-between p-base border-t border-[var(--color-border)]", children: [
|
|
6846
|
+
/* @__PURE__ */ jsx50(
|
|
6758
6847
|
PropertySelector,
|
|
6759
6848
|
{
|
|
6760
6849
|
properties,
|
|
6761
6850
|
onSelect: handleAddFilter,
|
|
6762
6851
|
open: addSelectorOpen,
|
|
6763
6852
|
onOpenChange: setAddSelectorOpen,
|
|
6764
|
-
children: /* @__PURE__ */
|
|
6853
|
+
children: /* @__PURE__ */ jsxs45(
|
|
6765
6854
|
"button",
|
|
6766
6855
|
{
|
|
6767
6856
|
type: "button",
|
|
@@ -6774,14 +6863,14 @@ var SummaryChip = ({
|
|
|
6774
6863
|
"hover:from-[var(--color-btn-outlined-neutral-bg-hover)] hover:to-[var(--color-btn-outlined-neutral-bg-gradient-to-hover)]"
|
|
6775
6864
|
),
|
|
6776
6865
|
children: [
|
|
6777
|
-
/* @__PURE__ */
|
|
6866
|
+
/* @__PURE__ */ jsx50(Icon32, { icon: faPlusOutline3, size: "sm", className: "text-[var(--color-foreground)]" }),
|
|
6778
6867
|
"Add filter"
|
|
6779
6868
|
]
|
|
6780
6869
|
}
|
|
6781
6870
|
)
|
|
6782
6871
|
}
|
|
6783
6872
|
),
|
|
6784
|
-
filters.length > 0 && /* @__PURE__ */
|
|
6873
|
+
filters.length > 0 && /* @__PURE__ */ jsx50(
|
|
6785
6874
|
"button",
|
|
6786
6875
|
{
|
|
6787
6876
|
type: "button",
|
|
@@ -6802,10 +6891,10 @@ var SummaryChip = ({
|
|
|
6802
6891
|
SummaryChip.displayName = "SummaryChip";
|
|
6803
6892
|
|
|
6804
6893
|
// src/components/ui/filter/use-filter-bar-mode.ts
|
|
6805
|
-
import * as
|
|
6894
|
+
import * as React48 from "react";
|
|
6806
6895
|
function useFilterBarMode(ref, override) {
|
|
6807
|
-
const [mode, setMode] =
|
|
6808
|
-
|
|
6896
|
+
const [mode, setMode] = React48.useState("default");
|
|
6897
|
+
React48.useEffect(() => {
|
|
6809
6898
|
if (override) return;
|
|
6810
6899
|
const el = ref.current;
|
|
6811
6900
|
if (!el) return;
|
|
@@ -6820,7 +6909,7 @@ function useFilterBarMode(ref, override) {
|
|
|
6820
6909
|
}
|
|
6821
6910
|
|
|
6822
6911
|
// src/components/ui/filter/filter-system.tsx
|
|
6823
|
-
import { Fragment as Fragment4, jsx as
|
|
6912
|
+
import { Fragment as Fragment4, jsx as jsx51, jsxs as jsxs46 } from "react/jsx-runtime";
|
|
6824
6913
|
var FilterSystem = ({
|
|
6825
6914
|
properties,
|
|
6826
6915
|
filterState,
|
|
@@ -6831,11 +6920,11 @@ var FilterSystem = ({
|
|
|
6831
6920
|
actions,
|
|
6832
6921
|
className
|
|
6833
6922
|
}) => {
|
|
6834
|
-
const containerRef =
|
|
6923
|
+
const containerRef = React49.useRef(null);
|
|
6835
6924
|
const mode = useFilterBarMode(containerRef, modeOverride);
|
|
6836
|
-
const [propertySelectorOpen, setPropertySelectorOpen] =
|
|
6837
|
-
const [advancedOpen, setAdvancedOpen] =
|
|
6838
|
-
const [pendingFilterId, setPendingFilterId] =
|
|
6925
|
+
const [propertySelectorOpen, setPropertySelectorOpen] = React49.useState(false);
|
|
6926
|
+
const [advancedOpen, setAdvancedOpen] = React49.useState(false);
|
|
6927
|
+
const [pendingFilterId, setPendingFilterId] = React49.useState(null);
|
|
6839
6928
|
const allFilters = [...filterState.basicFilters, ...filterState.advancedFilters];
|
|
6840
6929
|
const totalCount = allFilters.length;
|
|
6841
6930
|
const handleAddFilter = (property) => {
|
|
@@ -6910,10 +6999,10 @@ var FilterSystem = ({
|
|
|
6910
6999
|
const getPropertyDef = (propertyId) => properties.find((p) => p.id === propertyId);
|
|
6911
7000
|
const hasAdvanced = filterState.advancedFilters.length > 0;
|
|
6912
7001
|
const isMinimal = mode === "minimal";
|
|
6913
|
-
return /* @__PURE__ */
|
|
6914
|
-
/* @__PURE__ */
|
|
7002
|
+
return /* @__PURE__ */ jsxs46(FilterBar, { ref: containerRef, className, children: [
|
|
7003
|
+
/* @__PURE__ */ jsxs46(FilterBarLeft, { children: [
|
|
6915
7004
|
children,
|
|
6916
|
-
sortFields && filterState.sort && /* @__PURE__ */
|
|
7005
|
+
sortFields && filterState.sort && /* @__PURE__ */ jsx51(
|
|
6917
7006
|
SortButton,
|
|
6918
7007
|
{
|
|
6919
7008
|
fields: sortFields,
|
|
@@ -6925,7 +7014,7 @@ var FilterSystem = ({
|
|
|
6925
7014
|
),
|
|
6926
7015
|
isMinimal ? totalCount > 0 ? (
|
|
6927
7016
|
/* Has filters → SummaryChip (interactive popover) */
|
|
6928
|
-
/* @__PURE__ */
|
|
7017
|
+
/* @__PURE__ */ jsx51(
|
|
6929
7018
|
SummaryChip,
|
|
6930
7019
|
{
|
|
6931
7020
|
count: totalCount,
|
|
@@ -6943,20 +7032,20 @@ var FilterSystem = ({
|
|
|
6943
7032
|
)
|
|
6944
7033
|
) : (
|
|
6945
7034
|
/* No filters → same FilterBarButton as default, icon-only */
|
|
6946
|
-
/* @__PURE__ */
|
|
7035
|
+
/* @__PURE__ */ jsx51(
|
|
6947
7036
|
PropertySelector,
|
|
6948
7037
|
{
|
|
6949
7038
|
properties,
|
|
6950
7039
|
onSelect: handleAddFilter,
|
|
6951
7040
|
open: propertySelectorOpen,
|
|
6952
7041
|
onOpenChange: setPropertySelectorOpen,
|
|
6953
|
-
children: /* @__PURE__ */
|
|
7042
|
+
children: /* @__PURE__ */ jsx51(FilterBarButton, { iconOnly: true })
|
|
6954
7043
|
}
|
|
6955
7044
|
)
|
|
6956
7045
|
) : (
|
|
6957
7046
|
/* ── DEFAULT MODE ────────────────────────────────────── */
|
|
6958
|
-
/* @__PURE__ */
|
|
6959
|
-
hasAdvanced && /* @__PURE__ */
|
|
7047
|
+
/* @__PURE__ */ jsxs46(Fragment4, { children: [
|
|
7048
|
+
hasAdvanced && /* @__PURE__ */ jsx51(
|
|
6960
7049
|
AdvancedPopover,
|
|
6961
7050
|
{
|
|
6962
7051
|
filters: filterState.advancedFilters,
|
|
@@ -6964,7 +7053,7 @@ var FilterSystem = ({
|
|
|
6964
7053
|
onFiltersChange: handleAdvancedFiltersChange,
|
|
6965
7054
|
open: advancedOpen,
|
|
6966
7055
|
onOpenChange: setAdvancedOpen,
|
|
6967
|
-
children: /* @__PURE__ */
|
|
7056
|
+
children: /* @__PURE__ */ jsx51(
|
|
6968
7057
|
AdvancedChip,
|
|
6969
7058
|
{
|
|
6970
7059
|
count: filterState.advancedFilters.length,
|
|
@@ -6977,7 +7066,7 @@ var FilterSystem = ({
|
|
|
6977
7066
|
filterState.basicFilters.map((filter) => {
|
|
6978
7067
|
const propDef = getPropertyDef(filter.propertyId);
|
|
6979
7068
|
if (!propDef) return null;
|
|
6980
|
-
return /* @__PURE__ */
|
|
7069
|
+
return /* @__PURE__ */ jsx51(
|
|
6981
7070
|
InteractiveFilterChip,
|
|
6982
7071
|
{
|
|
6983
7072
|
propertyDef: propDef,
|
|
@@ -6993,14 +7082,14 @@ var FilterSystem = ({
|
|
|
6993
7082
|
filter.id
|
|
6994
7083
|
);
|
|
6995
7084
|
}),
|
|
6996
|
-
/* @__PURE__ */
|
|
7085
|
+
/* @__PURE__ */ jsx51(
|
|
6997
7086
|
PropertySelector,
|
|
6998
7087
|
{
|
|
6999
7088
|
properties,
|
|
7000
7089
|
onSelect: handleAddFilter,
|
|
7001
7090
|
open: propertySelectorOpen,
|
|
7002
7091
|
onOpenChange: setPropertySelectorOpen,
|
|
7003
|
-
children: /* @__PURE__ */
|
|
7092
|
+
children: /* @__PURE__ */ jsx51(
|
|
7004
7093
|
FilterBarButton,
|
|
7005
7094
|
{
|
|
7006
7095
|
count: totalCount || void 0
|
|
@@ -7009,26 +7098,24 @@ var FilterSystem = ({
|
|
|
7009
7098
|
}
|
|
7010
7099
|
)
|
|
7011
7100
|
] })
|
|
7012
|
-
)
|
|
7013
|
-
|
|
7014
|
-
(actions || totalCount > 0) && /* @__PURE__ */ jsxs45(FilterBarRight, { children: [
|
|
7015
|
-
totalCount > 0 && /* @__PURE__ */ jsx50(
|
|
7101
|
+
),
|
|
7102
|
+
totalCount > 0 && /* @__PURE__ */ jsx51(
|
|
7016
7103
|
"button",
|
|
7017
7104
|
{
|
|
7018
7105
|
type: "button",
|
|
7019
7106
|
onClick: handleClearAll,
|
|
7020
7107
|
className: "flex items-center gap-sm px-base py-sm min-h-[32px] max-h-[32px] rounded-md cursor-pointer transition-colors hover:bg-[var(--color-accent)]",
|
|
7021
|
-
children: isMinimal ? /* @__PURE__ */
|
|
7108
|
+
children: isMinimal ? /* @__PURE__ */ jsx51(Icon33, { icon: faXmarkOutline4, size: "sm", className: "text-[var(--color-foreground)]" }) : /* @__PURE__ */ jsx51("span", { className: "text-sm font-medium leading-sm text-[var(--color-foreground)]", children: "Clear" })
|
|
7022
7109
|
}
|
|
7023
|
-
)
|
|
7024
|
-
|
|
7025
|
-
|
|
7110
|
+
)
|
|
7111
|
+
] }),
|
|
7112
|
+
actions && /* @__PURE__ */ jsx51(FilterBarRight, { children: actions })
|
|
7026
7113
|
] });
|
|
7027
7114
|
};
|
|
7028
7115
|
FilterSystem.displayName = "FilterSystem";
|
|
7029
7116
|
|
|
7030
7117
|
// src/components/ui/date-picker.tsx
|
|
7031
|
-
import * as
|
|
7118
|
+
import * as React50 from "react";
|
|
7032
7119
|
import * as PopoverPrimitive12 from "@radix-ui/react-popover";
|
|
7033
7120
|
import {
|
|
7034
7121
|
Icon as Icon34,
|
|
@@ -7037,7 +7124,7 @@ import {
|
|
|
7037
7124
|
faArrowRightOutline as faArrowRightOutline2,
|
|
7038
7125
|
faCalendarOutline
|
|
7039
7126
|
} from "@l3mpire/icons";
|
|
7040
|
-
import { jsx as
|
|
7127
|
+
import { jsx as jsx52, jsxs as jsxs47 } from "react/jsx-runtime";
|
|
7041
7128
|
function getDaysInMonth(year, month) {
|
|
7042
7129
|
return new Date(year, month + 1, 0).getDate();
|
|
7043
7130
|
}
|
|
@@ -7069,16 +7156,16 @@ var MONTH_NAMES = [
|
|
|
7069
7156
|
"November",
|
|
7070
7157
|
"December"
|
|
7071
7158
|
];
|
|
7072
|
-
var DatePickerContext =
|
|
7159
|
+
var DatePickerContext = React50.createContext(
|
|
7073
7160
|
null
|
|
7074
7161
|
);
|
|
7075
7162
|
function useDatePickerContext() {
|
|
7076
|
-
const ctx =
|
|
7163
|
+
const ctx = React50.useContext(DatePickerContext);
|
|
7077
7164
|
if (!ctx)
|
|
7078
7165
|
throw new Error("DatePicker compound components must be used within <DatePicker>");
|
|
7079
7166
|
return ctx;
|
|
7080
7167
|
}
|
|
7081
|
-
var DatePicker =
|
|
7168
|
+
var DatePicker = React50.forwardRef(
|
|
7082
7169
|
({
|
|
7083
7170
|
className,
|
|
7084
7171
|
mode = "single",
|
|
@@ -7089,22 +7176,22 @@ var DatePicker = React49.forwardRef(
|
|
|
7089
7176
|
children,
|
|
7090
7177
|
...props
|
|
7091
7178
|
}, ref) => {
|
|
7092
|
-
const today =
|
|
7093
|
-
const initialDate =
|
|
7179
|
+
const today = React50.useMemo(() => startOfDay(/* @__PURE__ */ new Date()), []);
|
|
7180
|
+
const initialDate = React50.useMemo(() => {
|
|
7094
7181
|
if (value) {
|
|
7095
7182
|
if (value instanceof Date) return value;
|
|
7096
7183
|
return value.from;
|
|
7097
7184
|
}
|
|
7098
7185
|
return today;
|
|
7099
7186
|
}, []);
|
|
7100
|
-
const [month, setMonth] =
|
|
7187
|
+
const [month, setMonth] = React50.useState(
|
|
7101
7188
|
defaultMonth ?? initialDate.getMonth()
|
|
7102
7189
|
);
|
|
7103
|
-
const [year, setYear] =
|
|
7190
|
+
const [year, setYear] = React50.useState(
|
|
7104
7191
|
defaultYear ?? initialDate.getFullYear()
|
|
7105
7192
|
);
|
|
7106
|
-
const [hoveredDate, setHoveredDate] =
|
|
7107
|
-
const goToPrevMonth =
|
|
7193
|
+
const [hoveredDate, setHoveredDate] = React50.useState();
|
|
7194
|
+
const goToPrevMonth = React50.useCallback(() => {
|
|
7108
7195
|
setMonth((m) => {
|
|
7109
7196
|
if (m === 0) {
|
|
7110
7197
|
setYear((y) => y - 1);
|
|
@@ -7113,7 +7200,7 @@ var DatePicker = React49.forwardRef(
|
|
|
7113
7200
|
return m - 1;
|
|
7114
7201
|
});
|
|
7115
7202
|
}, []);
|
|
7116
|
-
const goToNextMonth =
|
|
7203
|
+
const goToNextMonth = React50.useCallback(() => {
|
|
7117
7204
|
setMonth((m) => {
|
|
7118
7205
|
if (m === 11) {
|
|
7119
7206
|
setYear((y) => y + 1);
|
|
@@ -7122,7 +7209,7 @@ var DatePicker = React49.forwardRef(
|
|
|
7122
7209
|
return m + 1;
|
|
7123
7210
|
});
|
|
7124
7211
|
}, []);
|
|
7125
|
-
const onSelect =
|
|
7212
|
+
const onSelect = React50.useCallback(
|
|
7126
7213
|
(date) => {
|
|
7127
7214
|
if (mode === "single") {
|
|
7128
7215
|
onValueChange?.(date);
|
|
@@ -7141,7 +7228,7 @@ var DatePicker = React49.forwardRef(
|
|
|
7141
7228
|
},
|
|
7142
7229
|
[mode, value, onValueChange]
|
|
7143
7230
|
);
|
|
7144
|
-
const ctxValue =
|
|
7231
|
+
const ctxValue = React50.useMemo(
|
|
7145
7232
|
() => ({
|
|
7146
7233
|
mode,
|
|
7147
7234
|
selected: value,
|
|
@@ -7168,7 +7255,7 @@ var DatePicker = React49.forwardRef(
|
|
|
7168
7255
|
hoveredDate
|
|
7169
7256
|
]
|
|
7170
7257
|
);
|
|
7171
|
-
return /* @__PURE__ */
|
|
7258
|
+
return /* @__PURE__ */ jsx52(DatePickerContext.Provider, { value: ctxValue, children: /* @__PURE__ */ jsx52(
|
|
7172
7259
|
"div",
|
|
7173
7260
|
{
|
|
7174
7261
|
ref,
|
|
@@ -7191,22 +7278,22 @@ function defaultFormatDate(date) {
|
|
|
7191
7278
|
year: "numeric"
|
|
7192
7279
|
});
|
|
7193
7280
|
}
|
|
7194
|
-
var DatePickerSelects =
|
|
7281
|
+
var DatePickerSelects = React50.forwardRef(({ className, formatDate = defaultFormatDate, ...props }, ref) => {
|
|
7195
7282
|
const { selected } = useDatePickerContext();
|
|
7196
7283
|
const fromDate = selected instanceof Date ? selected : selected?.from;
|
|
7197
7284
|
const toDate = selected instanceof Date ? void 0 : selected?.to;
|
|
7198
|
-
return /* @__PURE__ */
|
|
7285
|
+
return /* @__PURE__ */ jsx52(
|
|
7199
7286
|
"div",
|
|
7200
7287
|
{
|
|
7201
7288
|
ref,
|
|
7202
7289
|
className: cn("flex flex-col items-start pt-lg px-lg", className),
|
|
7203
7290
|
...props,
|
|
7204
|
-
children: /* @__PURE__ */
|
|
7205
|
-
/* @__PURE__ */
|
|
7206
|
-
/* @__PURE__ */
|
|
7207
|
-
/* @__PURE__ */
|
|
7291
|
+
children: /* @__PURE__ */ jsxs47("div", { className: "flex items-center gap-base w-full", children: [
|
|
7292
|
+
/* @__PURE__ */ jsxs47("div", { className: "flex-1 flex items-center gap-base min-w-0 px-base py-sm bg-gradient-to-t from-[var(--color-select-bg-default)] to-[var(--color-select-bg-gradient-to)] border border-[var(--color-select-border-default)] rounded-base shadow-sm", children: [
|
|
7293
|
+
/* @__PURE__ */ jsx52("span", { className: "flex-1 text-sm font-regular leading-sm text-datepicker-header-text truncate", children: fromDate ? formatDate(fromDate) : "Start date" }),
|
|
7294
|
+
/* @__PURE__ */ jsx52(Icon34, { icon: faCalendarOutline, size: "sm", className: "shrink-0 text-datepicker-header-text" })
|
|
7208
7295
|
] }),
|
|
7209
|
-
/* @__PURE__ */
|
|
7296
|
+
/* @__PURE__ */ jsx52(
|
|
7210
7297
|
Icon34,
|
|
7211
7298
|
{
|
|
7212
7299
|
icon: faArrowRightOutline2,
|
|
@@ -7214,9 +7301,9 @@ var DatePickerSelects = React49.forwardRef(({ className, formatDate = defaultFor
|
|
|
7214
7301
|
className: "shrink-0 text-datepicker-header-weekday"
|
|
7215
7302
|
}
|
|
7216
7303
|
),
|
|
7217
|
-
/* @__PURE__ */
|
|
7218
|
-
/* @__PURE__ */
|
|
7219
|
-
/* @__PURE__ */
|
|
7304
|
+
/* @__PURE__ */ jsxs47("div", { className: "flex-1 flex items-center gap-base min-w-0 px-base py-sm bg-gradient-to-t from-[var(--color-select-bg-default)] to-[var(--color-select-bg-gradient-to)] border border-[var(--color-select-border-default)] rounded-base shadow-sm", children: [
|
|
7305
|
+
/* @__PURE__ */ jsx52("span", { className: "flex-1 text-sm font-regular leading-sm text-datepicker-header-text truncate", children: toDate ? formatDate(toDate) : "End date" }),
|
|
7306
|
+
/* @__PURE__ */ jsx52(Icon34, { icon: faCalendarOutline, size: "sm", className: "shrink-0 text-datepicker-header-text" })
|
|
7220
7307
|
] })
|
|
7221
7308
|
] })
|
|
7222
7309
|
}
|
|
@@ -7232,7 +7319,7 @@ var DatePickerDay = ({ date, isOutside }) => {
|
|
|
7232
7319
|
const inRange = mode === "range" && selected && !(selected instanceof Date) && selected.from && selected.to && !isSelected && isInRange(date, selected.from, selected.to);
|
|
7233
7320
|
const inPreviewRange = mode === "range" && selected && !(selected instanceof Date) && selected.from && !selected.to && hoveredDate && !isSelected && hoveredDate.getTime() > selected.from.getTime() && isInRange(date, selected.from, hoveredDate);
|
|
7234
7321
|
const isInRangeOrPreview = inRange || inPreviewRange;
|
|
7235
|
-
return /* @__PURE__ */
|
|
7322
|
+
return /* @__PURE__ */ jsxs47(
|
|
7236
7323
|
"button",
|
|
7237
7324
|
{
|
|
7238
7325
|
type: "button",
|
|
@@ -7256,14 +7343,14 @@ var DatePickerDay = ({ date, isOutside }) => {
|
|
|
7256
7343
|
),
|
|
7257
7344
|
children: [
|
|
7258
7345
|
date.getDate(),
|
|
7259
|
-
isToday && !isOutside && /* @__PURE__ */
|
|
7346
|
+
isToday && !isOutside && /* @__PURE__ */ jsx52("span", { className: "absolute bottom-0.5 left-1/2 -translate-x-1/2 size-1.5 rounded-full bg-datepicker-day-today" })
|
|
7260
7347
|
]
|
|
7261
7348
|
}
|
|
7262
7349
|
);
|
|
7263
7350
|
};
|
|
7264
|
-
var DatePickerCalendar =
|
|
7351
|
+
var DatePickerCalendar = React50.forwardRef(({ className, header, ...props }, ref) => {
|
|
7265
7352
|
const { month, year, goToPrevMonth, goToNextMonth } = useDatePickerContext();
|
|
7266
|
-
const weeks =
|
|
7353
|
+
const weeks = React50.useMemo(() => {
|
|
7267
7354
|
const firstDay = new Date(year, month, 1);
|
|
7268
7355
|
const startOffset = getWeekdayIndex(firstDay);
|
|
7269
7356
|
const daysInMonth = getDaysInMonth(year, month);
|
|
@@ -7303,7 +7390,7 @@ var DatePickerCalendar = React49.forwardRef(({ className, header, ...props }, re
|
|
|
7303
7390
|
}
|
|
7304
7391
|
return result;
|
|
7305
7392
|
}, [month, year]);
|
|
7306
|
-
return /* @__PURE__ */
|
|
7393
|
+
return /* @__PURE__ */ jsxs47(
|
|
7307
7394
|
"div",
|
|
7308
7395
|
{
|
|
7309
7396
|
ref,
|
|
@@ -7311,38 +7398,38 @@ var DatePickerCalendar = React49.forwardRef(({ className, header, ...props }, re
|
|
|
7311
7398
|
...props,
|
|
7312
7399
|
children: [
|
|
7313
7400
|
header,
|
|
7314
|
-
/* @__PURE__ */
|
|
7315
|
-
/* @__PURE__ */
|
|
7316
|
-
/* @__PURE__ */
|
|
7401
|
+
/* @__PURE__ */ jsxs47("div", { className: "flex flex-col gap-lg p-lg", children: [
|
|
7402
|
+
/* @__PURE__ */ jsxs47("div", { className: "flex items-center justify-between", children: [
|
|
7403
|
+
/* @__PURE__ */ jsxs47("span", { className: "text-base font-medium leading-base text-datepicker-header-text", children: [
|
|
7317
7404
|
MONTH_NAMES[month],
|
|
7318
7405
|
" ",
|
|
7319
7406
|
year
|
|
7320
7407
|
] }),
|
|
7321
|
-
/* @__PURE__ */
|
|
7322
|
-
/* @__PURE__ */
|
|
7408
|
+
/* @__PURE__ */ jsxs47("div", { className: "flex items-center gap-xs", children: [
|
|
7409
|
+
/* @__PURE__ */ jsx52(
|
|
7323
7410
|
"button",
|
|
7324
7411
|
{
|
|
7325
7412
|
type: "button",
|
|
7326
7413
|
onClick: goToPrevMonth,
|
|
7327
7414
|
className: "flex items-center justify-center p-xs rounded-base hover:bg-datepicker-day-bg-hover transition-colors cursor-pointer",
|
|
7328
7415
|
"aria-label": "Previous month",
|
|
7329
|
-
children: /* @__PURE__ */
|
|
7416
|
+
children: /* @__PURE__ */ jsx52(Icon34, { icon: faChevronLeftOutline3, size: "xs", className: "text-datepicker-header-nav" })
|
|
7330
7417
|
}
|
|
7331
7418
|
),
|
|
7332
|
-
/* @__PURE__ */
|
|
7419
|
+
/* @__PURE__ */ jsx52(
|
|
7333
7420
|
"button",
|
|
7334
7421
|
{
|
|
7335
7422
|
type: "button",
|
|
7336
7423
|
onClick: goToNextMonth,
|
|
7337
7424
|
className: "flex items-center justify-center p-xs rounded-base hover:bg-datepicker-day-bg-hover transition-colors cursor-pointer",
|
|
7338
7425
|
"aria-label": "Next month",
|
|
7339
|
-
children: /* @__PURE__ */
|
|
7426
|
+
children: /* @__PURE__ */ jsx52(Icon34, { icon: faChevronRightOutline3, size: "xs", className: "text-datepicker-header-nav" })
|
|
7340
7427
|
}
|
|
7341
7428
|
)
|
|
7342
7429
|
] })
|
|
7343
7430
|
] }),
|
|
7344
|
-
/* @__PURE__ */
|
|
7345
|
-
/* @__PURE__ */
|
|
7431
|
+
/* @__PURE__ */ jsxs47("div", { className: "flex flex-col", children: [
|
|
7432
|
+
/* @__PURE__ */ jsx52("div", { className: "grid grid-cols-7 gap-base py-sm", children: WEEKDAYS.map((day) => /* @__PURE__ */ jsx52(
|
|
7346
7433
|
"span",
|
|
7347
7434
|
{
|
|
7348
7435
|
className: "w-9 text-center text-xs font-regular leading-xs text-datepicker-header-weekday",
|
|
@@ -7350,7 +7437,7 @@ var DatePickerCalendar = React49.forwardRef(({ className, header, ...props }, re
|
|
|
7350
7437
|
},
|
|
7351
7438
|
day
|
|
7352
7439
|
)) }),
|
|
7353
|
-
/* @__PURE__ */
|
|
7440
|
+
/* @__PURE__ */ jsx52("div", { className: "flex flex-col", children: weeks.map((week, wi) => /* @__PURE__ */ jsx52("div", { className: "grid grid-cols-7 gap-base", children: week.map((day, di) => /* @__PURE__ */ jsx52(
|
|
7354
7441
|
DatePickerDay,
|
|
7355
7442
|
{
|
|
7356
7443
|
date: day.date,
|
|
@@ -7365,10 +7452,10 @@ var DatePickerCalendar = React49.forwardRef(({ className, header, ...props }, re
|
|
|
7365
7452
|
);
|
|
7366
7453
|
});
|
|
7367
7454
|
DatePickerCalendar.displayName = "DatePickerCalendar";
|
|
7368
|
-
var DatePickerSuggestions =
|
|
7455
|
+
var DatePickerSuggestions = React50.forwardRef(
|
|
7369
7456
|
({ className, suggestions, formatDate = defaultFormatDate, ...props }, ref) => {
|
|
7370
7457
|
const { onSelect, mode } = useDatePickerContext();
|
|
7371
|
-
const onValueChange =
|
|
7458
|
+
const onValueChange = React50.useContext(DatePickerContext) ? void 0 : void 0;
|
|
7372
7459
|
const ctx = useDatePickerContext();
|
|
7373
7460
|
const handleClick = (suggestion) => {
|
|
7374
7461
|
const val = suggestion.getValue();
|
|
@@ -7390,7 +7477,7 @@ var DatePickerSuggestions = React49.forwardRef(
|
|
|
7390
7477
|
const to = val.to ? formatDate(val.to) : "";
|
|
7391
7478
|
return to ? `${from} - ${to}` : from;
|
|
7392
7479
|
};
|
|
7393
|
-
return /* @__PURE__ */
|
|
7480
|
+
return /* @__PURE__ */ jsxs47(
|
|
7394
7481
|
"div",
|
|
7395
7482
|
{
|
|
7396
7483
|
ref,
|
|
@@ -7400,16 +7487,16 @@ var DatePickerSuggestions = React49.forwardRef(
|
|
|
7400
7487
|
),
|
|
7401
7488
|
...props,
|
|
7402
7489
|
children: [
|
|
7403
|
-
/* @__PURE__ */
|
|
7404
|
-
/* @__PURE__ */
|
|
7490
|
+
/* @__PURE__ */ jsx52("div", { className: "pt-lg px-base", children: /* @__PURE__ */ jsx52("div", { className: "flex items-center p-base rounded-base", children: /* @__PURE__ */ jsx52("span", { className: "flex-1 text-xs font-medium leading-xs text-datepicker-suggestion-heading uppercase truncate", children: "Suggestions" }) }) }),
|
|
7491
|
+
/* @__PURE__ */ jsx52("div", { className: "flex flex-1 flex-col p-base min-w-[222px]", children: suggestions.map((suggestion, i) => /* @__PURE__ */ jsxs47(
|
|
7405
7492
|
"button",
|
|
7406
7493
|
{
|
|
7407
7494
|
type: "button",
|
|
7408
7495
|
onClick: () => handleClick(suggestion),
|
|
7409
7496
|
className: "flex items-center gap-sm p-base rounded-base hover:bg-datepicker-suggestion-hover transition-colors cursor-pointer text-left",
|
|
7410
7497
|
children: [
|
|
7411
|
-
/* @__PURE__ */
|
|
7412
|
-
/* @__PURE__ */
|
|
7498
|
+
/* @__PURE__ */ jsx52("span", { className: "text-sm font-regular leading-sm text-datepicker-suggestion-text truncate shrink-0", children: suggestion.label }),
|
|
7499
|
+
/* @__PURE__ */ jsx52("span", { className: "text-xs font-regular leading-xs text-datepicker-suggestion-date truncate", children: formatSuggestionDate(suggestion) })
|
|
7413
7500
|
]
|
|
7414
7501
|
},
|
|
7415
7502
|
i
|
|
@@ -7420,8 +7507,8 @@ var DatePickerSuggestions = React49.forwardRef(
|
|
|
7420
7507
|
}
|
|
7421
7508
|
);
|
|
7422
7509
|
DatePickerSuggestions.displayName = "DatePickerSuggestions";
|
|
7423
|
-
var DatePickerFooter =
|
|
7424
|
-
({ className, children, ...props }, ref) => /* @__PURE__ */
|
|
7510
|
+
var DatePickerFooter = React50.forwardRef(
|
|
7511
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx52(
|
|
7425
7512
|
"div",
|
|
7426
7513
|
{
|
|
7427
7514
|
ref,
|
|
@@ -7437,8 +7524,8 @@ var DatePickerFooter = React49.forwardRef(
|
|
|
7437
7524
|
)
|
|
7438
7525
|
);
|
|
7439
7526
|
DatePickerFooter.displayName = "DatePickerFooter";
|
|
7440
|
-
var DatePickerPanel =
|
|
7441
|
-
({ className, children, ...props }, ref) => /* @__PURE__ */
|
|
7527
|
+
var DatePickerPanel = React50.forwardRef(
|
|
7528
|
+
({ className, children, ...props }, ref) => /* @__PURE__ */ jsx52(
|
|
7442
7529
|
"div",
|
|
7443
7530
|
{
|
|
7444
7531
|
ref,
|
|
@@ -7451,7 +7538,7 @@ var DatePickerPanel = React49.forwardRef(
|
|
|
7451
7538
|
DatePickerPanel.displayName = "DatePickerPanel";
|
|
7452
7539
|
var DatePickerRoot = PopoverPrimitive12.Root;
|
|
7453
7540
|
var DatePickerTrigger = PopoverPrimitive12.Trigger;
|
|
7454
|
-
var DatePickerPopover =
|
|
7541
|
+
var DatePickerPopover = React50.forwardRef(({ className, sideOffset = 4, align = "start", children, ...props }, ref) => /* @__PURE__ */ jsx52(PopoverPrimitive12.Portal, { children: /* @__PURE__ */ jsx52(
|
|
7455
7542
|
PopoverPrimitive12.Content,
|
|
7456
7543
|
{
|
|
7457
7544
|
ref,
|
|
@@ -7595,6 +7682,8 @@ export {
|
|
|
7595
7682
|
OperatorSelector,
|
|
7596
7683
|
ProductLogo,
|
|
7597
7684
|
PropertySelector,
|
|
7685
|
+
RadioGroup,
|
|
7686
|
+
RadioGroupItem,
|
|
7598
7687
|
RowActions,
|
|
7599
7688
|
SaveViewButton,
|
|
7600
7689
|
SearchBar,
|