@luxfi/ui 7.2.0 → 7.3.1
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/bank.d.cts +2 -2
- package/dist/bank.d.ts +2 -2
- package/dist/index.cjs +295 -281
- package/dist/index.d.cts +4 -3
- package/dist/index.d.ts +4 -3
- package/dist/index.js +295 -281
- package/dist/provider.cjs +40 -52
- package/dist/provider.d.cts +9 -4
- package/dist/provider.d.ts +9 -4
- package/dist/provider.js +20 -35
- package/package.json +6 -6
- package/src/index.ts +1 -2
- package/src/provider.tsx +29 -6
package/dist/index.cjs
CHANGED
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
+
var core = require('@hanzogui/core');
|
|
5
|
+
var reactQuery = require('@tanstack/react-query');
|
|
6
|
+
var React30 = require('react');
|
|
7
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
8
|
var clsx = require('clsx');
|
|
5
9
|
var tailwindMerge = require('tailwind-merge');
|
|
6
10
|
var AccordionPrimitive = require('@radix-ui/react-accordion');
|
|
7
|
-
var React29 = require('react');
|
|
8
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
9
|
-
var core = require('@hanzogui/core');
|
|
10
11
|
var RadixAvatar = require('@radix-ui/react-avatar');
|
|
11
12
|
var tooltip = require('@hanzogui/tooltip');
|
|
12
13
|
var usehooks = require('@uidotdev/usehooks');
|
|
@@ -45,8 +46,8 @@ function _interopNamespace(e) {
|
|
|
45
46
|
return Object.freeze(n);
|
|
46
47
|
}
|
|
47
48
|
|
|
49
|
+
var React30__namespace = /*#__PURE__*/_interopNamespace(React30);
|
|
48
50
|
var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrimitive);
|
|
49
|
-
var React29__namespace = /*#__PURE__*/_interopNamespace(React29);
|
|
50
51
|
var RadixAvatar__namespace = /*#__PURE__*/_interopNamespace(RadixAvatar);
|
|
51
52
|
var RadixCheckbox__namespace = /*#__PURE__*/_interopNamespace(RadixCheckbox);
|
|
52
53
|
var Collapsible__namespace = /*#__PURE__*/_interopNamespace(Collapsible);
|
|
@@ -60,12 +61,28 @@ var RadixSlider__namespace = /*#__PURE__*/_interopNamespace(RadixSlider);
|
|
|
60
61
|
var RadixSwitch__namespace = /*#__PURE__*/_interopNamespace(RadixSwitch);
|
|
61
62
|
var RadixTabs__namespace = /*#__PURE__*/_interopNamespace(RadixTabs);
|
|
62
63
|
|
|
63
|
-
// src/
|
|
64
|
+
// src/provider.tsx
|
|
65
|
+
var _guiInitialized = false;
|
|
66
|
+
function ensureGui() {
|
|
67
|
+
if (_guiInitialized) return;
|
|
68
|
+
if (typeof window === "undefined") return;
|
|
69
|
+
core.createGui({ settings: { autocompleteSpecificTokens: "except-special" } });
|
|
70
|
+
_guiInitialized = true;
|
|
71
|
+
}
|
|
72
|
+
var defaultQueryClient = new reactQuery.QueryClient({
|
|
73
|
+
defaultOptions: { queries: { refetchOnWindowFocus: false, retry: 1, staleTime: 3e4 } }
|
|
74
|
+
});
|
|
75
|
+
var AppProvider = ({ children, queryClient }) => {
|
|
76
|
+
React30__namespace.default.useEffect(() => {
|
|
77
|
+
ensureGui();
|
|
78
|
+
}, []);
|
|
79
|
+
return /* @__PURE__ */ jsxRuntime.jsx(reactQuery.QueryClientProvider, { client: queryClient ?? defaultQueryClient, children });
|
|
80
|
+
};
|
|
64
81
|
function cn(...inputs) {
|
|
65
82
|
return tailwindMerge.twMerge(clsx.clsx(inputs));
|
|
66
83
|
}
|
|
67
84
|
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" }) });
|
|
68
|
-
var AccordionRoot =
|
|
85
|
+
var AccordionRoot = React30__namespace.forwardRef(
|
|
69
86
|
function AccordionRoot2(props, ref) {
|
|
70
87
|
const {
|
|
71
88
|
multiple: _multiple,
|
|
@@ -84,7 +101,7 @@ var AccordionRoot = React29__namespace.forwardRef(
|
|
|
84
101
|
borderRadius: _borderRadius,
|
|
85
102
|
...rest
|
|
86
103
|
} = props;
|
|
87
|
-
const handleValueChange =
|
|
104
|
+
const handleValueChange = React30__namespace.useCallback(
|
|
88
105
|
(next) => {
|
|
89
106
|
onValueChange?.({ value: next });
|
|
90
107
|
},
|
|
@@ -112,7 +129,7 @@ var AccordionRoot = React29__namespace.forwardRef(
|
|
|
112
129
|
);
|
|
113
130
|
}
|
|
114
131
|
);
|
|
115
|
-
var AccordionItem =
|
|
132
|
+
var AccordionItem = React30__namespace.forwardRef(
|
|
116
133
|
function AccordionItem2(props, ref) {
|
|
117
134
|
const { className, as: _as, _first, _last, display: _display, ...rest } = props;
|
|
118
135
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -128,7 +145,7 @@ var AccordionItem = React29__namespace.forwardRef(
|
|
|
128
145
|
);
|
|
129
146
|
}
|
|
130
147
|
);
|
|
131
|
-
var AccordionItemTrigger =
|
|
148
|
+
var AccordionItemTrigger = React30__namespace.forwardRef(function AccordionItemTrigger2(props, ref) {
|
|
132
149
|
const {
|
|
133
150
|
children,
|
|
134
151
|
indicatorPlacement: indicatorPlacementProp,
|
|
@@ -193,7 +210,7 @@ var AccordionItemTrigger = React29__namespace.forwardRef(function AccordionItemT
|
|
|
193
210
|
}
|
|
194
211
|
) }) });
|
|
195
212
|
});
|
|
196
|
-
var AccordionItemContent =
|
|
213
|
+
var AccordionItemContent = React30__namespace.forwardRef(function AccordionItemContent2(props, ref) {
|
|
197
214
|
const { className, children, pb: _pb, pr: _pr, pl: _pl, w: _w, display: _display, flexDir: _flexDir, rowGap: _rowGap, ...rest } = props;
|
|
198
215
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
199
216
|
AccordionPrimitive__namespace.Content,
|
|
@@ -211,11 +228,11 @@ var AccordionItemContent = React29__namespace.forwardRef(function AccordionItemC
|
|
|
211
228
|
);
|
|
212
229
|
});
|
|
213
230
|
function useAccordion(items) {
|
|
214
|
-
const [value, setValue] =
|
|
215
|
-
const onValueChange =
|
|
231
|
+
const [value, setValue] = React30__namespace.useState([]);
|
|
232
|
+
const onValueChange = React30__namespace.useCallback(({ value: value2 }) => {
|
|
216
233
|
setValue(value2);
|
|
217
234
|
}, []);
|
|
218
|
-
const scrollToItemFromUrl =
|
|
235
|
+
const scrollToItemFromUrl = React30__namespace.useCallback(() => {
|
|
219
236
|
const hash = window.location.hash.replace("#", "");
|
|
220
237
|
if (!hash) {
|
|
221
238
|
return;
|
|
@@ -229,7 +246,7 @@ function useAccordion(items) {
|
|
|
229
246
|
setValue([itemToScroll.id]);
|
|
230
247
|
}
|
|
231
248
|
}, [items]);
|
|
232
|
-
return
|
|
249
|
+
return React30__namespace.useMemo(() => {
|
|
233
250
|
return {
|
|
234
251
|
value,
|
|
235
252
|
onValueChange,
|
|
@@ -272,7 +289,7 @@ var CLOSE_BUTTON_CLASSES = [
|
|
|
272
289
|
"hover:text-[var(--hover-color,currentColor)]",
|
|
273
290
|
"disabled:opacity-40"
|
|
274
291
|
].join(" ");
|
|
275
|
-
var CloseButton =
|
|
292
|
+
var CloseButton = React30__namespace.forwardRef(function CloseButton2(props, ref) {
|
|
276
293
|
const { variant: _variant, size: _size, className, children, ...rest } = props;
|
|
277
294
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
278
295
|
CloseButtonFrame,
|
|
@@ -419,7 +436,7 @@ var SKELETON_CLASSES = [
|
|
|
419
436
|
"bg-[length:200%_100%]"
|
|
420
437
|
].join(" ");
|
|
421
438
|
var HIDE_BELOW_MAP = { lg: "lg:hidden", md: "md:hidden", sm: "sm:hidden" };
|
|
422
|
-
var Skeleton =
|
|
439
|
+
var Skeleton = React30__namespace.forwardRef(
|
|
423
440
|
function Skeleton2(props, ref) {
|
|
424
441
|
const { loading = false, asChild, className, children, style: styleProp, as: Component = "div", ...allRest } = props;
|
|
425
442
|
const shimStyle = shimToStyle(props);
|
|
@@ -428,10 +445,10 @@ var Skeleton = React29__namespace.forwardRef(
|
|
|
428
445
|
const cls = hideBelowClass ? cn(className, hideBelowClass) : className;
|
|
429
446
|
const htmlRest = stripShims(allRest);
|
|
430
447
|
if (!loading) {
|
|
431
|
-
if (asChild &&
|
|
448
|
+
if (asChild && React30__namespace.isValidElement(children)) return children;
|
|
432
449
|
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: cls, style: mergedStyle, ...htmlRest, children });
|
|
433
450
|
}
|
|
434
|
-
if (asChild &&
|
|
451
|
+
if (asChild && React30__namespace.isValidElement(children)) {
|
|
435
452
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
436
453
|
Component,
|
|
437
454
|
{
|
|
@@ -457,7 +474,7 @@ var Skeleton = React29__namespace.forwardRef(
|
|
|
457
474
|
);
|
|
458
475
|
}
|
|
459
476
|
);
|
|
460
|
-
var SkeletonCircle =
|
|
477
|
+
var SkeletonCircle = React30__namespace.forwardRef(
|
|
461
478
|
function SkeletonCircle2(props, ref) {
|
|
462
479
|
const { size = 40, loading = true, className, ...rest } = props;
|
|
463
480
|
const dimension = typeof size === "number" ? `${size}px` : size;
|
|
@@ -473,7 +490,7 @@ var SkeletonCircle = React29__namespace.forwardRef(
|
|
|
473
490
|
);
|
|
474
491
|
}
|
|
475
492
|
);
|
|
476
|
-
var SkeletonText =
|
|
493
|
+
var SkeletonText = React30__namespace.forwardRef(
|
|
477
494
|
function SkeletonText2(props, ref) {
|
|
478
495
|
const { noOfLines = 3, loading = true, className, ...rest } = props;
|
|
479
496
|
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(
|
|
@@ -503,7 +520,7 @@ var INDICATOR_SIZE_CLASSES = {
|
|
|
503
520
|
sm: "w-5 h-5 my-0",
|
|
504
521
|
md: "w-5 h-5 my-[2px]"
|
|
505
522
|
};
|
|
506
|
-
var Alert =
|
|
523
|
+
var Alert = React30__namespace.forwardRef(
|
|
507
524
|
function Alert2(props, ref) {
|
|
508
525
|
const {
|
|
509
526
|
title,
|
|
@@ -528,7 +545,7 @@ var Alert = React29__namespace.forwardRef(
|
|
|
528
545
|
if (_mb !== void 0) shimStyle.marginBottom = typeof _mb === "number" ? `${_mb * 4}px` : _mb;
|
|
529
546
|
if (_mt !== void 0) shimStyle.marginTop = typeof _mt === "number" ? `${_mt * 4}px` : _mt;
|
|
530
547
|
const alertStyle = Object.keys(shimStyle).length > 0 ? shimStyle : void 0;
|
|
531
|
-
const [isOpen, setIsOpen] =
|
|
548
|
+
const [isOpen, setIsOpen] = React30__namespace.useState(true);
|
|
532
549
|
const resolvedSize = size ?? "md";
|
|
533
550
|
const defaultIcon = /* @__PURE__ */ jsxRuntime.jsx(IndicatorIcon2, { className: "w-5 h-5" });
|
|
534
551
|
const iconElement = (() => {
|
|
@@ -543,7 +560,7 @@ var Alert = React29__namespace.forwardRef(
|
|
|
543
560
|
INDICATOR_SIZE_CLASSES[resolvedSize]
|
|
544
561
|
), children: icon || defaultIcon });
|
|
545
562
|
})();
|
|
546
|
-
const handleClose =
|
|
563
|
+
const handleClose = React30__namespace.useCallback(() => {
|
|
547
564
|
setIsOpen(false);
|
|
548
565
|
onClose?.();
|
|
549
566
|
}, [onClose]);
|
|
@@ -619,11 +636,11 @@ var VARIANT_CLASSES = {
|
|
|
619
636
|
};
|
|
620
637
|
var DEFAULT_SIZE = "md";
|
|
621
638
|
var DEFAULT_VARIANT = "subtle";
|
|
622
|
-
var AvatarGroupContext =
|
|
639
|
+
var AvatarGroupContext = React30__namespace.createContext({});
|
|
623
640
|
function useAvatarGroupContext() {
|
|
624
|
-
return
|
|
641
|
+
return React30__namespace.useContext(AvatarGroupContext);
|
|
625
642
|
}
|
|
626
|
-
var Avatar =
|
|
643
|
+
var Avatar = React30__namespace.forwardRef(
|
|
627
644
|
function Avatar2(props, ref) {
|
|
628
645
|
const group = useAvatarGroupContext();
|
|
629
646
|
const {
|
|
@@ -673,7 +690,7 @@ var Avatar = React29__namespace.forwardRef(
|
|
|
673
690
|
);
|
|
674
691
|
}
|
|
675
692
|
);
|
|
676
|
-
var AvatarFallback =
|
|
693
|
+
var AvatarFallback = React30__namespace.forwardRef(
|
|
677
694
|
function AvatarFallback2(props, ref) {
|
|
678
695
|
const { name, icon, children, className, ...rest } = props;
|
|
679
696
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -700,10 +717,10 @@ function getInitials(name) {
|
|
|
700
717
|
const lastName = names.length > 1 ? names[names.length - 1] : "";
|
|
701
718
|
return firstName && lastName ? `${firstName.charAt(0)}${lastName.charAt(0)}` : firstName.charAt(0);
|
|
702
719
|
}
|
|
703
|
-
var AvatarGroup =
|
|
720
|
+
var AvatarGroup = React30__namespace.forwardRef(
|
|
704
721
|
function AvatarGroup2(props, ref) {
|
|
705
722
|
const { size, variant, borderless, className, ...rest } = props;
|
|
706
|
-
const contextValue =
|
|
723
|
+
const contextValue = React30__namespace.useMemo(
|
|
707
724
|
() => ({ size, variant, borderless }),
|
|
708
725
|
[size, variant, borderless]
|
|
709
726
|
);
|
|
@@ -719,11 +736,11 @@ var AvatarGroup = React29__namespace.forwardRef(
|
|
|
719
736
|
);
|
|
720
737
|
var LG_BREAKPOINT = 1024;
|
|
721
738
|
function useIsMobile() {
|
|
722
|
-
const [isMobile, setIsMobile] =
|
|
739
|
+
const [isMobile, setIsMobile] = React30__namespace.useState(() => {
|
|
723
740
|
if (typeof window === "undefined") return false;
|
|
724
741
|
return window.innerWidth < LG_BREAKPOINT;
|
|
725
742
|
});
|
|
726
|
-
|
|
743
|
+
React30__namespace.useEffect(() => {
|
|
727
744
|
const mql = window.matchMedia(`(max-width: ${LG_BREAKPOINT - 1}px)`);
|
|
728
745
|
const handler = (e) => setIsMobile(e.matches);
|
|
729
746
|
setIsMobile(mql.matches);
|
|
@@ -736,7 +753,7 @@ function mapPlacement(p) {
|
|
|
736
753
|
if (!p) return void 0;
|
|
737
754
|
return p;
|
|
738
755
|
}
|
|
739
|
-
var Tooltip =
|
|
756
|
+
var Tooltip = React30__namespace.forwardRef(
|
|
740
757
|
function Tooltip2(props, ref) {
|
|
741
758
|
const {
|
|
742
759
|
showArrow: showArrowProp,
|
|
@@ -755,28 +772,28 @@ var Tooltip = React29__namespace.forwardRef(
|
|
|
755
772
|
interactive,
|
|
756
773
|
positioning
|
|
757
774
|
} = props;
|
|
758
|
-
const [open, setOpen] =
|
|
759
|
-
const timeoutRef =
|
|
775
|
+
const [open, setOpen] = React30__namespace.useState(defaultOpen);
|
|
776
|
+
const timeoutRef = React30__namespace.useRef(null);
|
|
760
777
|
const isMobile = useIsMobile();
|
|
761
|
-
const handleOpenChange =
|
|
778
|
+
const handleOpenChange = React30__namespace.useCallback((nextOpen) => {
|
|
762
779
|
setOpen(nextOpen);
|
|
763
780
|
onOpenChange?.({ open: nextOpen });
|
|
764
781
|
}, [onOpenChange]);
|
|
765
|
-
const handleOpenChangeManual =
|
|
782
|
+
const handleOpenChangeManual = React30__namespace.useCallback((nextOpen) => {
|
|
766
783
|
timeoutRef.current && window.clearTimeout(timeoutRef.current);
|
|
767
784
|
timeoutRef.current = window.setTimeout(() => {
|
|
768
785
|
setOpen(nextOpen);
|
|
769
786
|
onOpenChange?.({ open: nextOpen });
|
|
770
787
|
}, nextOpen ? openDelay : closeDelay);
|
|
771
788
|
}, [closeDelay, openDelay, onOpenChange]);
|
|
772
|
-
const handleClickAway =
|
|
789
|
+
const handleClickAway = React30__namespace.useCallback(() => {
|
|
773
790
|
handleOpenChangeManual(false);
|
|
774
791
|
}, [handleOpenChangeManual]);
|
|
775
792
|
const triggerRef = usehooks.useClickAway(handleClickAway);
|
|
776
|
-
const handleTriggerClick =
|
|
793
|
+
const handleTriggerClick = React30__namespace.useCallback(() => {
|
|
777
794
|
handleOpenChangeManual(!open);
|
|
778
795
|
}, [handleOpenChangeManual, open]);
|
|
779
|
-
const handleContentClick =
|
|
796
|
+
const handleContentClick = React30__namespace.useCallback((event) => {
|
|
780
797
|
event.stopPropagation();
|
|
781
798
|
if (interactive) {
|
|
782
799
|
const closestLink = event.target?.closest("a");
|
|
@@ -785,7 +802,7 @@ var Tooltip = React29__namespace.forwardRef(
|
|
|
785
802
|
}
|
|
786
803
|
}
|
|
787
804
|
}, [interactive, handleOpenChangeManual]);
|
|
788
|
-
|
|
805
|
+
React30__namespace.useEffect(() => {
|
|
789
806
|
return () => {
|
|
790
807
|
if (timeoutRef.current) {
|
|
791
808
|
clearTimeout(timeoutRef.current);
|
|
@@ -887,7 +904,7 @@ var COLOR_PALETTE_CLASSES = {
|
|
|
887
904
|
bright_pink: "bg-badge-bright-pink-bg text-badge-bright-pink-fg"
|
|
888
905
|
};
|
|
889
906
|
var S2 = 4;
|
|
890
|
-
var Badge =
|
|
907
|
+
var Badge = React30__namespace.default.forwardRef(
|
|
891
908
|
function Badge2(props, ref) {
|
|
892
909
|
const {
|
|
893
910
|
loading,
|
|
@@ -1136,7 +1153,7 @@ function buildShimStyle(props) {
|
|
|
1136
1153
|
if (props.borderTopRightRadius !== void 0) s.borderTopRightRadius = typeof props.borderTopRightRadius === "number" ? `${props.borderTopRightRadius}px` : props.borderTopRightRadius;
|
|
1137
1154
|
return Object.keys(s).length > 0 ? s : void 0;
|
|
1138
1155
|
}
|
|
1139
|
-
var Button =
|
|
1156
|
+
var Button = React30__namespace.forwardRef(
|
|
1140
1157
|
function Button2(props, ref) {
|
|
1141
1158
|
const {
|
|
1142
1159
|
className,
|
|
@@ -1238,7 +1255,7 @@ function buttonVariants(opts) {
|
|
|
1238
1255
|
const s = opts?.size ?? "md";
|
|
1239
1256
|
return [BASE_CLASSES2, VARIANT_CLASSES2[v] ?? "", SIZE_CLASSES4[s] ?? ""].filter(Boolean).join(" ");
|
|
1240
1257
|
}
|
|
1241
|
-
var ButtonGroup =
|
|
1258
|
+
var ButtonGroup = React30__namespace.forwardRef(
|
|
1242
1259
|
function ButtonGroup2(props, ref) {
|
|
1243
1260
|
const { className, ...rest } = props;
|
|
1244
1261
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1252,7 +1269,7 @@ var ButtonGroup = React29__namespace.forwardRef(
|
|
|
1252
1269
|
);
|
|
1253
1270
|
}
|
|
1254
1271
|
);
|
|
1255
|
-
var ButtonGroupRadio =
|
|
1272
|
+
var ButtonGroupRadio = React30__namespace.forwardRef(
|
|
1256
1273
|
function ButtonGroupRadio2(props, ref) {
|
|
1257
1274
|
const {
|
|
1258
1275
|
children,
|
|
@@ -1264,24 +1281,24 @@ var ButtonGroupRadio = React29__namespace.forwardRef(
|
|
|
1264
1281
|
className,
|
|
1265
1282
|
...rest
|
|
1266
1283
|
} = props;
|
|
1267
|
-
const firstChildValue =
|
|
1284
|
+
const firstChildValue = React30__namespace.useMemo(() => {
|
|
1268
1285
|
const firstChild = Array.isArray(children) ? children[0] : void 0;
|
|
1269
1286
|
return typeof firstChild?.props.value === "string" ? firstChild.props.value : void 0;
|
|
1270
1287
|
}, [children]);
|
|
1271
|
-
const [value, setValue] =
|
|
1272
|
-
const handleItemClick =
|
|
1288
|
+
const [value, setValue] = React30__namespace.useState(defaultValue ?? firstChildValue);
|
|
1289
|
+
const handleItemClick = React30__namespace.useCallback((event) => {
|
|
1273
1290
|
const v = event.currentTarget.value;
|
|
1274
1291
|
setValue(v);
|
|
1275
1292
|
onChange?.(v);
|
|
1276
1293
|
}, [onChange]);
|
|
1277
|
-
const clonedChildren =
|
|
1278
|
-
return
|
|
1294
|
+
const clonedChildren = React30__namespace.Children.map(children, (child) => {
|
|
1295
|
+
return React30__namespace.cloneElement(child, {
|
|
1279
1296
|
onClick: handleItemClick,
|
|
1280
1297
|
selected: value === child.props.value,
|
|
1281
1298
|
variant
|
|
1282
1299
|
});
|
|
1283
1300
|
});
|
|
1284
|
-
const childrenLength =
|
|
1301
|
+
const childrenLength = React30__namespace.Children.count(children);
|
|
1285
1302
|
return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { loading, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1286
1303
|
"div",
|
|
1287
1304
|
{
|
|
@@ -1301,11 +1318,11 @@ var ButtonGroupRadio = React29__namespace.forwardRef(
|
|
|
1301
1318
|
);
|
|
1302
1319
|
var NOOP = () => {
|
|
1303
1320
|
};
|
|
1304
|
-
var CheckboxGroupContext =
|
|
1321
|
+
var CheckboxGroupContext = React30__namespace.createContext(null);
|
|
1305
1322
|
function useCheckboxGroupContext() {
|
|
1306
|
-
return
|
|
1323
|
+
return React30__namespace.useContext(CheckboxGroupContext);
|
|
1307
1324
|
}
|
|
1308
|
-
var CheckboxGroupBase =
|
|
1325
|
+
var CheckboxGroupBase = React30__namespace.forwardRef(
|
|
1309
1326
|
function CheckboxGroup(props, ref) {
|
|
1310
1327
|
const {
|
|
1311
1328
|
children,
|
|
@@ -1317,10 +1334,10 @@ var CheckboxGroupBase = React29__namespace.forwardRef(
|
|
|
1317
1334
|
className,
|
|
1318
1335
|
...rest
|
|
1319
1336
|
} = props;
|
|
1320
|
-
const [uncontrolledValue, setUncontrolledValue] =
|
|
1337
|
+
const [uncontrolledValue, setUncontrolledValue] = React30__namespace.useState(defaultValue ?? []);
|
|
1321
1338
|
const isControlled = controlledValue !== void 0;
|
|
1322
1339
|
const value = isControlled ? controlledValue : uncontrolledValue;
|
|
1323
|
-
const toggle =
|
|
1340
|
+
const toggle = React30__namespace.useCallback(
|
|
1324
1341
|
(itemValue) => {
|
|
1325
1342
|
const next = value.includes(itemValue) ? value.filter((v) => v !== itemValue) : [...value, itemValue];
|
|
1326
1343
|
if (!isControlled) {
|
|
@@ -1330,12 +1347,12 @@ var CheckboxGroupBase = React29__namespace.forwardRef(
|
|
|
1330
1347
|
},
|
|
1331
1348
|
[value, isControlled, onValueChange]
|
|
1332
1349
|
);
|
|
1333
|
-
|
|
1350
|
+
React30__namespace.useEffect(() => {
|
|
1334
1351
|
if (isControlled) {
|
|
1335
1352
|
setUncontrolledValue(controlledValue);
|
|
1336
1353
|
}
|
|
1337
1354
|
}, [isControlled, controlledValue]);
|
|
1338
|
-
const ctx =
|
|
1355
|
+
const ctx = React30__namespace.useMemo(() => ({ value, toggle }), [value, toggle]);
|
|
1339
1356
|
return /* @__PURE__ */ jsxRuntime.jsx(CheckboxGroupContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1340
1357
|
"div",
|
|
1341
1358
|
{
|
|
@@ -1393,7 +1410,7 @@ var IndeterminateIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
|
1393
1410
|
children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M0 0H12V2H0V0Z", fill: "currentColor" })
|
|
1394
1411
|
}
|
|
1395
1412
|
);
|
|
1396
|
-
var CheckboxBase =
|
|
1413
|
+
var CheckboxBase = React30__namespace.forwardRef(
|
|
1397
1414
|
function Checkbox(props, ref) {
|
|
1398
1415
|
const {
|
|
1399
1416
|
icon,
|
|
@@ -1414,8 +1431,8 @@ var CheckboxBase = React29__namespace.forwardRef(
|
|
|
1414
1431
|
...rest
|
|
1415
1432
|
} = props;
|
|
1416
1433
|
const group = useCheckboxGroupContext();
|
|
1417
|
-
const hiddenInputRef =
|
|
1418
|
-
const setHiddenInputRef =
|
|
1434
|
+
const hiddenInputRef = React30__namespace.useRef(null);
|
|
1435
|
+
const setHiddenInputRef = React30__namespace.useCallback(
|
|
1419
1436
|
(node) => {
|
|
1420
1437
|
hiddenInputRef.current = node;
|
|
1421
1438
|
if (typeof ref === "function") {
|
|
@@ -1428,7 +1445,7 @@ var CheckboxBase = React29__namespace.forwardRef(
|
|
|
1428
1445
|
);
|
|
1429
1446
|
const isInGroup = group !== null && value !== void 0;
|
|
1430
1447
|
const groupChecked = isInGroup ? group.value.includes(value) : void 0;
|
|
1431
|
-
const [internalChecked, setInternalChecked] =
|
|
1448
|
+
const [internalChecked, setInternalChecked] = React30__namespace.useState(
|
|
1432
1449
|
defaultChecked ?? false
|
|
1433
1450
|
);
|
|
1434
1451
|
const isControlled = checkedProp !== void 0 || isInGroup;
|
|
@@ -1440,7 +1457,7 @@ var CheckboxBase = React29__namespace.forwardRef(
|
|
|
1440
1457
|
} else {
|
|
1441
1458
|
checkedState = internalChecked;
|
|
1442
1459
|
}
|
|
1443
|
-
const handleCheckedChange =
|
|
1460
|
+
const handleCheckedChange = React30__namespace.useCallback(
|
|
1444
1461
|
(nextChecked) => {
|
|
1445
1462
|
if (readOnly) return;
|
|
1446
1463
|
if (!isControlled) {
|
|
@@ -1604,7 +1621,7 @@ function resolveSpacing(v) {
|
|
|
1604
1621
|
}
|
|
1605
1622
|
return void 0;
|
|
1606
1623
|
}
|
|
1607
|
-
var Link =
|
|
1624
|
+
var Link = React30__namespace.default.forwardRef(
|
|
1608
1625
|
function Link2(props, ref) {
|
|
1609
1626
|
const {
|
|
1610
1627
|
external,
|
|
@@ -1693,7 +1710,7 @@ var Link = React29__namespace.default.forwardRef(
|
|
|
1693
1710
|
) });
|
|
1694
1711
|
}
|
|
1695
1712
|
);
|
|
1696
|
-
var LinkBox =
|
|
1713
|
+
var LinkBox = React30__namespace.default.forwardRef(
|
|
1697
1714
|
function LinkBox2(props, ref) {
|
|
1698
1715
|
const { className, ...rest } = props;
|
|
1699
1716
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1706,7 +1723,7 @@ var LinkBox = React29__namespace.default.forwardRef(
|
|
|
1706
1723
|
);
|
|
1707
1724
|
}
|
|
1708
1725
|
);
|
|
1709
|
-
var LinkOverlay =
|
|
1726
|
+
var LinkOverlay = React30__namespace.default.forwardRef(
|
|
1710
1727
|
function LinkOverlay2(props, ref) {
|
|
1711
1728
|
const {
|
|
1712
1729
|
children,
|
|
@@ -1787,8 +1804,8 @@ var LinkOverlay = React29__namespace.default.forwardRef(
|
|
|
1787
1804
|
}
|
|
1788
1805
|
);
|
|
1789
1806
|
function useUpdateEffect(effect, deps) {
|
|
1790
|
-
const isFirstMount =
|
|
1791
|
-
|
|
1807
|
+
const isFirstMount = React30__namespace.default.useRef(true);
|
|
1808
|
+
React30__namespace.default.useEffect(() => {
|
|
1792
1809
|
if (isFirstMount.current) {
|
|
1793
1810
|
isFirstMount.current = false;
|
|
1794
1811
|
return;
|
|
@@ -1805,8 +1822,8 @@ function scrollToElement(id) {
|
|
|
1805
1822
|
var CUT_ID = "CollapsibleDetails";
|
|
1806
1823
|
var CollapsibleDetails = (props) => {
|
|
1807
1824
|
const { children, id = CUT_ID, onClick, isExpanded: isExpandedProp = false, text: textProp, loading, noScroll, ...rest } = props;
|
|
1808
|
-
const [isExpanded, setIsExpanded] =
|
|
1809
|
-
const handleClick =
|
|
1825
|
+
const [isExpanded, setIsExpanded] = React30__namespace.default.useState(isExpandedProp);
|
|
1826
|
+
const handleClick = React30__namespace.default.useCallback((event) => {
|
|
1810
1827
|
setIsExpanded((flag) => !flag);
|
|
1811
1828
|
if (!noScroll) {
|
|
1812
1829
|
scrollToElement(id);
|
|
@@ -1837,11 +1854,11 @@ var CollapsibleDetails = (props) => {
|
|
|
1837
1854
|
var CollapsibleList = (props) => {
|
|
1838
1855
|
const CUT_LENGTH = 3;
|
|
1839
1856
|
const { items, renderItem, triggerProps, cutLength = CUT_LENGTH, text: textProp, defaultExpanded = false, className, ...rest } = props;
|
|
1840
|
-
const [isExpanded, setIsExpanded] =
|
|
1841
|
-
|
|
1857
|
+
const [isExpanded, setIsExpanded] = React30__namespace.default.useState(defaultExpanded);
|
|
1858
|
+
React30__namespace.default.useEffect(() => {
|
|
1842
1859
|
setIsExpanded(defaultExpanded);
|
|
1843
1860
|
}, [defaultExpanded]);
|
|
1844
|
-
const handleToggle =
|
|
1861
|
+
const handleToggle = React30__namespace.default.useCallback(() => {
|
|
1845
1862
|
setIsExpanded((flag) => !flag);
|
|
1846
1863
|
}, []);
|
|
1847
1864
|
const text = isExpanded ? textProp?.[1] ?? "Hide" : textProp?.[0] ?? "Show all";
|
|
@@ -1858,10 +1875,10 @@ var CollapsibleList = (props) => {
|
|
|
1858
1875
|
) })
|
|
1859
1876
|
] }) });
|
|
1860
1877
|
};
|
|
1861
|
-
var ColorModeContext =
|
|
1878
|
+
var ColorModeContext = React30__namespace.createContext(void 0);
|
|
1862
1879
|
function ColorModeProvider(props) {
|
|
1863
1880
|
const { children, defaultTheme = "light", value: controlledValue, onValueChange } = props;
|
|
1864
|
-
const [internalMode, setInternalMode] =
|
|
1881
|
+
const [internalMode, setInternalMode] = React30__namespace.useState(() => {
|
|
1865
1882
|
if (controlledValue === "dark" || controlledValue === "light") {
|
|
1866
1883
|
return controlledValue;
|
|
1867
1884
|
}
|
|
@@ -1871,7 +1888,7 @@ function ColorModeProvider(props) {
|
|
|
1871
1888
|
return defaultTheme === "dark" ? "dark" : "light";
|
|
1872
1889
|
});
|
|
1873
1890
|
const colorMode = controlledValue === "dark" || controlledValue === "light" ? controlledValue : internalMode;
|
|
1874
|
-
const setColorMode =
|
|
1891
|
+
const setColorMode = React30__namespace.useCallback((mode) => {
|
|
1875
1892
|
const resolved = mode === "dark" ? "dark" : "light";
|
|
1876
1893
|
setInternalMode(resolved);
|
|
1877
1894
|
onValueChange?.(resolved);
|
|
@@ -1880,19 +1897,19 @@ function ColorModeProvider(props) {
|
|
|
1880
1897
|
document.documentElement.classList.toggle("light", resolved === "light");
|
|
1881
1898
|
}
|
|
1882
1899
|
}, [onValueChange]);
|
|
1883
|
-
const toggleColorMode =
|
|
1900
|
+
const toggleColorMode = React30__namespace.useCallback(() => {
|
|
1884
1901
|
setColorMode(colorMode === "dark" ? "light" : "dark");
|
|
1885
1902
|
}, [colorMode, setColorMode]);
|
|
1886
|
-
const ctx =
|
|
1903
|
+
const ctx = React30__namespace.useMemo(
|
|
1887
1904
|
() => ({ colorMode, setColorMode, toggleColorMode }),
|
|
1888
1905
|
[colorMode, setColorMode, toggleColorMode]
|
|
1889
1906
|
);
|
|
1890
1907
|
return /* @__PURE__ */ jsxRuntime.jsx(ColorModeContext.Provider, { value: ctx, children });
|
|
1891
1908
|
}
|
|
1892
1909
|
function useColorMode() {
|
|
1893
|
-
const ctx =
|
|
1910
|
+
const ctx = React30__namespace.useContext(ColorModeContext);
|
|
1894
1911
|
if (!ctx) {
|
|
1895
|
-
const [mode, setMode] =
|
|
1912
|
+
const [mode, setMode] = React30__namespace.useState(() => {
|
|
1896
1913
|
if (typeof document !== "undefined" && document.documentElement.classList.contains("dark")) {
|
|
1897
1914
|
return "dark";
|
|
1898
1915
|
}
|
|
@@ -1936,9 +1953,9 @@ function BackToButton({ onClick }) {
|
|
|
1936
1953
|
}
|
|
1937
1954
|
);
|
|
1938
1955
|
}
|
|
1939
|
-
var DialogSizeContext =
|
|
1956
|
+
var DialogSizeContext = React30__namespace.createContext({ size: "md" });
|
|
1940
1957
|
function useDialogSizeContext() {
|
|
1941
|
-
return
|
|
1958
|
+
return React30__namespace.useContext(DialogSizeContext);
|
|
1942
1959
|
}
|
|
1943
1960
|
var CONTENT_SIZE_MAP = {
|
|
1944
1961
|
sm: "max-w-[400px]",
|
|
@@ -1970,13 +1987,13 @@ var DialogRoot = ({
|
|
|
1970
1987
|
modal = true
|
|
1971
1988
|
// motionPreset is intentionally unused -- kept for API compat
|
|
1972
1989
|
}) => {
|
|
1973
|
-
const handleOpenChange =
|
|
1990
|
+
const handleOpenChange = React30__namespace.useCallback(
|
|
1974
1991
|
(nextOpen) => {
|
|
1975
1992
|
onOpenChange?.({ open: nextOpen });
|
|
1976
1993
|
},
|
|
1977
1994
|
[onOpenChange]
|
|
1978
1995
|
);
|
|
1979
|
-
const ctx =
|
|
1996
|
+
const ctx = React30__namespace.useMemo(() => ({ size }), [size]);
|
|
1980
1997
|
return /* @__PURE__ */ jsxRuntime.jsx(DialogSizeContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1981
1998
|
dialog.Dialog,
|
|
1982
1999
|
{
|
|
@@ -1988,7 +2005,7 @@ var DialogRoot = ({
|
|
|
1988
2005
|
}
|
|
1989
2006
|
) });
|
|
1990
2007
|
};
|
|
1991
|
-
var DialogContent =
|
|
2008
|
+
var DialogContent = React30__namespace.forwardRef(function DialogContent2(props, ref) {
|
|
1992
2009
|
const {
|
|
1993
2010
|
children,
|
|
1994
2011
|
portalled: _portalled = true,
|
|
@@ -2045,11 +2062,11 @@ var DialogContent = React29__namespace.forwardRef(function DialogContent2(props,
|
|
|
2045
2062
|
)
|
|
2046
2063
|
] });
|
|
2047
2064
|
});
|
|
2048
|
-
var DialogCloseTrigger =
|
|
2065
|
+
var DialogCloseTrigger = React30__namespace.forwardRef(function DialogCloseTrigger2(props, ref) {
|
|
2049
2066
|
const { className, ...rest } = props;
|
|
2050
2067
|
return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { ref, className, ...rest, children: props.children }) });
|
|
2051
2068
|
});
|
|
2052
|
-
var DialogHeader =
|
|
2069
|
+
var DialogHeader = React30__namespace.forwardRef(function DialogHeader2(props, ref) {
|
|
2053
2070
|
const { startElement: startElementProp, onBackToClick, className, children, ...rest } = props;
|
|
2054
2071
|
const startElement = startElementProp ?? (onBackToClick ? /* @__PURE__ */ jsxRuntime.jsx(BackToButton, { onClick: onBackToClick }) : void 0);
|
|
2055
2072
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -2079,7 +2096,7 @@ var DialogHeader = React29__namespace.forwardRef(function DialogHeader2(props, r
|
|
|
2079
2096
|
}
|
|
2080
2097
|
);
|
|
2081
2098
|
});
|
|
2082
|
-
var DialogBody =
|
|
2099
|
+
var DialogBody = React30__namespace.forwardRef(function DialogBody2({ className, pt, display, flexDir, style: styleProp, ...props }, ref) {
|
|
2083
2100
|
const bodyStyle = {
|
|
2084
2101
|
...styleProp,
|
|
2085
2102
|
...pt !== void 0 ? { paddingTop: typeof pt === "number" ? `${pt * 4}px` : pt } : {},
|
|
@@ -2096,7 +2113,7 @@ var DialogBody = React29__namespace.forwardRef(function DialogBody2({ className,
|
|
|
2096
2113
|
}
|
|
2097
2114
|
);
|
|
2098
2115
|
});
|
|
2099
|
-
var DialogFooter =
|
|
2116
|
+
var DialogFooter = React30__namespace.forwardRef(function DialogFooter2({ className, ...props }, ref) {
|
|
2100
2117
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2101
2118
|
"div",
|
|
2102
2119
|
{
|
|
@@ -2111,8 +2128,8 @@ var DialogTitle = dialog.Dialog.Title;
|
|
|
2111
2128
|
var DialogDescription = dialog.Dialog.Description;
|
|
2112
2129
|
var DialogTrigger = dialog.Dialog.Trigger;
|
|
2113
2130
|
var DialogActionTrigger = dialog.Dialog.Close;
|
|
2114
|
-
var DrawerPlacementContext =
|
|
2115
|
-
var DrawerSizeContext =
|
|
2131
|
+
var DrawerPlacementContext = React30__namespace.createContext("right");
|
|
2132
|
+
var DrawerSizeContext = React30__namespace.createContext("md");
|
|
2116
2133
|
var DrawerRoot = (props) => {
|
|
2117
2134
|
const {
|
|
2118
2135
|
children,
|
|
@@ -2123,7 +2140,7 @@ var DrawerRoot = (props) => {
|
|
|
2123
2140
|
modal = true,
|
|
2124
2141
|
size = "md"
|
|
2125
2142
|
} = props;
|
|
2126
|
-
const handleOpenChange =
|
|
2143
|
+
const handleOpenChange = React30__namespace.useCallback((nextOpen) => {
|
|
2127
2144
|
onOpenChange?.({ open: nextOpen });
|
|
2128
2145
|
}, [onOpenChange]);
|
|
2129
2146
|
return /* @__PURE__ */ jsxRuntime.jsx(DrawerPlacementContext.Provider, { value: placement, children: /* @__PURE__ */ jsxRuntime.jsx(DrawerSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -2165,11 +2182,11 @@ var SIZE_CLASSES6 = {
|
|
|
2165
2182
|
top: { xs: "h-40", sm: "h-60", md: "h-80", lg: "h-96", xl: "h-[480px]", full: "h-screen" },
|
|
2166
2183
|
bottom: { xs: "h-40", sm: "h-60", md: "h-80", lg: "h-96", xl: "h-[480px]", full: "h-screen" }
|
|
2167
2184
|
};
|
|
2168
|
-
var DrawerContent =
|
|
2185
|
+
var DrawerContent = React30__namespace.forwardRef(
|
|
2169
2186
|
function DrawerContent2(props, ref) {
|
|
2170
2187
|
const { children, portalled = true, portalRef, offset: _offset, backdrop = true, className, ...rest } = props;
|
|
2171
|
-
const placement =
|
|
2172
|
-
const size =
|
|
2188
|
+
const placement = React30__namespace.useContext(DrawerPlacementContext);
|
|
2189
|
+
const size = React30__namespace.useContext(DrawerSizeContext);
|
|
2173
2190
|
const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
2174
2191
|
backdrop && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2175
2192
|
RadixDialog__namespace.Overlay,
|
|
@@ -2202,7 +2219,7 @@ var DrawerContent = React29__namespace.forwardRef(
|
|
|
2202
2219
|
return content;
|
|
2203
2220
|
}
|
|
2204
2221
|
);
|
|
2205
|
-
var DrawerCloseTrigger =
|
|
2222
|
+
var DrawerCloseTrigger = React30__namespace.forwardRef(function DrawerCloseTrigger2(props, ref) {
|
|
2206
2223
|
return /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2207
2224
|
CloseButton,
|
|
2208
2225
|
{
|
|
@@ -2216,17 +2233,17 @@ var DrawerTrigger = (props) => {
|
|
|
2216
2233
|
const { asChild = true, ...rest } = props;
|
|
2217
2234
|
return /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Trigger, { asChild, ...rest });
|
|
2218
2235
|
};
|
|
2219
|
-
var DrawerHeader =
|
|
2236
|
+
var DrawerHeader = React30__namespace.forwardRef(
|
|
2220
2237
|
function DrawerHeader2({ className, ...props }, ref) {
|
|
2221
2238
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex flex-col gap-1.5 p-6 pb-0", className), ...props });
|
|
2222
2239
|
}
|
|
2223
2240
|
);
|
|
2224
|
-
var DrawerBody =
|
|
2241
|
+
var DrawerBody = React30__namespace.forwardRef(
|
|
2225
2242
|
function DrawerBody2({ className, ...props }, ref) {
|
|
2226
2243
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex-1 overflow-auto p-6", className), ...props });
|
|
2227
2244
|
}
|
|
2228
2245
|
);
|
|
2229
|
-
var DrawerFooter =
|
|
2246
|
+
var DrawerFooter = React30__namespace.forwardRef(
|
|
2230
2247
|
function DrawerFooter2({ className, ...props }, ref) {
|
|
2231
2248
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex items-center justify-end gap-2 p-6 pt-0", className), ...props });
|
|
2232
2249
|
}
|
|
@@ -2239,7 +2256,7 @@ function upperFirst(str) {
|
|
|
2239
2256
|
return str.charAt(0).toUpperCase() + str.slice(1);
|
|
2240
2257
|
}
|
|
2241
2258
|
var ICONS = {};
|
|
2242
|
-
var EmptyState =
|
|
2259
|
+
var EmptyState = React30__namespace.forwardRef(
|
|
2243
2260
|
function EmptyState2(props, ref) {
|
|
2244
2261
|
const { title, description, term, type = "query", icon, children, className, ...rest } = props;
|
|
2245
2262
|
const titleContent = (() => {
|
|
@@ -2299,7 +2316,7 @@ function getComponentDisplayName(type) {
|
|
|
2299
2316
|
if ("displayName" in type) return type.displayName;
|
|
2300
2317
|
return void 0;
|
|
2301
2318
|
}
|
|
2302
|
-
var Field =
|
|
2319
|
+
var Field = React30__namespace.forwardRef(
|
|
2303
2320
|
function Field2(props, ref) {
|
|
2304
2321
|
const {
|
|
2305
2322
|
label,
|
|
@@ -2351,14 +2368,14 @@ var Field = React29__namespace.forwardRef(
|
|
|
2351
2368
|
}
|
|
2352
2369
|
);
|
|
2353
2370
|
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;
|
|
2354
|
-
const child2 =
|
|
2371
|
+
const child2 = React30__namespace.Children.only(children);
|
|
2355
2372
|
const isInputGroup = getComponentDisplayName(child2.type) === "InputGroup";
|
|
2356
2373
|
if (isInputGroup) {
|
|
2357
|
-
const inputElement2 =
|
|
2358
|
-
|
|
2374
|
+
const inputElement2 = React30__namespace.cloneElement(
|
|
2375
|
+
React30__namespace.Children.only(child2.props.children),
|
|
2359
2376
|
injectedProps2
|
|
2360
2377
|
);
|
|
2361
|
-
const groupInputElement =
|
|
2378
|
+
const groupInputElement = React30__namespace.cloneElement(
|
|
2362
2379
|
child2,
|
|
2363
2380
|
{},
|
|
2364
2381
|
inputElement2,
|
|
@@ -2381,7 +2398,7 @@ var Field = React29__namespace.forwardRef(
|
|
|
2381
2398
|
}
|
|
2382
2399
|
);
|
|
2383
2400
|
}
|
|
2384
|
-
const inputElement =
|
|
2401
|
+
const inputElement = React30__namespace.cloneElement(child2, injectedProps2);
|
|
2385
2402
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2386
2403
|
"div",
|
|
2387
2404
|
{
|
|
@@ -2403,8 +2420,8 @@ var Field = React29__namespace.forwardRef(
|
|
|
2403
2420
|
const injectedProps = {
|
|
2404
2421
|
size
|
|
2405
2422
|
};
|
|
2406
|
-
const child =
|
|
2407
|
-
const clonedChild =
|
|
2423
|
+
const child = React30__namespace.Children.only(children);
|
|
2424
|
+
const clonedChild = React30__namespace.cloneElement(child, injectedProps);
|
|
2408
2425
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2409
2426
|
"div",
|
|
2410
2427
|
{
|
|
@@ -2447,7 +2464,7 @@ var LEVEL_CLASSES = {
|
|
|
2447
2464
|
"3": "text-[14px] leading-[20px] font-semibold lg:text-[18px] lg:leading-[24px] lg:font-medium"
|
|
2448
2465
|
};
|
|
2449
2466
|
var BASE_CLASSES4 = "font-heading text-heading";
|
|
2450
|
-
var Heading =
|
|
2467
|
+
var Heading = React30__namespace.default.forwardRef(
|
|
2451
2468
|
function Heading2({ level, className, mb, size: _size, style: styleProp, ...rest }, ref) {
|
|
2452
2469
|
const Tag3 = level ? LEVEL_TAG[level] : "h2";
|
|
2453
2470
|
const levelClasses = level ? LEVEL_CLASSES[level] : void 0;
|
|
@@ -2533,7 +2550,7 @@ var ICON_SIZE_CLASSES = {
|
|
|
2533
2550
|
md: "[&_svg]:size-5"
|
|
2534
2551
|
};
|
|
2535
2552
|
var SP2 = 4;
|
|
2536
|
-
var IconButton =
|
|
2553
|
+
var IconButton = React30__namespace.forwardRef(
|
|
2537
2554
|
function IconButton2(props, ref) {
|
|
2538
2555
|
const {
|
|
2539
2556
|
size,
|
|
@@ -2584,7 +2601,7 @@ var IconButton = React29__namespace.forwardRef(
|
|
|
2584
2601
|
ref,
|
|
2585
2602
|
size,
|
|
2586
2603
|
disabled: !loadingSkeleton && (loading || disabled) || void 0,
|
|
2587
|
-
render: _as ?
|
|
2604
|
+
render: _as ? React30__namespace.createElement(_as) : void 0,
|
|
2588
2605
|
className: combinedClassName,
|
|
2589
2606
|
style: mergedStyle,
|
|
2590
2607
|
...expanded ? { "data-expanded": true } : {},
|
|
@@ -2755,31 +2772,31 @@ function extractStyleProps(props) {
|
|
|
2755
2772
|
}
|
|
2756
2773
|
return { styleProps, rest };
|
|
2757
2774
|
}
|
|
2758
|
-
var Image2 =
|
|
2775
|
+
var Image2 = React30__namespace.default.forwardRef(
|
|
2759
2776
|
function Image3(props, ref) {
|
|
2760
2777
|
const { fallback, src, onLoad, onError, skeletonWidth, skeletonHeight, alt, className, style: styleProp, ...allRest } = props;
|
|
2761
2778
|
const { styleProps, rest: extraProps } = extractStyleProps(allRest);
|
|
2762
|
-
const [loading, setLoading] =
|
|
2763
|
-
const [error, setError] =
|
|
2764
|
-
const handleLoadError =
|
|
2779
|
+
const [loading, setLoading] = React30__namespace.default.useState(true);
|
|
2780
|
+
const [error, setError] = React30__namespace.default.useState(false);
|
|
2781
|
+
const handleLoadError = React30__namespace.default.useCallback((event) => {
|
|
2765
2782
|
setError(true);
|
|
2766
2783
|
setLoading(false);
|
|
2767
2784
|
onError?.(event);
|
|
2768
2785
|
}, [onError]);
|
|
2769
|
-
const handleLoadSuccess =
|
|
2786
|
+
const handleLoadSuccess = React30__namespace.default.useCallback((event) => {
|
|
2770
2787
|
setLoading(false);
|
|
2771
2788
|
onLoad?.(event);
|
|
2772
2789
|
}, [onLoad]);
|
|
2773
2790
|
const passthroughProps = allRest;
|
|
2774
2791
|
if (!src && fallback) {
|
|
2775
|
-
if (
|
|
2776
|
-
return
|
|
2792
|
+
if (React30__namespace.default.isValidElement(fallback)) {
|
|
2793
|
+
return React30__namespace.default.cloneElement(fallback, passthroughProps);
|
|
2777
2794
|
}
|
|
2778
2795
|
return fallback;
|
|
2779
2796
|
}
|
|
2780
2797
|
if (error) {
|
|
2781
|
-
if (
|
|
2782
|
-
return
|
|
2798
|
+
if (React30__namespace.default.isValidElement(fallback)) {
|
|
2799
|
+
return React30__namespace.default.cloneElement(fallback, passthroughProps);
|
|
2783
2800
|
}
|
|
2784
2801
|
return fallback;
|
|
2785
2802
|
}
|
|
@@ -2835,7 +2852,7 @@ var INPUT_VARIANT_CLASSES = {
|
|
|
2835
2852
|
filled: "border-0 bg-[var(--color-input-filled-bg,theme(colors.gray.100))]",
|
|
2836
2853
|
unstyled: "border-0 bg-transparent p-0 h-auto"
|
|
2837
2854
|
};
|
|
2838
|
-
var Input =
|
|
2855
|
+
var Input = React30__namespace.default.forwardRef(
|
|
2839
2856
|
({ size = "md", variant = "outline", className, ...rest }, ref) => {
|
|
2840
2857
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2841
2858
|
"input",
|
|
@@ -2853,7 +2870,7 @@ function getComponentDisplayName2(type) {
|
|
|
2853
2870
|
if ("displayName" in type) return type.displayName;
|
|
2854
2871
|
return void 0;
|
|
2855
2872
|
}
|
|
2856
|
-
var InputGroup =
|
|
2873
|
+
var InputGroup = React30__namespace.forwardRef(
|
|
2857
2874
|
function InputGroup2(props, ref) {
|
|
2858
2875
|
const {
|
|
2859
2876
|
startElement,
|
|
@@ -2866,11 +2883,11 @@ var InputGroup = React29__namespace.forwardRef(
|
|
|
2866
2883
|
className,
|
|
2867
2884
|
...rest
|
|
2868
2885
|
} = props;
|
|
2869
|
-
const startElementRef =
|
|
2870
|
-
const endElementRef =
|
|
2871
|
-
const groupRef =
|
|
2872
|
-
const [inlinePaddings, setInlinePaddings] =
|
|
2873
|
-
const calculateInlinePaddings =
|
|
2886
|
+
const startElementRef = React30__namespace.useRef(null);
|
|
2887
|
+
const endElementRef = React30__namespace.useRef(null);
|
|
2888
|
+
const groupRef = React30__namespace.useRef(null);
|
|
2889
|
+
const [inlinePaddings, setInlinePaddings] = React30__namespace.useState();
|
|
2890
|
+
const calculateInlinePaddings = React30__namespace.useCallback(() => {
|
|
2874
2891
|
const startWidth = startElementRef.current?.getBoundingClientRect().width ?? 0;
|
|
2875
2892
|
const endWidth = endElementRef.current?.getBoundingClientRect().width ?? 0;
|
|
2876
2893
|
setInlinePaddings({
|
|
@@ -2878,7 +2895,7 @@ var InputGroup = React29__namespace.forwardRef(
|
|
|
2878
2895
|
end: endWidth
|
|
2879
2896
|
});
|
|
2880
2897
|
}, []);
|
|
2881
|
-
|
|
2898
|
+
React30__namespace.useEffect(() => {
|
|
2882
2899
|
if (!groupRef.current) return;
|
|
2883
2900
|
let timeoutId;
|
|
2884
2901
|
const intersectionObserver = new IntersectionObserver(
|
|
@@ -2898,7 +2915,7 @@ var InputGroup = React29__namespace.forwardRef(
|
|
|
2898
2915
|
}
|
|
2899
2916
|
};
|
|
2900
2917
|
}, [calculateInlinePaddings]);
|
|
2901
|
-
|
|
2918
|
+
React30__namespace.useEffect(() => {
|
|
2902
2919
|
calculateInlinePaddings();
|
|
2903
2920
|
const resizeHandler = esToolkit.debounce(calculateInlinePaddings, 300);
|
|
2904
2921
|
const resizeObserver = new ResizeObserver(resizeHandler);
|
|
@@ -2909,7 +2926,7 @@ var InputGroup = React29__namespace.forwardRef(
|
|
|
2909
2926
|
resizeObserver.disconnect();
|
|
2910
2927
|
};
|
|
2911
2928
|
}, [calculateInlinePaddings]);
|
|
2912
|
-
const combinedRef =
|
|
2929
|
+
const combinedRef = React30__namespace.useCallback((node) => {
|
|
2913
2930
|
groupRef.current = node;
|
|
2914
2931
|
if (typeof ref === "function") {
|
|
2915
2932
|
ref(node);
|
|
@@ -2938,11 +2955,11 @@ var InputGroup = React29__namespace.forwardRef(
|
|
|
2938
2955
|
children: startElement
|
|
2939
2956
|
}
|
|
2940
2957
|
),
|
|
2941
|
-
|
|
2958
|
+
React30__namespace.Children.map(children, (child) => {
|
|
2942
2959
|
if (getComponentDisplayName2(child.type) !== "FieldInput") {
|
|
2943
2960
|
return child;
|
|
2944
2961
|
}
|
|
2945
|
-
return
|
|
2962
|
+
return React30__namespace.cloneElement(child, {
|
|
2946
2963
|
...startElement && { ps: startOffset ?? (inlinePaddings?.start ? `${inlinePaddings.start}px` : void 0) },
|
|
2947
2964
|
...endElement && { pe: endOffset ?? (inlinePaddings?.end ? `${inlinePaddings.end}px` : void 0) },
|
|
2948
2965
|
// hide input value and placeholder for the first render
|
|
@@ -2983,7 +3000,7 @@ function parsePlacement(placement) {
|
|
|
2983
3000
|
}
|
|
2984
3001
|
return { side, align };
|
|
2985
3002
|
}
|
|
2986
|
-
var PositioningContext =
|
|
3003
|
+
var PositioningContext = React30__namespace.createContext({
|
|
2987
3004
|
side: "bottom",
|
|
2988
3005
|
align: "start",
|
|
2989
3006
|
sideOffset: 4,
|
|
@@ -3013,13 +3030,13 @@ var MenuRoot = (props) => {
|
|
|
3013
3030
|
}
|
|
3014
3031
|
};
|
|
3015
3032
|
const { side, align } = parsePlacement(mergedPositioning.placement);
|
|
3016
|
-
const positioningValue =
|
|
3033
|
+
const positioningValue = React30__namespace.useMemo(() => ({
|
|
3017
3034
|
side,
|
|
3018
3035
|
align,
|
|
3019
3036
|
sideOffset: mergedPositioning.offset?.mainAxis ?? 4,
|
|
3020
3037
|
alignOffset: mergedPositioning.offset?.crossAxis ?? 0
|
|
3021
3038
|
}), [side, align, mergedPositioning.offset?.mainAxis, mergedPositioning.offset?.crossAxis]);
|
|
3022
|
-
const handleOpenChange =
|
|
3039
|
+
const handleOpenChange = React30__namespace.useCallback((isOpen) => {
|
|
3023
3040
|
onOpenChange?.({ open: isOpen });
|
|
3024
3041
|
}, [onOpenChange]);
|
|
3025
3042
|
return /* @__PURE__ */ jsxRuntime.jsx(PositioningContext.Provider, { value: positioningValue, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -3033,13 +3050,13 @@ var MenuRoot = (props) => {
|
|
|
3033
3050
|
}
|
|
3034
3051
|
) });
|
|
3035
3052
|
};
|
|
3036
|
-
var MenuTrigger =
|
|
3053
|
+
var MenuTrigger = React30__namespace.forwardRef(function MenuTrigger2(props, ref) {
|
|
3037
3054
|
const { asChild = false, ...rest } = props;
|
|
3038
3055
|
return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Trigger, { asChild, ref, ...rest });
|
|
3039
3056
|
});
|
|
3040
|
-
var MenuContent =
|
|
3057
|
+
var MenuContent = React30__namespace.forwardRef(function MenuContent2(props, ref) {
|
|
3041
3058
|
const { portalled = true, portalRef, className, zIndex, minW, style, ...rest } = props;
|
|
3042
|
-
const positioning =
|
|
3059
|
+
const positioning = React30__namespace.useContext(PositioningContext);
|
|
3043
3060
|
const mergedStyle = {
|
|
3044
3061
|
...style,
|
|
3045
3062
|
...zIndex !== void 0 ? { zIndex: typeof zIndex === "string" ? `var(--z-index-${zIndex}, ${zIndex})` : zIndex } : {},
|
|
@@ -3074,7 +3091,7 @@ var MenuContent = React29__namespace.forwardRef(function MenuContent2(props, ref
|
|
|
3074
3091
|
}
|
|
3075
3092
|
return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Portal, { container: portalRef?.current ?? void 0, children: content });
|
|
3076
3093
|
});
|
|
3077
|
-
var MenuItem =
|
|
3094
|
+
var MenuItem = React30__namespace.forwardRef(function MenuItem2(props, ref) {
|
|
3078
3095
|
const { className, value: _value, asChild, closeOnSelect: _closeOnSelect, disabled, children, onClick, ...rest } = props;
|
|
3079
3096
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3080
3097
|
DropdownMenu__namespace.Item,
|
|
@@ -3096,11 +3113,11 @@ var MenuItem = React29__namespace.forwardRef(function MenuItem2(props, ref) {
|
|
|
3096
3113
|
}
|
|
3097
3114
|
);
|
|
3098
3115
|
});
|
|
3099
|
-
var MenuItemText =
|
|
3116
|
+
var MenuItemText = React30__namespace.forwardRef(function MenuItemText2(props, ref) {
|
|
3100
3117
|
const { className, ...rest } = props;
|
|
3101
3118
|
return /* @__PURE__ */ jsxRuntime.jsx("span", { ref, className: cn("flex-1", className), ...rest });
|
|
3102
3119
|
});
|
|
3103
|
-
|
|
3120
|
+
React30__namespace.forwardRef(function MenuItemCommand2(props, ref) {
|
|
3104
3121
|
const { className, ...rest } = props;
|
|
3105
3122
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3106
3123
|
"span",
|
|
@@ -3111,7 +3128,7 @@ React29__namespace.forwardRef(function MenuItemCommand2(props, ref) {
|
|
|
3111
3128
|
}
|
|
3112
3129
|
);
|
|
3113
3130
|
});
|
|
3114
|
-
var MenuSeparator =
|
|
3131
|
+
var MenuSeparator = React30__namespace.forwardRef(function MenuSeparator2(props, ref) {
|
|
3115
3132
|
const { className, ...rest } = props;
|
|
3116
3133
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3117
3134
|
DropdownMenu__namespace.Separator,
|
|
@@ -3122,14 +3139,14 @@ var MenuSeparator = React29__namespace.forwardRef(function MenuSeparator2(props,
|
|
|
3122
3139
|
}
|
|
3123
3140
|
);
|
|
3124
3141
|
});
|
|
3125
|
-
var MenuItemGroup =
|
|
3142
|
+
var MenuItemGroup = React30__namespace.forwardRef(function MenuItemGroup2(props, ref) {
|
|
3126
3143
|
const { title, children, className, ...rest } = props;
|
|
3127
3144
|
return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu__namespace.Group, { ref, className, ...rest, children: [
|
|
3128
3145
|
title && /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Label, { className: "px-2 py-1.5 text-xs font-semibold select-none opacity-60", children: title }),
|
|
3129
3146
|
children
|
|
3130
3147
|
] });
|
|
3131
3148
|
});
|
|
3132
|
-
var MenuArrow =
|
|
3149
|
+
var MenuArrow = React30__namespace.forwardRef(function MenuArrow2(props, ref) {
|
|
3133
3150
|
const { className, ...rest } = props;
|
|
3134
3151
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3135
3152
|
DropdownMenu__namespace.Arrow,
|
|
@@ -3140,7 +3157,7 @@ var MenuArrow = React29__namespace.forwardRef(function MenuArrow2(props, ref) {
|
|
|
3140
3157
|
}
|
|
3141
3158
|
);
|
|
3142
3159
|
});
|
|
3143
|
-
var MenuCheckboxItem =
|
|
3160
|
+
var MenuCheckboxItem = React30__namespace.forwardRef(function MenuCheckboxItem2(props, ref) {
|
|
3144
3161
|
const { className, children, checked, onCheckedChange, onClick, ...rest } = props;
|
|
3145
3162
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3146
3163
|
DropdownMenu__namespace.CheckboxItem,
|
|
@@ -3164,7 +3181,7 @@ var MenuCheckboxItem = React29__namespace.forwardRef(function MenuCheckboxItem2(
|
|
|
3164
3181
|
}
|
|
3165
3182
|
);
|
|
3166
3183
|
});
|
|
3167
|
-
var MenuRadioItemGroup =
|
|
3184
|
+
var MenuRadioItemGroup = React30__namespace.forwardRef(function MenuRadioItemGroup2(props, ref) {
|
|
3168
3185
|
const { value, onValueChange, ...rest } = props;
|
|
3169
3186
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3170
3187
|
DropdownMenu__namespace.RadioGroup,
|
|
@@ -3176,7 +3193,7 @@ var MenuRadioItemGroup = React29__namespace.forwardRef(function MenuRadioItemGro
|
|
|
3176
3193
|
}
|
|
3177
3194
|
);
|
|
3178
3195
|
});
|
|
3179
|
-
var MenuRadioItem =
|
|
3196
|
+
var MenuRadioItem = React30__namespace.forwardRef(function MenuRadioItem2(props, ref) {
|
|
3180
3197
|
const { className, children, value, onClick, ...rest } = props;
|
|
3181
3198
|
const { value: _v, ...radixRest } = rest;
|
|
3182
3199
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -3199,11 +3216,11 @@ var MenuRadioItem = React29__namespace.forwardRef(function MenuRadioItem2(props,
|
|
|
3199
3216
|
}
|
|
3200
3217
|
);
|
|
3201
3218
|
});
|
|
3202
|
-
|
|
3219
|
+
React30__namespace.forwardRef(function MenuContextTrigger2(props, ref) {
|
|
3203
3220
|
const { asChild: _asChild, ...rest } = props;
|
|
3204
3221
|
return /* @__PURE__ */ jsxRuntime.jsx("span", { ref, ...rest });
|
|
3205
3222
|
});
|
|
3206
|
-
var MenuTriggerItem =
|
|
3223
|
+
var MenuTriggerItem = React30__namespace.forwardRef(function MenuTriggerItem2(props, ref) {
|
|
3207
3224
|
const { startIcon, children, className, ...rest } = props;
|
|
3208
3225
|
return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Sub, { children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3209
3226
|
DropdownMenu__namespace.SubTrigger,
|
|
@@ -3238,7 +3255,7 @@ var INPUT_BASE2 = [
|
|
|
3238
3255
|
].join(" ");
|
|
3239
3256
|
var INPUT_FILLED = "border-[var(--color-input-border)]";
|
|
3240
3257
|
var INPUT_INVALID = "border-[var(--color-border-error)] hover:border-[var(--color-border-error)]";
|
|
3241
|
-
var PinInput =
|
|
3258
|
+
var PinInput = React30__namespace.forwardRef(
|
|
3242
3259
|
function PinInput2(props, ref) {
|
|
3243
3260
|
const {
|
|
3244
3261
|
count = 6,
|
|
@@ -3256,12 +3273,12 @@ var PinInput = React29__namespace.forwardRef(
|
|
|
3256
3273
|
bgColor,
|
|
3257
3274
|
className
|
|
3258
3275
|
} = props;
|
|
3259
|
-
const inputRefs =
|
|
3260
|
-
const values =
|
|
3276
|
+
const inputRefs = React30__namespace.useRef([]);
|
|
3277
|
+
const values = React30__namespace.useMemo(
|
|
3261
3278
|
() => controlledValue ?? Array.from({ length: count }).fill(""),
|
|
3262
3279
|
[controlledValue, count]
|
|
3263
3280
|
);
|
|
3264
|
-
const updateValue =
|
|
3281
|
+
const updateValue = React30__namespace.useCallback((index, char) => {
|
|
3265
3282
|
const next = [...values];
|
|
3266
3283
|
next[index] = char;
|
|
3267
3284
|
onValueChange?.({ value: next });
|
|
@@ -3269,11 +3286,11 @@ var PinInput = React29__namespace.forwardRef(
|
|
|
3269
3286
|
onValueComplete?.({ value: next });
|
|
3270
3287
|
}
|
|
3271
3288
|
}, [values, onValueChange, onValueComplete]);
|
|
3272
|
-
const focusInput =
|
|
3289
|
+
const focusInput = React30__namespace.useCallback((index) => {
|
|
3273
3290
|
const clamped = Math.max(0, Math.min(index, count - 1));
|
|
3274
3291
|
inputRefs.current[clamped]?.focus();
|
|
3275
3292
|
}, [count]);
|
|
3276
|
-
const handleInput =
|
|
3293
|
+
const handleInput = React30__namespace.useCallback((index, e) => {
|
|
3277
3294
|
const target = e.currentTarget;
|
|
3278
3295
|
const char = target.value.slice(-1);
|
|
3279
3296
|
updateValue(index, char);
|
|
@@ -3281,7 +3298,7 @@ var PinInput = React29__namespace.forwardRef(
|
|
|
3281
3298
|
focusInput(index + 1);
|
|
3282
3299
|
}
|
|
3283
3300
|
}, [count, updateValue, focusInput]);
|
|
3284
|
-
const handleKeyDown =
|
|
3301
|
+
const handleKeyDown = React30__namespace.useCallback((index, e) => {
|
|
3285
3302
|
if (e.key === "Backspace") {
|
|
3286
3303
|
if (values[index]) {
|
|
3287
3304
|
updateValue(index, "");
|
|
@@ -3298,7 +3315,7 @@ var PinInput = React29__namespace.forwardRef(
|
|
|
3298
3315
|
e.preventDefault();
|
|
3299
3316
|
}
|
|
3300
3317
|
}, [count, values, updateValue, focusInput]);
|
|
3301
|
-
const handlePaste =
|
|
3318
|
+
const handlePaste = React30__namespace.useCallback((e) => {
|
|
3302
3319
|
e.preventDefault();
|
|
3303
3320
|
const pasted = e.clipboardData.getData("text/plain").trim();
|
|
3304
3321
|
if (!pasted) {
|
|
@@ -3315,18 +3332,18 @@ var PinInput = React29__namespace.forwardRef(
|
|
|
3315
3332
|
}
|
|
3316
3333
|
focusInput(Math.min(chars.length, count - 1));
|
|
3317
3334
|
}, [count, values, onValueChange, onValueComplete, focusInput]);
|
|
3318
|
-
const handleFocus =
|
|
3335
|
+
const handleFocus = React30__namespace.useCallback((e) => {
|
|
3319
3336
|
e.currentTarget.select();
|
|
3320
3337
|
}, []);
|
|
3321
|
-
const handleNoop =
|
|
3338
|
+
const handleNoop = React30__namespace.useCallback(() => {
|
|
3322
3339
|
}, []);
|
|
3323
|
-
const setInputRef =
|
|
3340
|
+
const setInputRef = React30__namespace.useCallback((index) => (el) => {
|
|
3324
3341
|
inputRefs.current[index] = el;
|
|
3325
3342
|
}, []);
|
|
3326
|
-
const onInputAtIndex =
|
|
3343
|
+
const onInputAtIndex = React30__namespace.useCallback((index) => (e) => {
|
|
3327
3344
|
handleInput(index, e);
|
|
3328
3345
|
}, [handleInput]);
|
|
3329
|
-
const onKeyDownAtIndex =
|
|
3346
|
+
const onKeyDownAtIndex = React30__namespace.useCallback((index) => (e) => {
|
|
3330
3347
|
handleKeyDown(index, e);
|
|
3331
3348
|
}, [handleKeyDown]);
|
|
3332
3349
|
const bgStyle = bgColor ? { backgroundColor: `var(--color-${bgColor.replace(/\./g, "-")})` } : void 0;
|
|
@@ -3387,7 +3404,7 @@ function parsePlacement2(placement) {
|
|
|
3387
3404
|
}
|
|
3388
3405
|
return { side, align };
|
|
3389
3406
|
}
|
|
3390
|
-
var PositioningContext2 =
|
|
3407
|
+
var PositioningContext2 = React30__namespace.createContext({
|
|
3391
3408
|
side: "bottom",
|
|
3392
3409
|
align: "start",
|
|
3393
3410
|
sideOffset: 4,
|
|
@@ -3421,7 +3438,7 @@ var PopoverRoot = (props) => {
|
|
|
3421
3438
|
}
|
|
3422
3439
|
};
|
|
3423
3440
|
const { side, align } = parsePlacement2(mergedPositioning.placement);
|
|
3424
|
-
const positioningValue =
|
|
3441
|
+
const positioningValue = React30__namespace.useMemo(() => ({
|
|
3425
3442
|
side,
|
|
3426
3443
|
align,
|
|
3427
3444
|
sideOffset: mergedPositioning.offset?.mainAxis ?? 4,
|
|
@@ -3438,7 +3455,7 @@ var PopoverRoot = (props) => {
|
|
|
3438
3455
|
autoFocus,
|
|
3439
3456
|
closeOnInteractOutside
|
|
3440
3457
|
]);
|
|
3441
|
-
const handleOpenChange =
|
|
3458
|
+
const handleOpenChange = React30__namespace.useCallback((isOpen) => {
|
|
3442
3459
|
onOpenChange?.({ open: isOpen });
|
|
3443
3460
|
}, [onOpenChange]);
|
|
3444
3461
|
const placement = mergedPositioning.placement ?? "bottom-start";
|
|
@@ -3456,11 +3473,11 @@ var PopoverRoot = (props) => {
|
|
|
3456
3473
|
}
|
|
3457
3474
|
) });
|
|
3458
3475
|
};
|
|
3459
|
-
var PopoverTrigger =
|
|
3476
|
+
var PopoverTrigger = React30__namespace.forwardRef(function PopoverTrigger2(props, ref) {
|
|
3460
3477
|
const { asChild = true, ...rest } = props;
|
|
3461
3478
|
return /* @__PURE__ */ jsxRuntime.jsx(popover.Popover.Trigger, { asChild: asChild ? "except-style" : void 0, ref, ...rest });
|
|
3462
3479
|
});
|
|
3463
|
-
var PopoverContent =
|
|
3480
|
+
var PopoverContent = React30__namespace.forwardRef(function PopoverContent2(props, ref) {
|
|
3464
3481
|
const { portalled = true, portalRef: _portalRef, className, w, minW, maxW, paddingTop, style: styleProp, ...rest } = props;
|
|
3465
3482
|
const resolvedW = typeof w === "object" ? w.base ?? w.lg : w;
|
|
3466
3483
|
const contentStyle = {
|
|
@@ -3491,7 +3508,7 @@ var PopoverContent = React29__namespace.forwardRef(function PopoverContent2(prop
|
|
|
3491
3508
|
}
|
|
3492
3509
|
);
|
|
3493
3510
|
});
|
|
3494
|
-
var PopoverArrow =
|
|
3511
|
+
var PopoverArrow = React30__namespace.forwardRef(function PopoverArrow2(props, ref) {
|
|
3495
3512
|
const { className, ...rest } = props;
|
|
3496
3513
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3497
3514
|
popover.Popover.Arrow,
|
|
@@ -3503,7 +3520,7 @@ var PopoverArrow = React29__namespace.forwardRef(function PopoverArrow2(props, r
|
|
|
3503
3520
|
}
|
|
3504
3521
|
);
|
|
3505
3522
|
});
|
|
3506
|
-
var PopoverCloseTrigger =
|
|
3523
|
+
var PopoverCloseTrigger = React30__namespace.forwardRef(function PopoverCloseTrigger2(props, ref) {
|
|
3507
3524
|
const { className, ...rest } = props;
|
|
3508
3525
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3509
3526
|
popover.Popover.Close,
|
|
@@ -3517,14 +3534,14 @@ var PopoverCloseTrigger = React29__namespace.forwardRef(function PopoverCloseTri
|
|
|
3517
3534
|
}
|
|
3518
3535
|
);
|
|
3519
3536
|
});
|
|
3520
|
-
var PopoverCloseTriggerWrapper =
|
|
3537
|
+
var PopoverCloseTriggerWrapper = React30__namespace.forwardRef(function PopoverCloseTriggerWrapper2(props, ref) {
|
|
3521
3538
|
const { disabled, children, ...rest } = props;
|
|
3522
3539
|
if (disabled) {
|
|
3523
3540
|
return children;
|
|
3524
3541
|
}
|
|
3525
3542
|
return /* @__PURE__ */ jsxRuntime.jsx(popover.Popover.Close, { ref, ...rest, asChild: true, children });
|
|
3526
3543
|
});
|
|
3527
|
-
var PopoverBody =
|
|
3544
|
+
var PopoverBody = React30__namespace.forwardRef(function PopoverBody2(props, ref) {
|
|
3528
3545
|
const {
|
|
3529
3546
|
className,
|
|
3530
3547
|
style: styleProp,
|
|
@@ -3562,7 +3579,7 @@ var PopoverBody = React29__namespace.forwardRef(function PopoverBody2(props, ref
|
|
|
3562
3579
|
}
|
|
3563
3580
|
);
|
|
3564
3581
|
});
|
|
3565
|
-
var PopoverHeader =
|
|
3582
|
+
var PopoverHeader = React30__namespace.forwardRef(function PopoverHeader2(props, ref) {
|
|
3566
3583
|
const { className, ...rest } = props;
|
|
3567
3584
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3568
3585
|
"div",
|
|
@@ -3573,7 +3590,7 @@ var PopoverHeader = React29__namespace.forwardRef(function PopoverHeader2(props,
|
|
|
3573
3590
|
}
|
|
3574
3591
|
);
|
|
3575
3592
|
});
|
|
3576
|
-
var PopoverFooter =
|
|
3593
|
+
var PopoverFooter = React30__namespace.forwardRef(function PopoverFooter2(props, ref) {
|
|
3577
3594
|
const { className, ...rest } = props;
|
|
3578
3595
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3579
3596
|
"div",
|
|
@@ -3584,7 +3601,7 @@ var PopoverFooter = React29__namespace.forwardRef(function PopoverFooter2(props,
|
|
|
3584
3601
|
}
|
|
3585
3602
|
);
|
|
3586
3603
|
});
|
|
3587
|
-
var PopoverTitle =
|
|
3604
|
+
var PopoverTitle = React30__namespace.forwardRef(function PopoverTitle2(props, ref) {
|
|
3588
3605
|
const { className, ...rest } = props;
|
|
3589
3606
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3590
3607
|
"h3",
|
|
@@ -3595,7 +3612,7 @@ var PopoverTitle = React29__namespace.forwardRef(function PopoverTitle2(props, r
|
|
|
3595
3612
|
}
|
|
3596
3613
|
);
|
|
3597
3614
|
});
|
|
3598
|
-
var PopoverDescription =
|
|
3615
|
+
var PopoverDescription = React30__namespace.forwardRef(function PopoverDescription2(props, ref) {
|
|
3599
3616
|
const { className, ...rest } = props;
|
|
3600
3617
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3601
3618
|
"p",
|
|
@@ -3617,7 +3634,7 @@ function normalizeValue(value, min, max) {
|
|
|
3617
3634
|
if (max <= min) return 0;
|
|
3618
3635
|
return Math.round((value - min) / (max - min) * 100);
|
|
3619
3636
|
}
|
|
3620
|
-
var Progress =
|
|
3637
|
+
var Progress = React30__namespace.forwardRef(
|
|
3621
3638
|
function Progress2(props, ref) {
|
|
3622
3639
|
const {
|
|
3623
3640
|
value,
|
|
@@ -3694,12 +3711,12 @@ var SIZE_MAP = {
|
|
|
3694
3711
|
lg: { size: 48, thickness: 7, textClass: "text-sm" },
|
|
3695
3712
|
xl: { size: 64, thickness: 8, textClass: "text-sm" }
|
|
3696
3713
|
};
|
|
3697
|
-
var Ctx =
|
|
3714
|
+
var Ctx = React30__namespace.createContext({
|
|
3698
3715
|
value: 0,
|
|
3699
3716
|
size: "md",
|
|
3700
3717
|
colorPalette: "blue"
|
|
3701
3718
|
});
|
|
3702
|
-
var ProgressCircleRoot =
|
|
3719
|
+
var ProgressCircleRoot = React30__namespace.forwardRef(function ProgressCircleRoot2(props, ref) {
|
|
3703
3720
|
const {
|
|
3704
3721
|
value = 0,
|
|
3705
3722
|
size = "md",
|
|
@@ -3708,7 +3725,7 @@ var ProgressCircleRoot = React29__namespace.forwardRef(function ProgressCircleRo
|
|
|
3708
3725
|
children,
|
|
3709
3726
|
...rest
|
|
3710
3727
|
} = props;
|
|
3711
|
-
const ctx =
|
|
3728
|
+
const ctx = React30__namespace.useMemo(
|
|
3712
3729
|
() => ({ value: value ?? null, size, colorPalette }),
|
|
3713
3730
|
[value, size, colorPalette]
|
|
3714
3731
|
);
|
|
@@ -3726,9 +3743,9 @@ var ProgressCircleRoot = React29__namespace.forwardRef(function ProgressCircleRo
|
|
|
3726
3743
|
}
|
|
3727
3744
|
) });
|
|
3728
3745
|
});
|
|
3729
|
-
var ProgressCircleRing =
|
|
3746
|
+
var ProgressCircleRing = React30__namespace.forwardRef(function ProgressCircleRing2(props, ref) {
|
|
3730
3747
|
const { trackColor, cap, color, className, ...rest } = props;
|
|
3731
|
-
const { value, size: sizeKey } =
|
|
3748
|
+
const { value, size: sizeKey } = React30__namespace.useContext(Ctx);
|
|
3732
3749
|
const { size, thickness } = SIZE_MAP[sizeKey];
|
|
3733
3750
|
const radius = size / 2 - thickness / 2;
|
|
3734
3751
|
const circumference = 2 * Math.PI * radius;
|
|
@@ -3783,9 +3800,9 @@ var ProgressCircleRing = React29__namespace.forwardRef(function ProgressCircleRi
|
|
|
3783
3800
|
}
|
|
3784
3801
|
);
|
|
3785
3802
|
});
|
|
3786
|
-
var ProgressCircleValueText =
|
|
3803
|
+
var ProgressCircleValueText = React30__namespace.forwardRef(function ProgressCircleValueText2(props, ref) {
|
|
3787
3804
|
const { className, children, ...rest } = props;
|
|
3788
|
-
const { value, size: sizeKey } =
|
|
3805
|
+
const { value, size: sizeKey } = React30__namespace.useContext(Ctx);
|
|
3789
3806
|
const { textClass } = SIZE_MAP[sizeKey];
|
|
3790
3807
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
3791
3808
|
"div",
|
|
@@ -3829,8 +3846,8 @@ var SIZE_CLASSES8 = {
|
|
|
3829
3846
|
label: "text-base"
|
|
3830
3847
|
}
|
|
3831
3848
|
};
|
|
3832
|
-
var RadioSizeContext =
|
|
3833
|
-
var RadioGroupBase =
|
|
3849
|
+
var RadioSizeContext = React30__namespace.createContext("md");
|
|
3850
|
+
var RadioGroupBase = React30__namespace.forwardRef(
|
|
3834
3851
|
function RadioGroup2(props, ref) {
|
|
3835
3852
|
const {
|
|
3836
3853
|
children,
|
|
@@ -3847,7 +3864,7 @@ var RadioGroupBase = React29__namespace.forwardRef(
|
|
|
3847
3864
|
className,
|
|
3848
3865
|
...rest
|
|
3849
3866
|
} = props;
|
|
3850
|
-
const handleValueChange =
|
|
3867
|
+
const handleValueChange = React30__namespace.useCallback(
|
|
3851
3868
|
(nextValue) => {
|
|
3852
3869
|
if (readOnly) return;
|
|
3853
3870
|
onValueChange?.({ value: nextValue });
|
|
@@ -3880,10 +3897,10 @@ var RadioGroupBase = React29__namespace.forwardRef(
|
|
|
3880
3897
|
var RadioGroup3 = RadioGroupBase;
|
|
3881
3898
|
var NOOP2 = () => {
|
|
3882
3899
|
};
|
|
3883
|
-
var RadioBase =
|
|
3900
|
+
var RadioBase = React30__namespace.forwardRef(
|
|
3884
3901
|
function Radio(props, ref) {
|
|
3885
3902
|
const { children, inputProps, rootRef, value, disabled, className, ...rest } = props;
|
|
3886
|
-
const size =
|
|
3903
|
+
const size = React30__namespace.useContext(RadioSizeContext);
|
|
3887
3904
|
const sizeClasses2 = SIZE_CLASSES8[size];
|
|
3888
3905
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3889
3906
|
"label",
|
|
@@ -3945,23 +3962,23 @@ var RadioBase = React29__namespace.forwardRef(
|
|
|
3945
3962
|
var Radio2 = RadioBase;
|
|
3946
3963
|
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" }) });
|
|
3947
3964
|
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" }) });
|
|
3948
|
-
var Rating =
|
|
3965
|
+
var Rating = React30__namespace.forwardRef(
|
|
3949
3966
|
function Rating2(props, ref) {
|
|
3950
3967
|
const { count = 5, label: labelProp, defaultValue = 0, onValueChange, readOnly, className, ...rest } = props;
|
|
3951
|
-
const [value, setValue] =
|
|
3952
|
-
const [hoveredIndex, setHoveredIndex] =
|
|
3968
|
+
const [value, setValue] = React30__namespace.useState(defaultValue);
|
|
3969
|
+
const [hoveredIndex, setHoveredIndex] = React30__namespace.useState(-1);
|
|
3953
3970
|
const highlightedIndex = hoveredIndex >= 0 && !readOnly ? hoveredIndex + 1 : value;
|
|
3954
3971
|
const label = Array.isArray(labelProp) ? labelProp[highlightedIndex - 1] : labelProp;
|
|
3955
|
-
const handleClick =
|
|
3972
|
+
const handleClick = React30__namespace.useCallback((index) => () => {
|
|
3956
3973
|
if (readOnly) return;
|
|
3957
3974
|
setValue(index);
|
|
3958
3975
|
onValueChange?.({ value: index });
|
|
3959
3976
|
}, [readOnly, onValueChange]);
|
|
3960
|
-
const handleMouseEnter =
|
|
3977
|
+
const handleMouseEnter = React30__namespace.useCallback((index) => () => {
|
|
3961
3978
|
if (readOnly) return;
|
|
3962
3979
|
setHoveredIndex(index);
|
|
3963
3980
|
}, [readOnly]);
|
|
3964
|
-
const handleMouseLeave =
|
|
3981
|
+
const handleMouseLeave = React30__namespace.useCallback(() => {
|
|
3965
3982
|
setHoveredIndex(-1);
|
|
3966
3983
|
}, []);
|
|
3967
3984
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn("inline-flex items-center gap-1", className), ...rest, children: [
|
|
@@ -3995,8 +4012,8 @@ function createListCollection(config) {
|
|
|
3995
4012
|
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" }) });
|
|
3996
4013
|
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" }) });
|
|
3997
4014
|
function FilterInput({ placeholder, initialValue = "", onChange }) {
|
|
3998
|
-
const [value, setValue] =
|
|
3999
|
-
const handleChange =
|
|
4015
|
+
const [value, setValue] = React30__namespace.useState(initialValue);
|
|
4016
|
+
const handleChange = React30__namespace.useCallback((e) => {
|
|
4000
4017
|
setValue(e.target.value);
|
|
4001
4018
|
onChange?.(e.target.value);
|
|
4002
4019
|
}, [onChange]);
|
|
@@ -4015,15 +4032,15 @@ function FilterInput({ placeholder, initialValue = "", onChange }) {
|
|
|
4015
4032
|
}
|
|
4016
4033
|
);
|
|
4017
4034
|
}
|
|
4018
|
-
var SelectInternalContext =
|
|
4035
|
+
var SelectInternalContext = React30__namespace.createContext(null);
|
|
4019
4036
|
function useSelectInternalContext() {
|
|
4020
|
-
const ctx =
|
|
4037
|
+
const ctx = React30__namespace.useContext(SelectInternalContext);
|
|
4021
4038
|
if (!ctx) {
|
|
4022
4039
|
throw new Error("Select compound components must be rendered inside <SelectRoot>");
|
|
4023
4040
|
}
|
|
4024
4041
|
return ctx;
|
|
4025
4042
|
}
|
|
4026
|
-
var SelectRoot =
|
|
4043
|
+
var SelectRoot = React30__namespace.forwardRef(
|
|
4027
4044
|
function SelectRoot2(props, ref) {
|
|
4028
4045
|
const {
|
|
4029
4046
|
children,
|
|
@@ -4054,21 +4071,21 @@ var SelectRoot = React29__namespace.forwardRef(
|
|
|
4054
4071
|
hideFrom: _hideFrom
|
|
4055
4072
|
} = props;
|
|
4056
4073
|
const collection = collectionProp ?? createListCollection({ items: [] });
|
|
4057
|
-
const [internalValue, setInternalValue] =
|
|
4074
|
+
const [internalValue, setInternalValue] = React30__namespace.useState(defaultValueArr ?? []);
|
|
4058
4075
|
const currentValue = valueProp ?? internalValue;
|
|
4059
|
-
const selectedItems =
|
|
4076
|
+
const selectedItems = React30__namespace.useMemo(() => {
|
|
4060
4077
|
return currentValue.map((v) => collection.items.find((item) => item.value === v)).filter(Boolean);
|
|
4061
4078
|
}, [currentValue, collection.items]);
|
|
4062
|
-
const [open, setOpen] =
|
|
4079
|
+
const [open, setOpen] = React30__namespace.useState(defaultOpen ?? false);
|
|
4063
4080
|
const isOpen = openProp ?? open;
|
|
4064
|
-
const handleOpenChange =
|
|
4081
|
+
const handleOpenChange = React30__namespace.useCallback((nextOpen) => {
|
|
4065
4082
|
setOpen(nextOpen);
|
|
4066
4083
|
onOpenChange?.(nextOpen);
|
|
4067
4084
|
if (!nextOpen) {
|
|
4068
4085
|
onInteractOutside?.();
|
|
4069
4086
|
}
|
|
4070
4087
|
}, [onOpenChange, onInteractOutside]);
|
|
4071
|
-
const handleRadixValueChange =
|
|
4088
|
+
const handleRadixValueChange = React30__namespace.useCallback((radixValue) => {
|
|
4072
4089
|
const nextArr = [radixValue];
|
|
4073
4090
|
if (!valueProp) {
|
|
4074
4091
|
setInternalValue(nextArr);
|
|
@@ -4076,7 +4093,7 @@ var SelectRoot = React29__namespace.forwardRef(
|
|
|
4076
4093
|
const items = collection.items.filter((item) => nextArr.includes(item.value));
|
|
4077
4094
|
onValueChangeProp?.({ value: nextArr, items });
|
|
4078
4095
|
}, [valueProp, collection.items, onValueChangeProp]);
|
|
4079
|
-
const ctxValue =
|
|
4096
|
+
const ctxValue = React30__namespace.useMemo(() => ({
|
|
4080
4097
|
value: currentValue,
|
|
4081
4098
|
selectedItems,
|
|
4082
4099
|
collection,
|
|
@@ -4096,7 +4113,7 @@ var SelectRoot = React29__namespace.forwardRef(
|
|
|
4096
4113
|
if (typeof v === "string") return v;
|
|
4097
4114
|
return v.base ?? v.lg ?? Object.values(v)[0];
|
|
4098
4115
|
};
|
|
4099
|
-
const inlineStyle =
|
|
4116
|
+
const inlineStyle = React30__namespace.useMemo(() => {
|
|
4100
4117
|
const s = { ...style };
|
|
4101
4118
|
const rw = resolveVal(w);
|
|
4102
4119
|
if (rw) s.width = rw;
|
|
@@ -4134,7 +4151,7 @@ var SelectRoot = React29__namespace.forwardRef(
|
|
|
4134
4151
|
) });
|
|
4135
4152
|
}
|
|
4136
4153
|
);
|
|
4137
|
-
var SelectControl =
|
|
4154
|
+
var SelectControl = React30__namespace.forwardRef(
|
|
4138
4155
|
function SelectControl2(props, ref) {
|
|
4139
4156
|
const { children, noIndicator, triggerProps, loading, defaultValue } = props;
|
|
4140
4157
|
const ctx = useSelectInternalContext();
|
|
@@ -4171,11 +4188,11 @@ var SelectControl = React29__namespace.forwardRef(
|
|
|
4171
4188
|
return trigger;
|
|
4172
4189
|
}
|
|
4173
4190
|
);
|
|
4174
|
-
var SelectClearTrigger =
|
|
4191
|
+
var SelectClearTrigger = React30__namespace.forwardRef(
|
|
4175
4192
|
function SelectClearTrigger2(props, ref) {
|
|
4176
4193
|
const { className, ...rest } = props;
|
|
4177
4194
|
const ctx = useSelectInternalContext();
|
|
4178
|
-
const handleClick =
|
|
4195
|
+
const handleClick = React30__namespace.useCallback(() => {
|
|
4179
4196
|
ctx.onValueChange({ value: [], items: [] });
|
|
4180
4197
|
}, [ctx]);
|
|
4181
4198
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -4192,7 +4209,7 @@ var SelectClearTrigger = React29__namespace.forwardRef(
|
|
|
4192
4209
|
);
|
|
4193
4210
|
}
|
|
4194
4211
|
);
|
|
4195
|
-
var SelectContent =
|
|
4212
|
+
var SelectContent = React30__namespace.forwardRef(
|
|
4196
4213
|
function SelectContent2(props, ref) {
|
|
4197
4214
|
const { portalled = true, portalRef, children, className, ...rest } = props;
|
|
4198
4215
|
const content = /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -4219,7 +4236,7 @@ var SelectContent = React29__namespace.forwardRef(
|
|
|
4219
4236
|
return content;
|
|
4220
4237
|
}
|
|
4221
4238
|
);
|
|
4222
|
-
var SelectItem =
|
|
4239
|
+
var SelectItem = React30__namespace.forwardRef(
|
|
4223
4240
|
function SelectItem2(props, ref) {
|
|
4224
4241
|
const { item, children, className, ...rest } = props;
|
|
4225
4242
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -4247,7 +4264,7 @@ var SelectItem = React29__namespace.forwardRef(
|
|
|
4247
4264
|
);
|
|
4248
4265
|
}
|
|
4249
4266
|
);
|
|
4250
|
-
var SelectValueText =
|
|
4267
|
+
var SelectValueText = React30__namespace.forwardRef(
|
|
4251
4268
|
function SelectValueText2(props, ref) {
|
|
4252
4269
|
const { children, size, required, invalid, errorText, mode, className, style, placeholder: placeholderProp, ...rest } = props;
|
|
4253
4270
|
const ctx = useSelectInternalContext();
|
|
@@ -4303,7 +4320,7 @@ var SelectValueText = React29__namespace.forwardRef(
|
|
|
4303
4320
|
);
|
|
4304
4321
|
}
|
|
4305
4322
|
);
|
|
4306
|
-
var SelectItemGroup =
|
|
4323
|
+
var SelectItemGroup = React30__namespace.forwardRef(
|
|
4307
4324
|
function SelectItemGroup2(props, ref) {
|
|
4308
4325
|
const { children, label, className, ...rest } = props;
|
|
4309
4326
|
return /* @__PURE__ */ jsxRuntime.jsxs(RadixSelect__namespace.Group, { ref, className: cn("py-1", className), ...rest, children: [
|
|
@@ -4314,7 +4331,7 @@ var SelectItemGroup = React29__namespace.forwardRef(
|
|
|
4314
4331
|
);
|
|
4315
4332
|
var SelectLabel = RadixSelect__namespace.Label;
|
|
4316
4333
|
var SelectItemText = RadixSelect__namespace.ItemText;
|
|
4317
|
-
var Select =
|
|
4334
|
+
var Select = React30__namespace.forwardRef((props, ref) => {
|
|
4318
4335
|
const { collection, placeholder, portalled = true, loading, errorText, contentProps, contentHeader, itemFilter, mode, ...rest } = props;
|
|
4319
4336
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4320
4337
|
SelectRoot,
|
|
@@ -4336,7 +4353,7 @@ var Select = React29__namespace.forwardRef((props, ref) => {
|
|
|
4336
4353
|
) }),
|
|
4337
4354
|
/* @__PURE__ */ jsxRuntime.jsxs(SelectContent, { portalled, ...contentProps, children: [
|
|
4338
4355
|
contentHeader,
|
|
4339
|
-
collection.items.filter(itemFilter ?? (() => true)).map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4356
|
+
collection.items.filter(itemFilter ?? (() => true)).map((item) => /* @__PURE__ */ jsxRuntime.jsxs(React30__namespace.Fragment, { children: [
|
|
4340
4357
|
/* @__PURE__ */ jsxRuntime.jsx(SelectItem, { item, children: item.renderLabel ? item.renderLabel("item") : item.label }),
|
|
4341
4358
|
item.afterElement
|
|
4342
4359
|
] }, item.value))
|
|
@@ -4345,19 +4362,19 @@ var Select = React29__namespace.forwardRef((props, ref) => {
|
|
|
4345
4362
|
}
|
|
4346
4363
|
);
|
|
4347
4364
|
});
|
|
4348
|
-
var SelectAsync =
|
|
4365
|
+
var SelectAsync = React30__namespace.forwardRef((props, ref) => {
|
|
4349
4366
|
const { placeholder, portalled = true, loading, loadOptions, extraControls, onValueChange, errorText, mode, contentHeader, ...rest } = props;
|
|
4350
|
-
const [collection, setCollection] =
|
|
4351
|
-
const [inputValue, setInputValue] =
|
|
4352
|
-
const [value, setValue] =
|
|
4367
|
+
const [collection, setCollection] = React30__namespace.useState(createListCollection({ items: [] }));
|
|
4368
|
+
const [inputValue, setInputValue] = React30__namespace.useState("");
|
|
4369
|
+
const [value, setValue] = React30__namespace.useState([]);
|
|
4353
4370
|
const debouncedInputValue = usehooks.useDebounce(inputValue, 300);
|
|
4354
|
-
|
|
4371
|
+
React30__namespace.useEffect(() => {
|
|
4355
4372
|
loadOptions(debouncedInputValue, value).then(setCollection);
|
|
4356
4373
|
}, [debouncedInputValue, loadOptions, value]);
|
|
4357
|
-
const handleFilterChange =
|
|
4374
|
+
const handleFilterChange = React30__namespace.useCallback((val) => {
|
|
4358
4375
|
setInputValue(val);
|
|
4359
4376
|
}, []);
|
|
4360
|
-
const handleValueChange =
|
|
4377
|
+
const handleValueChange = React30__namespace.useCallback(({ value: v, items }) => {
|
|
4361
4378
|
setValue(v);
|
|
4362
4379
|
onValueChange?.({ value: v, items });
|
|
4363
4380
|
}, [onValueChange]);
|
|
@@ -4416,7 +4433,7 @@ var VERTICAL_SIZE_CLASSES = {
|
|
|
4416
4433
|
md: "border-l-2",
|
|
4417
4434
|
lg: "border-l-[3px]"
|
|
4418
4435
|
};
|
|
4419
|
-
var Separator2 =
|
|
4436
|
+
var Separator2 = React30__namespace.default.forwardRef(
|
|
4420
4437
|
function Separator3({ orientation = "horizontal", variant = "solid", size = "sm", className, ...rest }, ref) {
|
|
4421
4438
|
const isVertical = orientation === "vertical";
|
|
4422
4439
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -4440,7 +4457,7 @@ var Separator2 = React29__namespace.default.forwardRef(
|
|
|
4440
4457
|
);
|
|
4441
4458
|
var THUMB_SIZE = 20;
|
|
4442
4459
|
var TRACK_HEIGHT = 6;
|
|
4443
|
-
var Slider =
|
|
4460
|
+
var Slider = React30__namespace.forwardRef(
|
|
4444
4461
|
function Slider2(props, ref) {
|
|
4445
4462
|
const {
|
|
4446
4463
|
marks: marksProp,
|
|
@@ -4559,7 +4576,7 @@ var SIZE_CLASSES9 = {
|
|
|
4559
4576
|
label: "text-base"
|
|
4560
4577
|
}
|
|
4561
4578
|
};
|
|
4562
|
-
var SwitchBase =
|
|
4579
|
+
var SwitchBase = React30__namespace.forwardRef(
|
|
4563
4580
|
function Switch(props, ref) {
|
|
4564
4581
|
const {
|
|
4565
4582
|
inputProps,
|
|
@@ -4578,10 +4595,10 @@ var SwitchBase = React29__namespace.forwardRef(
|
|
|
4578
4595
|
className,
|
|
4579
4596
|
...rest
|
|
4580
4597
|
} = props;
|
|
4581
|
-
const [internalChecked, setInternalChecked] =
|
|
4598
|
+
const [internalChecked, setInternalChecked] = React30__namespace.useState(defaultChecked ?? false);
|
|
4582
4599
|
const isControlled = checkedProp !== void 0;
|
|
4583
4600
|
const checkedState = isControlled ? checkedProp : internalChecked;
|
|
4584
|
-
const handleCheckedChange =
|
|
4601
|
+
const handleCheckedChange = React30__namespace.useCallback(
|
|
4585
4602
|
(nextChecked) => {
|
|
4586
4603
|
if (!isControlled) {
|
|
4587
4604
|
setInternalChecked(nextChecked);
|
|
@@ -4846,7 +4863,7 @@ function resolveResponsive(value) {
|
|
|
4846
4863
|
}
|
|
4847
4864
|
return void 0;
|
|
4848
4865
|
}
|
|
4849
|
-
var TableRoot =
|
|
4866
|
+
var TableRoot = React30__namespace.forwardRef(
|
|
4850
4867
|
function TableRoot2(props, ref) {
|
|
4851
4868
|
const { className, style: styleProp, children, ...other } = props;
|
|
4852
4869
|
const rawMinW = other.minWidth ?? other.minW;
|
|
@@ -4869,7 +4886,7 @@ var TableRoot = React29__namespace.forwardRef(
|
|
|
4869
4886
|
);
|
|
4870
4887
|
}
|
|
4871
4888
|
);
|
|
4872
|
-
var TableHeader =
|
|
4889
|
+
var TableHeader = React30__namespace.forwardRef(
|
|
4873
4890
|
function TableHeader2(props, ref) {
|
|
4874
4891
|
const { className, style: styleProp, children, ...other } = props;
|
|
4875
4892
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -4886,7 +4903,7 @@ var TableHeader = React29__namespace.forwardRef(
|
|
|
4886
4903
|
);
|
|
4887
4904
|
}
|
|
4888
4905
|
);
|
|
4889
|
-
var TableBody =
|
|
4906
|
+
var TableBody = React30__namespace.forwardRef(
|
|
4890
4907
|
function TableBody2(props, ref) {
|
|
4891
4908
|
const { className, style: styleProp, children, ...other } = props;
|
|
4892
4909
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -4903,7 +4920,7 @@ var TableBody = React29__namespace.forwardRef(
|
|
|
4903
4920
|
);
|
|
4904
4921
|
}
|
|
4905
4922
|
);
|
|
4906
|
-
var TableRow =
|
|
4923
|
+
var TableRow = React30__namespace.forwardRef(
|
|
4907
4924
|
function TableRow2(props, ref) {
|
|
4908
4925
|
const { className, style: styleProp, children, ...other } = props;
|
|
4909
4926
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -4920,7 +4937,7 @@ var TableRow = React29__namespace.forwardRef(
|
|
|
4920
4937
|
);
|
|
4921
4938
|
}
|
|
4922
4939
|
);
|
|
4923
|
-
var TableCell =
|
|
4940
|
+
var TableCell = React30__namespace.forwardRef(
|
|
4924
4941
|
function TableCell2(props, ref) {
|
|
4925
4942
|
const { isNumeric, className, style: styleProp, children, ...other } = props;
|
|
4926
4943
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -4941,7 +4958,7 @@ var TableCell = React29__namespace.forwardRef(
|
|
|
4941
4958
|
);
|
|
4942
4959
|
}
|
|
4943
4960
|
);
|
|
4944
|
-
var TableColumnHeader =
|
|
4961
|
+
var TableColumnHeader = React30__namespace.forwardRef(
|
|
4945
4962
|
function TableColumnHeader2(props, ref) {
|
|
4946
4963
|
const { isNumeric, className, style: styleProp, children, ...other } = props;
|
|
4947
4964
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -4968,7 +4985,7 @@ var TableColumnHeader = React29__namespace.forwardRef(
|
|
|
4968
4985
|
);
|
|
4969
4986
|
var TableColumnHeaderSortable = (props) => {
|
|
4970
4987
|
const { sortField, sortValue, onSortToggle, children, disabled, indicatorPosition = "left", contentAfter, ...rest } = props;
|
|
4971
|
-
const handleSortToggle =
|
|
4988
|
+
const handleSortToggle = React30__namespace.useCallback(() => {
|
|
4972
4989
|
onSortToggle(sortField);
|
|
4973
4990
|
}, [onSortToggle, sortField]);
|
|
4974
4991
|
const isActive = sortValue.includes(sortField);
|
|
@@ -4994,16 +5011,16 @@ var TableColumnHeaderSortable = (props) => {
|
|
|
4994
5011
|
var ACTION_BAR_SHADOW = "0 4px 4px -4px rgb(0 0 0 / 10%), 0 2px 4px -4px rgb(0 0 0 / 6%)";
|
|
4995
5012
|
var TableHeaderSticky = (props) => {
|
|
4996
5013
|
const { top, children, className, style: styleProp, ...rest } = props;
|
|
4997
|
-
const ref =
|
|
4998
|
-
const [isStuck, setIsStuck] =
|
|
4999
|
-
const handleScroll =
|
|
5014
|
+
const ref = React30__namespace.useRef(null);
|
|
5015
|
+
const [isStuck, setIsStuck] = React30__namespace.useState(false);
|
|
5016
|
+
const handleScroll = React30__namespace.useCallback(() => {
|
|
5000
5017
|
if (Number(ref.current?.getBoundingClientRect().y) <= (Number(top) || 0)) {
|
|
5001
5018
|
setIsStuck(true);
|
|
5002
5019
|
} else {
|
|
5003
5020
|
setIsStuck(false);
|
|
5004
5021
|
}
|
|
5005
5022
|
}, [top]);
|
|
5006
|
-
|
|
5023
|
+
React30__namespace.useEffect(() => {
|
|
5007
5024
|
const throttledHandleScroll = esToolkit.throttle(handleScroll, 300);
|
|
5008
5025
|
window.addEventListener("scroll", throttledHandleScroll);
|
|
5009
5026
|
return () => {
|
|
@@ -5025,7 +5042,7 @@ var TableHeaderSticky = (props) => {
|
|
|
5025
5042
|
}
|
|
5026
5043
|
);
|
|
5027
5044
|
};
|
|
5028
|
-
var TableCaption =
|
|
5045
|
+
var TableCaption = React30__namespace.forwardRef(
|
|
5029
5046
|
function TableCaption2(props, ref) {
|
|
5030
5047
|
const { className, style: styleProp, children, ...other } = props;
|
|
5031
5048
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -5042,7 +5059,7 @@ var TableCaption = React29__namespace.forwardRef(
|
|
|
5042
5059
|
);
|
|
5043
5060
|
}
|
|
5044
5061
|
);
|
|
5045
|
-
var TableFooter =
|
|
5062
|
+
var TableFooter = React30__namespace.forwardRef(
|
|
5046
5063
|
function TableFooter2(props, ref) {
|
|
5047
5064
|
const { className, style: styleProp, children, ...other } = props;
|
|
5048
5065
|
const { style: extracted, rest } = extractStyles(other);
|
|
@@ -5059,7 +5076,7 @@ var TableFooter = React29__namespace.forwardRef(
|
|
|
5059
5076
|
);
|
|
5060
5077
|
}
|
|
5061
5078
|
);
|
|
5062
|
-
var TableScrollWrapper =
|
|
5079
|
+
var TableScrollWrapper = React30__namespace.forwardRef(
|
|
5063
5080
|
function TableScrollWrapper2(props, ref) {
|
|
5064
5081
|
const { className, children, ...rest } = props;
|
|
5065
5082
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -5078,7 +5095,7 @@ var ROOT_SIZE_CLASSES = {
|
|
|
5078
5095
|
md: "[--tabs-height:2.5rem] [--tabs-content-padding:1.5rem]",
|
|
5079
5096
|
free: ""
|
|
5080
5097
|
};
|
|
5081
|
-
var TabsRoot =
|
|
5098
|
+
var TabsRoot = React30__namespace.forwardRef(
|
|
5082
5099
|
function TabsRoot2(props, ref) {
|
|
5083
5100
|
const {
|
|
5084
5101
|
variant = "solid",
|
|
@@ -5090,7 +5107,7 @@ var TabsRoot = React29__namespace.forwardRef(
|
|
|
5090
5107
|
className,
|
|
5091
5108
|
...rest
|
|
5092
5109
|
} = props;
|
|
5093
|
-
const handleValueChange =
|
|
5110
|
+
const handleValueChange = React30__namespace.useCallback(
|
|
5094
5111
|
(value) => {
|
|
5095
5112
|
if (!onValueChange) return;
|
|
5096
5113
|
onValueChange({ value });
|
|
@@ -5115,7 +5132,7 @@ var TabsRoot = React29__namespace.forwardRef(
|
|
|
5115
5132
|
);
|
|
5116
5133
|
}
|
|
5117
5134
|
);
|
|
5118
|
-
var TabsList =
|
|
5135
|
+
var TabsList = React30__namespace.forwardRef(
|
|
5119
5136
|
function TabsList2(props, ref) {
|
|
5120
5137
|
const {
|
|
5121
5138
|
className,
|
|
@@ -5169,7 +5186,7 @@ var TRIGGER_VARIANT_CLASSES = {
|
|
|
5169
5186
|
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",
|
|
5170
5187
|
unstyled: ""
|
|
5171
5188
|
};
|
|
5172
|
-
var TabsTrigger =
|
|
5189
|
+
var TabsTrigger = React30__namespace.forwardRef(
|
|
5173
5190
|
function TabsTrigger2(props, ref) {
|
|
5174
5191
|
const {
|
|
5175
5192
|
className,
|
|
@@ -5189,7 +5206,7 @@ var TabsTrigger = React29__namespace.forwardRef(
|
|
|
5189
5206
|
visibility: _visibility,
|
|
5190
5207
|
...rest
|
|
5191
5208
|
} = props;
|
|
5192
|
-
const internalRef =
|
|
5209
|
+
const internalRef = React30__namespace.useRef(null);
|
|
5193
5210
|
const mergedRef = useMergedRef(ref, internalRef);
|
|
5194
5211
|
const { variant, size, fitted } = useTabsContext(internalRef);
|
|
5195
5212
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -5209,7 +5226,7 @@ var TabsTrigger = React29__namespace.forwardRef(
|
|
|
5209
5226
|
);
|
|
5210
5227
|
}
|
|
5211
5228
|
);
|
|
5212
|
-
var TabsContent =
|
|
5229
|
+
var TabsContent = React30__namespace.forwardRef(
|
|
5213
5230
|
function TabsContent2(props, ref) {
|
|
5214
5231
|
const { className, padding: _padding, ...rest } = props;
|
|
5215
5232
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -5243,8 +5260,8 @@ var TabsCounter = ({ count }) => {
|
|
|
5243
5260
|
);
|
|
5244
5261
|
};
|
|
5245
5262
|
function useTabsContext(triggerRef) {
|
|
5246
|
-
const [ctx, setCtx] =
|
|
5247
|
-
|
|
5263
|
+
const [ctx, setCtx] = React30__namespace.useState({ variant: "solid", size: "md", fitted: false });
|
|
5264
|
+
React30__namespace.useEffect(() => {
|
|
5248
5265
|
const el = triggerRef.current;
|
|
5249
5266
|
if (!el) return;
|
|
5250
5267
|
const root = el.closest("[data-variant]");
|
|
@@ -5258,7 +5275,7 @@ function useTabsContext(triggerRef) {
|
|
|
5258
5275
|
return ctx;
|
|
5259
5276
|
}
|
|
5260
5277
|
function useMergedRef(...refs) {
|
|
5261
|
-
return
|
|
5278
|
+
return React30__namespace.useCallback(
|
|
5262
5279
|
(instance) => {
|
|
5263
5280
|
for (const ref of refs) {
|
|
5264
5281
|
if (!ref) continue;
|
|
@@ -5296,7 +5313,7 @@ var TAG_SELECTED_CLASSES = [
|
|
|
5296
5313
|
"hover:opacity-76"
|
|
5297
5314
|
].join(" ");
|
|
5298
5315
|
var TAG_DISABLED_CLASSES = "opacity-40 pointer-events-none cursor-not-allowed";
|
|
5299
|
-
var Tag =
|
|
5316
|
+
var Tag = React30__namespace.forwardRef(
|
|
5300
5317
|
function Tag2(props, ref) {
|
|
5301
5318
|
const {
|
|
5302
5319
|
variant,
|
|
@@ -5383,7 +5400,7 @@ var TEXTAREA_VARIANT_CLASSES = {
|
|
|
5383
5400
|
filled: "border-0 bg-[var(--color-input-filled-bg,theme(colors.gray.100))]",
|
|
5384
5401
|
unstyled: "border-0 bg-transparent p-0"
|
|
5385
5402
|
};
|
|
5386
|
-
var Textarea =
|
|
5403
|
+
var Textarea = React30__namespace.default.forwardRef(
|
|
5387
5404
|
({ size = "md", variant = "outline", className, ...rest }, ref) => {
|
|
5388
5405
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5389
5406
|
"textarea",
|
|
@@ -5486,9 +5503,6 @@ var Toaster = () => {
|
|
|
5486
5503
|
}
|
|
5487
5504
|
);
|
|
5488
5505
|
};
|
|
5489
|
-
function Provider(props) {
|
|
5490
|
-
return /* @__PURE__ */ jsxRuntime.jsx(ColorModeProvider, { ...props });
|
|
5491
|
-
}
|
|
5492
5506
|
function fmt(n, decimals = 2) {
|
|
5493
5507
|
if (n === void 0 || n === null) return "-";
|
|
5494
5508
|
return n.toFixed(decimals);
|
|
@@ -5522,7 +5536,7 @@ function QuoteCell({ value, highlight, align = "right", onClick, className }) {
|
|
|
5522
5536
|
}
|
|
5523
5537
|
var CALL_HEADERS = ["Bid", "Ask", "Last", "Vol", "OI", "IV", "Delta"];
|
|
5524
5538
|
var PUT_HEADERS = ["Delta", "IV", "OI", "Vol", "Last", "Ask", "Bid"];
|
|
5525
|
-
var OptionChain =
|
|
5539
|
+
var OptionChain = React30__namespace.forwardRef(
|
|
5526
5540
|
function OptionChain2(props, ref) {
|
|
5527
5541
|
const {
|
|
5528
5542
|
symbol: _symbol,
|
|
@@ -5533,7 +5547,7 @@ var OptionChain = React29__namespace.forwardRef(
|
|
|
5533
5547
|
className,
|
|
5534
5548
|
...rest
|
|
5535
5549
|
} = props;
|
|
5536
|
-
const handleClick =
|
|
5550
|
+
const handleClick = React30__namespace.useCallback(
|
|
5537
5551
|
(quote, type, strike) => {
|
|
5538
5552
|
if (!quote || !onSelectContract) return;
|
|
5539
5553
|
onSelectContract({
|
|
@@ -5713,7 +5727,7 @@ function GreekItem({ def, value, compact }) {
|
|
|
5713
5727
|
}
|
|
5714
5728
|
);
|
|
5715
5729
|
}
|
|
5716
|
-
var GreeksDisplay =
|
|
5730
|
+
var GreeksDisplay = React30__namespace.forwardRef(
|
|
5717
5731
|
function GreeksDisplay2(props, ref) {
|
|
5718
5732
|
const {
|
|
5719
5733
|
delta,
|
|
@@ -5944,7 +5958,7 @@ function LegRow({ leg, index, strikes, expirations, removable, onChange, onRemov
|
|
|
5944
5958
|
)
|
|
5945
5959
|
] });
|
|
5946
5960
|
}
|
|
5947
|
-
var StrategyBuilder =
|
|
5961
|
+
var StrategyBuilder = React30__namespace.forwardRef(
|
|
5948
5962
|
function StrategyBuilder2(props, ref) {
|
|
5949
5963
|
const {
|
|
5950
5964
|
underlying,
|
|
@@ -5956,12 +5970,12 @@ var StrategyBuilder = React29__namespace.forwardRef(
|
|
|
5956
5970
|
...rest
|
|
5957
5971
|
} = props;
|
|
5958
5972
|
const defaultExp = expirations[0] ?? "";
|
|
5959
|
-
const [strategyType, setStrategyType] =
|
|
5960
|
-
const [legs, setLegs] =
|
|
5973
|
+
const [strategyType, setStrategyType] = React30__namespace.useState("bull_call_spread");
|
|
5974
|
+
const [legs, setLegs] = React30__namespace.useState(() => {
|
|
5961
5975
|
const preset = STRATEGY_PRESETS.find((p) => p.value === "bull_call_spread");
|
|
5962
5976
|
return preset ? preset.buildLegs(strikes, spotPrice, defaultExp) : [];
|
|
5963
5977
|
});
|
|
5964
|
-
const handleStrategyChange =
|
|
5978
|
+
const handleStrategyChange = React30__namespace.useCallback(
|
|
5965
5979
|
(e) => {
|
|
5966
5980
|
const type = e.target.value;
|
|
5967
5981
|
setStrategyType(type);
|
|
@@ -5972,7 +5986,7 @@ var StrategyBuilder = React29__namespace.forwardRef(
|
|
|
5972
5986
|
},
|
|
5973
5987
|
[strikes, spotPrice, defaultExp]
|
|
5974
5988
|
);
|
|
5975
|
-
const handleLegChange =
|
|
5989
|
+
const handleLegChange = React30__namespace.useCallback(
|
|
5976
5990
|
(index, leg) => {
|
|
5977
5991
|
setLegs((prev) => {
|
|
5978
5992
|
const next = [...prev];
|
|
@@ -5982,13 +5996,13 @@ var StrategyBuilder = React29__namespace.forwardRef(
|
|
|
5982
5996
|
},
|
|
5983
5997
|
[]
|
|
5984
5998
|
);
|
|
5985
|
-
const handleLegRemove =
|
|
5999
|
+
const handleLegRemove = React30__namespace.useCallback(
|
|
5986
6000
|
(index) => {
|
|
5987
6001
|
setLegs((prev) => prev.filter((_, i) => i !== index));
|
|
5988
6002
|
},
|
|
5989
6003
|
[]
|
|
5990
6004
|
);
|
|
5991
|
-
const handleAddLeg =
|
|
6005
|
+
const handleAddLeg = React30__namespace.useCallback(() => {
|
|
5992
6006
|
if (legs.length >= 4) return;
|
|
5993
6007
|
const atm = findATM(strikes, spotPrice);
|
|
5994
6008
|
setLegs((prev) => [
|
|
@@ -5996,14 +6010,14 @@ var StrategyBuilder = React29__namespace.forwardRef(
|
|
|
5996
6010
|
{ action: "buy", type: "call", strike: atm, expiration: defaultExp, quantity: 1 }
|
|
5997
6011
|
]);
|
|
5998
6012
|
}, [legs.length, strikes, spotPrice, defaultExp]);
|
|
5999
|
-
const netPremium =
|
|
6013
|
+
const netPremium = React30__namespace.useMemo(() => {
|
|
6000
6014
|
return legs.reduce((sum, leg) => {
|
|
6001
6015
|
if (leg.premium === void 0) return sum;
|
|
6002
6016
|
const sign = leg.action === "buy" ? -1 : 1;
|
|
6003
6017
|
return sum + sign * leg.premium * leg.quantity;
|
|
6004
6018
|
}, 0);
|
|
6005
6019
|
}, [legs]);
|
|
6006
|
-
const handleSubmit =
|
|
6020
|
+
const handleSubmit = React30__namespace.useCallback(() => {
|
|
6007
6021
|
if (!onSubmit || legs.length === 0) return;
|
|
6008
6022
|
onSubmit({
|
|
6009
6023
|
type: strategyType,
|
|
@@ -6124,7 +6138,7 @@ function buildPath(points, vb, width, height) {
|
|
|
6124
6138
|
return parts.join(" ");
|
|
6125
6139
|
}
|
|
6126
6140
|
var LEG_COLORS = ["#6366f1", "#f59e0b", "#ec4899", "#06b6d4"];
|
|
6127
|
-
var PnlDiagram =
|
|
6141
|
+
var PnlDiagram = React30__namespace.forwardRef(
|
|
6128
6142
|
function PnlDiagram2(props, ref) {
|
|
6129
6143
|
const {
|
|
6130
6144
|
legs,
|
|
@@ -6133,10 +6147,10 @@ var PnlDiagram = React29__namespace.forwardRef(
|
|
|
6133
6147
|
className,
|
|
6134
6148
|
...rest
|
|
6135
6149
|
} = props;
|
|
6136
|
-
const containerRef =
|
|
6137
|
-
const [hoverX, setHoverX] =
|
|
6138
|
-
const [dims, setDims] =
|
|
6139
|
-
|
|
6150
|
+
const containerRef = React30__namespace.useRef(null);
|
|
6151
|
+
const [hoverX, setHoverX] = React30__namespace.useState(null);
|
|
6152
|
+
const [dims, setDims] = React30__namespace.useState({ width: 600, height: 240 });
|
|
6153
|
+
React30__namespace.useEffect(() => {
|
|
6140
6154
|
const el = containerRef.current;
|
|
6141
6155
|
if (!el) return;
|
|
6142
6156
|
const observer = new ResizeObserver((entries) => {
|
|
@@ -6159,7 +6173,7 @@ var PnlDiagram = React29__namespace.forwardRef(
|
|
|
6159
6173
|
const xMax = maxStrike + range * 0.3;
|
|
6160
6174
|
const SAMPLES = 200;
|
|
6161
6175
|
const step = (xMax - xMin) / SAMPLES;
|
|
6162
|
-
const combinedPoints =
|
|
6176
|
+
const combinedPoints = React30__namespace.useMemo(() => {
|
|
6163
6177
|
const pts = [];
|
|
6164
6178
|
for (let i = 0; i <= SAMPLES; i++) {
|
|
6165
6179
|
const price = xMin + i * step;
|
|
@@ -6167,7 +6181,7 @@ var PnlDiagram = React29__namespace.forwardRef(
|
|
|
6167
6181
|
}
|
|
6168
6182
|
return pts;
|
|
6169
6183
|
}, [legs, multiplier, xMin, step]);
|
|
6170
|
-
const legPointSets =
|
|
6184
|
+
const legPointSets = React30__namespace.useMemo(() => {
|
|
6171
6185
|
return legs.map((leg) => {
|
|
6172
6186
|
const pts = [];
|
|
6173
6187
|
for (let i = 0; i <= SAMPLES; i++) {
|
|
@@ -6188,7 +6202,7 @@ var PnlDiagram = React29__namespace.forwardRef(
|
|
|
6188
6202
|
const chartH = height - PADDING.top - PADDING.bottom;
|
|
6189
6203
|
const scaleX = (x) => PADDING.left + (x - vb.xMin) / (vb.xMax - vb.xMin) * chartW;
|
|
6190
6204
|
const scaleY = (y) => PADDING.top + chartH - (y - vb.yMin) / (vb.yMax - vb.yMin) * chartH;
|
|
6191
|
-
const breakevens =
|
|
6205
|
+
const breakevens = React30__namespace.useMemo(() => {
|
|
6192
6206
|
const pts = [];
|
|
6193
6207
|
for (let i = 1; i < combinedPoints.length; i++) {
|
|
6194
6208
|
const prev = combinedPoints[i - 1];
|
|
@@ -6205,7 +6219,7 @@ var PnlDiagram = React29__namespace.forwardRef(
|
|
|
6205
6219
|
const maxGainPoint = combinedPoints.find((p) => p.y === maxGain);
|
|
6206
6220
|
const maxLossPoint = combinedPoints.find((p) => p.y === maxLoss);
|
|
6207
6221
|
const zeroY = scaleY(0);
|
|
6208
|
-
const handleMouseMove =
|
|
6222
|
+
const handleMouseMove = React30__namespace.useCallback(
|
|
6209
6223
|
(e) => {
|
|
6210
6224
|
const rect = e.currentTarget.getBoundingClientRect();
|
|
6211
6225
|
const mouseX = e.clientX - rect.left;
|
|
@@ -6218,7 +6232,7 @@ var PnlDiagram = React29__namespace.forwardRef(
|
|
|
6218
6232
|
},
|
|
6219
6233
|
[vb.xMin, vb.xMax, chartW]
|
|
6220
6234
|
);
|
|
6221
|
-
const handleMouseLeave =
|
|
6235
|
+
const handleMouseLeave = React30__namespace.useCallback(() => setHoverX(null), []);
|
|
6222
6236
|
const hoverPnl = hoverX !== null ? calcTotalPnl(legs, hoverX, multiplier) : null;
|
|
6223
6237
|
buildPath(
|
|
6224
6238
|
combinedPoints.map((p) => ({ x: scaleX(p.x), y: scaleY(p.y) })).map((p) => ({ x: p.x - PADDING.left, y: p.y - PADDING.top })),
|
|
@@ -6522,7 +6536,7 @@ function formatDate(date) {
|
|
|
6522
6536
|
const d = new Date(date);
|
|
6523
6537
|
return d.toLocaleDateString("en-US", { month: "short", day: "numeric" });
|
|
6524
6538
|
}
|
|
6525
|
-
var OptionPositionCard =
|
|
6539
|
+
var OptionPositionCard = React30__namespace.forwardRef(
|
|
6526
6540
|
function OptionPositionCard2(props, ref) {
|
|
6527
6541
|
const {
|
|
6528
6542
|
position,
|
|
@@ -6684,7 +6698,7 @@ function ExpirationPill({ exp, isSelected, onClick }) {
|
|
|
6684
6698
|
}
|
|
6685
6699
|
);
|
|
6686
6700
|
}
|
|
6687
|
-
var ExpirationSelector =
|
|
6701
|
+
var ExpirationSelector = React30__namespace.forwardRef(
|
|
6688
6702
|
function ExpirationSelector2(props, ref) {
|
|
6689
6703
|
const {
|
|
6690
6704
|
expirations,
|
|
@@ -6694,8 +6708,8 @@ var ExpirationSelector = React29__namespace.forwardRef(
|
|
|
6694
6708
|
className,
|
|
6695
6709
|
...rest
|
|
6696
6710
|
} = props;
|
|
6697
|
-
const scrollRef =
|
|
6698
|
-
|
|
6711
|
+
const scrollRef = React30__namespace.useRef(null);
|
|
6712
|
+
React30__namespace.useEffect(() => {
|
|
6699
6713
|
const container = scrollRef.current;
|
|
6700
6714
|
if (!container) return;
|
|
6701
6715
|
const selectedEl = container.querySelector('[data-selected="true"]');
|
|
@@ -7012,6 +7026,7 @@ exports.AccordionItemContent = AccordionItemContent;
|
|
|
7012
7026
|
exports.AccordionItemTrigger = AccordionItemTrigger;
|
|
7013
7027
|
exports.AccordionRoot = AccordionRoot;
|
|
7014
7028
|
exports.Alert = Alert;
|
|
7029
|
+
exports.AppProvider = AppProvider;
|
|
7015
7030
|
exports.Avatar = Avatar;
|
|
7016
7031
|
exports.AvatarGroup = AvatarGroup;
|
|
7017
7032
|
exports.Badge = Badge;
|
|
@@ -7101,7 +7116,6 @@ exports.Progress = Progress;
|
|
|
7101
7116
|
exports.ProgressCircleRing = ProgressCircleRing;
|
|
7102
7117
|
exports.ProgressCircleRoot = ProgressCircleRoot;
|
|
7103
7118
|
exports.ProgressCircleValueText = ProgressCircleValueText;
|
|
7104
|
-
exports.Provider = Provider;
|
|
7105
7119
|
exports.Radio = Radio2;
|
|
7106
7120
|
exports.RadioGroup = RadioGroup3;
|
|
7107
7121
|
exports.Rating = Rating;
|