@luxfi/ui 7.3.1 → 7.3.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +275 -282
- package/dist/index.js +276 -283
- package/dist/provider.cjs +1 -13
- package/dist/provider.js +1 -9
- package/package.json +1 -1
- package/src/provider.tsx +4 -7
package/dist/index.cjs
CHANGED
|
@@ -3,11 +3,11 @@
|
|
|
3
3
|
|
|
4
4
|
var core = require('@hanzogui/core');
|
|
5
5
|
var reactQuery = require('@tanstack/react-query');
|
|
6
|
-
var React30 = require('react');
|
|
7
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
8
7
|
var clsx = require('clsx');
|
|
9
8
|
var tailwindMerge = require('tailwind-merge');
|
|
10
9
|
var AccordionPrimitive = require('@radix-ui/react-accordion');
|
|
10
|
+
var React29 = require('react');
|
|
11
11
|
var RadixAvatar = require('@radix-ui/react-avatar');
|
|
12
12
|
var tooltip = require('@hanzogui/tooltip');
|
|
13
13
|
var usehooks = require('@uidotdev/usehooks');
|
|
@@ -46,8 +46,8 @@ function _interopNamespace(e) {
|
|
|
46
46
|
return Object.freeze(n);
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
-
var React30__namespace = /*#__PURE__*/_interopNamespace(React30);
|
|
50
49
|
var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrimitive);
|
|
50
|
+
var React29__namespace = /*#__PURE__*/_interopNamespace(React29);
|
|
51
51
|
var RadixAvatar__namespace = /*#__PURE__*/_interopNamespace(RadixAvatar);
|
|
52
52
|
var RadixCheckbox__namespace = /*#__PURE__*/_interopNamespace(RadixCheckbox);
|
|
53
53
|
var Collapsible__namespace = /*#__PURE__*/_interopNamespace(Collapsible);
|
|
@@ -62,27 +62,20 @@ var RadixSwitch__namespace = /*#__PURE__*/_interopNamespace(RadixSwitch);
|
|
|
62
62
|
var RadixTabs__namespace = /*#__PURE__*/_interopNamespace(RadixTabs);
|
|
63
63
|
|
|
64
64
|
// src/provider.tsx
|
|
65
|
-
|
|
66
|
-
function ensureGui() {
|
|
67
|
-
if (_guiInitialized) return;
|
|
68
|
-
if (typeof window === "undefined") return;
|
|
65
|
+
if (typeof window !== "undefined") {
|
|
69
66
|
core.createGui({ settings: { autocompleteSpecificTokens: "except-special" } });
|
|
70
|
-
_guiInitialized = true;
|
|
71
67
|
}
|
|
72
68
|
var defaultQueryClient = new reactQuery.QueryClient({
|
|
73
69
|
defaultOptions: { queries: { refetchOnWindowFocus: false, retry: 1, staleTime: 3e4 } }
|
|
74
70
|
});
|
|
75
71
|
var AppProvider = ({ children, queryClient }) => {
|
|
76
|
-
React30__namespace.default.useEffect(() => {
|
|
77
|
-
ensureGui();
|
|
78
|
-
}, []);
|
|
79
72
|
return /* @__PURE__ */ jsxRuntime.jsx(reactQuery.QueryClientProvider, { client: queryClient ?? defaultQueryClient, children });
|
|
80
73
|
};
|
|
81
74
|
function cn(...inputs) {
|
|
82
75
|
return tailwindMerge.twMerge(clsx.clsx(inputs));
|
|
83
76
|
}
|
|
84
77
|
var IndicatorIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7.5 15L12.5 10L7.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
85
|
-
var AccordionRoot =
|
|
78
|
+
var AccordionRoot = React29__namespace.forwardRef(
|
|
86
79
|
function AccordionRoot2(props, ref) {
|
|
87
80
|
const {
|
|
88
81
|
multiple: _multiple,
|
|
@@ -101,7 +94,7 @@ var AccordionRoot = React30__namespace.forwardRef(
|
|
|
101
94
|
borderRadius: _borderRadius,
|
|
102
95
|
...rest
|
|
103
96
|
} = props;
|
|
104
|
-
const handleValueChange =
|
|
97
|
+
const handleValueChange = React29__namespace.useCallback(
|
|
105
98
|
(next) => {
|
|
106
99
|
onValueChange?.({ value: next });
|
|
107
100
|
},
|
|
@@ -129,7 +122,7 @@ var AccordionRoot = React30__namespace.forwardRef(
|
|
|
129
122
|
);
|
|
130
123
|
}
|
|
131
124
|
);
|
|
132
|
-
var AccordionItem =
|
|
125
|
+
var AccordionItem = React29__namespace.forwardRef(
|
|
133
126
|
function AccordionItem2(props, ref) {
|
|
134
127
|
const { className, as: _as, _first, _last, display: _display, ...rest } = props;
|
|
135
128
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -145,7 +138,7 @@ var AccordionItem = React30__namespace.forwardRef(
|
|
|
145
138
|
);
|
|
146
139
|
}
|
|
147
140
|
);
|
|
148
|
-
var AccordionItemTrigger =
|
|
141
|
+
var AccordionItemTrigger = React29__namespace.forwardRef(function AccordionItemTrigger2(props, ref) {
|
|
149
142
|
const {
|
|
150
143
|
children,
|
|
151
144
|
indicatorPlacement: indicatorPlacementProp,
|
|
@@ -210,7 +203,7 @@ var AccordionItemTrigger = React30__namespace.forwardRef(function AccordionItemT
|
|
|
210
203
|
}
|
|
211
204
|
) }) });
|
|
212
205
|
});
|
|
213
|
-
var AccordionItemContent =
|
|
206
|
+
var AccordionItemContent = React29__namespace.forwardRef(function AccordionItemContent2(props, ref) {
|
|
214
207
|
const { className, children, pb: _pb, pr: _pr, pl: _pl, w: _w, display: _display, flexDir: _flexDir, rowGap: _rowGap, ...rest } = props;
|
|
215
208
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
216
209
|
AccordionPrimitive__namespace.Content,
|
|
@@ -228,11 +221,11 @@ var AccordionItemContent = React30__namespace.forwardRef(function AccordionItemC
|
|
|
228
221
|
);
|
|
229
222
|
});
|
|
230
223
|
function useAccordion(items) {
|
|
231
|
-
const [value, setValue] =
|
|
232
|
-
const onValueChange =
|
|
224
|
+
const [value, setValue] = React29__namespace.useState([]);
|
|
225
|
+
const onValueChange = React29__namespace.useCallback(({ value: value2 }) => {
|
|
233
226
|
setValue(value2);
|
|
234
227
|
}, []);
|
|
235
|
-
const scrollToItemFromUrl =
|
|
228
|
+
const scrollToItemFromUrl = React29__namespace.useCallback(() => {
|
|
236
229
|
const hash = window.location.hash.replace("#", "");
|
|
237
230
|
if (!hash) {
|
|
238
231
|
return;
|
|
@@ -246,7 +239,7 @@ function useAccordion(items) {
|
|
|
246
239
|
setValue([itemToScroll.id]);
|
|
247
240
|
}
|
|
248
241
|
}, [items]);
|
|
249
|
-
return
|
|
242
|
+
return React29__namespace.useMemo(() => {
|
|
250
243
|
return {
|
|
251
244
|
value,
|
|
252
245
|
onValueChange,
|
|
@@ -289,7 +282,7 @@ var CLOSE_BUTTON_CLASSES = [
|
|
|
289
282
|
"hover:text-[var(--hover-color,currentColor)]",
|
|
290
283
|
"disabled:opacity-40"
|
|
291
284
|
].join(" ");
|
|
292
|
-
var CloseButton =
|
|
285
|
+
var CloseButton = React29__namespace.forwardRef(function CloseButton2(props, ref) {
|
|
293
286
|
const { variant: _variant, size: _size, className, children, ...rest } = props;
|
|
294
287
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
295
288
|
CloseButtonFrame,
|
|
@@ -436,7 +429,7 @@ var SKELETON_CLASSES = [
|
|
|
436
429
|
"bg-[length:200%_100%]"
|
|
437
430
|
].join(" ");
|
|
438
431
|
var HIDE_BELOW_MAP = { lg: "lg:hidden", md: "md:hidden", sm: "sm:hidden" };
|
|
439
|
-
var Skeleton =
|
|
432
|
+
var Skeleton = React29__namespace.forwardRef(
|
|
440
433
|
function Skeleton2(props, ref) {
|
|
441
434
|
const { loading = false, asChild, className, children, style: styleProp, as: Component = "div", ...allRest } = props;
|
|
442
435
|
const shimStyle = shimToStyle(props);
|
|
@@ -445,10 +438,10 @@ var Skeleton = React30__namespace.forwardRef(
|
|
|
445
438
|
const cls = hideBelowClass ? cn(className, hideBelowClass) : className;
|
|
446
439
|
const htmlRest = stripShims(allRest);
|
|
447
440
|
if (!loading) {
|
|
448
|
-
if (asChild &&
|
|
441
|
+
if (asChild && React29__namespace.isValidElement(children)) return children;
|
|
449
442
|
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: cls, style: mergedStyle, ...htmlRest, children });
|
|
450
443
|
}
|
|
451
|
-
if (asChild &&
|
|
444
|
+
if (asChild && React29__namespace.isValidElement(children)) {
|
|
452
445
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
453
446
|
Component,
|
|
454
447
|
{
|
|
@@ -474,7 +467,7 @@ var Skeleton = React30__namespace.forwardRef(
|
|
|
474
467
|
);
|
|
475
468
|
}
|
|
476
469
|
);
|
|
477
|
-
var SkeletonCircle =
|
|
470
|
+
var SkeletonCircle = React29__namespace.forwardRef(
|
|
478
471
|
function SkeletonCircle2(props, ref) {
|
|
479
472
|
const { size = 40, loading = true, className, ...rest } = props;
|
|
480
473
|
const dimension = typeof size === "number" ? `${size}px` : size;
|
|
@@ -490,7 +483,7 @@ var SkeletonCircle = React30__namespace.forwardRef(
|
|
|
490
483
|
);
|
|
491
484
|
}
|
|
492
485
|
);
|
|
493
|
-
var SkeletonText =
|
|
486
|
+
var SkeletonText = React29__namespace.forwardRef(
|
|
494
487
|
function SkeletonText2(props, ref) {
|
|
495
488
|
const { noOfLines = 3, loading = true, className, ...rest } = props;
|
|
496
489
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex w-full flex-col gap-2", className), ...rest, children: Array.from({ length: noOfLines }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -520,7 +513,7 @@ var INDICATOR_SIZE_CLASSES = {
|
|
|
520
513
|
sm: "w-5 h-5 my-0",
|
|
521
514
|
md: "w-5 h-5 my-[2px]"
|
|
522
515
|
};
|
|
523
|
-
var Alert =
|
|
516
|
+
var Alert = React29__namespace.forwardRef(
|
|
524
517
|
function Alert2(props, ref) {
|
|
525
518
|
const {
|
|
526
519
|
title,
|
|
@@ -545,7 +538,7 @@ var Alert = React30__namespace.forwardRef(
|
|
|
545
538
|
if (_mb !== void 0) shimStyle.marginBottom = typeof _mb === "number" ? `${_mb * 4}px` : _mb;
|
|
546
539
|
if (_mt !== void 0) shimStyle.marginTop = typeof _mt === "number" ? `${_mt * 4}px` : _mt;
|
|
547
540
|
const alertStyle = Object.keys(shimStyle).length > 0 ? shimStyle : void 0;
|
|
548
|
-
const [isOpen, setIsOpen] =
|
|
541
|
+
const [isOpen, setIsOpen] = React29__namespace.useState(true);
|
|
549
542
|
const resolvedSize = size ?? "md";
|
|
550
543
|
const defaultIcon = /* @__PURE__ */ jsxRuntime.jsx(IndicatorIcon2, { className: "w-5 h-5" });
|
|
551
544
|
const iconElement = (() => {
|
|
@@ -560,7 +553,7 @@ var Alert = React30__namespace.forwardRef(
|
|
|
560
553
|
INDICATOR_SIZE_CLASSES[resolvedSize]
|
|
561
554
|
), children: icon || defaultIcon });
|
|
562
555
|
})();
|
|
563
|
-
const handleClose =
|
|
556
|
+
const handleClose = React29__namespace.useCallback(() => {
|
|
564
557
|
setIsOpen(false);
|
|
565
558
|
onClose?.();
|
|
566
559
|
}, [onClose]);
|
|
@@ -636,11 +629,11 @@ var VARIANT_CLASSES = {
|
|
|
636
629
|
};
|
|
637
630
|
var DEFAULT_SIZE = "md";
|
|
638
631
|
var DEFAULT_VARIANT = "subtle";
|
|
639
|
-
var AvatarGroupContext =
|
|
632
|
+
var AvatarGroupContext = React29__namespace.createContext({});
|
|
640
633
|
function useAvatarGroupContext() {
|
|
641
|
-
return
|
|
634
|
+
return React29__namespace.useContext(AvatarGroupContext);
|
|
642
635
|
}
|
|
643
|
-
var Avatar =
|
|
636
|
+
var Avatar = React29__namespace.forwardRef(
|
|
644
637
|
function Avatar2(props, ref) {
|
|
645
638
|
const group = useAvatarGroupContext();
|
|
646
639
|
const {
|
|
@@ -690,7 +683,7 @@ var Avatar = React30__namespace.forwardRef(
|
|
|
690
683
|
);
|
|
691
684
|
}
|
|
692
685
|
);
|
|
693
|
-
var AvatarFallback =
|
|
686
|
+
var AvatarFallback = React29__namespace.forwardRef(
|
|
694
687
|
function AvatarFallback2(props, ref) {
|
|
695
688
|
const { name, icon, children, className, ...rest } = props;
|
|
696
689
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -717,10 +710,10 @@ function getInitials(name) {
|
|
|
717
710
|
const lastName = names.length > 1 ? names[names.length - 1] : "";
|
|
718
711
|
return firstName && lastName ? `${firstName.charAt(0)}${lastName.charAt(0)}` : firstName.charAt(0);
|
|
719
712
|
}
|
|
720
|
-
var AvatarGroup =
|
|
713
|
+
var AvatarGroup = React29__namespace.forwardRef(
|
|
721
714
|
function AvatarGroup2(props, ref) {
|
|
722
715
|
const { size, variant, borderless, className, ...rest } = props;
|
|
723
|
-
const contextValue =
|
|
716
|
+
const contextValue = React29__namespace.useMemo(
|
|
724
717
|
() => ({ size, variant, borderless }),
|
|
725
718
|
[size, variant, borderless]
|
|
726
719
|
);
|
|
@@ -736,11 +729,11 @@ var AvatarGroup = React30__namespace.forwardRef(
|
|
|
736
729
|
);
|
|
737
730
|
var LG_BREAKPOINT = 1024;
|
|
738
731
|
function useIsMobile() {
|
|
739
|
-
const [isMobile, setIsMobile] =
|
|
732
|
+
const [isMobile, setIsMobile] = React29__namespace.useState(() => {
|
|
740
733
|
if (typeof window === "undefined") return false;
|
|
741
734
|
return window.innerWidth < LG_BREAKPOINT;
|
|
742
735
|
});
|
|
743
|
-
|
|
736
|
+
React29__namespace.useEffect(() => {
|
|
744
737
|
const mql = window.matchMedia(`(max-width: ${LG_BREAKPOINT - 1}px)`);
|
|
745
738
|
const handler = (e) => setIsMobile(e.matches);
|
|
746
739
|
setIsMobile(mql.matches);
|
|
@@ -753,7 +746,7 @@ function mapPlacement(p) {
|
|
|
753
746
|
if (!p) return void 0;
|
|
754
747
|
return p;
|
|
755
748
|
}
|
|
756
|
-
var Tooltip =
|
|
749
|
+
var Tooltip = React29__namespace.forwardRef(
|
|
757
750
|
function Tooltip2(props, ref) {
|
|
758
751
|
const {
|
|
759
752
|
showArrow: showArrowProp,
|
|
@@ -772,28 +765,28 @@ var Tooltip = React30__namespace.forwardRef(
|
|
|
772
765
|
interactive,
|
|
773
766
|
positioning
|
|
774
767
|
} = props;
|
|
775
|
-
const [open, setOpen] =
|
|
776
|
-
const timeoutRef =
|
|
768
|
+
const [open, setOpen] = React29__namespace.useState(defaultOpen);
|
|
769
|
+
const timeoutRef = React29__namespace.useRef(null);
|
|
777
770
|
const isMobile = useIsMobile();
|
|
778
|
-
const handleOpenChange =
|
|
771
|
+
const handleOpenChange = React29__namespace.useCallback((nextOpen) => {
|
|
779
772
|
setOpen(nextOpen);
|
|
780
773
|
onOpenChange?.({ open: nextOpen });
|
|
781
774
|
}, [onOpenChange]);
|
|
782
|
-
const handleOpenChangeManual =
|
|
775
|
+
const handleOpenChangeManual = React29__namespace.useCallback((nextOpen) => {
|
|
783
776
|
timeoutRef.current && window.clearTimeout(timeoutRef.current);
|
|
784
777
|
timeoutRef.current = window.setTimeout(() => {
|
|
785
778
|
setOpen(nextOpen);
|
|
786
779
|
onOpenChange?.({ open: nextOpen });
|
|
787
780
|
}, nextOpen ? openDelay : closeDelay);
|
|
788
781
|
}, [closeDelay, openDelay, onOpenChange]);
|
|
789
|
-
const handleClickAway =
|
|
782
|
+
const handleClickAway = React29__namespace.useCallback(() => {
|
|
790
783
|
handleOpenChangeManual(false);
|
|
791
784
|
}, [handleOpenChangeManual]);
|
|
792
785
|
const triggerRef = usehooks.useClickAway(handleClickAway);
|
|
793
|
-
const handleTriggerClick =
|
|
786
|
+
const handleTriggerClick = React29__namespace.useCallback(() => {
|
|
794
787
|
handleOpenChangeManual(!open);
|
|
795
788
|
}, [handleOpenChangeManual, open]);
|
|
796
|
-
const handleContentClick =
|
|
789
|
+
const handleContentClick = React29__namespace.useCallback((event) => {
|
|
797
790
|
event.stopPropagation();
|
|
798
791
|
if (interactive) {
|
|
799
792
|
const closestLink = event.target?.closest("a");
|
|
@@ -802,7 +795,7 @@ var Tooltip = React30__namespace.forwardRef(
|
|
|
802
795
|
}
|
|
803
796
|
}
|
|
804
797
|
}, [interactive, handleOpenChangeManual]);
|
|
805
|
-
|
|
798
|
+
React29__namespace.useEffect(() => {
|
|
806
799
|
return () => {
|
|
807
800
|
if (timeoutRef.current) {
|
|
808
801
|
clearTimeout(timeoutRef.current);
|
|
@@ -904,7 +897,7 @@ var COLOR_PALETTE_CLASSES = {
|
|
|
904
897
|
bright_pink: "bg-badge-bright-pink-bg text-badge-bright-pink-fg"
|
|
905
898
|
};
|
|
906
899
|
var S2 = 4;
|
|
907
|
-
var Badge =
|
|
900
|
+
var Badge = React29__namespace.default.forwardRef(
|
|
908
901
|
function Badge2(props, ref) {
|
|
909
902
|
const {
|
|
910
903
|
loading,
|
|
@@ -1153,7 +1146,7 @@ function buildShimStyle(props) {
|
|
|
1153
1146
|
if (props.borderTopRightRadius !== void 0) s.borderTopRightRadius = typeof props.borderTopRightRadius === "number" ? `${props.borderTopRightRadius}px` : props.borderTopRightRadius;
|
|
1154
1147
|
return Object.keys(s).length > 0 ? s : void 0;
|
|
1155
1148
|
}
|
|
1156
|
-
var Button =
|
|
1149
|
+
var Button = React29__namespace.forwardRef(
|
|
1157
1150
|
function Button2(props, ref) {
|
|
1158
1151
|
const {
|
|
1159
1152
|
className,
|
|
@@ -1255,7 +1248,7 @@ function buttonVariants(opts) {
|
|
|
1255
1248
|
const s = opts?.size ?? "md";
|
|
1256
1249
|
return [BASE_CLASSES2, VARIANT_CLASSES2[v] ?? "", SIZE_CLASSES4[s] ?? ""].filter(Boolean).join(" ");
|
|
1257
1250
|
}
|
|
1258
|
-
var ButtonGroup =
|
|
1251
|
+
var ButtonGroup = React29__namespace.forwardRef(
|
|
1259
1252
|
function ButtonGroup2(props, ref) {
|
|
1260
1253
|
const { className, ...rest } = props;
|
|
1261
1254
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1269,7 +1262,7 @@ var ButtonGroup = React30__namespace.forwardRef(
|
|
|
1269
1262
|
);
|
|
1270
1263
|
}
|
|
1271
1264
|
);
|
|
1272
|
-
var ButtonGroupRadio =
|
|
1265
|
+
var ButtonGroupRadio = React29__namespace.forwardRef(
|
|
1273
1266
|
function ButtonGroupRadio2(props, ref) {
|
|
1274
1267
|
const {
|
|
1275
1268
|
children,
|
|
@@ -1281,24 +1274,24 @@ var ButtonGroupRadio = React30__namespace.forwardRef(
|
|
|
1281
1274
|
className,
|
|
1282
1275
|
...rest
|
|
1283
1276
|
} = props;
|
|
1284
|
-
const firstChildValue =
|
|
1277
|
+
const firstChildValue = React29__namespace.useMemo(() => {
|
|
1285
1278
|
const firstChild = Array.isArray(children) ? children[0] : void 0;
|
|
1286
1279
|
return typeof firstChild?.props.value === "string" ? firstChild.props.value : void 0;
|
|
1287
1280
|
}, [children]);
|
|
1288
|
-
const [value, setValue] =
|
|
1289
|
-
const handleItemClick =
|
|
1281
|
+
const [value, setValue] = React29__namespace.useState(defaultValue ?? firstChildValue);
|
|
1282
|
+
const handleItemClick = React29__namespace.useCallback((event) => {
|
|
1290
1283
|
const v = event.currentTarget.value;
|
|
1291
1284
|
setValue(v);
|
|
1292
1285
|
onChange?.(v);
|
|
1293
1286
|
}, [onChange]);
|
|
1294
|
-
const clonedChildren =
|
|
1295
|
-
return
|
|
1287
|
+
const clonedChildren = React29__namespace.Children.map(children, (child) => {
|
|
1288
|
+
return React29__namespace.cloneElement(child, {
|
|
1296
1289
|
onClick: handleItemClick,
|
|
1297
1290
|
selected: value === child.props.value,
|
|
1298
1291
|
variant
|
|
1299
1292
|
});
|
|
1300
1293
|
});
|
|
1301
|
-
const childrenLength =
|
|
1294
|
+
const childrenLength = React29__namespace.Children.count(children);
|
|
1302
1295
|
return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { loading, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1303
1296
|
"div",
|
|
1304
1297
|
{
|
|
@@ -1318,11 +1311,11 @@ var ButtonGroupRadio = React30__namespace.forwardRef(
|
|
|
1318
1311
|
);
|
|
1319
1312
|
var NOOP = () => {
|
|
1320
1313
|
};
|
|
1321
|
-
var CheckboxGroupContext =
|
|
1314
|
+
var CheckboxGroupContext = React29__namespace.createContext(null);
|
|
1322
1315
|
function useCheckboxGroupContext() {
|
|
1323
|
-
return
|
|
1316
|
+
return React29__namespace.useContext(CheckboxGroupContext);
|
|
1324
1317
|
}
|
|
1325
|
-
var CheckboxGroupBase =
|
|
1318
|
+
var CheckboxGroupBase = React29__namespace.forwardRef(
|
|
1326
1319
|
function CheckboxGroup(props, ref) {
|
|
1327
1320
|
const {
|
|
1328
1321
|
children,
|
|
@@ -1334,10 +1327,10 @@ var CheckboxGroupBase = React30__namespace.forwardRef(
|
|
|
1334
1327
|
className,
|
|
1335
1328
|
...rest
|
|
1336
1329
|
} = props;
|
|
1337
|
-
const [uncontrolledValue, setUncontrolledValue] =
|
|
1330
|
+
const [uncontrolledValue, setUncontrolledValue] = React29__namespace.useState(defaultValue ?? []);
|
|
1338
1331
|
const isControlled = controlledValue !== void 0;
|
|
1339
1332
|
const value = isControlled ? controlledValue : uncontrolledValue;
|
|
1340
|
-
const toggle =
|
|
1333
|
+
const toggle = React29__namespace.useCallback(
|
|
1341
1334
|
(itemValue) => {
|
|
1342
1335
|
const next = value.includes(itemValue) ? value.filter((v) => v !== itemValue) : [...value, itemValue];
|
|
1343
1336
|
if (!isControlled) {
|
|
@@ -1347,12 +1340,12 @@ var CheckboxGroupBase = React30__namespace.forwardRef(
|
|
|
1347
1340
|
},
|
|
1348
1341
|
[value, isControlled, onValueChange]
|
|
1349
1342
|
);
|
|
1350
|
-
|
|
1343
|
+
React29__namespace.useEffect(() => {
|
|
1351
1344
|
if (isControlled) {
|
|
1352
1345
|
setUncontrolledValue(controlledValue);
|
|
1353
1346
|
}
|
|
1354
1347
|
}, [isControlled, controlledValue]);
|
|
1355
|
-
const ctx =
|
|
1348
|
+
const ctx = React29__namespace.useMemo(() => ({ value, toggle }), [value, toggle]);
|
|
1356
1349
|
return /* @__PURE__ */ jsxRuntime.jsx(CheckboxGroupContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1357
1350
|
"div",
|
|
1358
1351
|
{
|
|
@@ -1410,7 +1403,7 @@ var IndeterminateIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
|
1410
1403
|
children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M0 0H12V2H0V0Z", fill: "currentColor" })
|
|
1411
1404
|
}
|
|
1412
1405
|
);
|
|
1413
|
-
var CheckboxBase =
|
|
1406
|
+
var CheckboxBase = React29__namespace.forwardRef(
|
|
1414
1407
|
function Checkbox(props, ref) {
|
|
1415
1408
|
const {
|
|
1416
1409
|
icon,
|
|
@@ -1431,8 +1424,8 @@ var CheckboxBase = React30__namespace.forwardRef(
|
|
|
1431
1424
|
...rest
|
|
1432
1425
|
} = props;
|
|
1433
1426
|
const group = useCheckboxGroupContext();
|
|
1434
|
-
const hiddenInputRef =
|
|
1435
|
-
const setHiddenInputRef =
|
|
1427
|
+
const hiddenInputRef = React29__namespace.useRef(null);
|
|
1428
|
+
const setHiddenInputRef = React29__namespace.useCallback(
|
|
1436
1429
|
(node) => {
|
|
1437
1430
|
hiddenInputRef.current = node;
|
|
1438
1431
|
if (typeof ref === "function") {
|
|
@@ -1445,7 +1438,7 @@ var CheckboxBase = React30__namespace.forwardRef(
|
|
|
1445
1438
|
);
|
|
1446
1439
|
const isInGroup = group !== null && value !== void 0;
|
|
1447
1440
|
const groupChecked = isInGroup ? group.value.includes(value) : void 0;
|
|
1448
|
-
const [internalChecked, setInternalChecked] =
|
|
1441
|
+
const [internalChecked, setInternalChecked] = React29__namespace.useState(
|
|
1449
1442
|
defaultChecked ?? false
|
|
1450
1443
|
);
|
|
1451
1444
|
const isControlled = checkedProp !== void 0 || isInGroup;
|
|
@@ -1457,7 +1450,7 @@ var CheckboxBase = React30__namespace.forwardRef(
|
|
|
1457
1450
|
} else {
|
|
1458
1451
|
checkedState = internalChecked;
|
|
1459
1452
|
}
|
|
1460
|
-
const handleCheckedChange =
|
|
1453
|
+
const handleCheckedChange = React29__namespace.useCallback(
|
|
1461
1454
|
(nextChecked) => {
|
|
1462
1455
|
if (readOnly) return;
|
|
1463
1456
|
if (!isControlled) {
|
|
@@ -1621,7 +1614,7 @@ function resolveSpacing(v) {
|
|
|
1621
1614
|
}
|
|
1622
1615
|
return void 0;
|
|
1623
1616
|
}
|
|
1624
|
-
var Link =
|
|
1617
|
+
var Link = React29__namespace.default.forwardRef(
|
|
1625
1618
|
function Link2(props, ref) {
|
|
1626
1619
|
const {
|
|
1627
1620
|
external,
|
|
@@ -1710,7 +1703,7 @@ var Link = React30__namespace.default.forwardRef(
|
|
|
1710
1703
|
) });
|
|
1711
1704
|
}
|
|
1712
1705
|
);
|
|
1713
|
-
var LinkBox =
|
|
1706
|
+
var LinkBox = React29__namespace.default.forwardRef(
|
|
1714
1707
|
function LinkBox2(props, ref) {
|
|
1715
1708
|
const { className, ...rest } = props;
|
|
1716
1709
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1723,7 +1716,7 @@ var LinkBox = React30__namespace.default.forwardRef(
|
|
|
1723
1716
|
);
|
|
1724
1717
|
}
|
|
1725
1718
|
);
|
|
1726
|
-
var LinkOverlay =
|
|
1719
|
+
var LinkOverlay = React29__namespace.default.forwardRef(
|
|
1727
1720
|
function LinkOverlay2(props, ref) {
|
|
1728
1721
|
const {
|
|
1729
1722
|
children,
|
|
@@ -1804,8 +1797,8 @@ var LinkOverlay = React30__namespace.default.forwardRef(
|
|
|
1804
1797
|
}
|
|
1805
1798
|
);
|
|
1806
1799
|
function useUpdateEffect(effect, deps) {
|
|
1807
|
-
const isFirstMount =
|
|
1808
|
-
|
|
1800
|
+
const isFirstMount = React29__namespace.default.useRef(true);
|
|
1801
|
+
React29__namespace.default.useEffect(() => {
|
|
1809
1802
|
if (isFirstMount.current) {
|
|
1810
1803
|
isFirstMount.current = false;
|
|
1811
1804
|
return;
|
|
@@ -1822,8 +1815,8 @@ function scrollToElement(id) {
|
|
|
1822
1815
|
var CUT_ID = "CollapsibleDetails";
|
|
1823
1816
|
var CollapsibleDetails = (props) => {
|
|
1824
1817
|
const { children, id = CUT_ID, onClick, isExpanded: isExpandedProp = false, text: textProp, loading, noScroll, ...rest } = props;
|
|
1825
|
-
const [isExpanded, setIsExpanded] =
|
|
1826
|
-
const handleClick =
|
|
1818
|
+
const [isExpanded, setIsExpanded] = React29__namespace.default.useState(isExpandedProp);
|
|
1819
|
+
const handleClick = React29__namespace.default.useCallback((event) => {
|
|
1827
1820
|
setIsExpanded((flag) => !flag);
|
|
1828
1821
|
if (!noScroll) {
|
|
1829
1822
|
scrollToElement(id);
|
|
@@ -1854,11 +1847,11 @@ var CollapsibleDetails = (props) => {
|
|
|
1854
1847
|
var CollapsibleList = (props) => {
|
|
1855
1848
|
const CUT_LENGTH = 3;
|
|
1856
1849
|
const { items, renderItem, triggerProps, cutLength = CUT_LENGTH, text: textProp, defaultExpanded = false, className, ...rest } = props;
|
|
1857
|
-
const [isExpanded, setIsExpanded] =
|
|
1858
|
-
|
|
1850
|
+
const [isExpanded, setIsExpanded] = React29__namespace.default.useState(defaultExpanded);
|
|
1851
|
+
React29__namespace.default.useEffect(() => {
|
|
1859
1852
|
setIsExpanded(defaultExpanded);
|
|
1860
1853
|
}, [defaultExpanded]);
|
|
1861
|
-
const handleToggle =
|
|
1854
|
+
const handleToggle = React29__namespace.default.useCallback(() => {
|
|
1862
1855
|
setIsExpanded((flag) => !flag);
|
|
1863
1856
|
}, []);
|
|
1864
1857
|
const text = isExpanded ? textProp?.[1] ?? "Hide" : textProp?.[0] ?? "Show all";
|
|
@@ -1875,10 +1868,10 @@ var CollapsibleList = (props) => {
|
|
|
1875
1868
|
) })
|
|
1876
1869
|
] }) });
|
|
1877
1870
|
};
|
|
1878
|
-
var ColorModeContext =
|
|
1871
|
+
var ColorModeContext = React29__namespace.createContext(void 0);
|
|
1879
1872
|
function ColorModeProvider(props) {
|
|
1880
1873
|
const { children, defaultTheme = "light", value: controlledValue, onValueChange } = props;
|
|
1881
|
-
const [internalMode, setInternalMode] =
|
|
1874
|
+
const [internalMode, setInternalMode] = React29__namespace.useState(() => {
|
|
1882
1875
|
if (controlledValue === "dark" || controlledValue === "light") {
|
|
1883
1876
|
return controlledValue;
|
|
1884
1877
|
}
|
|
@@ -1888,7 +1881,7 @@ function ColorModeProvider(props) {
|
|
|
1888
1881
|
return defaultTheme === "dark" ? "dark" : "light";
|
|
1889
1882
|
});
|
|
1890
1883
|
const colorMode = controlledValue === "dark" || controlledValue === "light" ? controlledValue : internalMode;
|
|
1891
|
-
const setColorMode =
|
|
1884
|
+
const setColorMode = React29__namespace.useCallback((mode) => {
|
|
1892
1885
|
const resolved = mode === "dark" ? "dark" : "light";
|
|
1893
1886
|
setInternalMode(resolved);
|
|
1894
1887
|
onValueChange?.(resolved);
|
|
@@ -1897,19 +1890,19 @@ function ColorModeProvider(props) {
|
|
|
1897
1890
|
document.documentElement.classList.toggle("light", resolved === "light");
|
|
1898
1891
|
}
|
|
1899
1892
|
}, [onValueChange]);
|
|
1900
|
-
const toggleColorMode =
|
|
1893
|
+
const toggleColorMode = React29__namespace.useCallback(() => {
|
|
1901
1894
|
setColorMode(colorMode === "dark" ? "light" : "dark");
|
|
1902
1895
|
}, [colorMode, setColorMode]);
|
|
1903
|
-
const ctx =
|
|
1896
|
+
const ctx = React29__namespace.useMemo(
|
|
1904
1897
|
() => ({ colorMode, setColorMode, toggleColorMode }),
|
|
1905
1898
|
[colorMode, setColorMode, toggleColorMode]
|
|
1906
1899
|
);
|
|
1907
1900
|
return /* @__PURE__ */ jsxRuntime.jsx(ColorModeContext.Provider, { value: ctx, children });
|
|
1908
1901
|
}
|
|
1909
1902
|
function useColorMode() {
|
|
1910
|
-
const ctx =
|
|
1903
|
+
const ctx = React29__namespace.useContext(ColorModeContext);
|
|
1911
1904
|
if (!ctx) {
|
|
1912
|
-
const [mode, setMode] =
|
|
1905
|
+
const [mode, setMode] = React29__namespace.useState(() => {
|
|
1913
1906
|
if (typeof document !== "undefined" && document.documentElement.classList.contains("dark")) {
|
|
1914
1907
|
return "dark";
|
|
1915
1908
|
}
|
|
@@ -1953,9 +1946,9 @@ function BackToButton({ onClick }) {
|
|
|
1953
1946
|
}
|
|
1954
1947
|
);
|
|
1955
1948
|
}
|
|
1956
|
-
var DialogSizeContext =
|
|
1949
|
+
var DialogSizeContext = React29__namespace.createContext({ size: "md" });
|
|
1957
1950
|
function useDialogSizeContext() {
|
|
1958
|
-
return
|
|
1951
|
+
return React29__namespace.useContext(DialogSizeContext);
|
|
1959
1952
|
}
|
|
1960
1953
|
var CONTENT_SIZE_MAP = {
|
|
1961
1954
|
sm: "max-w-[400px]",
|
|
@@ -1987,13 +1980,13 @@ var DialogRoot = ({
|
|
|
1987
1980
|
modal = true
|
|
1988
1981
|
// motionPreset is intentionally unused -- kept for API compat
|
|
1989
1982
|
}) => {
|
|
1990
|
-
const handleOpenChange =
|
|
1983
|
+
const handleOpenChange = React29__namespace.useCallback(
|
|
1991
1984
|
(nextOpen) => {
|
|
1992
1985
|
onOpenChange?.({ open: nextOpen });
|
|
1993
1986
|
},
|
|
1994
1987
|
[onOpenChange]
|
|
1995
1988
|
);
|
|
1996
|
-
const ctx =
|
|
1989
|
+
const ctx = React29__namespace.useMemo(() => ({ size }), [size]);
|
|
1997
1990
|
return /* @__PURE__ */ jsxRuntime.jsx(DialogSizeContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1998
1991
|
dialog.Dialog,
|
|
1999
1992
|
{
|
|
@@ -2005,7 +1998,7 @@ var DialogRoot = ({
|
|
|
2005
1998
|
}
|
|
2006
1999
|
) });
|
|
2007
2000
|
};
|
|
2008
|
-
var DialogContent =
|
|
2001
|
+
var DialogContent = React29__namespace.forwardRef(function DialogContent2(props, ref) {
|
|
2009
2002
|
const {
|
|
2010
2003
|
children,
|
|
2011
2004
|
portalled: _portalled = true,
|
|
@@ -2062,11 +2055,11 @@ var DialogContent = React30__namespace.forwardRef(function DialogContent2(props,
|
|
|
2062
2055
|
)
|
|
2063
2056
|
] });
|
|
2064
2057
|
});
|
|
2065
|
-
var DialogCloseTrigger =
|
|
2058
|
+
var DialogCloseTrigger = React29__namespace.forwardRef(function DialogCloseTrigger2(props, ref) {
|
|
2066
2059
|
const { className, ...rest } = props;
|
|
2067
2060
|
return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { ref, className, ...rest, children: props.children }) });
|
|
2068
2061
|
});
|
|
2069
|
-
var DialogHeader =
|
|
2062
|
+
var DialogHeader = React29__namespace.forwardRef(function DialogHeader2(props, ref) {
|
|
2070
2063
|
const { startElement: startElementProp, onBackToClick, className, children, ...rest } = props;
|
|
2071
2064
|
const startElement = startElementProp ?? (onBackToClick ? /* @__PURE__ */ jsxRuntime.jsx(BackToButton, { onClick: onBackToClick }) : void 0);
|
|
2072
2065
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -2096,7 +2089,7 @@ var DialogHeader = React30__namespace.forwardRef(function DialogHeader2(props, r
|
|
|
2096
2089
|
}
|
|
2097
2090
|
);
|
|
2098
2091
|
});
|
|
2099
|
-
var DialogBody =
|
|
2092
|
+
var DialogBody = React29__namespace.forwardRef(function DialogBody2({ className, pt, display, flexDir, style: styleProp, ...props }, ref) {
|
|
2100
2093
|
const bodyStyle = {
|
|
2101
2094
|
...styleProp,
|
|
2102
2095
|
...pt !== void 0 ? { paddingTop: typeof pt === "number" ? `${pt * 4}px` : pt } : {},
|
|
@@ -2113,7 +2106,7 @@ var DialogBody = React30__namespace.forwardRef(function DialogBody2({ className,
|
|
|
2113
2106
|
}
|
|
2114
2107
|
);
|
|
2115
2108
|
});
|
|
2116
|
-
var DialogFooter =
|
|
2109
|
+
var DialogFooter = React29__namespace.forwardRef(function DialogFooter2({ className, ...props }, ref) {
|
|
2117
2110
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2118
2111
|
"div",
|
|
2119
2112
|
{
|
|
@@ -2128,8 +2121,8 @@ var DialogTitle = dialog.Dialog.Title;
|
|
|
2128
2121
|
var DialogDescription = dialog.Dialog.Description;
|
|
2129
2122
|
var DialogTrigger = dialog.Dialog.Trigger;
|
|
2130
2123
|
var DialogActionTrigger = dialog.Dialog.Close;
|
|
2131
|
-
var DrawerPlacementContext =
|
|
2132
|
-
var DrawerSizeContext =
|
|
2124
|
+
var DrawerPlacementContext = React29__namespace.createContext("right");
|
|
2125
|
+
var DrawerSizeContext = React29__namespace.createContext("md");
|
|
2133
2126
|
var DrawerRoot = (props) => {
|
|
2134
2127
|
const {
|
|
2135
2128
|
children,
|
|
@@ -2140,7 +2133,7 @@ var DrawerRoot = (props) => {
|
|
|
2140
2133
|
modal = true,
|
|
2141
2134
|
size = "md"
|
|
2142
2135
|
} = props;
|
|
2143
|
-
const handleOpenChange =
|
|
2136
|
+
const handleOpenChange = React29__namespace.useCallback((nextOpen) => {
|
|
2144
2137
|
onOpenChange?.({ open: nextOpen });
|
|
2145
2138
|
}, [onOpenChange]);
|
|
2146
2139
|
return /* @__PURE__ */ jsxRuntime.jsx(DrawerPlacementContext.Provider, { value: placement, children: /* @__PURE__ */ jsxRuntime.jsx(DrawerSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -2182,11 +2175,11 @@ var SIZE_CLASSES6 = {
|
|
|
2182
2175
|
top: { xs: "h-40", sm: "h-60", md: "h-80", lg: "h-96", xl: "h-[480px]", full: "h-screen" },
|
|
2183
2176
|
bottom: { xs: "h-40", sm: "h-60", md: "h-80", lg: "h-96", xl: "h-[480px]", full: "h-screen" }
|
|
2184
2177
|
};
|
|
2185
|
-
var DrawerContent =
|
|
2178
|
+
var DrawerContent = React29__namespace.forwardRef(
|
|
2186
2179
|
function DrawerContent2(props, ref) {
|
|
2187
2180
|
const { children, portalled = true, portalRef, offset: _offset, backdrop = true, className, ...rest } = props;
|
|
2188
|
-
const placement =
|
|
2189
|
-
const size =
|
|
2181
|
+
const placement = React29__namespace.useContext(DrawerPlacementContext);
|
|
2182
|
+
const size = React29__namespace.useContext(DrawerSizeContext);
|
|
2190
2183
|
const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
2191
2184
|
backdrop && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2192
2185
|
RadixDialog__namespace.Overlay,
|
|
@@ -2219,7 +2212,7 @@ var DrawerContent = React30__namespace.forwardRef(
|
|
|
2219
2212
|
return content;
|
|
2220
2213
|
}
|
|
2221
2214
|
);
|
|
2222
|
-
var DrawerCloseTrigger =
|
|
2215
|
+
var DrawerCloseTrigger = React29__namespace.forwardRef(function DrawerCloseTrigger2(props, ref) {
|
|
2223
2216
|
return /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2224
2217
|
CloseButton,
|
|
2225
2218
|
{
|
|
@@ -2233,17 +2226,17 @@ var DrawerTrigger = (props) => {
|
|
|
2233
2226
|
const { asChild = true, ...rest } = props;
|
|
2234
2227
|
return /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Trigger, { asChild, ...rest });
|
|
2235
2228
|
};
|
|
2236
|
-
var DrawerHeader =
|
|
2229
|
+
var DrawerHeader = React29__namespace.forwardRef(
|
|
2237
2230
|
function DrawerHeader2({ className, ...props }, ref) {
|
|
2238
2231
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex flex-col gap-1.5 p-6 pb-0", className), ...props });
|
|
2239
2232
|
}
|
|
2240
2233
|
);
|
|
2241
|
-
var DrawerBody =
|
|
2234
|
+
var DrawerBody = React29__namespace.forwardRef(
|
|
2242
2235
|
function DrawerBody2({ className, ...props }, ref) {
|
|
2243
2236
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex-1 overflow-auto p-6", className), ...props });
|
|
2244
2237
|
}
|
|
2245
2238
|
);
|
|
2246
|
-
var DrawerFooter =
|
|
2239
|
+
var DrawerFooter = React29__namespace.forwardRef(
|
|
2247
2240
|
function DrawerFooter2({ className, ...props }, ref) {
|
|
2248
2241
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex items-center justify-end gap-2 p-6 pt-0", className), ...props });
|
|
2249
2242
|
}
|
|
@@ -2256,7 +2249,7 @@ function upperFirst(str) {
|
|
|
2256
2249
|
return str.charAt(0).toUpperCase() + str.slice(1);
|
|
2257
2250
|
}
|
|
2258
2251
|
var ICONS = {};
|
|
2259
|
-
var EmptyState =
|
|
2252
|
+
var EmptyState = React29__namespace.forwardRef(
|
|
2260
2253
|
function EmptyState2(props, ref) {
|
|
2261
2254
|
const { title, description, term, type = "query", icon, children, className, ...rest } = props;
|
|
2262
2255
|
const titleContent = (() => {
|
|
@@ -2316,7 +2309,7 @@ function getComponentDisplayName(type) {
|
|
|
2316
2309
|
if ("displayName" in type) return type.displayName;
|
|
2317
2310
|
return void 0;
|
|
2318
2311
|
}
|
|
2319
|
-
var Field =
|
|
2312
|
+
var Field = React29__namespace.forwardRef(
|
|
2320
2313
|
function Field2(props, ref) {
|
|
2321
2314
|
const {
|
|
2322
2315
|
label,
|
|
@@ -2368,14 +2361,14 @@ var Field = React30__namespace.forwardRef(
|
|
|
2368
2361
|
}
|
|
2369
2362
|
);
|
|
2370
2363
|
const helperTextElement = helperText ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1.5 text-xs text-[var(--color-text-secondary,theme(colors.gray.400))]", children: helperText }) : null;
|
|
2371
|
-
const child2 =
|
|
2364
|
+
const child2 = React29__namespace.Children.only(children);
|
|
2372
2365
|
const isInputGroup = getComponentDisplayName(child2.type) === "InputGroup";
|
|
2373
2366
|
if (isInputGroup) {
|
|
2374
|
-
const inputElement2 =
|
|
2375
|
-
|
|
2367
|
+
const inputElement2 = React29__namespace.cloneElement(
|
|
2368
|
+
React29__namespace.Children.only(child2.props.children),
|
|
2376
2369
|
injectedProps2
|
|
2377
2370
|
);
|
|
2378
|
-
const groupInputElement =
|
|
2371
|
+
const groupInputElement = React29__namespace.cloneElement(
|
|
2379
2372
|
child2,
|
|
2380
2373
|
{},
|
|
2381
2374
|
inputElement2,
|
|
@@ -2398,7 +2391,7 @@ var Field = React30__namespace.forwardRef(
|
|
|
2398
2391
|
}
|
|
2399
2392
|
);
|
|
2400
2393
|
}
|
|
2401
|
-
const inputElement =
|
|
2394
|
+
const inputElement = React29__namespace.cloneElement(child2, injectedProps2);
|
|
2402
2395
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2403
2396
|
"div",
|
|
2404
2397
|
{
|
|
@@ -2420,8 +2413,8 @@ var Field = React30__namespace.forwardRef(
|
|
|
2420
2413
|
const injectedProps = {
|
|
2421
2414
|
size
|
|
2422
2415
|
};
|
|
2423
|
-
const child =
|
|
2424
|
-
const clonedChild =
|
|
2416
|
+
const child = React29__namespace.Children.only(children);
|
|
2417
|
+
const clonedChild = React29__namespace.cloneElement(child, injectedProps);
|
|
2425
2418
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2426
2419
|
"div",
|
|
2427
2420
|
{
|
|
@@ -2464,7 +2457,7 @@ var LEVEL_CLASSES = {
|
|
|
2464
2457
|
"3": "text-[14px] leading-[20px] font-semibold lg:text-[18px] lg:leading-[24px] lg:font-medium"
|
|
2465
2458
|
};
|
|
2466
2459
|
var BASE_CLASSES4 = "font-heading text-heading";
|
|
2467
|
-
var Heading =
|
|
2460
|
+
var Heading = React29__namespace.default.forwardRef(
|
|
2468
2461
|
function Heading2({ level, className, mb, size: _size, style: styleProp, ...rest }, ref) {
|
|
2469
2462
|
const Tag3 = level ? LEVEL_TAG[level] : "h2";
|
|
2470
2463
|
const levelClasses = level ? LEVEL_CLASSES[level] : void 0;
|
|
@@ -2550,7 +2543,7 @@ var ICON_SIZE_CLASSES = {
|
|
|
2550
2543
|
md: "[&_svg]:size-5"
|
|
2551
2544
|
};
|
|
2552
2545
|
var SP2 = 4;
|
|
2553
|
-
var IconButton =
|
|
2546
|
+
var IconButton = React29__namespace.forwardRef(
|
|
2554
2547
|
function IconButton2(props, ref) {
|
|
2555
2548
|
const {
|
|
2556
2549
|
size,
|
|
@@ -2601,7 +2594,7 @@ var IconButton = React30__namespace.forwardRef(
|
|
|
2601
2594
|
ref,
|
|
2602
2595
|
size,
|
|
2603
2596
|
disabled: !loadingSkeleton && (loading || disabled) || void 0,
|
|
2604
|
-
render: _as ?
|
|
2597
|
+
render: _as ? React29__namespace.createElement(_as) : void 0,
|
|
2605
2598
|
className: combinedClassName,
|
|
2606
2599
|
style: mergedStyle,
|
|
2607
2600
|
...expanded ? { "data-expanded": true } : {},
|
|
@@ -2772,31 +2765,31 @@ function extractStyleProps(props) {
|
|
|
2772
2765
|
}
|
|
2773
2766
|
return { styleProps, rest };
|
|
2774
2767
|
}
|
|
2775
|
-
var Image2 =
|
|
2768
|
+
var Image2 = React29__namespace.default.forwardRef(
|
|
2776
2769
|
function Image3(props, ref) {
|
|
2777
2770
|
const { fallback, src, onLoad, onError, skeletonWidth, skeletonHeight, alt, className, style: styleProp, ...allRest } = props;
|
|
2778
2771
|
const { styleProps, rest: extraProps } = extractStyleProps(allRest);
|
|
2779
|
-
const [loading, setLoading] =
|
|
2780
|
-
const [error, setError] =
|
|
2781
|
-
const handleLoadError =
|
|
2772
|
+
const [loading, setLoading] = React29__namespace.default.useState(true);
|
|
2773
|
+
const [error, setError] = React29__namespace.default.useState(false);
|
|
2774
|
+
const handleLoadError = React29__namespace.default.useCallback((event) => {
|
|
2782
2775
|
setError(true);
|
|
2783
2776
|
setLoading(false);
|
|
2784
2777
|
onError?.(event);
|
|
2785
2778
|
}, [onError]);
|
|
2786
|
-
const handleLoadSuccess =
|
|
2779
|
+
const handleLoadSuccess = React29__namespace.default.useCallback((event) => {
|
|
2787
2780
|
setLoading(false);
|
|
2788
2781
|
onLoad?.(event);
|
|
2789
2782
|
}, [onLoad]);
|
|
2790
2783
|
const passthroughProps = allRest;
|
|
2791
2784
|
if (!src && fallback) {
|
|
2792
|
-
if (
|
|
2793
|
-
return
|
|
2785
|
+
if (React29__namespace.default.isValidElement(fallback)) {
|
|
2786
|
+
return React29__namespace.default.cloneElement(fallback, passthroughProps);
|
|
2794
2787
|
}
|
|
2795
2788
|
return fallback;
|
|
2796
2789
|
}
|
|
2797
2790
|
if (error) {
|
|
2798
|
-
if (
|
|
2799
|
-
return
|
|
2791
|
+
if (React29__namespace.default.isValidElement(fallback)) {
|
|
2792
|
+
return React29__namespace.default.cloneElement(fallback, passthroughProps);
|
|
2800
2793
|
}
|
|
2801
2794
|
return fallback;
|
|
2802
2795
|
}
|
|
@@ -2852,7 +2845,7 @@ var INPUT_VARIANT_CLASSES = {
|
|
|
2852
2845
|
filled: "border-0 bg-[var(--color-input-filled-bg,theme(colors.gray.100))]",
|
|
2853
2846
|
unstyled: "border-0 bg-transparent p-0 h-auto"
|
|
2854
2847
|
};
|
|
2855
|
-
var Input =
|
|
2848
|
+
var Input = React29__namespace.default.forwardRef(
|
|
2856
2849
|
({ size = "md", variant = "outline", className, ...rest }, ref) => {
|
|
2857
2850
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2858
2851
|
"input",
|
|
@@ -2870,7 +2863,7 @@ function getComponentDisplayName2(type) {
|
|
|
2870
2863
|
if ("displayName" in type) return type.displayName;
|
|
2871
2864
|
return void 0;
|
|
2872
2865
|
}
|
|
2873
|
-
var InputGroup =
|
|
2866
|
+
var InputGroup = React29__namespace.forwardRef(
|
|
2874
2867
|
function InputGroup2(props, ref) {
|
|
2875
2868
|
const {
|
|
2876
2869
|
startElement,
|
|
@@ -2883,11 +2876,11 @@ var InputGroup = React30__namespace.forwardRef(
|
|
|
2883
2876
|
className,
|
|
2884
2877
|
...rest
|
|
2885
2878
|
} = props;
|
|
2886
|
-
const startElementRef =
|
|
2887
|
-
const endElementRef =
|
|
2888
|
-
const groupRef =
|
|
2889
|
-
const [inlinePaddings, setInlinePaddings] =
|
|
2890
|
-
const calculateInlinePaddings =
|
|
2879
|
+
const startElementRef = React29__namespace.useRef(null);
|
|
2880
|
+
const endElementRef = React29__namespace.useRef(null);
|
|
2881
|
+
const groupRef = React29__namespace.useRef(null);
|
|
2882
|
+
const [inlinePaddings, setInlinePaddings] = React29__namespace.useState();
|
|
2883
|
+
const calculateInlinePaddings = React29__namespace.useCallback(() => {
|
|
2891
2884
|
const startWidth = startElementRef.current?.getBoundingClientRect().width ?? 0;
|
|
2892
2885
|
const endWidth = endElementRef.current?.getBoundingClientRect().width ?? 0;
|
|
2893
2886
|
setInlinePaddings({
|
|
@@ -2895,7 +2888,7 @@ var InputGroup = React30__namespace.forwardRef(
|
|
|
2895
2888
|
end: endWidth
|
|
2896
2889
|
});
|
|
2897
2890
|
}, []);
|
|
2898
|
-
|
|
2891
|
+
React29__namespace.useEffect(() => {
|
|
2899
2892
|
if (!groupRef.current) return;
|
|
2900
2893
|
let timeoutId;
|
|
2901
2894
|
const intersectionObserver = new IntersectionObserver(
|
|
@@ -2915,7 +2908,7 @@ var InputGroup = React30__namespace.forwardRef(
|
|
|
2915
2908
|
}
|
|
2916
2909
|
};
|
|
2917
2910
|
}, [calculateInlinePaddings]);
|
|
2918
|
-
|
|
2911
|
+
React29__namespace.useEffect(() => {
|
|
2919
2912
|
calculateInlinePaddings();
|
|
2920
2913
|
const resizeHandler = esToolkit.debounce(calculateInlinePaddings, 300);
|
|
2921
2914
|
const resizeObserver = new ResizeObserver(resizeHandler);
|
|
@@ -2926,7 +2919,7 @@ var InputGroup = React30__namespace.forwardRef(
|
|
|
2926
2919
|
resizeObserver.disconnect();
|
|
2927
2920
|
};
|
|
2928
2921
|
}, [calculateInlinePaddings]);
|
|
2929
|
-
const combinedRef =
|
|
2922
|
+
const combinedRef = React29__namespace.useCallback((node) => {
|
|
2930
2923
|
groupRef.current = node;
|
|
2931
2924
|
if (typeof ref === "function") {
|
|
2932
2925
|
ref(node);
|
|
@@ -2955,11 +2948,11 @@ var InputGroup = React30__namespace.forwardRef(
|
|
|
2955
2948
|
children: startElement
|
|
2956
2949
|
}
|
|
2957
2950
|
),
|
|
2958
|
-
|
|
2951
|
+
React29__namespace.Children.map(children, (child) => {
|
|
2959
2952
|
if (getComponentDisplayName2(child.type) !== "FieldInput") {
|
|
2960
2953
|
return child;
|
|
2961
2954
|
}
|
|
2962
|
-
return
|
|
2955
|
+
return React29__namespace.cloneElement(child, {
|
|
2963
2956
|
...startElement && { ps: startOffset ?? (inlinePaddings?.start ? `${inlinePaddings.start}px` : void 0) },
|
|
2964
2957
|
...endElement && { pe: endOffset ?? (inlinePaddings?.end ? `${inlinePaddings.end}px` : void 0) },
|
|
2965
2958
|
// hide input value and placeholder for the first render
|
|
@@ -3000,7 +2993,7 @@ function parsePlacement(placement) {
|
|
|
3000
2993
|
}
|
|
3001
2994
|
return { side, align };
|
|
3002
2995
|
}
|
|
3003
|
-
var PositioningContext =
|
|
2996
|
+
var PositioningContext = React29__namespace.createContext({
|
|
3004
2997
|
side: "bottom",
|
|
3005
2998
|
align: "start",
|
|
3006
2999
|
sideOffset: 4,
|
|
@@ -3030,13 +3023,13 @@ var MenuRoot = (props) => {
|
|
|
3030
3023
|
}
|
|
3031
3024
|
};
|
|
3032
3025
|
const { side, align } = parsePlacement(mergedPositioning.placement);
|
|
3033
|
-
const positioningValue =
|
|
3026
|
+
const positioningValue = React29__namespace.useMemo(() => ({
|
|
3034
3027
|
side,
|
|
3035
3028
|
align,
|
|
3036
3029
|
sideOffset: mergedPositioning.offset?.mainAxis ?? 4,
|
|
3037
3030
|
alignOffset: mergedPositioning.offset?.crossAxis ?? 0
|
|
3038
3031
|
}), [side, align, mergedPositioning.offset?.mainAxis, mergedPositioning.offset?.crossAxis]);
|
|
3039
|
-
const handleOpenChange =
|
|
3032
|
+
const handleOpenChange = React29__namespace.useCallback((isOpen) => {
|
|
3040
3033
|
onOpenChange?.({ open: isOpen });
|
|
3041
3034
|
}, [onOpenChange]);
|
|
3042
3035
|
return /* @__PURE__ */ jsxRuntime.jsx(PositioningContext.Provider, { value: positioningValue, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -3050,13 +3043,13 @@ var MenuRoot = (props) => {
|
|
|
3050
3043
|
}
|
|
3051
3044
|
) });
|
|
3052
3045
|
};
|
|
3053
|
-
var MenuTrigger =
|
|
3046
|
+
var MenuTrigger = React29__namespace.forwardRef(function MenuTrigger2(props, ref) {
|
|
3054
3047
|
const { asChild = false, ...rest } = props;
|
|
3055
3048
|
return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Trigger, { asChild, ref, ...rest });
|
|
3056
3049
|
});
|
|
3057
|
-
var MenuContent =
|
|
3050
|
+
var MenuContent = React29__namespace.forwardRef(function MenuContent2(props, ref) {
|
|
3058
3051
|
const { portalled = true, portalRef, className, zIndex, minW, style, ...rest } = props;
|
|
3059
|
-
const positioning =
|
|
3052
|
+
const positioning = React29__namespace.useContext(PositioningContext);
|
|
3060
3053
|
const mergedStyle = {
|
|
3061
3054
|
...style,
|
|
3062
3055
|
...zIndex !== void 0 ? { zIndex: typeof zIndex === "string" ? `var(--z-index-${zIndex}, ${zIndex})` : zIndex } : {},
|
|
@@ -3091,7 +3084,7 @@ var MenuContent = React30__namespace.forwardRef(function MenuContent2(props, ref
|
|
|
3091
3084
|
}
|
|
3092
3085
|
return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Portal, { container: portalRef?.current ?? void 0, children: content });
|
|
3093
3086
|
});
|
|
3094
|
-
var MenuItem =
|
|
3087
|
+
var MenuItem = React29__namespace.forwardRef(function MenuItem2(props, ref) {
|
|
3095
3088
|
const { className, value: _value, asChild, closeOnSelect: _closeOnSelect, disabled, children, onClick, ...rest } = props;
|
|
3096
3089
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3097
3090
|
DropdownMenu__namespace.Item,
|
|
@@ -3113,11 +3106,11 @@ var MenuItem = React30__namespace.forwardRef(function MenuItem2(props, ref) {
|
|
|
3113
3106
|
}
|
|
3114
3107
|
);
|
|
3115
3108
|
});
|
|
3116
|
-
var MenuItemText =
|
|
3109
|
+
var MenuItemText = React29__namespace.forwardRef(function MenuItemText2(props, ref) {
|
|
3117
3110
|
const { className, ...rest } = props;
|
|
3118
3111
|
return /* @__PURE__ */ jsxRuntime.jsx("span", { ref, className: cn("flex-1", className), ...rest });
|
|
3119
3112
|
});
|
|
3120
|
-
|
|
3113
|
+
React29__namespace.forwardRef(function MenuItemCommand2(props, ref) {
|
|
3121
3114
|
const { className, ...rest } = props;
|
|
3122
3115
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3123
3116
|
"span",
|
|
@@ -3128,7 +3121,7 @@ React30__namespace.forwardRef(function MenuItemCommand2(props, ref) {
|
|
|
3128
3121
|
}
|
|
3129
3122
|
);
|
|
3130
3123
|
});
|
|
3131
|
-
var MenuSeparator =
|
|
3124
|
+
var MenuSeparator = React29__namespace.forwardRef(function MenuSeparator2(props, ref) {
|
|
3132
3125
|
const { className, ...rest } = props;
|
|
3133
3126
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3134
3127
|
DropdownMenu__namespace.Separator,
|
|
@@ -3139,14 +3132,14 @@ var MenuSeparator = React30__namespace.forwardRef(function MenuSeparator2(props,
|
|
|
3139
3132
|
}
|
|
3140
3133
|
);
|
|
3141
3134
|
});
|
|
3142
|
-
var MenuItemGroup =
|
|
3135
|
+
var MenuItemGroup = React29__namespace.forwardRef(function MenuItemGroup2(props, ref) {
|
|
3143
3136
|
const { title, children, className, ...rest } = props;
|
|
3144
3137
|
return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu__namespace.Group, { ref, className, ...rest, children: [
|
|
3145
3138
|
title && /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Label, { className: "px-2 py-1.5 text-xs font-semibold select-none opacity-60", children: title }),
|
|
3146
3139
|
children
|
|
3147
3140
|
] });
|
|
3148
3141
|
});
|
|
3149
|
-
var MenuArrow =
|
|
3142
|
+
var MenuArrow = React29__namespace.forwardRef(function MenuArrow2(props, ref) {
|
|
3150
3143
|
const { className, ...rest } = props;
|
|
3151
3144
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3152
3145
|
DropdownMenu__namespace.Arrow,
|
|
@@ -3157,7 +3150,7 @@ var MenuArrow = React30__namespace.forwardRef(function MenuArrow2(props, ref) {
|
|
|
3157
3150
|
}
|
|
3158
3151
|
);
|
|
3159
3152
|
});
|
|
3160
|
-
var MenuCheckboxItem =
|
|
3153
|
+
var MenuCheckboxItem = React29__namespace.forwardRef(function MenuCheckboxItem2(props, ref) {
|
|
3161
3154
|
const { className, children, checked, onCheckedChange, onClick, ...rest } = props;
|
|
3162
3155
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3163
3156
|
DropdownMenu__namespace.CheckboxItem,
|
|
@@ -3181,7 +3174,7 @@ var MenuCheckboxItem = React30__namespace.forwardRef(function MenuCheckboxItem2(
|
|
|
3181
3174
|
}
|
|
3182
3175
|
);
|
|
3183
3176
|
});
|
|
3184
|
-
var MenuRadioItemGroup =
|
|
3177
|
+
var MenuRadioItemGroup = React29__namespace.forwardRef(function MenuRadioItemGroup2(props, ref) {
|
|
3185
3178
|
const { value, onValueChange, ...rest } = props;
|
|
3186
3179
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3187
3180
|
DropdownMenu__namespace.RadioGroup,
|
|
@@ -3193,7 +3186,7 @@ var MenuRadioItemGroup = React30__namespace.forwardRef(function MenuRadioItemGro
|
|
|
3193
3186
|
}
|
|
3194
3187
|
);
|
|
3195
3188
|
});
|
|
3196
|
-
var MenuRadioItem =
|
|
3189
|
+
var MenuRadioItem = React29__namespace.forwardRef(function MenuRadioItem2(props, ref) {
|
|
3197
3190
|
const { className, children, value, onClick, ...rest } = props;
|
|
3198
3191
|
const { value: _v, ...radixRest } = rest;
|
|
3199
3192
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -3216,11 +3209,11 @@ var MenuRadioItem = React30__namespace.forwardRef(function MenuRadioItem2(props,
|
|
|
3216
3209
|
}
|
|
3217
3210
|
);
|
|
3218
3211
|
});
|
|
3219
|
-
|
|
3212
|
+
React29__namespace.forwardRef(function MenuContextTrigger2(props, ref) {
|
|
3220
3213
|
const { asChild: _asChild, ...rest } = props;
|
|
3221
3214
|
return /* @__PURE__ */ jsxRuntime.jsx("span", { ref, ...rest });
|
|
3222
3215
|
});
|
|
3223
|
-
var MenuTriggerItem =
|
|
3216
|
+
var MenuTriggerItem = React29__namespace.forwardRef(function MenuTriggerItem2(props, ref) {
|
|
3224
3217
|
const { startIcon, children, className, ...rest } = props;
|
|
3225
3218
|
return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Sub, { children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3226
3219
|
DropdownMenu__namespace.SubTrigger,
|
|
@@ -3255,7 +3248,7 @@ var INPUT_BASE2 = [
|
|
|
3255
3248
|
].join(" ");
|
|
3256
3249
|
var INPUT_FILLED = "border-[var(--color-input-border)]";
|
|
3257
3250
|
var INPUT_INVALID = "border-[var(--color-border-error)] hover:border-[var(--color-border-error)]";
|
|
3258
|
-
var PinInput =
|
|
3251
|
+
var PinInput = React29__namespace.forwardRef(
|
|
3259
3252
|
function PinInput2(props, ref) {
|
|
3260
3253
|
const {
|
|
3261
3254
|
count = 6,
|
|
@@ -3273,12 +3266,12 @@ var PinInput = React30__namespace.forwardRef(
|
|
|
3273
3266
|
bgColor,
|
|
3274
3267
|
className
|
|
3275
3268
|
} = props;
|
|
3276
|
-
const inputRefs =
|
|
3277
|
-
const values =
|
|
3269
|
+
const inputRefs = React29__namespace.useRef([]);
|
|
3270
|
+
const values = React29__namespace.useMemo(
|
|
3278
3271
|
() => controlledValue ?? Array.from({ length: count }).fill(""),
|
|
3279
3272
|
[controlledValue, count]
|
|
3280
3273
|
);
|
|
3281
|
-
const updateValue =
|
|
3274
|
+
const updateValue = React29__namespace.useCallback((index, char) => {
|
|
3282
3275
|
const next = [...values];
|
|
3283
3276
|
next[index] = char;
|
|
3284
3277
|
onValueChange?.({ value: next });
|
|
@@ -3286,11 +3279,11 @@ var PinInput = React30__namespace.forwardRef(
|
|
|
3286
3279
|
onValueComplete?.({ value: next });
|
|
3287
3280
|
}
|
|
3288
3281
|
}, [values, onValueChange, onValueComplete]);
|
|
3289
|
-
const focusInput =
|
|
3282
|
+
const focusInput = React29__namespace.useCallback((index) => {
|
|
3290
3283
|
const clamped = Math.max(0, Math.min(index, count - 1));
|
|
3291
3284
|
inputRefs.current[clamped]?.focus();
|
|
3292
3285
|
}, [count]);
|
|
3293
|
-
const handleInput =
|
|
3286
|
+
const handleInput = React29__namespace.useCallback((index, e) => {
|
|
3294
3287
|
const target = e.currentTarget;
|
|
3295
3288
|
const char = target.value.slice(-1);
|
|
3296
3289
|
updateValue(index, char);
|
|
@@ -3298,7 +3291,7 @@ var PinInput = React30__namespace.forwardRef(
|
|
|
3298
3291
|
focusInput(index + 1);
|
|
3299
3292
|
}
|
|
3300
3293
|
}, [count, updateValue, focusInput]);
|
|
3301
|
-
const handleKeyDown =
|
|
3294
|
+
const handleKeyDown = React29__namespace.useCallback((index, e) => {
|
|
3302
3295
|
if (e.key === "Backspace") {
|
|
3303
3296
|
if (values[index]) {
|
|
3304
3297
|
updateValue(index, "");
|
|
@@ -3315,7 +3308,7 @@ var PinInput = React30__namespace.forwardRef(
|
|
|
3315
3308
|
e.preventDefault();
|
|
3316
3309
|
}
|
|
3317
3310
|
}, [count, values, updateValue, focusInput]);
|
|
3318
|
-
const handlePaste =
|
|
3311
|
+
const handlePaste = React29__namespace.useCallback((e) => {
|
|
3319
3312
|
e.preventDefault();
|
|
3320
3313
|
const pasted = e.clipboardData.getData("text/plain").trim();
|
|
3321
3314
|
if (!pasted) {
|
|
@@ -3332,18 +3325,18 @@ var PinInput = React30__namespace.forwardRef(
|
|
|
3332
3325
|
}
|
|
3333
3326
|
focusInput(Math.min(chars.length, count - 1));
|
|
3334
3327
|
}, [count, values, onValueChange, onValueComplete, focusInput]);
|
|
3335
|
-
const handleFocus =
|
|
3328
|
+
const handleFocus = React29__namespace.useCallback((e) => {
|
|
3336
3329
|
e.currentTarget.select();
|
|
3337
3330
|
}, []);
|
|
3338
|
-
const handleNoop =
|
|
3331
|
+
const handleNoop = React29__namespace.useCallback(() => {
|
|
3339
3332
|
}, []);
|
|
3340
|
-
const setInputRef =
|
|
3333
|
+
const setInputRef = React29__namespace.useCallback((index) => (el) => {
|
|
3341
3334
|
inputRefs.current[index] = el;
|
|
3342
3335
|
}, []);
|
|
3343
|
-
const onInputAtIndex =
|
|
3336
|
+
const onInputAtIndex = React29__namespace.useCallback((index) => (e) => {
|
|
3344
3337
|
handleInput(index, e);
|
|
3345
3338
|
}, [handleInput]);
|
|
3346
|
-
const onKeyDownAtIndex =
|
|
3339
|
+
const onKeyDownAtIndex = React29__namespace.useCallback((index) => (e) => {
|
|
3347
3340
|
handleKeyDown(index, e);
|
|
3348
3341
|
}, [handleKeyDown]);
|
|
3349
3342
|
const bgStyle = bgColor ? { backgroundColor: `var(--color-${bgColor.replace(/\./g, "-")})` } : void 0;
|
|
@@ -3404,7 +3397,7 @@ function parsePlacement2(placement) {
|
|
|
3404
3397
|
}
|
|
3405
3398
|
return { side, align };
|
|
3406
3399
|
}
|
|
3407
|
-
var PositioningContext2 =
|
|
3400
|
+
var PositioningContext2 = React29__namespace.createContext({
|
|
3408
3401
|
side: "bottom",
|
|
3409
3402
|
align: "start",
|
|
3410
3403
|
sideOffset: 4,
|
|
@@ -3438,7 +3431,7 @@ var PopoverRoot = (props) => {
|
|
|
3438
3431
|
}
|
|
3439
3432
|
};
|
|
3440
3433
|
const { side, align } = parsePlacement2(mergedPositioning.placement);
|
|
3441
|
-
const positioningValue =
|
|
3434
|
+
const positioningValue = React29__namespace.useMemo(() => ({
|
|
3442
3435
|
side,
|
|
3443
3436
|
align,
|
|
3444
3437
|
sideOffset: mergedPositioning.offset?.mainAxis ?? 4,
|
|
@@ -3455,7 +3448,7 @@ var PopoverRoot = (props) => {
|
|
|
3455
3448
|
autoFocus,
|
|
3456
3449
|
closeOnInteractOutside
|
|
3457
3450
|
]);
|
|
3458
|
-
const handleOpenChange =
|
|
3451
|
+
const handleOpenChange = React29__namespace.useCallback((isOpen) => {
|
|
3459
3452
|
onOpenChange?.({ open: isOpen });
|
|
3460
3453
|
}, [onOpenChange]);
|
|
3461
3454
|
const placement = mergedPositioning.placement ?? "bottom-start";
|
|
@@ -3473,11 +3466,11 @@ var PopoverRoot = (props) => {
|
|
|
3473
3466
|
}
|
|
3474
3467
|
) });
|
|
3475
3468
|
};
|
|
3476
|
-
var PopoverTrigger =
|
|
3469
|
+
var PopoverTrigger = React29__namespace.forwardRef(function PopoverTrigger2(props, ref) {
|
|
3477
3470
|
const { asChild = true, ...rest } = props;
|
|
3478
3471
|
return /* @__PURE__ */ jsxRuntime.jsx(popover.Popover.Trigger, { asChild: asChild ? "except-style" : void 0, ref, ...rest });
|
|
3479
3472
|
});
|
|
3480
|
-
var PopoverContent =
|
|
3473
|
+
var PopoverContent = React29__namespace.forwardRef(function PopoverContent2(props, ref) {
|
|
3481
3474
|
const { portalled = true, portalRef: _portalRef, className, w, minW, maxW, paddingTop, style: styleProp, ...rest } = props;
|
|
3482
3475
|
const resolvedW = typeof w === "object" ? w.base ?? w.lg : w;
|
|
3483
3476
|
const contentStyle = {
|
|
@@ -3508,7 +3501,7 @@ var PopoverContent = React30__namespace.forwardRef(function PopoverContent2(prop
|
|
|
3508
3501
|
}
|
|
3509
3502
|
);
|
|
3510
3503
|
});
|
|
3511
|
-
var PopoverArrow =
|
|
3504
|
+
var PopoverArrow = React29__namespace.forwardRef(function PopoverArrow2(props, ref) {
|
|
3512
3505
|
const { className, ...rest } = props;
|
|
3513
3506
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3514
3507
|
popover.Popover.Arrow,
|
|
@@ -3520,7 +3513,7 @@ var PopoverArrow = React30__namespace.forwardRef(function PopoverArrow2(props, r
|
|
|
3520
3513
|
}
|
|
3521
3514
|
);
|
|
3522
3515
|
});
|
|
3523
|
-
var PopoverCloseTrigger =
|
|
3516
|
+
var PopoverCloseTrigger = React29__namespace.forwardRef(function PopoverCloseTrigger2(props, ref) {
|
|
3524
3517
|
const { className, ...rest } = props;
|
|
3525
3518
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3526
3519
|
popover.Popover.Close,
|
|
@@ -3534,14 +3527,14 @@ var PopoverCloseTrigger = React30__namespace.forwardRef(function PopoverCloseTri
|
|
|
3534
3527
|
}
|
|
3535
3528
|
);
|
|
3536
3529
|
});
|
|
3537
|
-
var PopoverCloseTriggerWrapper =
|
|
3530
|
+
var PopoverCloseTriggerWrapper = React29__namespace.forwardRef(function PopoverCloseTriggerWrapper2(props, ref) {
|
|
3538
3531
|
const { disabled, children, ...rest } = props;
|
|
3539
3532
|
if (disabled) {
|
|
3540
3533
|
return children;
|
|
3541
3534
|
}
|
|
3542
3535
|
return /* @__PURE__ */ jsxRuntime.jsx(popover.Popover.Close, { ref, ...rest, asChild: true, children });
|
|
3543
3536
|
});
|
|
3544
|
-
var PopoverBody =
|
|
3537
|
+
var PopoverBody = React29__namespace.forwardRef(function PopoverBody2(props, ref) {
|
|
3545
3538
|
const {
|
|
3546
3539
|
className,
|
|
3547
3540
|
style: styleProp,
|
|
@@ -3579,7 +3572,7 @@ var PopoverBody = React30__namespace.forwardRef(function PopoverBody2(props, ref
|
|
|
3579
3572
|
}
|
|
3580
3573
|
);
|
|
3581
3574
|
});
|
|
3582
|
-
var PopoverHeader =
|
|
3575
|
+
var PopoverHeader = React29__namespace.forwardRef(function PopoverHeader2(props, ref) {
|
|
3583
3576
|
const { className, ...rest } = props;
|
|
3584
3577
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3585
3578
|
"div",
|
|
@@ -3590,7 +3583,7 @@ var PopoverHeader = React30__namespace.forwardRef(function PopoverHeader2(props,
|
|
|
3590
3583
|
}
|
|
3591
3584
|
);
|
|
3592
3585
|
});
|
|
3593
|
-
var PopoverFooter =
|
|
3586
|
+
var PopoverFooter = React29__namespace.forwardRef(function PopoverFooter2(props, ref) {
|
|
3594
3587
|
const { className, ...rest } = props;
|
|
3595
3588
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3596
3589
|
"div",
|
|
@@ -3601,7 +3594,7 @@ var PopoverFooter = React30__namespace.forwardRef(function PopoverFooter2(props,
|
|
|
3601
3594
|
}
|
|
3602
3595
|
);
|
|
3603
3596
|
});
|
|
3604
|
-
var PopoverTitle =
|
|
3597
|
+
var PopoverTitle = React29__namespace.forwardRef(function PopoverTitle2(props, ref) {
|
|
3605
3598
|
const { className, ...rest } = props;
|
|
3606
3599
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3607
3600
|
"h3",
|
|
@@ -3612,7 +3605,7 @@ var PopoverTitle = React30__namespace.forwardRef(function PopoverTitle2(props, r
|
|
|
3612
3605
|
}
|
|
3613
3606
|
);
|
|
3614
3607
|
});
|
|
3615
|
-
var PopoverDescription =
|
|
3608
|
+
var PopoverDescription = React29__namespace.forwardRef(function PopoverDescription2(props, ref) {
|
|
3616
3609
|
const { className, ...rest } = props;
|
|
3617
3610
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3618
3611
|
"p",
|
|
@@ -3634,7 +3627,7 @@ function normalizeValue(value, min, max) {
|
|
|
3634
3627
|
if (max <= min) return 0;
|
|
3635
3628
|
return Math.round((value - min) / (max - min) * 100);
|
|
3636
3629
|
}
|
|
3637
|
-
var Progress =
|
|
3630
|
+
var Progress = React29__namespace.forwardRef(
|
|
3638
3631
|
function Progress2(props, ref) {
|
|
3639
3632
|
const {
|
|
3640
3633
|
value,
|
|
@@ -3711,12 +3704,12 @@ var SIZE_MAP = {
|
|
|
3711
3704
|
lg: { size: 48, thickness: 7, textClass: "text-sm" },
|
|
3712
3705
|
xl: { size: 64, thickness: 8, textClass: "text-sm" }
|
|
3713
3706
|
};
|
|
3714
|
-
var Ctx =
|
|
3707
|
+
var Ctx = React29__namespace.createContext({
|
|
3715
3708
|
value: 0,
|
|
3716
3709
|
size: "md",
|
|
3717
3710
|
colorPalette: "blue"
|
|
3718
3711
|
});
|
|
3719
|
-
var ProgressCircleRoot =
|
|
3712
|
+
var ProgressCircleRoot = React29__namespace.forwardRef(function ProgressCircleRoot2(props, ref) {
|
|
3720
3713
|
const {
|
|
3721
3714
|
value = 0,
|
|
3722
3715
|
size = "md",
|
|
@@ -3725,7 +3718,7 @@ var ProgressCircleRoot = React30__namespace.forwardRef(function ProgressCircleRo
|
|
|
3725
3718
|
children,
|
|
3726
3719
|
...rest
|
|
3727
3720
|
} = props;
|
|
3728
|
-
const ctx =
|
|
3721
|
+
const ctx = React29__namespace.useMemo(
|
|
3729
3722
|
() => ({ value: value ?? null, size, colorPalette }),
|
|
3730
3723
|
[value, size, colorPalette]
|
|
3731
3724
|
);
|
|
@@ -3743,9 +3736,9 @@ var ProgressCircleRoot = React30__namespace.forwardRef(function ProgressCircleRo
|
|
|
3743
3736
|
}
|
|
3744
3737
|
) });
|
|
3745
3738
|
});
|
|
3746
|
-
var ProgressCircleRing =
|
|
3739
|
+
var ProgressCircleRing = React29__namespace.forwardRef(function ProgressCircleRing2(props, ref) {
|
|
3747
3740
|
const { trackColor, cap, color, className, ...rest } = props;
|
|
3748
|
-
const { value, size: sizeKey } =
|
|
3741
|
+
const { value, size: sizeKey } = React29__namespace.useContext(Ctx);
|
|
3749
3742
|
const { size, thickness } = SIZE_MAP[sizeKey];
|
|
3750
3743
|
const radius = size / 2 - thickness / 2;
|
|
3751
3744
|
const circumference = 2 * Math.PI * radius;
|
|
@@ -3800,9 +3793,9 @@ var ProgressCircleRing = React30__namespace.forwardRef(function ProgressCircleRi
|
|
|
3800
3793
|
}
|
|
3801
3794
|
);
|
|
3802
3795
|
});
|
|
3803
|
-
var ProgressCircleValueText =
|
|
3796
|
+
var ProgressCircleValueText = React29__namespace.forwardRef(function ProgressCircleValueText2(props, ref) {
|
|
3804
3797
|
const { className, children, ...rest } = props;
|
|
3805
|
-
const { value, size: sizeKey } =
|
|
3798
|
+
const { value, size: sizeKey } = React29__namespace.useContext(Ctx);
|
|
3806
3799
|
const { textClass } = SIZE_MAP[sizeKey];
|
|
3807
3800
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3808
3801
|
"div",
|
|
@@ -3846,8 +3839,8 @@ var SIZE_CLASSES8 = {
|
|
|
3846
3839
|
label: "text-base"
|
|
3847
3840
|
}
|
|
3848
3841
|
};
|
|
3849
|
-
var RadioSizeContext =
|
|
3850
|
-
var RadioGroupBase =
|
|
3842
|
+
var RadioSizeContext = React29__namespace.createContext("md");
|
|
3843
|
+
var RadioGroupBase = React29__namespace.forwardRef(
|
|
3851
3844
|
function RadioGroup2(props, ref) {
|
|
3852
3845
|
const {
|
|
3853
3846
|
children,
|
|
@@ -3864,7 +3857,7 @@ var RadioGroupBase = React30__namespace.forwardRef(
|
|
|
3864
3857
|
className,
|
|
3865
3858
|
...rest
|
|
3866
3859
|
} = props;
|
|
3867
|
-
const handleValueChange =
|
|
3860
|
+
const handleValueChange = React29__namespace.useCallback(
|
|
3868
3861
|
(nextValue) => {
|
|
3869
3862
|
if (readOnly) return;
|
|
3870
3863
|
onValueChange?.({ value: nextValue });
|
|
@@ -3897,10 +3890,10 @@ var RadioGroupBase = React30__namespace.forwardRef(
|
|
|
3897
3890
|
var RadioGroup3 = RadioGroupBase;
|
|
3898
3891
|
var NOOP2 = () => {
|
|
3899
3892
|
};
|
|
3900
|
-
var RadioBase =
|
|
3893
|
+
var RadioBase = React29__namespace.forwardRef(
|
|
3901
3894
|
function Radio(props, ref) {
|
|
3902
3895
|
const { children, inputProps, rootRef, value, disabled, className, ...rest } = props;
|
|
3903
|
-
const size =
|
|
3896
|
+
const size = React29__namespace.useContext(RadioSizeContext);
|
|
3904
3897
|
const sizeClasses2 = SIZE_CLASSES8[size];
|
|
3905
3898
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3906
3899
|
"label",
|
|
@@ -3962,23 +3955,23 @@ var RadioBase = React30__namespace.forwardRef(
|
|
|
3962
3955
|
var Radio2 = RadioBase;
|
|
3963
3956
|
var StarFilledIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z" }) });
|
|
3964
3957
|
var StarOutlineIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", stroke: "currentColor", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z", strokeWidth: "1.5" }) });
|
|
3965
|
-
var Rating =
|
|
3958
|
+
var Rating = React29__namespace.forwardRef(
|
|
3966
3959
|
function Rating2(props, ref) {
|
|
3967
3960
|
const { count = 5, label: labelProp, defaultValue = 0, onValueChange, readOnly, className, ...rest } = props;
|
|
3968
|
-
const [value, setValue] =
|
|
3969
|
-
const [hoveredIndex, setHoveredIndex] =
|
|
3961
|
+
const [value, setValue] = React29__namespace.useState(defaultValue);
|
|
3962
|
+
const [hoveredIndex, setHoveredIndex] = React29__namespace.useState(-1);
|
|
3970
3963
|
const highlightedIndex = hoveredIndex >= 0 && !readOnly ? hoveredIndex + 1 : value;
|
|
3971
3964
|
const label = Array.isArray(labelProp) ? labelProp[highlightedIndex - 1] : labelProp;
|
|
3972
|
-
const handleClick =
|
|
3965
|
+
const handleClick = React29__namespace.useCallback((index) => () => {
|
|
3973
3966
|
if (readOnly) return;
|
|
3974
3967
|
setValue(index);
|
|
3975
3968
|
onValueChange?.({ value: index });
|
|
3976
3969
|
}, [readOnly, onValueChange]);
|
|
3977
|
-
const handleMouseEnter =
|
|
3970
|
+
const handleMouseEnter = React29__namespace.useCallback((index) => () => {
|
|
3978
3971
|
if (readOnly) return;
|
|
3979
3972
|
setHoveredIndex(index);
|
|
3980
3973
|
}, [readOnly]);
|
|
3981
|
-
const handleMouseLeave =
|
|
3974
|
+
const handleMouseLeave = React29__namespace.useCallback(() => {
|
|
3982
3975
|
setHoveredIndex(-1);
|
|
3983
3976
|
}, []);
|
|
3984
3977
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn("inline-flex items-center gap-1", className), ...rest, children: [
|
|
@@ -4012,8 +4005,8 @@ function createListCollection(config) {
|
|
|
4012
4005
|
var ArrowIcon2 = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7.5 15L12.5 10L7.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
4013
4006
|
var CheckIcon2 = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M16.667 5L7.5 14.167 3.333 10", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
4014
4007
|
function FilterInput({ placeholder, initialValue = "", onChange }) {
|
|
4015
|
-
const [value, setValue] =
|
|
4016
|
-
const handleChange =
|
|
4008
|
+
const [value, setValue] = React29__namespace.useState(initialValue);
|
|
4009
|
+
const handleChange = React29__namespace.useCallback((e) => {
|
|
4017
4010
|
setValue(e.target.value);
|
|
4018
4011
|
onChange?.(e.target.value);
|
|
4019
4012
|
}, [onChange]);
|
|
@@ -4032,15 +4025,15 @@ function FilterInput({ placeholder, initialValue = "", onChange }) {
|
|
|
4032
4025
|
}
|
|
4033
4026
|
);
|
|
4034
4027
|
}
|
|
4035
|
-
var SelectInternalContext =
|
|
4028
|
+
var SelectInternalContext = React29__namespace.createContext(null);
|
|
4036
4029
|
function useSelectInternalContext() {
|
|
4037
|
-
const ctx =
|
|
4030
|
+
const ctx = React29__namespace.useContext(SelectInternalContext);
|
|
4038
4031
|
if (!ctx) {
|
|
4039
4032
|
throw new Error("Select compound components must be rendered inside <SelectRoot>");
|
|
4040
4033
|
}
|
|
4041
4034
|
return ctx;
|
|
4042
4035
|
}
|
|
4043
|
-
var SelectRoot =
|
|
4036
|
+
var SelectRoot = React29__namespace.forwardRef(
|
|
4044
4037
|
function SelectRoot2(props, ref) {
|
|
4045
4038
|
const {
|
|
4046
4039
|
children,
|
|
@@ -4071,21 +4064,21 @@ var SelectRoot = React30__namespace.forwardRef(
|
|
|
4071
4064
|
hideFrom: _hideFrom
|
|
4072
4065
|
} = props;
|
|
4073
4066
|
const collection = collectionProp ?? createListCollection({ items: [] });
|
|
4074
|
-
const [internalValue, setInternalValue] =
|
|
4067
|
+
const [internalValue, setInternalValue] = React29__namespace.useState(defaultValueArr ?? []);
|
|
4075
4068
|
const currentValue = valueProp ?? internalValue;
|
|
4076
|
-
const selectedItems =
|
|
4069
|
+
const selectedItems = React29__namespace.useMemo(() => {
|
|
4077
4070
|
return currentValue.map((v) => collection.items.find((item) => item.value === v)).filter(Boolean);
|
|
4078
4071
|
}, [currentValue, collection.items]);
|
|
4079
|
-
const [open, setOpen] =
|
|
4072
|
+
const [open, setOpen] = React29__namespace.useState(defaultOpen ?? false);
|
|
4080
4073
|
const isOpen = openProp ?? open;
|
|
4081
|
-
const handleOpenChange =
|
|
4074
|
+
const handleOpenChange = React29__namespace.useCallback((nextOpen) => {
|
|
4082
4075
|
setOpen(nextOpen);
|
|
4083
4076
|
onOpenChange?.(nextOpen);
|
|
4084
4077
|
if (!nextOpen) {
|
|
4085
4078
|
onInteractOutside?.();
|
|
4086
4079
|
}
|
|
4087
4080
|
}, [onOpenChange, onInteractOutside]);
|
|
4088
|
-
const handleRadixValueChange =
|
|
4081
|
+
const handleRadixValueChange = React29__namespace.useCallback((radixValue) => {
|
|
4089
4082
|
const nextArr = [radixValue];
|
|
4090
4083
|
if (!valueProp) {
|
|
4091
4084
|
setInternalValue(nextArr);
|
|
@@ -4093,7 +4086,7 @@ var SelectRoot = React30__namespace.forwardRef(
|
|
|
4093
4086
|
const items = collection.items.filter((item) => nextArr.includes(item.value));
|
|
4094
4087
|
onValueChangeProp?.({ value: nextArr, items });
|
|
4095
4088
|
}, [valueProp, collection.items, onValueChangeProp]);
|
|
4096
|
-
const ctxValue =
|
|
4089
|
+
const ctxValue = React29__namespace.useMemo(() => ({
|
|
4097
4090
|
value: currentValue,
|
|
4098
4091
|
selectedItems,
|
|
4099
4092
|
collection,
|
|
@@ -4113,7 +4106,7 @@ var SelectRoot = React30__namespace.forwardRef(
|
|
|
4113
4106
|
if (typeof v === "string") return v;
|
|
4114
4107
|
return v.base ?? v.lg ?? Object.values(v)[0];
|
|
4115
4108
|
};
|
|
4116
|
-
const inlineStyle =
|
|
4109
|
+
const inlineStyle = React29__namespace.useMemo(() => {
|
|
4117
4110
|
const s = { ...style };
|
|
4118
4111
|
const rw = resolveVal(w);
|
|
4119
4112
|
if (rw) s.width = rw;
|
|
@@ -4151,7 +4144,7 @@ var SelectRoot = React30__namespace.forwardRef(
|
|
|
4151
4144
|
) });
|
|
4152
4145
|
}
|
|
4153
4146
|
);
|
|
4154
|
-
var SelectControl =
|
|
4147
|
+
var SelectControl = React29__namespace.forwardRef(
|
|
4155
4148
|
function SelectControl2(props, ref) {
|
|
4156
4149
|
const { children, noIndicator, triggerProps, loading, defaultValue } = props;
|
|
4157
4150
|
const ctx = useSelectInternalContext();
|
|
@@ -4188,11 +4181,11 @@ var SelectControl = React30__namespace.forwardRef(
|
|
|
4188
4181
|
return trigger;
|
|
4189
4182
|
}
|
|
4190
4183
|
);
|
|
4191
|
-
var SelectClearTrigger =
|
|
4184
|
+
var SelectClearTrigger = React29__namespace.forwardRef(
|
|
4192
4185
|
function SelectClearTrigger2(props, ref) {
|
|
4193
4186
|
const { className, ...rest } = props;
|
|
4194
4187
|
const ctx = useSelectInternalContext();
|
|
4195
|
-
const handleClick =
|
|
4188
|
+
const handleClick = React29__namespace.useCallback(() => {
|
|
4196
4189
|
ctx.onValueChange({ value: [], items: [] });
|
|
4197
4190
|
}, [ctx]);
|
|
4198
4191
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -4209,7 +4202,7 @@ var SelectClearTrigger = React30__namespace.forwardRef(
|
|
|
4209
4202
|
);
|
|
4210
4203
|
}
|
|
4211
4204
|
);
|
|
4212
|
-
var SelectContent =
|
|
4205
|
+
var SelectContent = React29__namespace.forwardRef(
|
|
4213
4206
|
function SelectContent2(props, ref) {
|
|
4214
4207
|
const { portalled = true, portalRef, children, className, ...rest } = props;
|
|
4215
4208
|
const content = /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -4236,7 +4229,7 @@ var SelectContent = React30__namespace.forwardRef(
|
|
|
4236
4229
|
return content;
|
|
4237
4230
|
}
|
|
4238
4231
|
);
|
|
4239
|
-
var SelectItem =
|
|
4232
|
+
var SelectItem = React29__namespace.forwardRef(
|
|
4240
4233
|
function SelectItem2(props, ref) {
|
|
4241
4234
|
const { item, children, className, ...rest } = props;
|
|
4242
4235
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -4264,7 +4257,7 @@ var SelectItem = React30__namespace.forwardRef(
|
|
|
4264
4257
|
);
|
|
4265
4258
|
}
|
|
4266
4259
|
);
|
|
4267
|
-
var SelectValueText =
|
|
4260
|
+
var SelectValueText = React29__namespace.forwardRef(
|
|
4268
4261
|
function SelectValueText2(props, ref) {
|
|
4269
4262
|
const { children, size, required, invalid, errorText, mode, className, style, placeholder: placeholderProp, ...rest } = props;
|
|
4270
4263
|
const ctx = useSelectInternalContext();
|
|
@@ -4320,7 +4313,7 @@ var SelectValueText = React30__namespace.forwardRef(
|
|
|
4320
4313
|
);
|
|
4321
4314
|
}
|
|
4322
4315
|
);
|
|
4323
|
-
var SelectItemGroup =
|
|
4316
|
+
var SelectItemGroup = React29__namespace.forwardRef(
|
|
4324
4317
|
function SelectItemGroup2(props, ref) {
|
|
4325
4318
|
const { children, label, className, ...rest } = props;
|
|
4326
4319
|
return /* @__PURE__ */ jsxRuntime.jsxs(RadixSelect__namespace.Group, { ref, className: cn("py-1", className), ...rest, children: [
|
|
@@ -4331,7 +4324,7 @@ var SelectItemGroup = React30__namespace.forwardRef(
|
|
|
4331
4324
|
);
|
|
4332
4325
|
var SelectLabel = RadixSelect__namespace.Label;
|
|
4333
4326
|
var SelectItemText = RadixSelect__namespace.ItemText;
|
|
4334
|
-
var Select =
|
|
4327
|
+
var Select = React29__namespace.forwardRef((props, ref) => {
|
|
4335
4328
|
const { collection, placeholder, portalled = true, loading, errorText, contentProps, contentHeader, itemFilter, mode, ...rest } = props;
|
|
4336
4329
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4337
4330
|
SelectRoot,
|
|
@@ -4353,7 +4346,7 @@ var Select = React30__namespace.forwardRef((props, ref) => {
|
|
|
4353
4346
|
) }),
|
|
4354
4347
|
/* @__PURE__ */ jsxRuntime.jsxs(SelectContent, { portalled, ...contentProps, children: [
|
|
4355
4348
|
contentHeader,
|
|
4356
|
-
collection.items.filter(itemFilter ?? (() => true)).map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4349
|
+
collection.items.filter(itemFilter ?? (() => true)).map((item) => /* @__PURE__ */ jsxRuntime.jsxs(React29__namespace.Fragment, { children: [
|
|
4357
4350
|
/* @__PURE__ */ jsxRuntime.jsx(SelectItem, { item, children: item.renderLabel ? item.renderLabel("item") : item.label }),
|
|
4358
4351
|
item.afterElement
|
|
4359
4352
|
] }, item.value))
|
|
@@ -4362,19 +4355,19 @@ var Select = React30__namespace.forwardRef((props, ref) => {
|
|
|
4362
4355
|
}
|
|
4363
4356
|
);
|
|
4364
4357
|
});
|
|
4365
|
-
var SelectAsync =
|
|
4358
|
+
var SelectAsync = React29__namespace.forwardRef((props, ref) => {
|
|
4366
4359
|
const { placeholder, portalled = true, loading, loadOptions, extraControls, onValueChange, errorText, mode, contentHeader, ...rest } = props;
|
|
4367
|
-
const [collection, setCollection] =
|
|
4368
|
-
const [inputValue, setInputValue] =
|
|
4369
|
-
const [value, setValue] =
|
|
4360
|
+
const [collection, setCollection] = React29__namespace.useState(createListCollection({ items: [] }));
|
|
4361
|
+
const [inputValue, setInputValue] = React29__namespace.useState("");
|
|
4362
|
+
const [value, setValue] = React29__namespace.useState([]);
|
|
4370
4363
|
const debouncedInputValue = usehooks.useDebounce(inputValue, 300);
|
|
4371
|
-
|
|
4364
|
+
React29__namespace.useEffect(() => {
|
|
4372
4365
|
loadOptions(debouncedInputValue, value).then(setCollection);
|
|
4373
4366
|
}, [debouncedInputValue, loadOptions, value]);
|
|
4374
|
-
const handleFilterChange =
|
|
4367
|
+
const handleFilterChange = React29__namespace.useCallback((val) => {
|
|
4375
4368
|
setInputValue(val);
|
|
4376
4369
|
}, []);
|
|
4377
|
-
const handleValueChange =
|
|
4370
|
+
const handleValueChange = React29__namespace.useCallback(({ value: v, items }) => {
|
|
4378
4371
|
setValue(v);
|
|
4379
4372
|
onValueChange?.({ value: v, items });
|
|
4380
4373
|
}, [onValueChange]);
|
|
@@ -4433,7 +4426,7 @@ var VERTICAL_SIZE_CLASSES = {
|
|
|
4433
4426
|
md: "border-l-2",
|
|
4434
4427
|
lg: "border-l-[3px]"
|
|
4435
4428
|
};
|
|
4436
|
-
var Separator2 =
|
|
4429
|
+
var Separator2 = React29__namespace.default.forwardRef(
|
|
4437
4430
|
function Separator3({ orientation = "horizontal", variant = "solid", size = "sm", className, ...rest }, ref) {
|
|
4438
4431
|
const isVertical = orientation === "vertical";
|
|
4439
4432
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -4457,7 +4450,7 @@ var Separator2 = React30__namespace.default.forwardRef(
|
|
|
4457
4450
|
);
|
|
4458
4451
|
var THUMB_SIZE = 20;
|
|
4459
4452
|
var TRACK_HEIGHT = 6;
|
|
4460
|
-
var Slider =
|
|
4453
|
+
var Slider = React29__namespace.forwardRef(
|
|
4461
4454
|
function Slider2(props, ref) {
|
|
4462
4455
|
const {
|
|
4463
4456
|
marks: marksProp,
|
|
@@ -4576,7 +4569,7 @@ var SIZE_CLASSES9 = {
|
|
|
4576
4569
|
label: "text-base"
|
|
4577
4570
|
}
|
|
4578
4571
|
};
|
|
4579
|
-
var SwitchBase =
|
|
4572
|
+
var SwitchBase = React29__namespace.forwardRef(
|
|
4580
4573
|
function Switch(props, ref) {
|
|
4581
4574
|
const {
|
|
4582
4575
|
inputProps,
|
|
@@ -4595,10 +4588,10 @@ var SwitchBase = React30__namespace.forwardRef(
|
|
|
4595
4588
|
className,
|
|
4596
4589
|
...rest
|
|
4597
4590
|
} = props;
|
|
4598
|
-
const [internalChecked, setInternalChecked] =
|
|
4591
|
+
const [internalChecked, setInternalChecked] = React29__namespace.useState(defaultChecked ?? false);
|
|
4599
4592
|
const isControlled = checkedProp !== void 0;
|
|
4600
4593
|
const checkedState = isControlled ? checkedProp : internalChecked;
|
|
4601
|
-
const handleCheckedChange =
|
|
4594
|
+
const handleCheckedChange = React29__namespace.useCallback(
|
|
4602
4595
|
(nextChecked) => {
|
|
4603
4596
|
if (!isControlled) {
|
|
4604
4597
|
setInternalChecked(nextChecked);
|
|
@@ -4863,7 +4856,7 @@ function resolveResponsive(value) {
|
|
|
4863
4856
|
}
|
|
4864
4857
|
return void 0;
|
|
4865
4858
|
}
|
|
4866
|
-
var TableRoot =
|
|
4859
|
+
var TableRoot = React29__namespace.forwardRef(
|
|
4867
4860
|
function TableRoot2(props, ref) {
|
|
4868
4861
|
const { className, style: styleProp, children, ...other } = props;
|
|
4869
4862
|
const rawMinW = other.minWidth ?? other.minW;
|
|
@@ -4886,7 +4879,7 @@ var TableRoot = React30__namespace.forwardRef(
|
|
|
4886
4879
|
);
|
|
4887
4880
|
}
|
|
4888
4881
|
);
|
|
4889
|
-
var TableHeader =
|
|
4882
|
+
var TableHeader = React29__namespace.forwardRef(
|
|
4890
4883
|
function TableHeader2(props, ref) {
|
|
4891
4884
|
const { className, style: styleProp, children, ...other } = props;
|
|
4892
4885
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -4903,7 +4896,7 @@ var TableHeader = React30__namespace.forwardRef(
|
|
|
4903
4896
|
);
|
|
4904
4897
|
}
|
|
4905
4898
|
);
|
|
4906
|
-
var TableBody =
|
|
4899
|
+
var TableBody = React29__namespace.forwardRef(
|
|
4907
4900
|
function TableBody2(props, ref) {
|
|
4908
4901
|
const { className, style: styleProp, children, ...other } = props;
|
|
4909
4902
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -4920,7 +4913,7 @@ var TableBody = React30__namespace.forwardRef(
|
|
|
4920
4913
|
);
|
|
4921
4914
|
}
|
|
4922
4915
|
);
|
|
4923
|
-
var TableRow =
|
|
4916
|
+
var TableRow = React29__namespace.forwardRef(
|
|
4924
4917
|
function TableRow2(props, ref) {
|
|
4925
4918
|
const { className, style: styleProp, children, ...other } = props;
|
|
4926
4919
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -4937,7 +4930,7 @@ var TableRow = React30__namespace.forwardRef(
|
|
|
4937
4930
|
);
|
|
4938
4931
|
}
|
|
4939
4932
|
);
|
|
4940
|
-
var TableCell =
|
|
4933
|
+
var TableCell = React29__namespace.forwardRef(
|
|
4941
4934
|
function TableCell2(props, ref) {
|
|
4942
4935
|
const { isNumeric, className, style: styleProp, children, ...other } = props;
|
|
4943
4936
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -4958,7 +4951,7 @@ var TableCell = React30__namespace.forwardRef(
|
|
|
4958
4951
|
);
|
|
4959
4952
|
}
|
|
4960
4953
|
);
|
|
4961
|
-
var TableColumnHeader =
|
|
4954
|
+
var TableColumnHeader = React29__namespace.forwardRef(
|
|
4962
4955
|
function TableColumnHeader2(props, ref) {
|
|
4963
4956
|
const { isNumeric, className, style: styleProp, children, ...other } = props;
|
|
4964
4957
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -4985,7 +4978,7 @@ var TableColumnHeader = React30__namespace.forwardRef(
|
|
|
4985
4978
|
);
|
|
4986
4979
|
var TableColumnHeaderSortable = (props) => {
|
|
4987
4980
|
const { sortField, sortValue, onSortToggle, children, disabled, indicatorPosition = "left", contentAfter, ...rest } = props;
|
|
4988
|
-
const handleSortToggle =
|
|
4981
|
+
const handleSortToggle = React29__namespace.useCallback(() => {
|
|
4989
4982
|
onSortToggle(sortField);
|
|
4990
4983
|
}, [onSortToggle, sortField]);
|
|
4991
4984
|
const isActive = sortValue.includes(sortField);
|
|
@@ -5011,16 +5004,16 @@ var TableColumnHeaderSortable = (props) => {
|
|
|
5011
5004
|
var ACTION_BAR_SHADOW = "0 4px 4px -4px rgb(0 0 0 / 10%), 0 2px 4px -4px rgb(0 0 0 / 6%)";
|
|
5012
5005
|
var TableHeaderSticky = (props) => {
|
|
5013
5006
|
const { top, children, className, style: styleProp, ...rest } = props;
|
|
5014
|
-
const ref =
|
|
5015
|
-
const [isStuck, setIsStuck] =
|
|
5016
|
-
const handleScroll =
|
|
5007
|
+
const ref = React29__namespace.useRef(null);
|
|
5008
|
+
const [isStuck, setIsStuck] = React29__namespace.useState(false);
|
|
5009
|
+
const handleScroll = React29__namespace.useCallback(() => {
|
|
5017
5010
|
if (Number(ref.current?.getBoundingClientRect().y) <= (Number(top) || 0)) {
|
|
5018
5011
|
setIsStuck(true);
|
|
5019
5012
|
} else {
|
|
5020
5013
|
setIsStuck(false);
|
|
5021
5014
|
}
|
|
5022
5015
|
}, [top]);
|
|
5023
|
-
|
|
5016
|
+
React29__namespace.useEffect(() => {
|
|
5024
5017
|
const throttledHandleScroll = esToolkit.throttle(handleScroll, 300);
|
|
5025
5018
|
window.addEventListener("scroll", throttledHandleScroll);
|
|
5026
5019
|
return () => {
|
|
@@ -5042,7 +5035,7 @@ var TableHeaderSticky = (props) => {
|
|
|
5042
5035
|
}
|
|
5043
5036
|
);
|
|
5044
5037
|
};
|
|
5045
|
-
var TableCaption =
|
|
5038
|
+
var TableCaption = React29__namespace.forwardRef(
|
|
5046
5039
|
function TableCaption2(props, ref) {
|
|
5047
5040
|
const { className, style: styleProp, children, ...other } = props;
|
|
5048
5041
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -5059,7 +5052,7 @@ var TableCaption = React30__namespace.forwardRef(
|
|
|
5059
5052
|
);
|
|
5060
5053
|
}
|
|
5061
5054
|
);
|
|
5062
|
-
var TableFooter =
|
|
5055
|
+
var TableFooter = React29__namespace.forwardRef(
|
|
5063
5056
|
function TableFooter2(props, ref) {
|
|
5064
5057
|
const { className, style: styleProp, children, ...other } = props;
|
|
5065
5058
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -5076,7 +5069,7 @@ var TableFooter = React30__namespace.forwardRef(
|
|
|
5076
5069
|
);
|
|
5077
5070
|
}
|
|
5078
5071
|
);
|
|
5079
|
-
var TableScrollWrapper =
|
|
5072
|
+
var TableScrollWrapper = React29__namespace.forwardRef(
|
|
5080
5073
|
function TableScrollWrapper2(props, ref) {
|
|
5081
5074
|
const { className, children, ...rest } = props;
|
|
5082
5075
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -5095,7 +5088,7 @@ var ROOT_SIZE_CLASSES = {
|
|
|
5095
5088
|
md: "[--tabs-height:2.5rem] [--tabs-content-padding:1.5rem]",
|
|
5096
5089
|
free: ""
|
|
5097
5090
|
};
|
|
5098
|
-
var TabsRoot =
|
|
5091
|
+
var TabsRoot = React29__namespace.forwardRef(
|
|
5099
5092
|
function TabsRoot2(props, ref) {
|
|
5100
5093
|
const {
|
|
5101
5094
|
variant = "solid",
|
|
@@ -5107,7 +5100,7 @@ var TabsRoot = React30__namespace.forwardRef(
|
|
|
5107
5100
|
className,
|
|
5108
5101
|
...rest
|
|
5109
5102
|
} = props;
|
|
5110
|
-
const handleValueChange =
|
|
5103
|
+
const handleValueChange = React29__namespace.useCallback(
|
|
5111
5104
|
(value) => {
|
|
5112
5105
|
if (!onValueChange) return;
|
|
5113
5106
|
onValueChange({ value });
|
|
@@ -5132,7 +5125,7 @@ var TabsRoot = React30__namespace.forwardRef(
|
|
|
5132
5125
|
);
|
|
5133
5126
|
}
|
|
5134
5127
|
);
|
|
5135
|
-
var TabsList =
|
|
5128
|
+
var TabsList = React29__namespace.forwardRef(
|
|
5136
5129
|
function TabsList2(props, ref) {
|
|
5137
5130
|
const {
|
|
5138
5131
|
className,
|
|
@@ -5186,7 +5179,7 @@ var TRIGGER_VARIANT_CLASSES = {
|
|
|
5186
5179
|
segmented: "bg-transparent text-text-primary border-2 border-solid border-selected-control-bg hover:text-hover data-[state=active]:text-selected-control-text data-[state=active]:bg-selected-control-bg data-[state=active]:border-selected-control-bg data-[state=active]:hover:text-selected-control-text",
|
|
5187
5180
|
unstyled: ""
|
|
5188
5181
|
};
|
|
5189
|
-
var TabsTrigger =
|
|
5182
|
+
var TabsTrigger = React29__namespace.forwardRef(
|
|
5190
5183
|
function TabsTrigger2(props, ref) {
|
|
5191
5184
|
const {
|
|
5192
5185
|
className,
|
|
@@ -5206,7 +5199,7 @@ var TabsTrigger = React30__namespace.forwardRef(
|
|
|
5206
5199
|
visibility: _visibility,
|
|
5207
5200
|
...rest
|
|
5208
5201
|
} = props;
|
|
5209
|
-
const internalRef =
|
|
5202
|
+
const internalRef = React29__namespace.useRef(null);
|
|
5210
5203
|
const mergedRef = useMergedRef(ref, internalRef);
|
|
5211
5204
|
const { variant, size, fitted } = useTabsContext(internalRef);
|
|
5212
5205
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -5226,7 +5219,7 @@ var TabsTrigger = React30__namespace.forwardRef(
|
|
|
5226
5219
|
);
|
|
5227
5220
|
}
|
|
5228
5221
|
);
|
|
5229
|
-
var TabsContent =
|
|
5222
|
+
var TabsContent = React29__namespace.forwardRef(
|
|
5230
5223
|
function TabsContent2(props, ref) {
|
|
5231
5224
|
const { className, padding: _padding, ...rest } = props;
|
|
5232
5225
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -5260,8 +5253,8 @@ var TabsCounter = ({ count }) => {
|
|
|
5260
5253
|
);
|
|
5261
5254
|
};
|
|
5262
5255
|
function useTabsContext(triggerRef) {
|
|
5263
|
-
const [ctx, setCtx] =
|
|
5264
|
-
|
|
5256
|
+
const [ctx, setCtx] = React29__namespace.useState({ variant: "solid", size: "md", fitted: false });
|
|
5257
|
+
React29__namespace.useEffect(() => {
|
|
5265
5258
|
const el = triggerRef.current;
|
|
5266
5259
|
if (!el) return;
|
|
5267
5260
|
const root = el.closest("[data-variant]");
|
|
@@ -5275,7 +5268,7 @@ function useTabsContext(triggerRef) {
|
|
|
5275
5268
|
return ctx;
|
|
5276
5269
|
}
|
|
5277
5270
|
function useMergedRef(...refs) {
|
|
5278
|
-
return
|
|
5271
|
+
return React29__namespace.useCallback(
|
|
5279
5272
|
(instance) => {
|
|
5280
5273
|
for (const ref of refs) {
|
|
5281
5274
|
if (!ref) continue;
|
|
@@ -5313,7 +5306,7 @@ var TAG_SELECTED_CLASSES = [
|
|
|
5313
5306
|
"hover:opacity-76"
|
|
5314
5307
|
].join(" ");
|
|
5315
5308
|
var TAG_DISABLED_CLASSES = "opacity-40 pointer-events-none cursor-not-allowed";
|
|
5316
|
-
var Tag =
|
|
5309
|
+
var Tag = React29__namespace.forwardRef(
|
|
5317
5310
|
function Tag2(props, ref) {
|
|
5318
5311
|
const {
|
|
5319
5312
|
variant,
|
|
@@ -5400,7 +5393,7 @@ var TEXTAREA_VARIANT_CLASSES = {
|
|
|
5400
5393
|
filled: "border-0 bg-[var(--color-input-filled-bg,theme(colors.gray.100))]",
|
|
5401
5394
|
unstyled: "border-0 bg-transparent p-0"
|
|
5402
5395
|
};
|
|
5403
|
-
var Textarea =
|
|
5396
|
+
var Textarea = React29__namespace.default.forwardRef(
|
|
5404
5397
|
({ size = "md", variant = "outline", className, ...rest }, ref) => {
|
|
5405
5398
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5406
5399
|
"textarea",
|
|
@@ -5536,7 +5529,7 @@ function QuoteCell({ value, highlight, align = "right", onClick, className }) {
|
|
|
5536
5529
|
}
|
|
5537
5530
|
var CALL_HEADERS = ["Bid", "Ask", "Last", "Vol", "OI", "IV", "Delta"];
|
|
5538
5531
|
var PUT_HEADERS = ["Delta", "IV", "OI", "Vol", "Last", "Ask", "Bid"];
|
|
5539
|
-
var OptionChain =
|
|
5532
|
+
var OptionChain = React29__namespace.forwardRef(
|
|
5540
5533
|
function OptionChain2(props, ref) {
|
|
5541
5534
|
const {
|
|
5542
5535
|
symbol: _symbol,
|
|
@@ -5547,7 +5540,7 @@ var OptionChain = React30__namespace.forwardRef(
|
|
|
5547
5540
|
className,
|
|
5548
5541
|
...rest
|
|
5549
5542
|
} = props;
|
|
5550
|
-
const handleClick =
|
|
5543
|
+
const handleClick = React29__namespace.useCallback(
|
|
5551
5544
|
(quote, type, strike) => {
|
|
5552
5545
|
if (!quote || !onSelectContract) return;
|
|
5553
5546
|
onSelectContract({
|
|
@@ -5727,7 +5720,7 @@ function GreekItem({ def, value, compact }) {
|
|
|
5727
5720
|
}
|
|
5728
5721
|
);
|
|
5729
5722
|
}
|
|
5730
|
-
var GreeksDisplay =
|
|
5723
|
+
var GreeksDisplay = React29__namespace.forwardRef(
|
|
5731
5724
|
function GreeksDisplay2(props, ref) {
|
|
5732
5725
|
const {
|
|
5733
5726
|
delta,
|
|
@@ -5958,7 +5951,7 @@ function LegRow({ leg, index, strikes, expirations, removable, onChange, onRemov
|
|
|
5958
5951
|
)
|
|
5959
5952
|
] });
|
|
5960
5953
|
}
|
|
5961
|
-
var StrategyBuilder =
|
|
5954
|
+
var StrategyBuilder = React29__namespace.forwardRef(
|
|
5962
5955
|
function StrategyBuilder2(props, ref) {
|
|
5963
5956
|
const {
|
|
5964
5957
|
underlying,
|
|
@@ -5970,12 +5963,12 @@ var StrategyBuilder = React30__namespace.forwardRef(
|
|
|
5970
5963
|
...rest
|
|
5971
5964
|
} = props;
|
|
5972
5965
|
const defaultExp = expirations[0] ?? "";
|
|
5973
|
-
const [strategyType, setStrategyType] =
|
|
5974
|
-
const [legs, setLegs] =
|
|
5966
|
+
const [strategyType, setStrategyType] = React29__namespace.useState("bull_call_spread");
|
|
5967
|
+
const [legs, setLegs] = React29__namespace.useState(() => {
|
|
5975
5968
|
const preset = STRATEGY_PRESETS.find((p) => p.value === "bull_call_spread");
|
|
5976
5969
|
return preset ? preset.buildLegs(strikes, spotPrice, defaultExp) : [];
|
|
5977
5970
|
});
|
|
5978
|
-
const handleStrategyChange =
|
|
5971
|
+
const handleStrategyChange = React29__namespace.useCallback(
|
|
5979
5972
|
(e) => {
|
|
5980
5973
|
const type = e.target.value;
|
|
5981
5974
|
setStrategyType(type);
|
|
@@ -5986,7 +5979,7 @@ var StrategyBuilder = React30__namespace.forwardRef(
|
|
|
5986
5979
|
},
|
|
5987
5980
|
[strikes, spotPrice, defaultExp]
|
|
5988
5981
|
);
|
|
5989
|
-
const handleLegChange =
|
|
5982
|
+
const handleLegChange = React29__namespace.useCallback(
|
|
5990
5983
|
(index, leg) => {
|
|
5991
5984
|
setLegs((prev) => {
|
|
5992
5985
|
const next = [...prev];
|
|
@@ -5996,13 +5989,13 @@ var StrategyBuilder = React30__namespace.forwardRef(
|
|
|
5996
5989
|
},
|
|
5997
5990
|
[]
|
|
5998
5991
|
);
|
|
5999
|
-
const handleLegRemove =
|
|
5992
|
+
const handleLegRemove = React29__namespace.useCallback(
|
|
6000
5993
|
(index) => {
|
|
6001
5994
|
setLegs((prev) => prev.filter((_, i) => i !== index));
|
|
6002
5995
|
},
|
|
6003
5996
|
[]
|
|
6004
5997
|
);
|
|
6005
|
-
const handleAddLeg =
|
|
5998
|
+
const handleAddLeg = React29__namespace.useCallback(() => {
|
|
6006
5999
|
if (legs.length >= 4) return;
|
|
6007
6000
|
const atm = findATM(strikes, spotPrice);
|
|
6008
6001
|
setLegs((prev) => [
|
|
@@ -6010,14 +6003,14 @@ var StrategyBuilder = React30__namespace.forwardRef(
|
|
|
6010
6003
|
{ action: "buy", type: "call", strike: atm, expiration: defaultExp, quantity: 1 }
|
|
6011
6004
|
]);
|
|
6012
6005
|
}, [legs.length, strikes, spotPrice, defaultExp]);
|
|
6013
|
-
const netPremium =
|
|
6006
|
+
const netPremium = React29__namespace.useMemo(() => {
|
|
6014
6007
|
return legs.reduce((sum, leg) => {
|
|
6015
6008
|
if (leg.premium === void 0) return sum;
|
|
6016
6009
|
const sign = leg.action === "buy" ? -1 : 1;
|
|
6017
6010
|
return sum + sign * leg.premium * leg.quantity;
|
|
6018
6011
|
}, 0);
|
|
6019
6012
|
}, [legs]);
|
|
6020
|
-
const handleSubmit =
|
|
6013
|
+
const handleSubmit = React29__namespace.useCallback(() => {
|
|
6021
6014
|
if (!onSubmit || legs.length === 0) return;
|
|
6022
6015
|
onSubmit({
|
|
6023
6016
|
type: strategyType,
|
|
@@ -6138,7 +6131,7 @@ function buildPath(points, vb, width, height) {
|
|
|
6138
6131
|
return parts.join(" ");
|
|
6139
6132
|
}
|
|
6140
6133
|
var LEG_COLORS = ["#6366f1", "#f59e0b", "#ec4899", "#06b6d4"];
|
|
6141
|
-
var PnlDiagram =
|
|
6134
|
+
var PnlDiagram = React29__namespace.forwardRef(
|
|
6142
6135
|
function PnlDiagram2(props, ref) {
|
|
6143
6136
|
const {
|
|
6144
6137
|
legs,
|
|
@@ -6147,10 +6140,10 @@ var PnlDiagram = React30__namespace.forwardRef(
|
|
|
6147
6140
|
className,
|
|
6148
6141
|
...rest
|
|
6149
6142
|
} = props;
|
|
6150
|
-
const containerRef =
|
|
6151
|
-
const [hoverX, setHoverX] =
|
|
6152
|
-
const [dims, setDims] =
|
|
6153
|
-
|
|
6143
|
+
const containerRef = React29__namespace.useRef(null);
|
|
6144
|
+
const [hoverX, setHoverX] = React29__namespace.useState(null);
|
|
6145
|
+
const [dims, setDims] = React29__namespace.useState({ width: 600, height: 240 });
|
|
6146
|
+
React29__namespace.useEffect(() => {
|
|
6154
6147
|
const el = containerRef.current;
|
|
6155
6148
|
if (!el) return;
|
|
6156
6149
|
const observer = new ResizeObserver((entries) => {
|
|
@@ -6173,7 +6166,7 @@ var PnlDiagram = React30__namespace.forwardRef(
|
|
|
6173
6166
|
const xMax = maxStrike + range * 0.3;
|
|
6174
6167
|
const SAMPLES = 200;
|
|
6175
6168
|
const step = (xMax - xMin) / SAMPLES;
|
|
6176
|
-
const combinedPoints =
|
|
6169
|
+
const combinedPoints = React29__namespace.useMemo(() => {
|
|
6177
6170
|
const pts = [];
|
|
6178
6171
|
for (let i = 0; i <= SAMPLES; i++) {
|
|
6179
6172
|
const price = xMin + i * step;
|
|
@@ -6181,7 +6174,7 @@ var PnlDiagram = React30__namespace.forwardRef(
|
|
|
6181
6174
|
}
|
|
6182
6175
|
return pts;
|
|
6183
6176
|
}, [legs, multiplier, xMin, step]);
|
|
6184
|
-
const legPointSets =
|
|
6177
|
+
const legPointSets = React29__namespace.useMemo(() => {
|
|
6185
6178
|
return legs.map((leg) => {
|
|
6186
6179
|
const pts = [];
|
|
6187
6180
|
for (let i = 0; i <= SAMPLES; i++) {
|
|
@@ -6202,7 +6195,7 @@ var PnlDiagram = React30__namespace.forwardRef(
|
|
|
6202
6195
|
const chartH = height - PADDING.top - PADDING.bottom;
|
|
6203
6196
|
const scaleX = (x) => PADDING.left + (x - vb.xMin) / (vb.xMax - vb.xMin) * chartW;
|
|
6204
6197
|
const scaleY = (y) => PADDING.top + chartH - (y - vb.yMin) / (vb.yMax - vb.yMin) * chartH;
|
|
6205
|
-
const breakevens =
|
|
6198
|
+
const breakevens = React29__namespace.useMemo(() => {
|
|
6206
6199
|
const pts = [];
|
|
6207
6200
|
for (let i = 1; i < combinedPoints.length; i++) {
|
|
6208
6201
|
const prev = combinedPoints[i - 1];
|
|
@@ -6219,7 +6212,7 @@ var PnlDiagram = React30__namespace.forwardRef(
|
|
|
6219
6212
|
const maxGainPoint = combinedPoints.find((p) => p.y === maxGain);
|
|
6220
6213
|
const maxLossPoint = combinedPoints.find((p) => p.y === maxLoss);
|
|
6221
6214
|
const zeroY = scaleY(0);
|
|
6222
|
-
const handleMouseMove =
|
|
6215
|
+
const handleMouseMove = React29__namespace.useCallback(
|
|
6223
6216
|
(e) => {
|
|
6224
6217
|
const rect = e.currentTarget.getBoundingClientRect();
|
|
6225
6218
|
const mouseX = e.clientX - rect.left;
|
|
@@ -6232,7 +6225,7 @@ var PnlDiagram = React30__namespace.forwardRef(
|
|
|
6232
6225
|
},
|
|
6233
6226
|
[vb.xMin, vb.xMax, chartW]
|
|
6234
6227
|
);
|
|
6235
|
-
const handleMouseLeave =
|
|
6228
|
+
const handleMouseLeave = React29__namespace.useCallback(() => setHoverX(null), []);
|
|
6236
6229
|
const hoverPnl = hoverX !== null ? calcTotalPnl(legs, hoverX, multiplier) : null;
|
|
6237
6230
|
buildPath(
|
|
6238
6231
|
combinedPoints.map((p) => ({ x: scaleX(p.x), y: scaleY(p.y) })).map((p) => ({ x: p.x - PADDING.left, y: p.y - PADDING.top })),
|
|
@@ -6536,7 +6529,7 @@ function formatDate(date) {
|
|
|
6536
6529
|
const d = new Date(date);
|
|
6537
6530
|
return d.toLocaleDateString("en-US", { month: "short", day: "numeric" });
|
|
6538
6531
|
}
|
|
6539
|
-
var OptionPositionCard =
|
|
6532
|
+
var OptionPositionCard = React29__namespace.forwardRef(
|
|
6540
6533
|
function OptionPositionCard2(props, ref) {
|
|
6541
6534
|
const {
|
|
6542
6535
|
position,
|
|
@@ -6698,7 +6691,7 @@ function ExpirationPill({ exp, isSelected, onClick }) {
|
|
|
6698
6691
|
}
|
|
6699
6692
|
);
|
|
6700
6693
|
}
|
|
6701
|
-
var ExpirationSelector =
|
|
6694
|
+
var ExpirationSelector = React29__namespace.forwardRef(
|
|
6702
6695
|
function ExpirationSelector2(props, ref) {
|
|
6703
6696
|
const {
|
|
6704
6697
|
expirations,
|
|
@@ -6708,8 +6701,8 @@ var ExpirationSelector = React30__namespace.forwardRef(
|
|
|
6708
6701
|
className,
|
|
6709
6702
|
...rest
|
|
6710
6703
|
} = props;
|
|
6711
|
-
const scrollRef =
|
|
6712
|
-
|
|
6704
|
+
const scrollRef = React29__namespace.useRef(null);
|
|
6705
|
+
React29__namespace.useEffect(() => {
|
|
6713
6706
|
const container = scrollRef.current;
|
|
6714
6707
|
if (!container) return;
|
|
6715
6708
|
const selectedEl = container.querySelector('[data-selected="true"]');
|