@underverse-ui/underverse 1.0.53 → 1.0.54
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/api-reference.json +1 -1
- package/dist/index.cjs +398 -408
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +0 -13
- package/dist/index.d.ts +0 -13
- package/dist/index.js +186 -196
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -3667,7 +3667,7 @@ var ToastProvider = ({ children, position = "top-right", maxToasts = 5 }) => {
|
|
|
3667
3667
|
return updated.slice(0, maxToasts);
|
|
3668
3668
|
});
|
|
3669
3669
|
},
|
|
3670
|
-
[maxToasts
|
|
3670
|
+
[maxToasts]
|
|
3671
3671
|
);
|
|
3672
3672
|
const positionClasses = {
|
|
3673
3673
|
"top-right": "top-4 right-4",
|
|
@@ -4075,6 +4075,7 @@ var React15 = __toESM(require("react"), 1);
|
|
|
4075
4075
|
var import_react_dom3 = require("react-dom");
|
|
4076
4076
|
|
|
4077
4077
|
// src/utils/animations.ts
|
|
4078
|
+
var import_react8 = require("react");
|
|
4078
4079
|
var shadcnAnimationStyles = `
|
|
4079
4080
|
/* ============================================
|
|
4080
4081
|
* DROPDOWN / POPOVER ANIMATIONS
|
|
@@ -4240,7 +4241,7 @@ var shadcnAnimationStyles = `
|
|
|
4240
4241
|
transition: backdrop-filter 200ms ease, background-color 200ms ease;
|
|
4241
4242
|
}
|
|
4242
4243
|
`;
|
|
4243
|
-
function
|
|
4244
|
+
function ensureAnimationStylesInjected() {
|
|
4244
4245
|
if (typeof document !== "undefined") {
|
|
4245
4246
|
const styleId = "shadcn-animations";
|
|
4246
4247
|
if (!document.getElementById(styleId)) {
|
|
@@ -4251,8 +4252,13 @@ function useShadCNAnimations() {
|
|
|
4251
4252
|
}
|
|
4252
4253
|
}
|
|
4253
4254
|
}
|
|
4255
|
+
function useShadCNAnimations() {
|
|
4256
|
+
(0, import_react8.useEffect)(() => {
|
|
4257
|
+
ensureAnimationStylesInjected();
|
|
4258
|
+
}, []);
|
|
4259
|
+
}
|
|
4254
4260
|
function injectAnimationStyles() {
|
|
4255
|
-
|
|
4261
|
+
ensureAnimationStylesInjected();
|
|
4256
4262
|
}
|
|
4257
4263
|
function getAnimationStyles() {
|
|
4258
4264
|
return shadcnAnimationStyles;
|
|
@@ -4794,7 +4800,7 @@ var SidebarSheet = ({ navigation, children, ...props }) => {
|
|
|
4794
4800
|
};
|
|
4795
4801
|
|
|
4796
4802
|
// src/components/Alert.tsx
|
|
4797
|
-
var
|
|
4803
|
+
var import_react9 = require("react");
|
|
4798
4804
|
var import_lucide_react9 = require("lucide-react");
|
|
4799
4805
|
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
4800
4806
|
var variantConfig = {
|
|
@@ -4835,7 +4841,7 @@ var variantConfig = {
|
|
|
4835
4841
|
}
|
|
4836
4842
|
};
|
|
4837
4843
|
var Alert = ({ title, description, variant = "default", className, icon, dismissible = false, onClose, actions, closeAriaLabel }) => {
|
|
4838
|
-
const [open, setOpen] = (0,
|
|
4844
|
+
const [open, setOpen] = (0, import_react9.useState)(true);
|
|
4839
4845
|
const t = useSmartTranslations("Common");
|
|
4840
4846
|
if (!open) return null;
|
|
4841
4847
|
const handleClose = () => {
|
|
@@ -4880,7 +4886,7 @@ var Alert = ({ title, description, variant = "default", className, icon, dismiss
|
|
|
4880
4886
|
var Alert_default = Alert;
|
|
4881
4887
|
|
|
4882
4888
|
// src/components/GlobalLoading.tsx
|
|
4883
|
-
var
|
|
4889
|
+
var import_react10 = __toESM(require("react"), 1);
|
|
4884
4890
|
var import_lucide_react10 = require("lucide-react");
|
|
4885
4891
|
|
|
4886
4892
|
// src/utils/loading.ts
|
|
@@ -4927,8 +4933,8 @@ var loading = new LoadingManager();
|
|
|
4927
4933
|
// src/components/GlobalLoading.tsx
|
|
4928
4934
|
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
4929
4935
|
var GlobalLoading = ({ className, backdrop = true, position = "fixed", size = "lg" }) => {
|
|
4930
|
-
const [state, setState] = (0,
|
|
4931
|
-
(0,
|
|
4936
|
+
const [state, setState] = (0, import_react10.useState)(() => loading.getState());
|
|
4937
|
+
(0, import_react10.useEffect)(() => {
|
|
4932
4938
|
const unsubscribe = loading.subscribe(setState);
|
|
4933
4939
|
return unsubscribe;
|
|
4934
4940
|
}, []);
|
|
@@ -4985,7 +4991,7 @@ var InlineLoading = ({ isLoading, text, className, size = "md" }) => {
|
|
|
4985
4991
|
] });
|
|
4986
4992
|
};
|
|
4987
4993
|
var ButtonLoading = ({ isLoading, children, className, disabled, loadingText }) => {
|
|
4988
|
-
const child =
|
|
4994
|
+
const child = import_react10.default.isValidElement(children) ? import_react10.default.cloneElement(children, {
|
|
4989
4995
|
disabled: (children.props?.disabled ?? false) || disabled || isLoading,
|
|
4990
4996
|
"aria-busy": isLoading || void 0
|
|
4991
4997
|
}) : children;
|
|
@@ -5335,7 +5341,7 @@ var VerticalTabs = ({ sidebarWidth = "w-48", className, ...props }) => {
|
|
|
5335
5341
|
};
|
|
5336
5342
|
|
|
5337
5343
|
// src/components/DropdownMenu.tsx
|
|
5338
|
-
var
|
|
5344
|
+
var import_react11 = __toESM(require("react"), 1);
|
|
5339
5345
|
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
5340
5346
|
var DropdownMenu = ({
|
|
5341
5347
|
trigger,
|
|
@@ -5349,18 +5355,18 @@ var DropdownMenu = ({
|
|
|
5349
5355
|
onOpenChange,
|
|
5350
5356
|
items
|
|
5351
5357
|
}) => {
|
|
5352
|
-
const [internalOpen, setInternalOpen] = (0,
|
|
5353
|
-
const triggerRef =
|
|
5354
|
-
const menuRef =
|
|
5355
|
-
const itemsRef =
|
|
5356
|
-
const [activeIndex, setActiveIndex] = (0,
|
|
5358
|
+
const [internalOpen, setInternalOpen] = (0, import_react11.useState)(false);
|
|
5359
|
+
const triggerRef = import_react11.default.useRef(null);
|
|
5360
|
+
const menuRef = import_react11.default.useRef(null);
|
|
5361
|
+
const itemsRef = import_react11.default.useRef([]);
|
|
5362
|
+
const [activeIndex, setActiveIndex] = (0, import_react11.useState)(-1);
|
|
5357
5363
|
useShadCNAnimations();
|
|
5358
5364
|
const open = isOpen !== void 0 ? isOpen : internalOpen;
|
|
5359
5365
|
const setOpen = onOpenChange || setInternalOpen;
|
|
5360
|
-
|
|
5366
|
+
import_react11.default.useEffect(() => {
|
|
5361
5367
|
if (open) setActiveIndex(-1);
|
|
5362
5368
|
}, [open]);
|
|
5363
|
-
|
|
5369
|
+
import_react11.default.useEffect(() => {
|
|
5364
5370
|
if (!open) return;
|
|
5365
5371
|
const handleKeyNav = (e) => {
|
|
5366
5372
|
const active = document.activeElement;
|
|
@@ -5434,7 +5440,7 @@ var DropdownMenu = ({
|
|
|
5434
5440
|
index
|
|
5435
5441
|
);
|
|
5436
5442
|
}) : children });
|
|
5437
|
-
const enhancedTrigger =
|
|
5443
|
+
const enhancedTrigger = import_react11.default.cloneElement(trigger, {
|
|
5438
5444
|
ref: triggerRef,
|
|
5439
5445
|
"aria-haspopup": "menu",
|
|
5440
5446
|
"aria-expanded": open,
|
|
@@ -5548,11 +5554,11 @@ var import_lucide_react13 = require("lucide-react");
|
|
|
5548
5554
|
|
|
5549
5555
|
// src/components/Combobox.tsx
|
|
5550
5556
|
var React22 = __toESM(require("react"), 1);
|
|
5551
|
-
var
|
|
5557
|
+
var import_react13 = require("react");
|
|
5552
5558
|
var import_lucide_react12 = require("lucide-react");
|
|
5553
5559
|
|
|
5554
5560
|
// src/components/OverlayScrollbarProvider.tsx
|
|
5555
|
-
var
|
|
5561
|
+
var import_react12 = require("react");
|
|
5556
5562
|
var import_overlayscrollbars = require("overlayscrollbars");
|
|
5557
5563
|
|
|
5558
5564
|
// src/utils/overlay-scrollbar-controller.ts
|
|
@@ -5718,7 +5724,7 @@ function createOverlayScrollbarController({
|
|
|
5718
5724
|
|
|
5719
5725
|
// src/components/OverlayScrollbarProvider.tsx
|
|
5720
5726
|
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
5721
|
-
var OverlayScrollbarConfigContext = (0,
|
|
5727
|
+
var OverlayScrollbarConfigContext = (0, import_react12.createContext)(DEFAULT_OVERLAY_SCROLLBAR_BEHAVIOR);
|
|
5722
5728
|
function OverlayScrollbarProvider({
|
|
5723
5729
|
enabled = DEFAULT_OVERLAY_SCROLLBAR_BEHAVIOR.enabled,
|
|
5724
5730
|
theme = DEFAULT_OVERLAY_SCROLLBAR_BEHAVIOR.theme,
|
|
@@ -5731,7 +5737,7 @@ function OverlayScrollbarProvider({
|
|
|
5731
5737
|
selector,
|
|
5732
5738
|
children
|
|
5733
5739
|
} = {}) {
|
|
5734
|
-
const value = (0,
|
|
5740
|
+
const value = (0, import_react12.useMemo)(
|
|
5735
5741
|
() => resolveOverlayScrollbarBehavior({
|
|
5736
5742
|
enabled,
|
|
5737
5743
|
theme,
|
|
@@ -5748,32 +5754,15 @@ function OverlayScrollbarProvider({
|
|
|
5748
5754
|
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(OverlayScrollbarConfigContext.Provider, { value, children: children ?? null });
|
|
5749
5755
|
}
|
|
5750
5756
|
function useOverlayScrollbarTarget(targetRef, options = {}) {
|
|
5751
|
-
const inherited = (0,
|
|
5752
|
-
const resolved = (0,
|
|
5757
|
+
const inherited = (0, import_react12.useContext)(OverlayScrollbarConfigContext);
|
|
5758
|
+
const resolved = (0, import_react12.useMemo)(
|
|
5753
5759
|
() => resolveOverlayScrollbarBehavior({
|
|
5754
5760
|
...inherited,
|
|
5755
5761
|
...options
|
|
5756
5762
|
}),
|
|
5757
|
-
[
|
|
5758
|
-
inherited.enabled,
|
|
5759
|
-
inherited.theme,
|
|
5760
|
-
inherited.visibility,
|
|
5761
|
-
inherited.autoHide,
|
|
5762
|
-
inherited.autoHideDelay,
|
|
5763
|
-
inherited.dragScroll,
|
|
5764
|
-
inherited.clickScroll,
|
|
5765
|
-
inherited.exclude,
|
|
5766
|
-
options.enabled,
|
|
5767
|
-
options.theme,
|
|
5768
|
-
options.visibility,
|
|
5769
|
-
options.autoHide,
|
|
5770
|
-
options.autoHideDelay,
|
|
5771
|
-
options.dragScroll,
|
|
5772
|
-
options.clickScroll,
|
|
5773
|
-
options.exclude
|
|
5774
|
-
]
|
|
5763
|
+
[inherited, options]
|
|
5775
5764
|
);
|
|
5776
|
-
(0,
|
|
5765
|
+
(0, import_react12.useEffect)(() => {
|
|
5777
5766
|
if (typeof window === "undefined") return;
|
|
5778
5767
|
const target = targetRef.current;
|
|
5779
5768
|
if (!target) return;
|
|
@@ -5787,17 +5776,7 @@ function useOverlayScrollbarTarget(targetRef, options = {}) {
|
|
|
5787
5776
|
return () => {
|
|
5788
5777
|
controller.destroy();
|
|
5789
5778
|
};
|
|
5790
|
-
}, [
|
|
5791
|
-
targetRef,
|
|
5792
|
-
resolved.enabled,
|
|
5793
|
-
resolved.theme,
|
|
5794
|
-
resolved.visibility,
|
|
5795
|
-
resolved.autoHide,
|
|
5796
|
-
resolved.autoHideDelay,
|
|
5797
|
-
resolved.dragScroll,
|
|
5798
|
-
resolved.clickScroll,
|
|
5799
|
-
resolved.exclude
|
|
5800
|
-
]);
|
|
5779
|
+
}, [targetRef, resolved]);
|
|
5801
5780
|
}
|
|
5802
5781
|
var OverlayScrollbarProvider_default = OverlayScrollbarProvider;
|
|
5803
5782
|
|
|
@@ -5858,7 +5837,7 @@ var Combobox = ({
|
|
|
5858
5837
|
const inputRef = React22.useRef(null);
|
|
5859
5838
|
const optionsViewportRef = React22.useRef(null);
|
|
5860
5839
|
useOverlayScrollbarTarget(optionsViewportRef, { enabled: useOverlayScrollbar });
|
|
5861
|
-
const autoId = (0,
|
|
5840
|
+
const autoId = (0, import_react13.useId)();
|
|
5862
5841
|
const resolvedId = id ? String(id) : `combobox-${autoId}`;
|
|
5863
5842
|
const labelId = label ? `${resolvedId}-label` : void 0;
|
|
5864
5843
|
const enableSearch = options.length > 10;
|
|
@@ -6543,7 +6522,7 @@ var CompactPagination = ({ page, totalPages, onChange, className, disabled = fal
|
|
|
6543
6522
|
};
|
|
6544
6523
|
|
|
6545
6524
|
// src/components/Section.tsx
|
|
6546
|
-
var
|
|
6525
|
+
var import_react14 = __toESM(require("react"), 1);
|
|
6547
6526
|
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
6548
6527
|
var gradientDirectionMap = {
|
|
6549
6528
|
"to-r": "to right",
|
|
@@ -6576,7 +6555,7 @@ var variantClasses = {
|
|
|
6576
6555
|
accent: "bg-accent/10",
|
|
6577
6556
|
gradient: ""
|
|
6578
6557
|
};
|
|
6579
|
-
var Section =
|
|
6558
|
+
var Section = import_react14.default.forwardRef(
|
|
6580
6559
|
({
|
|
6581
6560
|
children,
|
|
6582
6561
|
className,
|
|
@@ -6616,7 +6595,7 @@ Section.displayName = "Section";
|
|
|
6616
6595
|
var Section_default = Section;
|
|
6617
6596
|
|
|
6618
6597
|
// src/components/ScrollArea.tsx
|
|
6619
|
-
var
|
|
6598
|
+
var import_react15 = require("react");
|
|
6620
6599
|
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
6621
6600
|
var variantClasses2 = {
|
|
6622
6601
|
default: "bg-background",
|
|
@@ -6624,9 +6603,9 @@ var variantClasses2 = {
|
|
|
6624
6603
|
primary: "bg-primary/5",
|
|
6625
6604
|
accent: "bg-accent/10"
|
|
6626
6605
|
};
|
|
6627
|
-
var ScrollArea = (0,
|
|
6606
|
+
var ScrollArea = (0, import_react15.forwardRef)(
|
|
6628
6607
|
({ className, contentClassName, children, variant = "default", outlined = false, useOverlayScrollbar = false, ...props }, ref) => {
|
|
6629
|
-
const viewportRef = (0,
|
|
6608
|
+
const viewportRef = (0, import_react15.useRef)(null);
|
|
6630
6609
|
useOverlayScrollbarTarget(viewportRef, { enabled: useOverlayScrollbar });
|
|
6631
6610
|
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
6632
6611
|
"div",
|
|
@@ -6647,11 +6626,11 @@ var ScrollArea = (0, import_react14.forwardRef)(
|
|
|
6647
6626
|
ScrollArea.displayName = "ScrollArea";
|
|
6648
6627
|
|
|
6649
6628
|
// src/components/OverlayScrollArea.tsx
|
|
6650
|
-
var
|
|
6629
|
+
var import_react16 = require("react");
|
|
6651
6630
|
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
6652
|
-
var OverlayScrollArea = (0,
|
|
6631
|
+
var OverlayScrollArea = (0, import_react16.forwardRef)(
|
|
6653
6632
|
({ className, viewportClassName, viewportProps, enabled = true, overlayScrollbarOptions, children, ...props }, ref) => {
|
|
6654
|
-
const viewportRef = (0,
|
|
6633
|
+
const viewportRef = (0, import_react16.useRef)(null);
|
|
6655
6634
|
useOverlayScrollbarTarget(viewportRef, {
|
|
6656
6635
|
enabled,
|
|
6657
6636
|
...overlayScrollbarOptions
|
|
@@ -6886,7 +6865,7 @@ function formatDateSmart(date, locale = "en") {
|
|
|
6886
6865
|
// src/components/DatePicker.tsx
|
|
6887
6866
|
var import_lucide_react14 = require("lucide-react");
|
|
6888
6867
|
var React26 = __toESM(require("react"), 1);
|
|
6889
|
-
var
|
|
6868
|
+
var import_react17 = require("react");
|
|
6890
6869
|
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
6891
6870
|
var DatePicker = ({
|
|
6892
6871
|
id,
|
|
@@ -7285,7 +7264,7 @@ var DatePicker = ({
|
|
|
7285
7264
|
)
|
|
7286
7265
|
] })
|
|
7287
7266
|
] });
|
|
7288
|
-
const autoId = (0,
|
|
7267
|
+
const autoId = (0, import_react17.useId)();
|
|
7289
7268
|
const resolvedId = id ? String(id) : `datepicker-${autoId}`;
|
|
7290
7269
|
const labelId = label ? `${resolvedId}-label` : void 0;
|
|
7291
7270
|
const labelSize = sizeStyles8[size].label;
|
|
@@ -11868,6 +11847,7 @@ function useSlotMetrics(args) {
|
|
|
11868
11847
|
}, [
|
|
11869
11848
|
activeView,
|
|
11870
11849
|
adaptiveSlotWidths,
|
|
11850
|
+
bodyClientWidth,
|
|
11871
11851
|
dayHeaderMarks,
|
|
11872
11852
|
dayHeaderSmart,
|
|
11873
11853
|
daySlotCompression,
|
|
@@ -12253,7 +12233,7 @@ function CalendarTimeline({
|
|
|
12253
12233
|
});
|
|
12254
12234
|
React36.useEffect(() => {
|
|
12255
12235
|
onRangeChange?.(range);
|
|
12256
|
-
}, [range
|
|
12236
|
+
}, [range, onRangeChange]);
|
|
12257
12237
|
const leftRef = React36.useRef(null);
|
|
12258
12238
|
const bodyRef = React36.useRef(null);
|
|
12259
12239
|
const headerRef = React36.useRef(null);
|
|
@@ -12565,7 +12545,7 @@ function CalendarTimeline({
|
|
|
12565
12545
|
}
|
|
12566
12546
|
return dayFmt.format(d);
|
|
12567
12547
|
};
|
|
12568
|
-
}, [activeView, dueDateSprint, l.sprint, resolvedLocale, resolvedTimeZone, slotStarts
|
|
12548
|
+
}, [activeView, dueDateSprint, l.sprint, resolvedLocale, resolvedTimeZone, slotStarts]);
|
|
12569
12549
|
const openCreate = React36.useCallback(() => {
|
|
12570
12550
|
if (!canCreate) return;
|
|
12571
12551
|
if (activeEventSheetOpen) setEventSheetOpen(false);
|
|
@@ -12728,7 +12708,7 @@ function CalendarTimeline({
|
|
|
12728
12708
|
return;
|
|
12729
12709
|
}
|
|
12730
12710
|
},
|
|
12731
|
-
[getPointerContext, range.end, range.start, slotToDate, slots.length]
|
|
12711
|
+
[getPointerContext, range.end, range.start, setPreview, slotToDate, slots.length]
|
|
12732
12712
|
);
|
|
12733
12713
|
const flushDragPreview = React36.useCallback(() => {
|
|
12734
12714
|
dragPreviewRafRef.current = null;
|
|
@@ -13472,7 +13452,7 @@ function CalendarTimeline({
|
|
|
13472
13452
|
|
|
13473
13453
|
// src/components/MultiCombobox.tsx
|
|
13474
13454
|
var React37 = __toESM(require("react"), 1);
|
|
13475
|
-
var
|
|
13455
|
+
var import_react18 = require("react");
|
|
13476
13456
|
var import_lucide_react23 = require("lucide-react");
|
|
13477
13457
|
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
13478
13458
|
var MultiCombobox = ({
|
|
@@ -13601,7 +13581,7 @@ var MultiCombobox = ({
|
|
|
13601
13581
|
outline: "border-2 border-input bg-transparent hover:border-primary",
|
|
13602
13582
|
ghost: "border border-transparent bg-muted/50 hover:bg-muted"
|
|
13603
13583
|
};
|
|
13604
|
-
const autoId = (0,
|
|
13584
|
+
const autoId = (0, import_react18.useId)();
|
|
13605
13585
|
const resolvedId = id ? String(id) : `multicombobox-${autoId}`;
|
|
13606
13586
|
const labelId = label ? `${resolvedId}-label` : void 0;
|
|
13607
13587
|
const labelSize = size === "sm" ? "text-xs" : size === "lg" ? "text-base" : "text-sm";
|
|
@@ -14281,7 +14261,10 @@ var Slider = React39.forwardRef(
|
|
|
14281
14261
|
const currentRange = isRangeControlled ? rangeValue : internalRange;
|
|
14282
14262
|
const rangeMin = clamp6(currentRange[0] ?? min, min, max);
|
|
14283
14263
|
const rangeMax = clamp6(currentRange[1] ?? max, min, max);
|
|
14284
|
-
const normalizedRange =
|
|
14264
|
+
const normalizedRange = React39.useMemo(
|
|
14265
|
+
() => rangeMin <= rangeMax ? [rangeMin, rangeMax] : [rangeMax, rangeMin],
|
|
14266
|
+
[rangeMax, rangeMin]
|
|
14267
|
+
);
|
|
14285
14268
|
const handleSingleChange = React39.useCallback(
|
|
14286
14269
|
(e) => {
|
|
14287
14270
|
const newValue = Number(e.target.value);
|
|
@@ -14587,7 +14570,7 @@ Slider.displayName = "Slider";
|
|
|
14587
14570
|
|
|
14588
14571
|
// src/components/OverlayControls.tsx
|
|
14589
14572
|
var import_lucide_react24 = require("lucide-react");
|
|
14590
|
-
var
|
|
14573
|
+
var import_react19 = __toESM(require("react"), 1);
|
|
14591
14574
|
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
14592
14575
|
function OverlayControls({
|
|
14593
14576
|
mode,
|
|
@@ -14618,24 +14601,24 @@ function OverlayControls({
|
|
|
14618
14601
|
}) {
|
|
14619
14602
|
const hoverClasses = showOnHover ? "opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto" : "opacity-100 pointer-events-auto";
|
|
14620
14603
|
const showControlsBar = mode === "review";
|
|
14621
|
-
const [rateOpen, setRateOpen] =
|
|
14622
|
-
const rateWrapRef =
|
|
14623
|
-
const [controlsVisible, setControlsVisible] =
|
|
14624
|
-
const hideTimerRef =
|
|
14625
|
-
const [previewData, setPreviewData] =
|
|
14626
|
-
const sliderRef =
|
|
14627
|
-
const [isDragging, setIsDragging] =
|
|
14628
|
-
const [dragValue, setDragValue] =
|
|
14629
|
-
|
|
14604
|
+
const [rateOpen, setRateOpen] = import_react19.default.useState(false);
|
|
14605
|
+
const rateWrapRef = import_react19.default.useRef(null);
|
|
14606
|
+
const [controlsVisible, setControlsVisible] = import_react19.default.useState(true);
|
|
14607
|
+
const hideTimerRef = import_react19.default.useRef(null);
|
|
14608
|
+
const [previewData, setPreviewData] = import_react19.default.useState(null);
|
|
14609
|
+
const sliderRef = import_react19.default.useRef(null);
|
|
14610
|
+
const [isDragging, setIsDragging] = import_react19.default.useState(false);
|
|
14611
|
+
const [dragValue, setDragValue] = import_react19.default.useState(value);
|
|
14612
|
+
import_react19.default.useEffect(() => {
|
|
14630
14613
|
if (!isDragging) {
|
|
14631
14614
|
setDragValue(value);
|
|
14632
14615
|
}
|
|
14633
14616
|
}, [value, isDragging]);
|
|
14634
|
-
const [keyboardFeedback, setKeyboardFeedback] =
|
|
14635
|
-
const feedbackTimerRef =
|
|
14636
|
-
const seekAccumulatorRef =
|
|
14637
|
-
const seekAccumulatorTimerRef =
|
|
14638
|
-
|
|
14617
|
+
const [keyboardFeedback, setKeyboardFeedback] = import_react19.default.useState(null);
|
|
14618
|
+
const feedbackTimerRef = import_react19.default.useRef(null);
|
|
14619
|
+
const seekAccumulatorRef = import_react19.default.useRef(0);
|
|
14620
|
+
const seekAccumulatorTimerRef = import_react19.default.useRef(null);
|
|
14621
|
+
import_react19.default.useEffect(() => {
|
|
14639
14622
|
const onDocDown = (e) => {
|
|
14640
14623
|
if (!rateOpen) return;
|
|
14641
14624
|
const wrap = rateWrapRef.current;
|
|
@@ -14646,7 +14629,7 @@ function OverlayControls({
|
|
|
14646
14629
|
document.addEventListener("mousedown", onDocDown);
|
|
14647
14630
|
return () => document.removeEventListener("mousedown", onDocDown);
|
|
14648
14631
|
}, [rateOpen]);
|
|
14649
|
-
|
|
14632
|
+
import_react19.default.useEffect(() => {
|
|
14650
14633
|
if (!autoHide || showOnHover) return;
|
|
14651
14634
|
const resetTimer = () => {
|
|
14652
14635
|
if (hideTimerRef.current) clearTimeout(hideTimerRef.current);
|
|
@@ -14669,22 +14652,22 @@ function OverlayControls({
|
|
|
14669
14652
|
document.removeEventListener("mousemove", handleMouseMove);
|
|
14670
14653
|
};
|
|
14671
14654
|
}, [autoHide, autoHideDelay, showOnHover]);
|
|
14672
|
-
const showFeedback = (type, value2) => {
|
|
14655
|
+
const showFeedback = import_react19.default.useCallback((type, value2) => {
|
|
14673
14656
|
if (feedbackTimerRef.current) clearTimeout(feedbackTimerRef.current);
|
|
14674
14657
|
setKeyboardFeedback({ type, value: value2 });
|
|
14675
14658
|
feedbackTimerRef.current = setTimeout(() => {
|
|
14676
14659
|
setKeyboardFeedback(null);
|
|
14677
14660
|
}, 800);
|
|
14678
|
-
};
|
|
14679
|
-
const accumulateSeek = (seconds) => {
|
|
14661
|
+
}, []);
|
|
14662
|
+
const accumulateSeek = import_react19.default.useCallback((seconds) => {
|
|
14680
14663
|
if (seekAccumulatorTimerRef.current) clearTimeout(seekAccumulatorTimerRef.current);
|
|
14681
14664
|
seekAccumulatorRef.current += seconds;
|
|
14682
14665
|
showFeedback("seek", seekAccumulatorRef.current);
|
|
14683
14666
|
seekAccumulatorTimerRef.current = setTimeout(() => {
|
|
14684
14667
|
seekAccumulatorRef.current = 0;
|
|
14685
14668
|
}, 1e3);
|
|
14686
|
-
};
|
|
14687
|
-
|
|
14669
|
+
}, [showFeedback]);
|
|
14670
|
+
import_react19.default.useEffect(() => {
|
|
14688
14671
|
if (!enableKeyboardShortcuts) return;
|
|
14689
14672
|
const handleKeyDown = (e) => {
|
|
14690
14673
|
if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement) return;
|
|
@@ -14782,6 +14765,7 @@ function OverlayControls({
|
|
|
14782
14765
|
onSkip,
|
|
14783
14766
|
skipSeconds,
|
|
14784
14767
|
onChange,
|
|
14768
|
+
onCommit,
|
|
14785
14769
|
value,
|
|
14786
14770
|
max,
|
|
14787
14771
|
onVolumeChange,
|
|
@@ -14789,7 +14773,9 @@ function OverlayControls({
|
|
|
14789
14773
|
onToggleFullscreen,
|
|
14790
14774
|
onToggleMute,
|
|
14791
14775
|
playing,
|
|
14792
|
-
muted
|
|
14776
|
+
muted,
|
|
14777
|
+
accumulateSeek,
|
|
14778
|
+
showFeedback
|
|
14793
14779
|
]);
|
|
14794
14780
|
const formatTime3 = (sec) => {
|
|
14795
14781
|
if (!isFinite(sec) || sec < 0) return "0:00";
|
|
@@ -15019,7 +15005,7 @@ function OverlayControls({
|
|
|
15019
15005
|
}
|
|
15020
15006
|
|
|
15021
15007
|
// src/components/CategoryTreeSelect.tsx
|
|
15022
|
-
var
|
|
15008
|
+
var import_react20 = require("react");
|
|
15023
15009
|
var import_lucide_react25 = require("lucide-react");
|
|
15024
15010
|
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
15025
15011
|
var defaultLabels = {
|
|
@@ -15052,22 +15038,25 @@ function CategoryTreeSelect(props) {
|
|
|
15052
15038
|
useOverlayScrollbar = false,
|
|
15053
15039
|
singleSelect = false
|
|
15054
15040
|
} = props;
|
|
15055
|
-
const [isOpen, setIsOpen] = (0,
|
|
15056
|
-
const [expandedNodes, setExpandedNodes] = (0,
|
|
15057
|
-
const [query, setQuery] = (0,
|
|
15058
|
-
const searchInputRef = (0,
|
|
15059
|
-
const dropdownViewportRef = (0,
|
|
15041
|
+
const [isOpen, setIsOpen] = (0, import_react20.useState)(false);
|
|
15042
|
+
const [expandedNodes, setExpandedNodes] = (0, import_react20.useState)(/* @__PURE__ */ new Set());
|
|
15043
|
+
const [query, setQuery] = (0, import_react20.useState)("");
|
|
15044
|
+
const searchInputRef = (0, import_react20.useRef)(null);
|
|
15045
|
+
const dropdownViewportRef = (0, import_react20.useRef)(null);
|
|
15060
15046
|
useOverlayScrollbarTarget(dropdownViewportRef, { enabled: useOverlayScrollbar });
|
|
15061
|
-
const autoId = (0,
|
|
15047
|
+
const autoId = (0, import_react20.useId)();
|
|
15062
15048
|
const resolvedId = id ? String(id) : `category-tree-select-${autoId}`;
|
|
15063
15049
|
const labelId = label ? `${resolvedId}-label` : void 0;
|
|
15064
15050
|
const helperId = helperText && !error ? `${resolvedId}-helper` : void 0;
|
|
15065
15051
|
const errorId = error ? `${resolvedId}-error` : void 0;
|
|
15066
15052
|
const describedBy = errorId || helperId;
|
|
15067
15053
|
const mergedLabels = { ...defaultLabels, ...labels };
|
|
15068
|
-
const valueArray =
|
|
15069
|
-
|
|
15070
|
-
|
|
15054
|
+
const valueArray = (0, import_react20.useMemo)(
|
|
15055
|
+
() => singleSelect ? props.value != null ? [props.value] : [] : props.value ?? [],
|
|
15056
|
+
[props.value, singleSelect]
|
|
15057
|
+
);
|
|
15058
|
+
const selectedIds = (0, import_react20.useMemo)(() => new Set(valueArray), [valueArray]);
|
|
15059
|
+
const { parentCategories, childrenMap, byId } = (0, import_react20.useMemo)(() => {
|
|
15071
15060
|
const byId2 = /* @__PURE__ */ new Map();
|
|
15072
15061
|
const childrenMap2 = /* @__PURE__ */ new Map();
|
|
15073
15062
|
const parentCategories2 = [];
|
|
@@ -15082,10 +15071,10 @@ function CategoryTreeSelect(props) {
|
|
|
15082
15071
|
}
|
|
15083
15072
|
return { parentCategories: parentCategories2, childrenMap: childrenMap2, byId: byId2 };
|
|
15084
15073
|
}, [categories]);
|
|
15085
|
-
const isSearchEnabled = (0,
|
|
15086
|
-
const normalizedQuery = (0,
|
|
15074
|
+
const isSearchEnabled = (0, import_react20.useMemo)(() => enableSearch ?? categories.length > 10, [enableSearch, categories.length]);
|
|
15075
|
+
const normalizedQuery = (0, import_react20.useMemo)(() => query.trim().toLowerCase(), [query]);
|
|
15087
15076
|
const isSearchMode = isSearchEnabled && normalizedQuery.length > 0;
|
|
15088
|
-
const visibleIds = (0,
|
|
15077
|
+
const visibleIds = (0, import_react20.useMemo)(() => {
|
|
15089
15078
|
if (!isSearchMode) return null;
|
|
15090
15079
|
const matches = categories.filter((c) => c.name.toLowerCase().includes(normalizedQuery));
|
|
15091
15080
|
if (matches.length === 0) return /* @__PURE__ */ new Set();
|
|
@@ -15124,21 +15113,21 @@ function CategoryTreeSelect(props) {
|
|
|
15124
15113
|
}
|
|
15125
15114
|
return visible;
|
|
15126
15115
|
}, [byId, categories, childrenMap, isSearchMode, normalizedQuery]);
|
|
15127
|
-
(0,
|
|
15116
|
+
(0, import_react20.useEffect)(() => {
|
|
15128
15117
|
if (!isOpen) setQuery("");
|
|
15129
15118
|
}, [isOpen]);
|
|
15130
|
-
(0,
|
|
15119
|
+
(0, import_react20.useEffect)(() => {
|
|
15131
15120
|
if (!isOpen) return;
|
|
15132
15121
|
if (!isSearchEnabled) return;
|
|
15133
15122
|
const t = setTimeout(() => searchInputRef.current?.focus(), 50);
|
|
15134
15123
|
return () => clearTimeout(t);
|
|
15135
15124
|
}, [isOpen, isSearchEnabled]);
|
|
15136
|
-
(0,
|
|
15125
|
+
(0, import_react20.useEffect)(() => {
|
|
15137
15126
|
if ((viewOnly || inline) && defaultExpanded) {
|
|
15138
15127
|
const allParentIds = categories.filter((c) => childrenMap.has(c.id)).map((c) => c.id);
|
|
15139
15128
|
setExpandedNodes(new Set(allParentIds));
|
|
15140
15129
|
}
|
|
15141
|
-
}, [viewOnly, inline, defaultExpanded, categories]);
|
|
15130
|
+
}, [viewOnly, inline, defaultExpanded, categories, childrenMap]);
|
|
15142
15131
|
const toggleExpand = (id2) => {
|
|
15143
15132
|
if (isSearchMode) return;
|
|
15144
15133
|
const newExpanded = new Set(expandedNodes);
|
|
@@ -15296,11 +15285,11 @@ function CategoryTreeSelect(props) {
|
|
|
15296
15285
|
)
|
|
15297
15286
|
] }) });
|
|
15298
15287
|
};
|
|
15299
|
-
const effectiveParentCategories = (0,
|
|
15288
|
+
const effectiveParentCategories = (0, import_react20.useMemo)(() => {
|
|
15300
15289
|
if (!isSearchMode) return parentCategories;
|
|
15301
15290
|
return parentCategories.filter((c) => visibleIds?.has(c.id));
|
|
15302
15291
|
}, [isSearchMode, parentCategories, visibleIds]);
|
|
15303
|
-
const effectiveChildrenMap = (0,
|
|
15292
|
+
const effectiveChildrenMap = (0, import_react20.useMemo)(() => {
|
|
15304
15293
|
if (!isSearchMode || !visibleIds) return childrenMap;
|
|
15305
15294
|
const next = /* @__PURE__ */ new Map();
|
|
15306
15295
|
for (const [parentId, children] of childrenMap.entries()) {
|
|
@@ -15470,6 +15459,7 @@ function CategoryTreeSelect(props) {
|
|
|
15470
15459
|
disabled,
|
|
15471
15460
|
role: "combobox",
|
|
15472
15461
|
"aria-haspopup": "tree",
|
|
15462
|
+
"aria-expanded": isOpen,
|
|
15473
15463
|
"aria-controls": `${resolvedId}-tree`,
|
|
15474
15464
|
"aria-labelledby": labelId,
|
|
15475
15465
|
"aria-describedby": describedBy,
|
|
@@ -15541,7 +15531,7 @@ function CategoryTreeSelect(props) {
|
|
|
15541
15531
|
}
|
|
15542
15532
|
|
|
15543
15533
|
// src/components/ImageUpload.tsx
|
|
15544
|
-
var
|
|
15534
|
+
var import_react21 = require("react");
|
|
15545
15535
|
var import_lucide_react26 = require("lucide-react");
|
|
15546
15536
|
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
15547
15537
|
function ImageUpload({
|
|
@@ -15559,10 +15549,10 @@ function ImageUpload({
|
|
|
15559
15549
|
browseText,
|
|
15560
15550
|
supportedFormatsText
|
|
15561
15551
|
}) {
|
|
15562
|
-
const [isDragging, setIsDragging] = (0,
|
|
15563
|
-
const [uploading, setUploading] = (0,
|
|
15564
|
-
const [uploadedImages, setUploadedImages] = (0,
|
|
15565
|
-
const fileInputRef = (0,
|
|
15552
|
+
const [isDragging, setIsDragging] = (0, import_react21.useState)(false);
|
|
15553
|
+
const [uploading, setUploading] = (0, import_react21.useState)(false);
|
|
15554
|
+
const [uploadedImages, setUploadedImages] = (0, import_react21.useState)([]);
|
|
15555
|
+
const fileInputRef = (0, import_react21.useRef)(null);
|
|
15566
15556
|
const { addToast } = useToast();
|
|
15567
15557
|
const t = useSmartTranslations("OCR.imageUpload");
|
|
15568
15558
|
const previewSizes = {
|
|
@@ -15570,7 +15560,7 @@ function ImageUpload({
|
|
|
15570
15560
|
md: "w-24 h-24",
|
|
15571
15561
|
lg: "w-32 h-32"
|
|
15572
15562
|
};
|
|
15573
|
-
const handleDragOver = (0,
|
|
15563
|
+
const handleDragOver = (0, import_react21.useCallback)(
|
|
15574
15564
|
(e) => {
|
|
15575
15565
|
e.preventDefault();
|
|
15576
15566
|
if (!disabled) {
|
|
@@ -15579,11 +15569,11 @@ function ImageUpload({
|
|
|
15579
15569
|
},
|
|
15580
15570
|
[disabled]
|
|
15581
15571
|
);
|
|
15582
|
-
const handleDragLeave = (0,
|
|
15572
|
+
const handleDragLeave = (0, import_react21.useCallback)((e) => {
|
|
15583
15573
|
e.preventDefault();
|
|
15584
15574
|
setIsDragging(false);
|
|
15585
15575
|
}, []);
|
|
15586
|
-
const handleFiles = (0,
|
|
15576
|
+
const handleFiles = (0, import_react21.useCallback)(
|
|
15587
15577
|
async (files) => {
|
|
15588
15578
|
if (files.length === 0) return;
|
|
15589
15579
|
const validFiles = files.filter((file) => {
|
|
@@ -15650,7 +15640,7 @@ function ImageUpload({
|
|
|
15650
15640
|
},
|
|
15651
15641
|
[maxSize, addToast, onUpload]
|
|
15652
15642
|
);
|
|
15653
|
-
const handleDrop = (0,
|
|
15643
|
+
const handleDrop = (0, import_react21.useCallback)(
|
|
15654
15644
|
(e) => {
|
|
15655
15645
|
e.preventDefault();
|
|
15656
15646
|
setIsDragging(false);
|
|
@@ -15660,7 +15650,7 @@ function ImageUpload({
|
|
|
15660
15650
|
},
|
|
15661
15651
|
[disabled, handleFiles]
|
|
15662
15652
|
);
|
|
15663
|
-
const handleFileSelect = (0,
|
|
15653
|
+
const handleFileSelect = (0, import_react21.useCallback)(
|
|
15664
15654
|
(e) => {
|
|
15665
15655
|
const files = Array.from(e.target.files || []);
|
|
15666
15656
|
handleFiles(files);
|
|
@@ -15764,11 +15754,8 @@ function ImageUpload({
|
|
|
15764
15754
|
|
|
15765
15755
|
// src/components/FileUpload.tsx
|
|
15766
15756
|
var import_lucide_react27 = require("lucide-react");
|
|
15767
|
-
var
|
|
15768
|
-
var import_jsx_runtime48 = (
|
|
15769
|
-
// eslint-disable-next-line @next/next/no-img-element
|
|
15770
|
-
require("react/jsx-runtime")
|
|
15771
|
-
);
|
|
15757
|
+
var import_react22 = require("react");
|
|
15758
|
+
var import_jsx_runtime48 = require("react/jsx-runtime");
|
|
15772
15759
|
var formatFileSize = (bytes) => {
|
|
15773
15760
|
if (bytes === 0) return "0 Bytes";
|
|
15774
15761
|
const k = 1024;
|
|
@@ -15874,12 +15861,12 @@ function FileUpload({
|
|
|
15874
15861
|
allowPreview = true,
|
|
15875
15862
|
initialFiles = []
|
|
15876
15863
|
}) {
|
|
15877
|
-
const [isDragging, setIsDragging] = (0,
|
|
15878
|
-
const [files, setFiles] = (0,
|
|
15879
|
-
const fileInputRef = (0,
|
|
15864
|
+
const [isDragging, setIsDragging] = (0, import_react22.useState)(false);
|
|
15865
|
+
const [files, setFiles] = (0, import_react22.useState)(initialFiles);
|
|
15866
|
+
const fileInputRef = (0, import_react22.useRef)(null);
|
|
15880
15867
|
const { addToast } = useToast();
|
|
15881
15868
|
const t = useSmartTranslations("FileUpload");
|
|
15882
|
-
const sizeConfig = (0,
|
|
15869
|
+
const sizeConfig = (0, import_react22.useMemo)(
|
|
15883
15870
|
() => ({
|
|
15884
15871
|
sm: {
|
|
15885
15872
|
padding: "p-4",
|
|
@@ -15912,7 +15899,7 @@ function FileUpload({
|
|
|
15912
15899
|
[]
|
|
15913
15900
|
);
|
|
15914
15901
|
const currentSize = sizeConfig[size];
|
|
15915
|
-
const handleDragOver = (0,
|
|
15902
|
+
const handleDragOver = (0, import_react22.useCallback)(
|
|
15916
15903
|
(e) => {
|
|
15917
15904
|
e.preventDefault();
|
|
15918
15905
|
e.stopPropagation();
|
|
@@ -15922,12 +15909,12 @@ function FileUpload({
|
|
|
15922
15909
|
},
|
|
15923
15910
|
[disabled]
|
|
15924
15911
|
);
|
|
15925
|
-
const handleDragLeave = (0,
|
|
15912
|
+
const handleDragLeave = (0, import_react22.useCallback)((e) => {
|
|
15926
15913
|
e.preventDefault();
|
|
15927
15914
|
e.stopPropagation();
|
|
15928
15915
|
setIsDragging(false);
|
|
15929
15916
|
}, []);
|
|
15930
|
-
const processFiles = (0,
|
|
15917
|
+
const processFiles = (0, import_react22.useCallback)(
|
|
15931
15918
|
async (fileList) => {
|
|
15932
15919
|
if (fileList.length === 0) return;
|
|
15933
15920
|
const remainingSlots = maxFiles - files.length;
|
|
@@ -16000,7 +15987,7 @@ function FileUpload({
|
|
|
16000
15987
|
},
|
|
16001
15988
|
[files, maxFiles, maxSize, uploadHandler, onUpload, onChange, addToast, t]
|
|
16002
15989
|
);
|
|
16003
|
-
const handleDrop = (0,
|
|
15990
|
+
const handleDrop = (0, import_react22.useCallback)(
|
|
16004
15991
|
(e) => {
|
|
16005
15992
|
e.preventDefault();
|
|
16006
15993
|
e.stopPropagation();
|
|
@@ -16011,7 +15998,7 @@ function FileUpload({
|
|
|
16011
15998
|
},
|
|
16012
15999
|
[disabled, processFiles]
|
|
16013
16000
|
);
|
|
16014
|
-
const handleFileSelect = (0,
|
|
16001
|
+
const handleFileSelect = (0, import_react22.useCallback)(
|
|
16015
16002
|
(e) => {
|
|
16016
16003
|
const selectedFiles = Array.from(e.target.files || []);
|
|
16017
16004
|
processFiles(selectedFiles);
|
|
@@ -16021,7 +16008,7 @@ function FileUpload({
|
|
|
16021
16008
|
},
|
|
16022
16009
|
[processFiles]
|
|
16023
16010
|
);
|
|
16024
|
-
const handleRemove = (0,
|
|
16011
|
+
const handleRemove = (0, import_react22.useCallback)(
|
|
16025
16012
|
(fileId) => {
|
|
16026
16013
|
setFiles((prev) => {
|
|
16027
16014
|
const fileToRemove = prev.find((f) => f.id === fileId);
|
|
@@ -16039,7 +16026,7 @@ function FileUpload({
|
|
|
16039
16026
|
const handleBrowseClick = () => {
|
|
16040
16027
|
fileInputRef.current?.click();
|
|
16041
16028
|
};
|
|
16042
|
-
const handleRetry = (0,
|
|
16029
|
+
const handleRetry = (0, import_react22.useCallback)(
|
|
16043
16030
|
(fileEntry) => {
|
|
16044
16031
|
if (!uploadHandler || !fileEntry.file) return;
|
|
16045
16032
|
processFiles([fileEntry.file]);
|
|
@@ -16565,7 +16552,7 @@ function Carousel({
|
|
|
16565
16552
|
}
|
|
16566
16553
|
|
|
16567
16554
|
// src/components/FallingIcons.tsx
|
|
16568
|
-
var
|
|
16555
|
+
var import_react23 = __toESM(require("react"), 1);
|
|
16569
16556
|
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
16570
16557
|
var DEFAULT_COUNT = 24;
|
|
16571
16558
|
var DEFAULT_SPEED_RANGE = [6, 14];
|
|
@@ -16593,10 +16580,10 @@ function FallingIcons({
|
|
|
16593
16580
|
physics,
|
|
16594
16581
|
easingFunction = "linear"
|
|
16595
16582
|
}) {
|
|
16596
|
-
const uid =
|
|
16597
|
-
const containerRef =
|
|
16598
|
-
const [fallDist, setFallDist] =
|
|
16599
|
-
const idRef =
|
|
16583
|
+
const uid = import_react23.default.useId().replace(/[:]/g, "");
|
|
16584
|
+
const containerRef = import_react23.default.useRef(null);
|
|
16585
|
+
const [fallDist, setFallDist] = import_react23.default.useState(null);
|
|
16586
|
+
const idRef = import_react23.default.useRef(1);
|
|
16600
16587
|
const gravity = physics?.gravity ?? 1;
|
|
16601
16588
|
const windDirection = physics?.windDirection ?? 0;
|
|
16602
16589
|
const windStrength = physics?.windStrength ?? 0;
|
|
@@ -16610,7 +16597,7 @@ function FallingIcons({
|
|
|
16610
16597
|
bounce: "cubic-bezier(0.68, -0.55, 0.265, 1.55)",
|
|
16611
16598
|
elastic: "cubic-bezier(0.175, 0.885, 0.32, 1.275)"
|
|
16612
16599
|
};
|
|
16613
|
-
const makeParticle =
|
|
16600
|
+
const makeParticle = import_react23.default.useCallback(() => {
|
|
16614
16601
|
const rnd = (min, max) => min + Math.random() * (max - min);
|
|
16615
16602
|
return {
|
|
16616
16603
|
leftPct: rnd(0, 100),
|
|
@@ -16624,12 +16611,12 @@ function FallingIcons({
|
|
|
16624
16611
|
key: idRef.current++
|
|
16625
16612
|
};
|
|
16626
16613
|
}, [sizeRange, speedRange, horizontalDrift, gravity, windDirection, windStrength]);
|
|
16627
|
-
const [particles, setParticles] =
|
|
16628
|
-
|
|
16614
|
+
const [particles, setParticles] = import_react23.default.useState([]);
|
|
16615
|
+
import_react23.default.useEffect(() => {
|
|
16629
16616
|
const arr = Array.from({ length: Math.max(0, count) }).map(() => makeParticle());
|
|
16630
16617
|
setParticles(arr);
|
|
16631
16618
|
}, [count, makeParticle]);
|
|
16632
|
-
|
|
16619
|
+
import_react23.default.useEffect(() => {
|
|
16633
16620
|
if (fullScreen) {
|
|
16634
16621
|
const measure2 = () => setFallDist(window.innerHeight + 200);
|
|
16635
16622
|
measure2();
|
|
@@ -16654,18 +16641,22 @@ function FallingIcons({
|
|
|
16654
16641
|
const SpinName = `uv-spin-${uid}`;
|
|
16655
16642
|
const PopName = `uv-pop-${uid}`;
|
|
16656
16643
|
const PhysicsSpinName = `uv-physics-spin-${uid}`;
|
|
16657
|
-
const glowStyles =
|
|
16644
|
+
const glowStyles = import_react23.default.useMemo(() => {
|
|
16658
16645
|
if (!glow) return {};
|
|
16659
16646
|
const intensity = Math.max(0, Math.min(1, glowIntensity));
|
|
16660
16647
|
return {
|
|
16661
16648
|
filter: `drop-shadow(0 0 ${4 * intensity}px ${glowColor}) drop-shadow(0 0 ${8 * intensity}px ${glowColor})`
|
|
16662
16649
|
};
|
|
16663
16650
|
}, [glow, glowColor, glowIntensity]);
|
|
16664
|
-
const FallbackIcon =
|
|
16665
|
-
() =>
|
|
16651
|
+
const FallbackIcon = import_react23.default.useMemo(
|
|
16652
|
+
() => function FallingIconsFallbackIcon(props) {
|
|
16653
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("circle", { cx: "12", cy: "12", r: "10" }) });
|
|
16654
|
+
},
|
|
16666
16655
|
[]
|
|
16667
16656
|
);
|
|
16668
|
-
const TheIcon = imageUrl ? ({ className: imgClassName })
|
|
16657
|
+
const TheIcon = imageUrl ? function FallingIconsImage({ className: imgClassName }) {
|
|
16658
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("img", { src: imageUrl, alt: "", className: cn("w-full h-full object-cover rounded-lg", imgClassName), draggable: false });
|
|
16659
|
+
} : Icon || FallbackIcon;
|
|
16669
16660
|
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
|
|
16670
16661
|
"div",
|
|
16671
16662
|
{
|
|
@@ -16719,7 +16710,7 @@ function FallingIcons({
|
|
|
16719
16710
|
});
|
|
16720
16711
|
};
|
|
16721
16712
|
const trailParticles = trail ? Array.from({ length: Math.min(5, Math.max(1, trailLength)) }) : [];
|
|
16722
|
-
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
|
|
16713
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_react23.default.Fragment, { children: [
|
|
16723
16714
|
trail && trailParticles.map((_, trailIndex) => {
|
|
16724
16715
|
const trailDelay = p.delay - (trailIndex + 1) * 0.15;
|
|
16725
16716
|
const trailOpacity = 1 - (trailIndex + 1) * (1 / (trailParticles.length + 1));
|
|
@@ -18126,7 +18117,7 @@ function ColorPicker({
|
|
|
18126
18117
|
}
|
|
18127
18118
|
|
|
18128
18119
|
// src/components/MusicPlayer.tsx
|
|
18129
|
-
var
|
|
18120
|
+
var import_react24 = require("react");
|
|
18130
18121
|
var import_lucide_react32 = require("lucide-react");
|
|
18131
18122
|
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
18132
18123
|
var DEFAULT_PLAYLIST = [
|
|
@@ -18247,21 +18238,21 @@ var MusicPlayer = ({
|
|
|
18247
18238
|
showPlaylist: initialShowPlaylist = true,
|
|
18248
18239
|
className = ""
|
|
18249
18240
|
}) => {
|
|
18250
|
-
const [currentSongIndex, setCurrentSongIndex] = (0,
|
|
18251
|
-
const [isPlaying, setIsPlaying] = (0,
|
|
18252
|
-
const [currentTime, setCurrentTime] = (0,
|
|
18253
|
-
const [duration, setDuration] = (0,
|
|
18254
|
-
const [volume, setVolume] = (0,
|
|
18255
|
-
const [isMuted, setIsMuted] = (0,
|
|
18256
|
-
const [showPlaylist, setShowPlaylist] = (0,
|
|
18257
|
-
const audioRef = (0,
|
|
18241
|
+
const [currentSongIndex, setCurrentSongIndex] = (0, import_react24.useState)(0);
|
|
18242
|
+
const [isPlaying, setIsPlaying] = (0, import_react24.useState)(false);
|
|
18243
|
+
const [currentTime, setCurrentTime] = (0, import_react24.useState)(0);
|
|
18244
|
+
const [duration, setDuration] = (0, import_react24.useState)(0);
|
|
18245
|
+
const [volume, setVolume] = (0, import_react24.useState)(1);
|
|
18246
|
+
const [isMuted, setIsMuted] = (0, import_react24.useState)(false);
|
|
18247
|
+
const [showPlaylist, setShowPlaylist] = (0, import_react24.useState)(initialShowPlaylist);
|
|
18248
|
+
const audioRef = (0, import_react24.useRef)(null);
|
|
18258
18249
|
const currentSong = playlist[currentSongIndex];
|
|
18259
|
-
(0,
|
|
18250
|
+
(0, import_react24.useEffect)(() => {
|
|
18260
18251
|
if (audioRef.current) {
|
|
18261
18252
|
audioRef.current.volume = volume;
|
|
18262
18253
|
}
|
|
18263
18254
|
}, [volume]);
|
|
18264
|
-
(0,
|
|
18255
|
+
(0, import_react24.useEffect)(() => {
|
|
18265
18256
|
if (autoPlay && audioRef.current) {
|
|
18266
18257
|
audioRef.current.play().catch(() => {
|
|
18267
18258
|
setIsPlaying(false);
|
|
@@ -18337,7 +18328,7 @@ var MusicPlayer = ({
|
|
|
18337
18328
|
setCurrentSongIndex(index);
|
|
18338
18329
|
setIsPlaying(true);
|
|
18339
18330
|
};
|
|
18340
|
-
(0,
|
|
18331
|
+
(0, import_react24.useEffect)(() => {
|
|
18341
18332
|
if (audioRef.current) {
|
|
18342
18333
|
if (currentSong.startTime !== void 0) {
|
|
18343
18334
|
audioRef.current.currentTime = currentSong.startTime;
|
|
@@ -18479,7 +18470,7 @@ var MusicPlayer = ({
|
|
|
18479
18470
|
var MusicPlayer_default = MusicPlayer;
|
|
18480
18471
|
|
|
18481
18472
|
// src/components/Grid.tsx
|
|
18482
|
-
var
|
|
18473
|
+
var import_react25 = __toESM(require("react"), 1);
|
|
18483
18474
|
var import_jsx_runtime56 = require("react/jsx-runtime");
|
|
18484
18475
|
var BP_MIN = {
|
|
18485
18476
|
sm: 640,
|
|
@@ -18519,7 +18510,7 @@ function getVariantClasses(variant = "default", outlined) {
|
|
|
18519
18510
|
};
|
|
18520
18511
|
return variants[variant] || "";
|
|
18521
18512
|
}
|
|
18522
|
-
var GridRoot =
|
|
18513
|
+
var GridRoot = import_react25.default.forwardRef(
|
|
18523
18514
|
({
|
|
18524
18515
|
columns,
|
|
18525
18516
|
rows,
|
|
@@ -18544,7 +18535,7 @@ var GridRoot = import_react24.default.forwardRef(
|
|
|
18544
18535
|
children,
|
|
18545
18536
|
...rest
|
|
18546
18537
|
}, ref) => {
|
|
18547
|
-
const id = (0,
|
|
18538
|
+
const id = (0, import_react25.useId)().replace(/[:]/g, "");
|
|
18548
18539
|
const baseClass = `uv-grid-${id}`;
|
|
18549
18540
|
const baseCols = toTemplateCols(columns, minColumnWidth);
|
|
18550
18541
|
const baseRows = toTemplateRows(rows);
|
|
@@ -18603,7 +18594,7 @@ var GridRoot = import_react24.default.forwardRef(
|
|
|
18603
18594
|
}
|
|
18604
18595
|
);
|
|
18605
18596
|
GridRoot.displayName = "Grid";
|
|
18606
|
-
var GridItem =
|
|
18597
|
+
var GridItem = import_react25.default.forwardRef(
|
|
18607
18598
|
({
|
|
18608
18599
|
colSpan,
|
|
18609
18600
|
rowSpan,
|
|
@@ -18667,10 +18658,10 @@ var Grid = Object.assign(GridRoot, { Item: GridItem });
|
|
|
18667
18658
|
var Grid_default = Grid;
|
|
18668
18659
|
|
|
18669
18660
|
// src/components/LineChart.tsx
|
|
18670
|
-
var
|
|
18661
|
+
var import_react27 = require("react");
|
|
18671
18662
|
|
|
18672
18663
|
// src/components/ChartTooltip.tsx
|
|
18673
|
-
var
|
|
18664
|
+
var import_react26 = require("react");
|
|
18674
18665
|
var import_react_dom6 = require("react-dom");
|
|
18675
18666
|
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
18676
18667
|
function ChartTooltip({
|
|
@@ -18686,13 +18677,13 @@ function ChartTooltip({
|
|
|
18686
18677
|
containerRef,
|
|
18687
18678
|
formatter
|
|
18688
18679
|
}) {
|
|
18689
|
-
const [isMounted, setIsMounted] = (0,
|
|
18690
|
-
const [position, setPosition] = (0,
|
|
18691
|
-
const tooltipRef = (0,
|
|
18692
|
-
(0,
|
|
18680
|
+
const [isMounted, setIsMounted] = (0, import_react26.useState)(false);
|
|
18681
|
+
const [position, setPosition] = (0, import_react26.useState)(null);
|
|
18682
|
+
const tooltipRef = (0, import_react26.useRef)(null);
|
|
18683
|
+
(0, import_react26.useEffect)(() => {
|
|
18693
18684
|
setIsMounted(true);
|
|
18694
18685
|
}, []);
|
|
18695
|
-
(0,
|
|
18686
|
+
(0, import_react26.useEffect)(() => {
|
|
18696
18687
|
if (visible && containerRef?.current) {
|
|
18697
18688
|
const rect = containerRef.current.getBoundingClientRect();
|
|
18698
18689
|
const tw = tooltipRef.current?.offsetWidth ?? 160;
|
|
@@ -18769,6 +18760,7 @@ function ChartTooltip({
|
|
|
18769
18760
|
}
|
|
18770
18761
|
|
|
18771
18762
|
// src/utils/chart-utils.ts
|
|
18763
|
+
var React51 = __toESM(require("react"), 1);
|
|
18772
18764
|
function getCatmullRomSpline(points, tension = 0.5) {
|
|
18773
18765
|
if (points.length < 2) return "";
|
|
18774
18766
|
if (points.length === 2) {
|
|
@@ -18817,14 +18809,14 @@ function LineChart({
|
|
|
18817
18809
|
labelClassName,
|
|
18818
18810
|
className = ""
|
|
18819
18811
|
}) {
|
|
18820
|
-
const svgRef = (0,
|
|
18821
|
-
const clipId = (0,
|
|
18812
|
+
const svgRef = (0, import_react27.useRef)(null);
|
|
18813
|
+
const clipId = (0, import_react27.useRef)(`line-clip-${Math.random().toString(36).slice(2, 8)}`).current;
|
|
18822
18814
|
const padding = { top: 20, right: 20, bottom: 40, left: 40 };
|
|
18823
18815
|
const chartWidth = width - padding.left - padding.right;
|
|
18824
18816
|
const chartHeight = height - padding.top - padding.bottom;
|
|
18825
|
-
const [hoveredPoint, setHoveredPoint] = (0,
|
|
18826
|
-
const [hiddenSeries, setHiddenSeries] = (0,
|
|
18827
|
-
const toggleSeries = (0,
|
|
18817
|
+
const [hoveredPoint, setHoveredPoint] = (0, import_react27.useState)(null);
|
|
18818
|
+
const [hiddenSeries, setHiddenSeries] = (0, import_react27.useState)(/* @__PURE__ */ new Set());
|
|
18819
|
+
const toggleSeries = (0, import_react27.useCallback)((name) => {
|
|
18828
18820
|
setHiddenSeries((prev) => {
|
|
18829
18821
|
const next = new Set(prev);
|
|
18830
18822
|
if (next.has(name)) next.delete(name);
|
|
@@ -18832,13 +18824,13 @@ function LineChart({
|
|
|
18832
18824
|
return next;
|
|
18833
18825
|
});
|
|
18834
18826
|
}, []);
|
|
18835
|
-
const normalizedSeries = (0,
|
|
18827
|
+
const normalizedSeries = (0, import_react27.useMemo)(() => {
|
|
18836
18828
|
if (series && series.length > 0) return series;
|
|
18837
18829
|
if (data && data.length > 0) return [{ name: "", data, color, fillColor }];
|
|
18838
18830
|
return [];
|
|
18839
18831
|
}, [series, data, color, fillColor]);
|
|
18840
18832
|
const isMultiSeries = normalizedSeries.length > 1;
|
|
18841
|
-
const { minValue, maxValue, processedSeries, labels } = (0,
|
|
18833
|
+
const { minValue, maxValue, processedSeries, labels } = (0, import_react27.useMemo)(() => {
|
|
18842
18834
|
if (!normalizedSeries.length || !normalizedSeries[0]?.data?.length) {
|
|
18843
18835
|
return { minValue: 0, maxValue: 0, processedSeries: [], labels: [] };
|
|
18844
18836
|
}
|
|
@@ -18867,7 +18859,7 @@ function LineChart({
|
|
|
18867
18859
|
});
|
|
18868
18860
|
return { minValue: min, maxValue: max, processedSeries: processed, labels: allLabels };
|
|
18869
18861
|
}, [normalizedSeries, chartWidth, chartHeight, curved, padding.left, padding.top]);
|
|
18870
|
-
const gridLines = (0,
|
|
18862
|
+
const gridLines = (0, import_react27.useMemo)(() => {
|
|
18871
18863
|
const lines = [];
|
|
18872
18864
|
const steps = 5;
|
|
18873
18865
|
for (let i = 0; i <= steps; i++) {
|
|
@@ -19070,7 +19062,7 @@ function LineChart({
|
|
|
19070
19062
|
}
|
|
19071
19063
|
|
|
19072
19064
|
// src/components/BarChart.tsx
|
|
19073
|
-
var
|
|
19065
|
+
var import_react28 = require("react");
|
|
19074
19066
|
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
19075
19067
|
function BarChart({
|
|
19076
19068
|
data,
|
|
@@ -19091,18 +19083,21 @@ function BarChart({
|
|
|
19091
19083
|
labelClassName,
|
|
19092
19084
|
className = ""
|
|
19093
19085
|
}) {
|
|
19094
|
-
const svgRef = (0,
|
|
19095
|
-
const padding =
|
|
19086
|
+
const svgRef = (0, import_react28.useRef)(null);
|
|
19087
|
+
const padding = (0, import_react28.useMemo)(
|
|
19088
|
+
() => horizontal ? { top: 20, right: 40, bottom: 20, left: 80 } : { top: 20, right: 20, bottom: 40, left: 40 },
|
|
19089
|
+
[horizontal]
|
|
19090
|
+
);
|
|
19096
19091
|
const chartWidth = width - padding.left - padding.right;
|
|
19097
19092
|
const chartHeight = height - padding.top - padding.bottom;
|
|
19098
|
-
const [hoveredBar, setHoveredBar] = (0,
|
|
19099
|
-
const normalizedSeries = (0,
|
|
19093
|
+
const [hoveredBar, setHoveredBar] = (0, import_react28.useState)(null);
|
|
19094
|
+
const normalizedSeries = (0, import_react28.useMemo)(() => {
|
|
19100
19095
|
if (series && series.length > 0) return series;
|
|
19101
19096
|
if (data && data.length > 0) return [{ name: "", data, color }];
|
|
19102
19097
|
return [];
|
|
19103
19098
|
}, [series, data, color]);
|
|
19104
19099
|
const isMultiSeries = normalizedSeries.length > 1;
|
|
19105
|
-
const { maxValue, barGroups, gridLines } = (0,
|
|
19100
|
+
const { maxValue, barGroups, gridLines } = (0, import_react28.useMemo)(() => {
|
|
19106
19101
|
if (!normalizedSeries.length || !normalizedSeries[0]?.data?.length) {
|
|
19107
19102
|
return { maxValue: 0, barGroups: [], gridLines: [] };
|
|
19108
19103
|
}
|
|
@@ -19358,7 +19353,7 @@ function BarChart({
|
|
|
19358
19353
|
}
|
|
19359
19354
|
|
|
19360
19355
|
// src/components/PieChart.tsx
|
|
19361
|
-
var
|
|
19356
|
+
var import_react29 = require("react");
|
|
19362
19357
|
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
19363
19358
|
function PieChart({
|
|
19364
19359
|
data,
|
|
@@ -19375,11 +19370,11 @@ function PieChart({
|
|
|
19375
19370
|
labelClassName,
|
|
19376
19371
|
className = ""
|
|
19377
19372
|
}) {
|
|
19378
|
-
const containerRef = (0,
|
|
19373
|
+
const containerRef = (0, import_react29.useRef)(null);
|
|
19379
19374
|
const center = size / 2;
|
|
19380
19375
|
const radius = size / 2 - 10;
|
|
19381
19376
|
const innerRadius = donut ? radius - donutWidth : 0;
|
|
19382
|
-
const { segments, total } = (0,
|
|
19377
|
+
const { segments, total } = (0, import_react29.useMemo)(() => {
|
|
19383
19378
|
if (!data.length) return { segments: [], total: 0 };
|
|
19384
19379
|
const sum = data.reduce((acc, d) => acc + d.value, 0);
|
|
19385
19380
|
let currentAngle = startAngle;
|
|
@@ -19425,7 +19420,7 @@ function PieChart({
|
|
|
19425
19420
|
});
|
|
19426
19421
|
return { segments: segs, total: sum };
|
|
19427
19422
|
}, [data, center, radius, innerRadius, donut, startAngle]);
|
|
19428
|
-
const [hoveredSegment, setHoveredSegment] = (0,
|
|
19423
|
+
const [hoveredSegment, setHoveredSegment] = (0, import_react29.useState)(null);
|
|
19429
19424
|
return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { ref: containerRef, className: `relative flex items-center gap-6 ${className}`, children: [
|
|
19430
19425
|
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("svg", { width: size + 40, height: size + 40, className: "overflow-visible", style: { fontFamily: "inherit" }, children: [
|
|
19431
19426
|
/* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("g", { transform: `translate(20, 20)`, children: [
|
|
@@ -19526,7 +19521,7 @@ function PieChart({
|
|
|
19526
19521
|
}
|
|
19527
19522
|
|
|
19528
19523
|
// src/components/AreaChart.tsx
|
|
19529
|
-
var
|
|
19524
|
+
var import_react30 = require("react");
|
|
19530
19525
|
var import_jsx_runtime61 = require("react/jsx-runtime");
|
|
19531
19526
|
function AreaChart({
|
|
19532
19527
|
series,
|
|
@@ -19544,14 +19539,14 @@ function AreaChart({
|
|
|
19544
19539
|
labelClassName,
|
|
19545
19540
|
className = ""
|
|
19546
19541
|
}) {
|
|
19547
|
-
const containerRef = (0,
|
|
19548
|
-
const clipId = (0,
|
|
19549
|
-
const padding = { top: 20, right: 20, bottom: 40, left: 50 };
|
|
19542
|
+
const containerRef = (0, import_react30.useRef)(null);
|
|
19543
|
+
const clipId = (0, import_react30.useRef)(`area-clip-${Math.random().toString(36).slice(2, 8)}`).current;
|
|
19544
|
+
const padding = (0, import_react30.useMemo)(() => ({ top: 20, right: 20, bottom: 40, left: 50 }), []);
|
|
19550
19545
|
const chartWidth = width - padding.left - padding.right;
|
|
19551
19546
|
const chartHeight = height - padding.top - padding.bottom;
|
|
19552
|
-
const [hoveredPoint, setHoveredPoint] = (0,
|
|
19553
|
-
const [hiddenSeries, setHiddenSeries] = (0,
|
|
19554
|
-
const toggleSeries = (0,
|
|
19547
|
+
const [hoveredPoint, setHoveredPoint] = (0, import_react30.useState)(null);
|
|
19548
|
+
const [hiddenSeries, setHiddenSeries] = (0, import_react30.useState)(/* @__PURE__ */ new Set());
|
|
19549
|
+
const toggleSeries = (0, import_react30.useCallback)((name) => {
|
|
19555
19550
|
setHiddenSeries((prev) => {
|
|
19556
19551
|
const next = new Set(prev);
|
|
19557
19552
|
if (next.has(name)) next.delete(name);
|
|
@@ -19559,7 +19554,7 @@ function AreaChart({
|
|
|
19559
19554
|
return next;
|
|
19560
19555
|
});
|
|
19561
19556
|
}, []);
|
|
19562
|
-
const { processedSeries, gridLines, maxValue, labels } = (0,
|
|
19557
|
+
const { processedSeries, gridLines, maxValue, labels } = (0, import_react30.useMemo)(() => {
|
|
19563
19558
|
if (!series.length || !series[0]?.data?.length) {
|
|
19564
19559
|
return { processedSeries: [], gridLines: [], maxValue: 0, labels: [] };
|
|
19565
19560
|
}
|
|
@@ -19794,7 +19789,7 @@ function AreaChart({
|
|
|
19794
19789
|
}
|
|
19795
19790
|
|
|
19796
19791
|
// src/components/Sparkline.tsx
|
|
19797
|
-
var
|
|
19792
|
+
var import_react31 = require("react");
|
|
19798
19793
|
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
19799
19794
|
function Sparkline({
|
|
19800
19795
|
data,
|
|
@@ -19813,7 +19808,7 @@ function Sparkline({
|
|
|
19813
19808
|
const padding = 4;
|
|
19814
19809
|
const chartWidth = width - padding * 2;
|
|
19815
19810
|
const chartHeight = height - padding * 2;
|
|
19816
|
-
const { points, linePath, areaPath, lineLength, trend } = (0,
|
|
19811
|
+
const { points, linePath, areaPath, lineLength, trend } = (0, import_react31.useMemo)(() => {
|
|
19817
19812
|
const normalizedData = data.map((d) => typeof d === "number" ? d : d.value);
|
|
19818
19813
|
if (!normalizedData.length) {
|
|
19819
19814
|
return { points: [], linePath: "", areaPath: "", lineLength: 0, trend: 0 };
|
|
@@ -19917,7 +19912,7 @@ function Sparkline({
|
|
|
19917
19912
|
}
|
|
19918
19913
|
|
|
19919
19914
|
// src/components/RadarChart.tsx
|
|
19920
|
-
var
|
|
19915
|
+
var import_react32 = require("react");
|
|
19921
19916
|
var import_jsx_runtime63 = require("react/jsx-runtime");
|
|
19922
19917
|
function RadarChart({
|
|
19923
19918
|
series,
|
|
@@ -19931,12 +19926,12 @@ function RadarChart({
|
|
|
19931
19926
|
labelClassName,
|
|
19932
19927
|
className = ""
|
|
19933
19928
|
}) {
|
|
19934
|
-
const containerRef = (0,
|
|
19929
|
+
const containerRef = (0, import_react32.useRef)(null);
|
|
19935
19930
|
const center = size / 2;
|
|
19936
19931
|
const radius = size / 2 - 40;
|
|
19937
|
-
const [hoveredPoint, setHoveredPoint] = (0,
|
|
19938
|
-
const [hiddenSeries, setHiddenSeries] = (0,
|
|
19939
|
-
const toggleSeries = (0,
|
|
19932
|
+
const [hoveredPoint, setHoveredPoint] = (0, import_react32.useState)(null);
|
|
19933
|
+
const [hiddenSeries, setHiddenSeries] = (0, import_react32.useState)(/* @__PURE__ */ new Set());
|
|
19934
|
+
const toggleSeries = (0, import_react32.useCallback)((name) => {
|
|
19940
19935
|
setHiddenSeries((prev) => {
|
|
19941
19936
|
const next = new Set(prev);
|
|
19942
19937
|
if (next.has(name)) next.delete(name);
|
|
@@ -19944,7 +19939,7 @@ function RadarChart({
|
|
|
19944
19939
|
return next;
|
|
19945
19940
|
});
|
|
19946
19941
|
}, []);
|
|
19947
|
-
const { axes, processedSeries, levelPaths } = (0,
|
|
19942
|
+
const { axes, processedSeries, levelPaths } = (0, import_react32.useMemo)(() => {
|
|
19948
19943
|
if (!series.length || !series[0]?.data?.length) {
|
|
19949
19944
|
return { axes: [], processedSeries: [], levelPaths: [] };
|
|
19950
19945
|
}
|
|
@@ -20137,7 +20132,7 @@ function RadarChart({
|
|
|
20137
20132
|
}
|
|
20138
20133
|
|
|
20139
20134
|
// src/components/GaugeChart.tsx
|
|
20140
|
-
var
|
|
20135
|
+
var import_react33 = require("react");
|
|
20141
20136
|
var import_jsx_runtime64 = require("react/jsx-runtime");
|
|
20142
20137
|
function GaugeChart({
|
|
20143
20138
|
value,
|
|
@@ -20160,7 +20155,7 @@ function GaugeChart({
|
|
|
20160
20155
|
}) {
|
|
20161
20156
|
const center = size / 2;
|
|
20162
20157
|
const radius = center - thickness / 2 - 10;
|
|
20163
|
-
const { backgroundPath, valuePath, percentage, needleAngle, zonePaths } = (0,
|
|
20158
|
+
const { backgroundPath, valuePath, percentage, needleAngle, zonePaths } = (0, import_react33.useMemo)(() => {
|
|
20164
20159
|
const normalizedValue = Math.min(Math.max(value, min), max);
|
|
20165
20160
|
const pct = (normalizedValue - min) / (max - min);
|
|
20166
20161
|
const totalAngle = endAngle - startAngle;
|
|
@@ -20315,11 +20310,11 @@ function GaugeChart({
|
|
|
20315
20310
|
}
|
|
20316
20311
|
|
|
20317
20312
|
// src/components/ClientOnly.tsx
|
|
20318
|
-
var
|
|
20313
|
+
var import_react34 = require("react");
|
|
20319
20314
|
var import_jsx_runtime65 = require("react/jsx-runtime");
|
|
20320
20315
|
function ClientOnly({ children, fallback = null }) {
|
|
20321
|
-
const [hasMounted, setHasMounted] = (0,
|
|
20322
|
-
(0,
|
|
20316
|
+
const [hasMounted, setHasMounted] = (0, import_react34.useState)(false);
|
|
20317
|
+
(0, import_react34.useEffect)(() => {
|
|
20323
20318
|
setHasMounted(true);
|
|
20324
20319
|
}, []);
|
|
20325
20320
|
if (!hasMounted) {
|
|
@@ -20415,7 +20410,7 @@ var LoadingBar = ({
|
|
|
20415
20410
|
};
|
|
20416
20411
|
|
|
20417
20412
|
// src/components/Table.tsx
|
|
20418
|
-
var
|
|
20413
|
+
var import_react35 = __toESM(require("react"), 1);
|
|
20419
20414
|
var import_jsx_runtime67 = require("react/jsx-runtime");
|
|
20420
20415
|
var TABLE_BASE_CLASS = "w-full caption-bottom text-sm";
|
|
20421
20416
|
var TABLE_CONTAINER_BASE_CLASS = [
|
|
@@ -20433,8 +20428,8 @@ function assignRef3(ref, value) {
|
|
|
20433
20428
|
ref.current = value;
|
|
20434
20429
|
}
|
|
20435
20430
|
}
|
|
20436
|
-
var TableContainer =
|
|
20437
|
-
const containerRef =
|
|
20431
|
+
var TableContainer = import_react35.default.forwardRef(({ className, useOverlayScrollbar = false, ...props }, ref) => {
|
|
20432
|
+
const containerRef = import_react35.default.useRef(null);
|
|
20438
20433
|
useOverlayScrollbarTarget(containerRef, { enabled: useOverlayScrollbar });
|
|
20439
20434
|
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
20440
20435
|
"div",
|
|
@@ -20449,7 +20444,7 @@ var TableContainer = import_react34.default.forwardRef(({ className, useOverlayS
|
|
|
20449
20444
|
);
|
|
20450
20445
|
});
|
|
20451
20446
|
TableContainer.displayName = "TableContainer";
|
|
20452
|
-
var Table =
|
|
20447
|
+
var Table = import_react35.default.forwardRef(
|
|
20453
20448
|
({ className, containerClassName, disableContainer = false, useOverlayScrollbar = false, ...props }, ref) => {
|
|
20454
20449
|
if (disableContainer) {
|
|
20455
20450
|
return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("table", { ref, className: cn(TABLE_BASE_CLASS, className), ...props });
|
|
@@ -20458,16 +20453,16 @@ var Table = import_react34.default.forwardRef(
|
|
|
20458
20453
|
}
|
|
20459
20454
|
);
|
|
20460
20455
|
Table.displayName = "Table";
|
|
20461
|
-
var TableHeader =
|
|
20456
|
+
var TableHeader = import_react35.default.forwardRef(({ className, children, filterRow, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("thead", { ref, className: cn("[&_tr]:border-b [&_tr]:border-border", "bg-muted", className), ...props, children: [
|
|
20462
20457
|
children,
|
|
20463
20458
|
filterRow
|
|
20464
20459
|
] }));
|
|
20465
20460
|
TableHeader.displayName = "TableHeader";
|
|
20466
|
-
var TableBody =
|
|
20461
|
+
var TableBody = import_react35.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("tbody", { ref, className: cn("[&_tr:last-child]:border-0", className), ...props }));
|
|
20467
20462
|
TableBody.displayName = "TableBody";
|
|
20468
|
-
var TableFooter =
|
|
20463
|
+
var TableFooter = import_react35.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("tfoot", { ref, className: cn("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", className), ...props }));
|
|
20469
20464
|
TableFooter.displayName = "TableFooter";
|
|
20470
|
-
var TableRow =
|
|
20465
|
+
var TableRow = import_react35.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
20471
20466
|
"tr",
|
|
20472
20467
|
{
|
|
20473
20468
|
ref,
|
|
@@ -20481,7 +20476,7 @@ var TableRow = import_react34.default.forwardRef(({ className, ...props }, ref)
|
|
|
20481
20476
|
}
|
|
20482
20477
|
));
|
|
20483
20478
|
TableRow.displayName = "TableRow";
|
|
20484
|
-
var TableHead =
|
|
20479
|
+
var TableHead = import_react35.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
|
|
20485
20480
|
"th",
|
|
20486
20481
|
{
|
|
20487
20482
|
ref,
|
|
@@ -20490,13 +20485,13 @@ var TableHead = import_react34.default.forwardRef(({ className, ...props }, ref)
|
|
|
20490
20485
|
}
|
|
20491
20486
|
));
|
|
20492
20487
|
TableHead.displayName = "TableHead";
|
|
20493
|
-
var TableCell =
|
|
20488
|
+
var TableCell = import_react35.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("td", { ref, className: cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className), ...props }));
|
|
20494
20489
|
TableCell.displayName = "TableCell";
|
|
20495
|
-
var TableCaption =
|
|
20490
|
+
var TableCaption = import_react35.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("caption", { ref, className: cn("mt-4 text-sm text-muted-foreground", className), ...props }));
|
|
20496
20491
|
TableCaption.displayName = "TableCaption";
|
|
20497
20492
|
|
|
20498
20493
|
// src/components/DataTable/DataTable.tsx
|
|
20499
|
-
var
|
|
20494
|
+
var import_react44 = __toESM(require("react"), 1);
|
|
20500
20495
|
|
|
20501
20496
|
// src/components/DataTable/components/DataTableBody.tsx
|
|
20502
20497
|
var import_jsx_runtime68 = require("react/jsx-runtime");
|
|
@@ -20568,7 +20563,7 @@ function DataTableBodyRows({
|
|
|
20568
20563
|
}
|
|
20569
20564
|
|
|
20570
20565
|
// src/components/DataTable/components/DataTableHeader.tsx
|
|
20571
|
-
var
|
|
20566
|
+
var import_react36 = __toESM(require("react"), 1);
|
|
20572
20567
|
var import_lucide_react34 = require("lucide-react");
|
|
20573
20568
|
var import_jsx_runtime69 = require("react/jsx-runtime");
|
|
20574
20569
|
function DataTableHeader({
|
|
@@ -20588,7 +20583,7 @@ function DataTableHeader({
|
|
|
20588
20583
|
getStickyHeaderCellStyle,
|
|
20589
20584
|
t
|
|
20590
20585
|
}) {
|
|
20591
|
-
const renderFilterControl =
|
|
20586
|
+
const renderFilterControl = import_react36.default.useCallback(
|
|
20592
20587
|
(col) => {
|
|
20593
20588
|
if (!col.filter) return null;
|
|
20594
20589
|
const key = col.key;
|
|
@@ -20641,7 +20636,7 @@ function DataTableHeader({
|
|
|
20641
20636
|
},
|
|
20642
20637
|
[filters, setCurPage, setFilters, size]
|
|
20643
20638
|
);
|
|
20644
|
-
const renderHeaderContent =
|
|
20639
|
+
const renderHeaderContent = import_react36.default.useCallback(
|
|
20645
20640
|
(col, isLeaf) => {
|
|
20646
20641
|
if (!isLeaf) {
|
|
20647
20642
|
return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
@@ -20804,7 +20799,7 @@ function DataTableHeader({
|
|
|
20804
20799
|
}
|
|
20805
20800
|
|
|
20806
20801
|
// src/components/DataTable/components/Pagination.tsx
|
|
20807
|
-
var
|
|
20802
|
+
var import_react37 = __toESM(require("react"), 1);
|
|
20808
20803
|
var import_jsx_runtime70 = require("react/jsx-runtime");
|
|
20809
20804
|
function DataTablePagination({
|
|
20810
20805
|
totalItems,
|
|
@@ -20816,14 +20811,7 @@ function DataTablePagination({
|
|
|
20816
20811
|
size
|
|
20817
20812
|
}) {
|
|
20818
20813
|
const totalPages = Math.ceil(totalItems / curPageSize);
|
|
20819
|
-
|
|
20820
|
-
const controlButtonSize = size === "lg" ? "md" : "sm";
|
|
20821
|
-
const navBtnClass = size === "sm" ? "h-6 w-6 p-0 rounded-full" : size === "lg" ? "h-8 w-8 p-0 rounded-full" : "h-7 w-7 p-0 rounded-full";
|
|
20822
|
-
const navIconClass = size === "sm" ? "h-3.5 w-3.5" : size === "lg" ? "h-5 w-5" : "h-4 w-4";
|
|
20823
|
-
const pageBtnClass = size === "sm" ? "h-6 min-w-6 px-1.5 rounded-full text-[11px] font-medium transition-colors" : size === "lg" ? "h-8 min-w-8 px-2.5 rounded-full text-sm font-medium transition-colors" : "h-7 min-w-7 px-2 rounded-full text-xs font-medium transition-colors";
|
|
20824
|
-
const containerTextClass = size === "sm" ? "text-[11px]" : size === "lg" ? "text-sm" : "text-xs";
|
|
20825
|
-
const pageSizeClass = size === "sm" ? "w-16" : size === "lg" ? "w-24" : "w-20";
|
|
20826
|
-
const pages = import_react36.default.useMemo(() => {
|
|
20814
|
+
const pages = import_react37.default.useMemo(() => {
|
|
20827
20815
|
const result = [];
|
|
20828
20816
|
if (totalPages <= 5) {
|
|
20829
20817
|
for (let i = 1; i <= totalPages; i++) result.push(i);
|
|
@@ -20838,6 +20826,13 @@ function DataTablePagination({
|
|
|
20838
20826
|
result.push(totalPages);
|
|
20839
20827
|
return result;
|
|
20840
20828
|
}, [curPage, totalPages]);
|
|
20829
|
+
if (!(totalItems > 0 && totalPages > 1)) return null;
|
|
20830
|
+
const controlButtonSize = size === "lg" ? "md" : "sm";
|
|
20831
|
+
const navBtnClass = size === "sm" ? "h-6 w-6 p-0 rounded-full" : size === "lg" ? "h-8 w-8 p-0 rounded-full" : "h-7 w-7 p-0 rounded-full";
|
|
20832
|
+
const navIconClass = size === "sm" ? "h-3.5 w-3.5" : size === "lg" ? "h-5 w-5" : "h-4 w-4";
|
|
20833
|
+
const pageBtnClass = size === "sm" ? "h-6 min-w-6 px-1.5 rounded-full text-[11px] font-medium transition-colors" : size === "lg" ? "h-8 min-w-8 px-2.5 rounded-full text-sm font-medium transition-colors" : "h-7 min-w-7 px-2 rounded-full text-xs font-medium transition-colors";
|
|
20834
|
+
const containerTextClass = size === "sm" ? "text-[11px]" : size === "lg" ? "text-sm" : "text-xs";
|
|
20835
|
+
const pageSizeClass = size === "sm" ? "w-16" : size === "lg" ? "w-24" : "w-20";
|
|
20841
20836
|
return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: cn("flex items-center justify-between gap-2 px-1 pt-3 text-muted-foreground", containerTextClass), children: [
|
|
20842
20837
|
/* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("div", { className: "tabular-nums", children: [
|
|
20843
20838
|
(curPage - 1) * curPageSize + 1,
|
|
@@ -20898,7 +20893,7 @@ function DataTablePagination({
|
|
|
20898
20893
|
}
|
|
20899
20894
|
|
|
20900
20895
|
// src/components/DataTable/components/Toolbar.tsx
|
|
20901
|
-
var
|
|
20896
|
+
var import_react38 = __toESM(require("react"), 1);
|
|
20902
20897
|
|
|
20903
20898
|
// src/components/DataTable/utils/headers.ts
|
|
20904
20899
|
function isLeafColumn(col) {
|
|
@@ -21019,7 +21014,7 @@ function DataTableToolbar({
|
|
|
21019
21014
|
const controlButtonClass = size === "sm" ? "h-7 px-2 text-xs" : size === "lg" ? "h-9 px-3 text-sm" : "h-8 px-2";
|
|
21020
21015
|
const iconClass = size === "sm" ? "w-3.5 h-3.5 mr-1" : "w-4 h-4 mr-1";
|
|
21021
21016
|
const captionClass = size === "sm" ? "text-xs" : size === "lg" ? "text-sm" : "text-sm";
|
|
21022
|
-
const leafCols =
|
|
21017
|
+
const leafCols = import_react38.default.useMemo(() => getLeafColumns(columns), [columns]);
|
|
21023
21018
|
return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "flex items-center justify-between gap-4 mb-1", children: [
|
|
21024
21019
|
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: captionClass + " text-muted-foreground", children: caption }),
|
|
21025
21020
|
/* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
@@ -21087,10 +21082,10 @@ function DataTableToolbar({
|
|
|
21087
21082
|
}
|
|
21088
21083
|
|
|
21089
21084
|
// src/components/DataTable/hooks/useDebounced.ts
|
|
21090
|
-
var
|
|
21085
|
+
var import_react39 = __toESM(require("react"), 1);
|
|
21091
21086
|
function useDebounced(value, delay = 300) {
|
|
21092
|
-
const [debounced, setDebounced] =
|
|
21093
|
-
|
|
21087
|
+
const [debounced, setDebounced] = import_react39.default.useState(value);
|
|
21088
|
+
import_react39.default.useEffect(() => {
|
|
21094
21089
|
const id = setTimeout(() => setDebounced(value), delay);
|
|
21095
21090
|
return () => clearTimeout(id);
|
|
21096
21091
|
}, [value, delay]);
|
|
@@ -21098,7 +21093,7 @@ function useDebounced(value, delay = 300) {
|
|
|
21098
21093
|
}
|
|
21099
21094
|
|
|
21100
21095
|
// src/components/DataTable/hooks/useDataTableModel.ts
|
|
21101
|
-
var
|
|
21096
|
+
var import_react40 = __toESM(require("react"), 1);
|
|
21102
21097
|
|
|
21103
21098
|
// src/components/DataTable/utils/columns.ts
|
|
21104
21099
|
function getColumnWidth(col, fallback = 150) {
|
|
@@ -21126,22 +21121,22 @@ function useDataTableModel({
|
|
|
21126
21121
|
isServerMode,
|
|
21127
21122
|
total
|
|
21128
21123
|
}) {
|
|
21129
|
-
const visibleColsSet =
|
|
21130
|
-
const allLeafColumns =
|
|
21131
|
-
const columnMap =
|
|
21124
|
+
const visibleColsSet = import_react40.default.useMemo(() => new Set(visibleCols), [visibleCols]);
|
|
21125
|
+
const allLeafColumns = import_react40.default.useMemo(() => getLeafColumns(columns), [columns]);
|
|
21126
|
+
const columnMap = import_react40.default.useMemo(() => {
|
|
21132
21127
|
return new Map(allLeafColumns.map((column) => [column.key, column]));
|
|
21133
21128
|
}, [allLeafColumns]);
|
|
21134
|
-
const visibleColumns =
|
|
21129
|
+
const visibleColumns = import_react40.default.useMemo(() => {
|
|
21135
21130
|
return filterVisibleColumns(columns, visibleColsSet);
|
|
21136
21131
|
}, [columns, visibleColsSet]);
|
|
21137
|
-
const leafColumns =
|
|
21132
|
+
const leafColumns = import_react40.default.useMemo(() => {
|
|
21138
21133
|
return getLeafColumnsWithFixedInheritance(visibleColumns);
|
|
21139
21134
|
}, [visibleColumns]);
|
|
21140
|
-
const headerRows =
|
|
21141
|
-
const totalColumnsWidth =
|
|
21135
|
+
const headerRows = import_react40.default.useMemo(() => buildHeaderRows(visibleColumns), [visibleColumns]);
|
|
21136
|
+
const totalColumnsWidth = import_react40.default.useMemo(() => {
|
|
21142
21137
|
return leafColumns.reduce((sum, column) => sum + getColumnWidth(column), 0);
|
|
21143
21138
|
}, [leafColumns]);
|
|
21144
|
-
const processedData =
|
|
21139
|
+
const processedData = import_react40.default.useMemo(() => {
|
|
21145
21140
|
if (isServerMode) return data;
|
|
21146
21141
|
let result = [...data];
|
|
21147
21142
|
if (Object.keys(filters).length > 0) {
|
|
@@ -21173,7 +21168,7 @@ function useDataTableModel({
|
|
|
21173
21168
|
return result;
|
|
21174
21169
|
}, [columnMap, data, filters, isServerMode, sort]);
|
|
21175
21170
|
const totalItems = isServerMode ? total : processedData.length;
|
|
21176
|
-
const displayedData =
|
|
21171
|
+
const displayedData = import_react40.default.useMemo(() => {
|
|
21177
21172
|
if (isServerMode) return data;
|
|
21178
21173
|
const start = (curPage - 1) * curPageSize;
|
|
21179
21174
|
return processedData.slice(start, start + curPageSize);
|
|
@@ -21189,13 +21184,13 @@ function useDataTableModel({
|
|
|
21189
21184
|
}
|
|
21190
21185
|
|
|
21191
21186
|
// src/components/DataTable/hooks/useDataTableState.ts
|
|
21192
|
-
var
|
|
21187
|
+
var import_react42 = __toESM(require("react"), 1);
|
|
21193
21188
|
|
|
21194
21189
|
// src/components/DataTable/hooks/usePageSizeStorage.ts
|
|
21195
|
-
var
|
|
21190
|
+
var import_react41 = __toESM(require("react"), 1);
|
|
21196
21191
|
function usePageSizeStorage({ pageSize, storageKey }) {
|
|
21197
|
-
const loadedFromStorage =
|
|
21198
|
-
const [curPageSize, setCurPageSize] =
|
|
21192
|
+
const loadedFromStorage = import_react41.default.useRef(false);
|
|
21193
|
+
const [curPageSize, setCurPageSize] = import_react41.default.useState(() => {
|
|
21199
21194
|
if (typeof window === "undefined" || !storageKey) return pageSize;
|
|
21200
21195
|
try {
|
|
21201
21196
|
const saved = localStorage.getItem(`datatable_${storageKey}_pageSize`);
|
|
@@ -21210,11 +21205,11 @@ function usePageSizeStorage({ pageSize, storageKey }) {
|
|
|
21210
21205
|
}
|
|
21211
21206
|
return pageSize;
|
|
21212
21207
|
});
|
|
21213
|
-
const hasMounted =
|
|
21214
|
-
|
|
21208
|
+
const hasMounted = import_react41.default.useRef(false);
|
|
21209
|
+
import_react41.default.useEffect(() => {
|
|
21215
21210
|
hasMounted.current = true;
|
|
21216
21211
|
}, []);
|
|
21217
|
-
|
|
21212
|
+
import_react41.default.useEffect(() => {
|
|
21218
21213
|
if (typeof window === "undefined" || !storageKey) return;
|
|
21219
21214
|
if (!hasMounted.current) return;
|
|
21220
21215
|
try {
|
|
@@ -21222,7 +21217,7 @@ function usePageSizeStorage({ pageSize, storageKey }) {
|
|
|
21222
21217
|
} catch {
|
|
21223
21218
|
}
|
|
21224
21219
|
}, [curPageSize, storageKey]);
|
|
21225
|
-
|
|
21220
|
+
import_react41.default.useEffect(() => {
|
|
21226
21221
|
if (storageKey && loadedFromStorage.current) return;
|
|
21227
21222
|
setCurPageSize(pageSize);
|
|
21228
21223
|
}, [pageSize, storageKey]);
|
|
@@ -21242,17 +21237,17 @@ function useDataTableState({
|
|
|
21242
21237
|
size,
|
|
21243
21238
|
storageKey
|
|
21244
21239
|
}) {
|
|
21245
|
-
const allLeafColumns =
|
|
21246
|
-
const defaultVisibleLeafKeys =
|
|
21247
|
-
const knownLeafKeysRef =
|
|
21248
|
-
const [headerAlign, setHeaderAlign] =
|
|
21249
|
-
const [visibleCols, setVisibleCols] =
|
|
21250
|
-
const [filters, setFilters] =
|
|
21251
|
-
const [sort, setSort] =
|
|
21252
|
-
const [density, setDensity] =
|
|
21253
|
-
const [curPage, setCurPage] =
|
|
21240
|
+
const allLeafColumns = import_react42.default.useMemo(() => getLeafColumns(columns), [columns]);
|
|
21241
|
+
const defaultVisibleLeafKeys = import_react42.default.useMemo(() => allLeafColumns.filter((column) => column.visible !== false).map((column) => column.key), [allLeafColumns]);
|
|
21242
|
+
const knownLeafKeysRef = import_react42.default.useRef(new Set(defaultVisibleLeafKeys));
|
|
21243
|
+
const [headerAlign, setHeaderAlign] = import_react42.default.useState("left");
|
|
21244
|
+
const [visibleCols, setVisibleCols] = import_react42.default.useState(defaultVisibleLeafKeys);
|
|
21245
|
+
const [filters, setFilters] = import_react42.default.useState({});
|
|
21246
|
+
const [sort, setSort] = import_react42.default.useState(null);
|
|
21247
|
+
const [density, setDensity] = import_react42.default.useState(() => SIZE_TO_DENSITY[size]);
|
|
21248
|
+
const [curPage, setCurPage] = import_react42.default.useState(page);
|
|
21254
21249
|
const { curPageSize, setCurPageSize } = usePageSizeStorage({ pageSize, storageKey });
|
|
21255
|
-
|
|
21250
|
+
import_react42.default.useEffect(() => {
|
|
21256
21251
|
const knownLeafKeys = knownLeafKeysRef.current;
|
|
21257
21252
|
setVisibleCols((prev) => {
|
|
21258
21253
|
const prevSet = new Set(prev);
|
|
@@ -21260,10 +21255,10 @@ function useDataTableState({
|
|
|
21260
21255
|
});
|
|
21261
21256
|
knownLeafKeysRef.current = new Set(allLeafColumns.map((column) => column.key));
|
|
21262
21257
|
}, [allLeafColumns]);
|
|
21263
|
-
|
|
21258
|
+
import_react42.default.useEffect(() => {
|
|
21264
21259
|
setCurPage(page);
|
|
21265
21260
|
}, [page]);
|
|
21266
|
-
|
|
21261
|
+
import_react42.default.useEffect(() => {
|
|
21267
21262
|
setDensity(SIZE_TO_DENSITY[size]);
|
|
21268
21263
|
}, [size]);
|
|
21269
21264
|
return {
|
|
@@ -21285,7 +21280,7 @@ function useDataTableState({
|
|
|
21285
21280
|
}
|
|
21286
21281
|
|
|
21287
21282
|
// src/components/DataTable/hooks/useStickyColumns.ts
|
|
21288
|
-
var
|
|
21283
|
+
var import_react43 = __toESM(require("react"), 1);
|
|
21289
21284
|
|
|
21290
21285
|
// src/components/DataTable/utils/sticky.ts
|
|
21291
21286
|
function buildStickyLayout(visibleColumns) {
|
|
@@ -21332,8 +21327,8 @@ function resolveGroupStickyPosition(column, positions) {
|
|
|
21332
21327
|
|
|
21333
21328
|
// src/components/DataTable/hooks/useStickyColumns.ts
|
|
21334
21329
|
function useStickyColumns(visibleColumns) {
|
|
21335
|
-
const { positions, leftBoundaryKey, rightBoundaryKey } =
|
|
21336
|
-
const getStickyColumnStyle =
|
|
21330
|
+
const { positions, leftBoundaryKey, rightBoundaryKey } = import_react43.default.useMemo(() => buildStickyLayout(visibleColumns), [visibleColumns]);
|
|
21331
|
+
const getStickyColumnStyle = import_react43.default.useCallback(
|
|
21337
21332
|
(col) => {
|
|
21338
21333
|
const pos = resolveStickyPosition(col, positions);
|
|
21339
21334
|
if (!pos) return {};
|
|
@@ -21344,7 +21339,7 @@ function useStickyColumns(visibleColumns) {
|
|
|
21344
21339
|
},
|
|
21345
21340
|
[positions]
|
|
21346
21341
|
);
|
|
21347
|
-
const getBoundaryShadowClass =
|
|
21342
|
+
const getBoundaryShadowClass = import_react43.default.useCallback(
|
|
21348
21343
|
(col) => {
|
|
21349
21344
|
if (col.fixed === "left" && col.key === leftBoundaryKey) {
|
|
21350
21345
|
return "border-r border-border/80 shadow-[10px_0_16px_-10px_rgba(0,0,0,0.55)]";
|
|
@@ -21356,14 +21351,14 @@ function useStickyColumns(visibleColumns) {
|
|
|
21356
21351
|
},
|
|
21357
21352
|
[leftBoundaryKey, rightBoundaryKey]
|
|
21358
21353
|
);
|
|
21359
|
-
const getStickyHeaderClass =
|
|
21354
|
+
const getStickyHeaderClass = import_react43.default.useCallback(
|
|
21360
21355
|
(col) => {
|
|
21361
21356
|
if (!col.fixed) return "";
|
|
21362
21357
|
return cn("sticky", col.fixed === "left" && "left-0", col.fixed === "right" && "right-0", getBoundaryShadowClass(col), "z-50 !bg-muted");
|
|
21363
21358
|
},
|
|
21364
21359
|
[getBoundaryShadowClass]
|
|
21365
21360
|
);
|
|
21366
|
-
const getStickyCellClass =
|
|
21361
|
+
const getStickyCellClass = import_react43.default.useCallback(
|
|
21367
21362
|
(col, isStripedRow) => {
|
|
21368
21363
|
if (!col.fixed) return "";
|
|
21369
21364
|
return cn(
|
|
@@ -21376,7 +21371,7 @@ function useStickyColumns(visibleColumns) {
|
|
|
21376
21371
|
},
|
|
21377
21372
|
[getBoundaryShadowClass]
|
|
21378
21373
|
);
|
|
21379
|
-
const getStickyHeaderCellStyle =
|
|
21374
|
+
const getStickyHeaderCellStyle = import_react43.default.useCallback(
|
|
21380
21375
|
(headerCell) => {
|
|
21381
21376
|
const col = headerCell.column;
|
|
21382
21377
|
if (headerCell.isLeaf) {
|
|
@@ -21523,7 +21518,7 @@ function DataTable({
|
|
|
21523
21518
|
size,
|
|
21524
21519
|
storageKey
|
|
21525
21520
|
});
|
|
21526
|
-
|
|
21521
|
+
import_react44.default.useEffect(() => {
|
|
21527
21522
|
if (process.env.NODE_ENV === "development") {
|
|
21528
21523
|
const warnings = validateColumns(columns);
|
|
21529
21524
|
warnings.forEach((w) => console.warn(`[DataTable] ${w}`));
|
|
@@ -21531,8 +21526,8 @@ function DataTable({
|
|
|
21531
21526
|
}, [columns]);
|
|
21532
21527
|
const debouncedFilters = useDebounced(filters, 350);
|
|
21533
21528
|
const isServerMode = Boolean(onQueryChange);
|
|
21534
|
-
const hasEmittedQuery =
|
|
21535
|
-
|
|
21529
|
+
const hasEmittedQuery = import_react44.default.useRef(false);
|
|
21530
|
+
import_react44.default.useEffect(() => {
|
|
21536
21531
|
if (!onQueryChange) return;
|
|
21537
21532
|
if (!hasEmittedQuery.current) {
|
|
21538
21533
|
hasEmittedQuery.current = true;
|
|
@@ -21540,7 +21535,7 @@ function DataTable({
|
|
|
21540
21535
|
}
|
|
21541
21536
|
onQueryChange({ filters: debouncedFilters, sort, page: curPage, pageSize: curPageSize });
|
|
21542
21537
|
}, [debouncedFilters, sort, curPage, curPageSize, onQueryChange]);
|
|
21543
|
-
|
|
21538
|
+
import_react44.default.useEffect(() => {
|
|
21544
21539
|
if (process.env.NODE_ENV !== "development" || rowKey) return;
|
|
21545
21540
|
const hasQueryFeatures = columns.some((column) => column.sortable || column.filter) || Boolean(pageSizeOptions?.length) || isServerMode;
|
|
21546
21541
|
if (!hasQueryFeatures) return;
|
|
@@ -21568,7 +21563,7 @@ function DataTable({
|
|
|
21568
21563
|
if (typeof rowKey === "function") return String(rowKey(row));
|
|
21569
21564
|
return String(row[rowKey]);
|
|
21570
21565
|
};
|
|
21571
|
-
const viewportRef =
|
|
21566
|
+
const viewportRef = import_react44.default.useRef(null);
|
|
21572
21567
|
useOverlayScrollbarTarget(viewportRef, { enabled: useOverlayScrollbar });
|
|
21573
21568
|
return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: cn("space-y-2", className), children: [
|
|
21574
21569
|
/* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
@@ -21674,10 +21669,10 @@ function DataTable({
|
|
|
21674
21669
|
var DataTable_default = DataTable;
|
|
21675
21670
|
|
|
21676
21671
|
// src/components/Form.tsx
|
|
21677
|
-
var
|
|
21672
|
+
var React69 = __toESM(require("react"), 1);
|
|
21678
21673
|
var import_react_hook_form = require("react-hook-form");
|
|
21679
21674
|
var import_jsx_runtime73 = require("react/jsx-runtime");
|
|
21680
|
-
var FormConfigContext =
|
|
21675
|
+
var FormConfigContext = React69.createContext({ size: "md" });
|
|
21681
21676
|
var FormWrapper = ({
|
|
21682
21677
|
children,
|
|
21683
21678
|
onSubmit,
|
|
@@ -21690,7 +21685,7 @@ var FormWrapper = ({
|
|
|
21690
21685
|
const methods = (0, import_react_hook_form.useForm)({
|
|
21691
21686
|
defaultValues: initialValues
|
|
21692
21687
|
});
|
|
21693
|
-
|
|
21688
|
+
React69.useEffect(() => {
|
|
21694
21689
|
if (initialValues) {
|
|
21695
21690
|
methods.reset(initialValues);
|
|
21696
21691
|
}
|
|
@@ -21699,23 +21694,18 @@ var FormWrapper = ({
|
|
|
21699
21694
|
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_react_hook_form.FormProvider, { ...methods, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(FormConfigContext.Provider, { value: { size }, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("form", { onSubmit: methods.handleSubmit(onSubmit), className, ...formProps, children }) }) });
|
|
21700
21695
|
};
|
|
21701
21696
|
var Form = FormWrapper;
|
|
21702
|
-
var FormFieldContext =
|
|
21697
|
+
var FormFieldContext = React69.createContext({});
|
|
21703
21698
|
var FormField = ({
|
|
21704
21699
|
...props
|
|
21705
21700
|
}) => {
|
|
21706
21701
|
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_react_hook_form.Controller, { ...props }) });
|
|
21707
21702
|
};
|
|
21708
21703
|
var useFormField = () => {
|
|
21709
|
-
const fieldContext =
|
|
21710
|
-
const itemContext =
|
|
21704
|
+
const fieldContext = React69.useContext(FormFieldContext);
|
|
21705
|
+
const itemContext = React69.useContext(FormItemContext);
|
|
21711
21706
|
const { getFieldState, formState } = (0, import_react_hook_form.useFormContext)();
|
|
21712
21707
|
if (!fieldContext) {
|
|
21713
|
-
|
|
21714
|
-
const t = useSmartTranslations("Form");
|
|
21715
|
-
throw new Error(t("validation.mustBeUsedWithinForm"));
|
|
21716
|
-
} catch {
|
|
21717
|
-
throw new Error("useFormField must be used within FormField");
|
|
21718
|
-
}
|
|
21708
|
+
throw new Error("useFormField must be used within FormField");
|
|
21719
21709
|
}
|
|
21720
21710
|
const fieldState = getFieldState(fieldContext.name, formState);
|
|
21721
21711
|
const { id } = itemContext;
|
|
@@ -21728,16 +21718,16 @@ var useFormField = () => {
|
|
|
21728
21718
|
...fieldState
|
|
21729
21719
|
};
|
|
21730
21720
|
};
|
|
21731
|
-
var FormItemContext =
|
|
21732
|
-
var FormItem =
|
|
21733
|
-
const id =
|
|
21721
|
+
var FormItemContext = React69.createContext({});
|
|
21722
|
+
var FormItem = React69.forwardRef(({ className, ...props }, ref) => {
|
|
21723
|
+
const id = React69.useId();
|
|
21734
21724
|
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { ref, className: cn("space-y-2", className), ...props }) });
|
|
21735
21725
|
});
|
|
21736
21726
|
FormItem.displayName = "FormItem";
|
|
21737
|
-
var FormLabel =
|
|
21727
|
+
var FormLabel = React69.forwardRef(
|
|
21738
21728
|
({ className, children, required, ...props }, ref) => {
|
|
21739
21729
|
const { error, formItemId } = useFormField();
|
|
21740
|
-
const config =
|
|
21730
|
+
const config = React69.useContext(FormConfigContext);
|
|
21741
21731
|
const sizeClass = config.size === "sm" ? "text-xs" : config.size === "lg" ? "text-base" : "text-sm";
|
|
21742
21732
|
return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(Label, { ref, className: cn(sizeClass, error && "text-destructive", className), htmlFor: formItemId, ...props, children: [
|
|
21743
21733
|
children,
|
|
@@ -21746,7 +21736,7 @@ var FormLabel = React68.forwardRef(
|
|
|
21746
21736
|
}
|
|
21747
21737
|
);
|
|
21748
21738
|
FormLabel.displayName = "FormLabel";
|
|
21749
|
-
var FormControl =
|
|
21739
|
+
var FormControl = React69.forwardRef(({ ...props }, ref) => {
|
|
21750
21740
|
const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
|
|
21751
21741
|
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
21752
21742
|
"div",
|
|
@@ -21760,12 +21750,12 @@ var FormControl = React68.forwardRef(({ ...props }, ref) => {
|
|
|
21760
21750
|
);
|
|
21761
21751
|
});
|
|
21762
21752
|
FormControl.displayName = "FormControl";
|
|
21763
|
-
var FormDescription =
|
|
21753
|
+
var FormDescription = React69.forwardRef(({ className, ...props }, ref) => {
|
|
21764
21754
|
const { formDescriptionId } = useFormField();
|
|
21765
21755
|
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { ref, id: formDescriptionId, className: cn("text-sm text-muted-foreground", className), ...props });
|
|
21766
21756
|
});
|
|
21767
21757
|
FormDescription.displayName = "FormDescription";
|
|
21768
|
-
var FormMessage =
|
|
21758
|
+
var FormMessage = React69.forwardRef(({ className, children, ...props }, ref) => {
|
|
21769
21759
|
const { error, formMessageId } = useFormField();
|
|
21770
21760
|
const body = error ? String(error?.message) : children;
|
|
21771
21761
|
if (!body) {
|
|
@@ -21774,7 +21764,7 @@ var FormMessage = React68.forwardRef(({ className, children, ...props }, ref) =>
|
|
|
21774
21764
|
return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("p", { ref, id: formMessageId, className: cn("text-sm font-medium text-destructive", className), ...props, children: body });
|
|
21775
21765
|
});
|
|
21776
21766
|
FormMessage.displayName = "FormMessage";
|
|
21777
|
-
var FormInput =
|
|
21767
|
+
var FormInput = React69.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
21778
21768
|
FormField,
|
|
21779
21769
|
{
|
|
21780
21770
|
name,
|
|
@@ -21785,7 +21775,7 @@ var FormInput = React68.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */
|
|
|
21785
21775
|
}
|
|
21786
21776
|
) }));
|
|
21787
21777
|
FormInput.displayName = "FormInput";
|
|
21788
|
-
var FormCheckbox =
|
|
21778
|
+
var FormCheckbox = React69.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
21789
21779
|
FormField,
|
|
21790
21780
|
{
|
|
21791
21781
|
name,
|
|
@@ -21809,9 +21799,9 @@ var FormCheckbox = React68.forwardRef(({ name, ...props }, ref) => /* @__PURE__
|
|
|
21809
21799
|
}
|
|
21810
21800
|
) }));
|
|
21811
21801
|
FormCheckbox.displayName = "FormCheckbox";
|
|
21812
|
-
var FormActions =
|
|
21802
|
+
var FormActions = React69.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { ref, className: cn("flex gap-2 justify-end", className), ...props }));
|
|
21813
21803
|
FormActions.displayName = "FormActions";
|
|
21814
|
-
var FormSubmitButton =
|
|
21804
|
+
var FormSubmitButton = React69.forwardRef(
|
|
21815
21805
|
({ children, loading: loading2, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Button_default, { ref, type: "submit", size: props.size ?? size, disabled: loading2, ...props, children }) })
|
|
21816
21806
|
);
|
|
21817
21807
|
FormSubmitButton.displayName = "FormSubmitButton";
|
|
@@ -21893,7 +21883,7 @@ function AccessDenied({
|
|
|
21893
21883
|
|
|
21894
21884
|
// src/components/ThemeToggleHeadless.tsx
|
|
21895
21885
|
var import_lucide_react37 = require("lucide-react");
|
|
21896
|
-
var
|
|
21886
|
+
var import_react45 = require("react");
|
|
21897
21887
|
var import_react_dom7 = require("react-dom");
|
|
21898
21888
|
var import_jsx_runtime76 = require("react/jsx-runtime");
|
|
21899
21889
|
function ThemeToggleHeadless({
|
|
@@ -21902,11 +21892,11 @@ function ThemeToggleHeadless({
|
|
|
21902
21892
|
labels,
|
|
21903
21893
|
className
|
|
21904
21894
|
}) {
|
|
21905
|
-
const [isOpen, setIsOpen] = (0,
|
|
21906
|
-
const [mounted, setMounted] = (0,
|
|
21907
|
-
const triggerRef = (0,
|
|
21908
|
-
const [dropdownPosition, setDropdownPosition] = (0,
|
|
21909
|
-
(0,
|
|
21895
|
+
const [isOpen, setIsOpen] = (0, import_react45.useState)(false);
|
|
21896
|
+
const [mounted, setMounted] = (0, import_react45.useState)(false);
|
|
21897
|
+
const triggerRef = (0, import_react45.useRef)(null);
|
|
21898
|
+
const [dropdownPosition, setDropdownPosition] = (0, import_react45.useState)(null);
|
|
21899
|
+
(0, import_react45.useEffect)(() => setMounted(true), []);
|
|
21910
21900
|
const themes = [
|
|
21911
21901
|
{ value: "light", label: labels?.light ?? "Light", icon: import_lucide_react37.Sun },
|
|
21912
21902
|
{ value: "dark", label: labels?.dark ?? "Dark", icon: import_lucide_react37.Moon },
|
|
@@ -21995,7 +21985,7 @@ function ThemeToggleHeadless({
|
|
|
21995
21985
|
}
|
|
21996
21986
|
|
|
21997
21987
|
// src/components/LanguageSwitcherHeadless.tsx
|
|
21998
|
-
var
|
|
21988
|
+
var import_react46 = require("react");
|
|
21999
21989
|
var import_react_dom8 = require("react-dom");
|
|
22000
21990
|
var import_lucide_react38 = require("lucide-react");
|
|
22001
21991
|
var import_jsx_runtime77 = require("react/jsx-runtime");
|
|
@@ -22006,9 +21996,9 @@ function LanguageSwitcherHeadless({
|
|
|
22006
21996
|
labels,
|
|
22007
21997
|
className
|
|
22008
21998
|
}) {
|
|
22009
|
-
const [isOpen, setIsOpen] = (0,
|
|
22010
|
-
const [dropdownPosition, setDropdownPosition] = (0,
|
|
22011
|
-
const triggerButtonRef = (0,
|
|
21999
|
+
const [isOpen, setIsOpen] = (0, import_react46.useState)(false);
|
|
22000
|
+
const [dropdownPosition, setDropdownPosition] = (0, import_react46.useState)(null);
|
|
22001
|
+
const triggerButtonRef = (0, import_react46.useRef)(null);
|
|
22012
22002
|
const currentLanguage = locales.find((l) => l.code === currentLocale) || locales[0];
|
|
22013
22003
|
const calculatePosition = () => {
|
|
22014
22004
|
const rect = triggerButtonRef.current?.getBoundingClientRect();
|
|
@@ -22102,7 +22092,7 @@ var VARIANT_STYLES_ALERT = {
|
|
|
22102
22092
|
};
|
|
22103
22093
|
|
|
22104
22094
|
// ../../lib/i18n/translation-adapter.tsx
|
|
22105
|
-
var
|
|
22095
|
+
var React71 = __toESM(require("react"), 1);
|
|
22106
22096
|
var import_jsx_runtime78 = require("react/jsx-runtime");
|
|
22107
22097
|
var defaultTranslations2 = {
|
|
22108
22098
|
en: {
|
|
@@ -22467,9 +22457,9 @@ function resolveTranslationValue2(translations, namespace, key) {
|
|
|
22467
22457
|
const value = resolveObjectPath2(namespaceValue, key);
|
|
22468
22458
|
return typeof value === "string" ? value : null;
|
|
22469
22459
|
}
|
|
22470
|
-
var TranslationContext2 =
|
|
22460
|
+
var TranslationContext2 = React71.createContext(null);
|
|
22471
22461
|
var UnderverseProvider = ({ children, locale = "en", translations }) => {
|
|
22472
|
-
const t =
|
|
22462
|
+
const t = React71.useCallback(
|
|
22473
22463
|
(namespace) => {
|
|
22474
22464
|
return (key) => {
|
|
22475
22465
|
const mergedTranslations = {
|
|
@@ -22510,7 +22500,7 @@ function getInternalTranslation(namespace, locale) {
|
|
|
22510
22500
|
};
|
|
22511
22501
|
}
|
|
22512
22502
|
function useTranslations(namespace) {
|
|
22513
|
-
const underverseContext =
|
|
22503
|
+
const underverseContext = React71.useContext(TranslationContext2);
|
|
22514
22504
|
if (underverseContext) {
|
|
22515
22505
|
return (key, params) => {
|
|
22516
22506
|
const result = underverseContext.t(namespace)(key);
|
|
@@ -22527,7 +22517,7 @@ function useTranslations(namespace) {
|
|
|
22527
22517
|
return getInternalTranslation(namespace, "en");
|
|
22528
22518
|
}
|
|
22529
22519
|
function useLocale() {
|
|
22530
|
-
const underverseContext =
|
|
22520
|
+
const underverseContext = React71.useContext(TranslationContext2);
|
|
22531
22521
|
if (underverseContext) {
|
|
22532
22522
|
return underverseContext.locale;
|
|
22533
22523
|
}
|
|
@@ -22546,8 +22536,8 @@ function useLocale() {
|
|
|
22546
22536
|
}
|
|
22547
22537
|
|
|
22548
22538
|
// src/components/UEditor/UEditor.tsx
|
|
22549
|
-
var
|
|
22550
|
-
var
|
|
22539
|
+
var import_react58 = __toESM(require("react"), 1);
|
|
22540
|
+
var import_react59 = require("@tiptap/react");
|
|
22551
22541
|
|
|
22552
22542
|
// src/components/UEditor/extensions.ts
|
|
22553
22543
|
var import_extension_document = __toESM(require("@tiptap/extension-document"), 1);
|
|
@@ -22586,8 +22576,8 @@ var import_lowlight = require("lowlight");
|
|
|
22586
22576
|
// src/components/UEditor/slash-command.tsx
|
|
22587
22577
|
var import_core = require("@tiptap/core");
|
|
22588
22578
|
var import_suggestion = __toESM(require("@tiptap/suggestion"), 1);
|
|
22589
|
-
var
|
|
22590
|
-
var
|
|
22579
|
+
var import_react47 = require("@tiptap/react");
|
|
22580
|
+
var import_react48 = require("react");
|
|
22591
22581
|
var import_lucide_react39 = require("lucide-react");
|
|
22592
22582
|
var import_tippy = __toESM(require("tippy.js"), 1);
|
|
22593
22583
|
var import_jsx_runtime79 = require("react/jsx-runtime");
|
|
@@ -22617,17 +22607,17 @@ var DEFAULT_MESSAGES = {
|
|
|
22617
22607
|
table: "Table",
|
|
22618
22608
|
tableDesc: "Insert a table"
|
|
22619
22609
|
};
|
|
22620
|
-
var CommandList = (0,
|
|
22621
|
-
const [selectedIndex, setSelectedIndex] = (0,
|
|
22622
|
-
const listRef = (0,
|
|
22623
|
-
(0,
|
|
22610
|
+
var CommandList = (0, import_react48.forwardRef)((props, ref) => {
|
|
22611
|
+
const [selectedIndex, setSelectedIndex] = (0, import_react48.useState)(0);
|
|
22612
|
+
const listRef = (0, import_react48.useRef)(null);
|
|
22613
|
+
(0, import_react48.useEffect)(() => {
|
|
22624
22614
|
setSelectedIndex(0);
|
|
22625
22615
|
}, [props.items]);
|
|
22626
|
-
(0,
|
|
22616
|
+
(0, import_react48.useEffect)(() => {
|
|
22627
22617
|
const selectedElement = listRef.current?.querySelector(`[data-index="${selectedIndex}"]`);
|
|
22628
22618
|
selectedElement?.scrollIntoView({ block: "nearest" });
|
|
22629
22619
|
}, [selectedIndex, props.items]);
|
|
22630
|
-
(0,
|
|
22620
|
+
(0, import_react48.useImperativeHandle)(ref, () => ({
|
|
22631
22621
|
onKeyDown: ({ event }) => {
|
|
22632
22622
|
if (event.key === "ArrowUp") {
|
|
22633
22623
|
setSelectedIndex((prev) => (prev + props.items.length - 1) % props.items.length);
|
|
@@ -22798,7 +22788,7 @@ var SlashCommand = import_core.Extension.create({
|
|
|
22798
22788
|
let popup;
|
|
22799
22789
|
return {
|
|
22800
22790
|
onStart: (props) => {
|
|
22801
|
-
component = new
|
|
22791
|
+
component = new import_react47.ReactRenderer(CommandList, {
|
|
22802
22792
|
props: {
|
|
22803
22793
|
...props,
|
|
22804
22794
|
messages
|
|
@@ -22946,9 +22936,9 @@ var ClipboardImages = import_core2.Extension.create({
|
|
|
22946
22936
|
// src/components/UEditor/emoji-suggestion.tsx
|
|
22947
22937
|
var import_core3 = require("@tiptap/core");
|
|
22948
22938
|
var import_suggestion2 = __toESM(require("@tiptap/suggestion"), 1);
|
|
22949
|
-
var
|
|
22939
|
+
var import_react49 = require("@tiptap/react");
|
|
22950
22940
|
var import_state2 = require("@tiptap/pm/state");
|
|
22951
|
-
var
|
|
22941
|
+
var import_react50 = require("react");
|
|
22952
22942
|
var import_lucide_react40 = require("lucide-react");
|
|
22953
22943
|
var import_tippy2 = __toESM(require("tippy.js"), 1);
|
|
22954
22944
|
|
|
@@ -23719,12 +23709,12 @@ var EMOJI_LIST = [
|
|
|
23719
23709
|
|
|
23720
23710
|
// src/components/UEditor/emoji-suggestion.tsx
|
|
23721
23711
|
var import_jsx_runtime80 = require("react/jsx-runtime");
|
|
23722
|
-
var EmojiList = (0,
|
|
23723
|
-
const [selectedIndex, setSelectedIndex] = (0,
|
|
23724
|
-
(0,
|
|
23712
|
+
var EmojiList = (0, import_react50.forwardRef)((props, ref) => {
|
|
23713
|
+
const [selectedIndex, setSelectedIndex] = (0, import_react50.useState)(0);
|
|
23714
|
+
(0, import_react50.useEffect)(() => {
|
|
23725
23715
|
setSelectedIndex(0);
|
|
23726
23716
|
}, [props.items]);
|
|
23727
|
-
(0,
|
|
23717
|
+
(0, import_react50.useImperativeHandle)(ref, () => ({
|
|
23728
23718
|
onKeyDown: ({ event }) => {
|
|
23729
23719
|
if (event.key === "ArrowUp") {
|
|
23730
23720
|
setSelectedIndex((prev) => (prev + props.items.length - 1) % props.items.length);
|
|
@@ -23811,7 +23801,7 @@ var EmojiSuggestion = import_core3.Extension.create({
|
|
|
23811
23801
|
let popup;
|
|
23812
23802
|
return {
|
|
23813
23803
|
onStart: (props) => {
|
|
23814
|
-
component = new
|
|
23804
|
+
component = new import_react49.ReactRenderer(EmojiList, {
|
|
23815
23805
|
props,
|
|
23816
23806
|
editor: props.editor
|
|
23817
23807
|
});
|
|
@@ -23929,10 +23919,10 @@ var UEditorPlaceholder = import_core4.Extension.create({
|
|
|
23929
23919
|
});
|
|
23930
23920
|
|
|
23931
23921
|
// src/components/UEditor/resizable-image.tsx
|
|
23932
|
-
var
|
|
23922
|
+
var import_react51 = require("react");
|
|
23933
23923
|
var import_extension_image = __toESM(require("@tiptap/extension-image"), 1);
|
|
23934
23924
|
var import_core5 = require("@tiptap/core");
|
|
23935
|
-
var
|
|
23925
|
+
var import_react52 = require("@tiptap/react");
|
|
23936
23926
|
var import_jsx_runtime81 = require("react/jsx-runtime");
|
|
23937
23927
|
var MIN_IMAGE_SIZE_PX = 40;
|
|
23938
23928
|
var AXIS_LOCK_THRESHOLD_PX = 4;
|
|
@@ -23949,15 +23939,15 @@ function clamp8(value, min, max) {
|
|
|
23949
23939
|
}
|
|
23950
23940
|
function ResizableImageNodeView(props) {
|
|
23951
23941
|
const { node, selected, updateAttributes, editor, getPos } = props;
|
|
23952
|
-
const wrapperRef = (0,
|
|
23953
|
-
const imgRef = (0,
|
|
23954
|
-
const [isHovered, setIsHovered] = (0,
|
|
23955
|
-
const [isResizing, setIsResizing] = (0,
|
|
23942
|
+
const wrapperRef = (0, import_react51.useRef)(null);
|
|
23943
|
+
const imgRef = (0, import_react51.useRef)(null);
|
|
23944
|
+
const [isHovered, setIsHovered] = (0, import_react51.useState)(false);
|
|
23945
|
+
const [isResizing, setIsResizing] = (0, import_react51.useState)(false);
|
|
23956
23946
|
const widthAttr = toNullableNumber(node.attrs["width"]);
|
|
23957
23947
|
const heightAttr = toNullableNumber(node.attrs["height"]);
|
|
23958
23948
|
const textAlign = String(node.attrs["textAlign"] ?? "");
|
|
23959
|
-
const dragStateRef = (0,
|
|
23960
|
-
(0,
|
|
23949
|
+
const dragStateRef = (0, import_react51.useRef)(null);
|
|
23950
|
+
(0, import_react51.useEffect)(() => {
|
|
23961
23951
|
const img = imgRef.current;
|
|
23962
23952
|
if (!img) return;
|
|
23963
23953
|
img.style.width = widthAttr ? `${widthAttr}px` : "";
|
|
@@ -24052,7 +24042,7 @@ function ResizableImageNodeView(props) {
|
|
|
24052
24042
|
const wrapperAlignClass = textAlign === "center" ? "mx-auto" : textAlign === "right" ? "ml-auto" : textAlign === "justify" ? "mx-auto" : "";
|
|
24053
24043
|
const wrapperWidthClass = "w-fit";
|
|
24054
24044
|
return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
|
|
24055
|
-
|
|
24045
|
+
import_react52.NodeViewWrapper,
|
|
24056
24046
|
{
|
|
24057
24047
|
as: "div",
|
|
24058
24048
|
ref: wrapperRef,
|
|
@@ -24133,7 +24123,7 @@ var ResizableImage = import_extension_image.default.extend({
|
|
|
24133
24123
|
return ["img", (0, import_core5.mergeAttributes)(this.options.HTMLAttributes, HTMLAttributes)];
|
|
24134
24124
|
},
|
|
24135
24125
|
addNodeView() {
|
|
24136
|
-
return (0,
|
|
24126
|
+
return (0, import_react52.ReactNodeViewRenderer)(ResizableImageNodeView);
|
|
24137
24127
|
}
|
|
24138
24128
|
}).configure({
|
|
24139
24129
|
allowBase64: true,
|
|
@@ -24288,16 +24278,16 @@ function buildUEditorExtensions({
|
|
|
24288
24278
|
}
|
|
24289
24279
|
|
|
24290
24280
|
// src/components/UEditor/toolbar.tsx
|
|
24291
|
-
var
|
|
24281
|
+
var import_react56 = __toESM(require("react"), 1);
|
|
24292
24282
|
var import_lucide_react44 = require("lucide-react");
|
|
24293
24283
|
|
|
24294
24284
|
// src/components/UEditor/colors.tsx
|
|
24295
|
-
var
|
|
24285
|
+
var import_react53 = require("react");
|
|
24296
24286
|
var import_lucide_react41 = require("lucide-react");
|
|
24297
24287
|
var import_jsx_runtime82 = require("react/jsx-runtime");
|
|
24298
24288
|
var useEditorColors = () => {
|
|
24299
24289
|
const t = useSmartTranslations("UEditor");
|
|
24300
|
-
const textColors = (0,
|
|
24290
|
+
const textColors = (0, import_react53.useMemo)(
|
|
24301
24291
|
() => [
|
|
24302
24292
|
{ name: t("colors.default"), color: "inherit", cssClass: "text-foreground" },
|
|
24303
24293
|
{ name: t("colors.muted"), color: "var(--muted-foreground)", cssClass: "text-muted-foreground" },
|
|
@@ -24310,7 +24300,7 @@ var useEditorColors = () => {
|
|
|
24310
24300
|
],
|
|
24311
24301
|
[t]
|
|
24312
24302
|
);
|
|
24313
|
-
const highlightColors = (0,
|
|
24303
|
+
const highlightColors = (0, import_react53.useMemo)(
|
|
24314
24304
|
() => [
|
|
24315
24305
|
{ name: t("colors.default"), color: "", cssClass: "" },
|
|
24316
24306
|
{ name: t("colors.muted"), color: "var(--muted)", cssClass: "bg-muted" },
|
|
@@ -24355,7 +24345,7 @@ var EditorColorPalette = ({
|
|
|
24355
24345
|
] });
|
|
24356
24346
|
|
|
24357
24347
|
// src/components/UEditor/inputs.tsx
|
|
24358
|
-
var
|
|
24348
|
+
var import_react54 = require("react");
|
|
24359
24349
|
var import_lucide_react42 = require("lucide-react");
|
|
24360
24350
|
var import_jsx_runtime83 = require("react/jsx-runtime");
|
|
24361
24351
|
function normalizeUrl(raw) {
|
|
@@ -24371,9 +24361,9 @@ var LinkInput = ({
|
|
|
24371
24361
|
initialUrl = ""
|
|
24372
24362
|
}) => {
|
|
24373
24363
|
const t = useSmartTranslations("UEditor");
|
|
24374
|
-
const [url, setUrl] = (0,
|
|
24375
|
-
const inputRef = (0,
|
|
24376
|
-
(0,
|
|
24364
|
+
const [url, setUrl] = (0, import_react54.useState)(initialUrl);
|
|
24365
|
+
const inputRef = (0, import_react54.useRef)(null);
|
|
24366
|
+
(0, import_react54.useEffect)(() => {
|
|
24377
24367
|
inputRef.current?.focus();
|
|
24378
24368
|
inputRef.current?.select();
|
|
24379
24369
|
}, []);
|
|
@@ -24400,10 +24390,10 @@ var LinkInput = ({
|
|
|
24400
24390
|
};
|
|
24401
24391
|
var ImageInput = ({ onSubmit, onCancel }) => {
|
|
24402
24392
|
const t = useSmartTranslations("UEditor");
|
|
24403
|
-
const [url, setUrl] = (0,
|
|
24404
|
-
const [alt, setAlt] = (0,
|
|
24405
|
-
const inputRef = (0,
|
|
24406
|
-
(0,
|
|
24393
|
+
const [url, setUrl] = (0, import_react54.useState)("");
|
|
24394
|
+
const [alt, setAlt] = (0, import_react54.useState)("");
|
|
24395
|
+
const inputRef = (0, import_react54.useRef)(null);
|
|
24396
|
+
(0, import_react54.useEffect)(() => {
|
|
24407
24397
|
inputRef.current?.focus();
|
|
24408
24398
|
}, []);
|
|
24409
24399
|
const handleSubmit = (e) => {
|
|
@@ -24456,7 +24446,7 @@ var ImageInput = ({ onSubmit, onCancel }) => {
|
|
|
24456
24446
|
};
|
|
24457
24447
|
|
|
24458
24448
|
// src/components/UEditor/emoji-picker.tsx
|
|
24459
|
-
var
|
|
24449
|
+
var import_react55 = require("react");
|
|
24460
24450
|
var import_lucide_react43 = require("lucide-react");
|
|
24461
24451
|
var import_jsx_runtime84 = require("react/jsx-runtime");
|
|
24462
24452
|
var CATEGORY_ICONS = {
|
|
@@ -24470,12 +24460,12 @@ var CATEGORY_ICONS = {
|
|
|
24470
24460
|
};
|
|
24471
24461
|
var EmojiPicker = ({ onSelect, onClose }) => {
|
|
24472
24462
|
const t = useSmartTranslations("UEditor");
|
|
24473
|
-
const [search, setSearch] = (0,
|
|
24474
|
-
const [activeCategory, setActiveCategory] = (0,
|
|
24475
|
-
const scrollContainerRef = (0,
|
|
24476
|
-
const categoryRefs = (0,
|
|
24477
|
-
const isUserScrolling = (0,
|
|
24478
|
-
const filteredCategories = (0,
|
|
24463
|
+
const [search, setSearch] = (0, import_react55.useState)("");
|
|
24464
|
+
const [activeCategory, setActiveCategory] = (0, import_react55.useState)(EMOJI_LIST[0]?.id || "");
|
|
24465
|
+
const scrollContainerRef = (0, import_react55.useRef)(null);
|
|
24466
|
+
const categoryRefs = (0, import_react55.useRef)({});
|
|
24467
|
+
const isUserScrolling = (0, import_react55.useRef)(false);
|
|
24468
|
+
const filteredCategories = (0, import_react55.useMemo)(() => {
|
|
24479
24469
|
if (!search.trim()) return EMOJI_LIST;
|
|
24480
24470
|
const query = search.toLowerCase();
|
|
24481
24471
|
return EMOJI_LIST.map((category) => ({
|
|
@@ -24489,7 +24479,7 @@ var EmojiPicker = ({ onSelect, onClose }) => {
|
|
|
24489
24479
|
onSelect(emoji);
|
|
24490
24480
|
setSearch("");
|
|
24491
24481
|
};
|
|
24492
|
-
(0,
|
|
24482
|
+
(0, import_react55.useEffect)(() => {
|
|
24493
24483
|
if (search) return;
|
|
24494
24484
|
const container = scrollContainerRef.current;
|
|
24495
24485
|
if (!container) return;
|
|
@@ -24529,7 +24519,7 @@ var EmojiPicker = ({ onSelect, onClose }) => {
|
|
|
24529
24519
|
isUserScrolling.current = true;
|
|
24530
24520
|
}, 500);
|
|
24531
24521
|
};
|
|
24532
|
-
(0,
|
|
24522
|
+
(0, import_react55.useEffect)(() => {
|
|
24533
24523
|
isUserScrolling.current = true;
|
|
24534
24524
|
}, []);
|
|
24535
24525
|
return /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { className: "w-96 bg-card border border-border rounded-2xl shadow-xl overflow-hidden flex flex-col max-h-128", children: [
|
|
@@ -24648,7 +24638,7 @@ function fileToDataUrl2(file) {
|
|
|
24648
24638
|
reader.readAsDataURL(file);
|
|
24649
24639
|
});
|
|
24650
24640
|
}
|
|
24651
|
-
var ToolbarButton =
|
|
24641
|
+
var ToolbarButton = import_react56.default.forwardRef(({ onClick, onMouseDown, active, disabled, children, title, className }, ref) => {
|
|
24652
24642
|
const button = /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
|
|
24653
24643
|
"button",
|
|
24654
24644
|
{
|
|
@@ -24686,10 +24676,10 @@ var EditorToolbar = ({
|
|
|
24686
24676
|
}) => {
|
|
24687
24677
|
const t = useSmartTranslations("UEditor");
|
|
24688
24678
|
const { textColors, highlightColors } = useEditorColors();
|
|
24689
|
-
const [showImageInput, setShowImageInput] = (0,
|
|
24690
|
-
const fileInputRef = (0,
|
|
24691
|
-
const [isUploadingImage, setIsUploadingImage] = (0,
|
|
24692
|
-
const [imageUploadError, setImageUploadError] = (0,
|
|
24679
|
+
const [showImageInput, setShowImageInput] = (0, import_react56.useState)(false);
|
|
24680
|
+
const fileInputRef = (0, import_react56.useRef)(null);
|
|
24681
|
+
const [isUploadingImage, setIsUploadingImage] = (0, import_react56.useState)(false);
|
|
24682
|
+
const [imageUploadError, setImageUploadError] = (0, import_react56.useState)(null);
|
|
24693
24683
|
const insertImageFiles = async (files) => {
|
|
24694
24684
|
if (files.length === 0) return;
|
|
24695
24685
|
setIsUploadingImage(true);
|
|
@@ -25137,15 +25127,15 @@ var EditorToolbar = ({
|
|
|
25137
25127
|
};
|
|
25138
25128
|
|
|
25139
25129
|
// src/components/UEditor/menus.tsx
|
|
25140
|
-
var
|
|
25130
|
+
var import_react57 = require("react");
|
|
25141
25131
|
var import_react_dom9 = require("react-dom");
|
|
25142
25132
|
var import_lucide_react45 = require("lucide-react");
|
|
25143
25133
|
var import_jsx_runtime86 = require("react/jsx-runtime");
|
|
25144
25134
|
var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
|
|
25145
25135
|
const t = useSmartTranslations("UEditor");
|
|
25146
|
-
const [selectedIndex, setSelectedIndex] = (0,
|
|
25147
|
-
const menuRef = (0,
|
|
25148
|
-
const allCommands = (0,
|
|
25136
|
+
const [selectedIndex, setSelectedIndex] = (0, import_react57.useState)(0);
|
|
25137
|
+
const menuRef = (0, import_react57.useRef)(null);
|
|
25138
|
+
const allCommands = (0, import_react57.useMemo)(
|
|
25149
25139
|
() => [
|
|
25150
25140
|
{
|
|
25151
25141
|
icon: import_lucide_react45.Type,
|
|
@@ -25216,19 +25206,19 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
|
|
|
25216
25206
|
],
|
|
25217
25207
|
[editor, t]
|
|
25218
25208
|
);
|
|
25219
|
-
const commands = (0,
|
|
25209
|
+
const commands = (0, import_react57.useMemo)(() => {
|
|
25220
25210
|
if (!filterText) return allCommands;
|
|
25221
25211
|
const lowerFilter = filterText.toLowerCase();
|
|
25222
25212
|
return allCommands.filter((cmd) => cmd.label.toLowerCase().includes(lowerFilter) || cmd.description.toLowerCase().includes(lowerFilter));
|
|
25223
25213
|
}, [allCommands, filterText]);
|
|
25224
|
-
(0,
|
|
25214
|
+
(0, import_react57.useEffect)(() => {
|
|
25225
25215
|
setSelectedIndex(0);
|
|
25226
25216
|
}, [filterText]);
|
|
25227
|
-
(0,
|
|
25217
|
+
(0, import_react57.useEffect)(() => {
|
|
25228
25218
|
const selectedElement = menuRef.current?.querySelector(`[data-index="${selectedIndex}"]`);
|
|
25229
25219
|
selectedElement?.scrollIntoView({ block: "nearest" });
|
|
25230
25220
|
}, [selectedIndex]);
|
|
25231
|
-
const selectCommand = (0,
|
|
25221
|
+
const selectCommand = (0, import_react57.useCallback)(
|
|
25232
25222
|
(index) => {
|
|
25233
25223
|
const command = commands[index];
|
|
25234
25224
|
if (command) {
|
|
@@ -25238,7 +25228,7 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
|
|
|
25238
25228
|
},
|
|
25239
25229
|
[commands, onClose]
|
|
25240
25230
|
);
|
|
25241
|
-
(0,
|
|
25231
|
+
(0, import_react57.useEffect)(() => {
|
|
25242
25232
|
const handleKeyDown = (e) => {
|
|
25243
25233
|
if (commands.length === 0) return;
|
|
25244
25234
|
if (e.key === "ArrowDown") {
|
|
@@ -25298,7 +25288,7 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
|
|
|
25298
25288
|
};
|
|
25299
25289
|
var FloatingMenuContent = ({ editor }) => {
|
|
25300
25290
|
const t = useSmartTranslations("UEditor");
|
|
25301
|
-
const [showCommands, setShowCommands] = (0,
|
|
25291
|
+
const [showCommands, setShowCommands] = (0, import_react57.useState)(false);
|
|
25302
25292
|
if (showCommands) {
|
|
25303
25293
|
return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(SlashCommandMenu, { editor, onClose: () => setShowCommands(false) });
|
|
25304
25294
|
}
|
|
@@ -25321,12 +25311,12 @@ var BubbleMenuContent = ({
|
|
|
25321
25311
|
}) => {
|
|
25322
25312
|
const t = useSmartTranslations("UEditor");
|
|
25323
25313
|
const { textColors, highlightColors } = useEditorColors();
|
|
25324
|
-
const [showLinkInput, setShowLinkInput] = (0,
|
|
25325
|
-
const [showEditorColorPalette, setShowEditorColorPalette] = (0,
|
|
25326
|
-
(0,
|
|
25314
|
+
const [showLinkInput, setShowLinkInput] = (0, import_react57.useState)(false);
|
|
25315
|
+
const [showEditorColorPalette, setShowEditorColorPalette] = (0, import_react57.useState)(false);
|
|
25316
|
+
(0, import_react57.useEffect)(() => {
|
|
25327
25317
|
onKeepOpenChange?.(showLinkInput);
|
|
25328
25318
|
}, [onKeepOpenChange, showLinkInput]);
|
|
25329
|
-
(0,
|
|
25319
|
+
(0, import_react57.useEffect)(() => {
|
|
25330
25320
|
if (!showLinkInput) return;
|
|
25331
25321
|
const close = () => setShowLinkInput(false);
|
|
25332
25322
|
editor.on("selectionUpdate", close);
|
|
@@ -25449,15 +25439,15 @@ var BubbleMenuContent = ({
|
|
|
25449
25439
|
] });
|
|
25450
25440
|
};
|
|
25451
25441
|
var CustomBubbleMenu = ({ editor }) => {
|
|
25452
|
-
const [isVisible, setIsVisible] = (0,
|
|
25453
|
-
const [position, setPosition] = (0,
|
|
25454
|
-
const menuRef = (0,
|
|
25455
|
-
const keepOpenRef = (0,
|
|
25456
|
-
const setKeepOpen = (0,
|
|
25442
|
+
const [isVisible, setIsVisible] = (0, import_react57.useState)(false);
|
|
25443
|
+
const [position, setPosition] = (0, import_react57.useState)({ top: 0, left: 0 });
|
|
25444
|
+
const menuRef = (0, import_react57.useRef)(null);
|
|
25445
|
+
const keepOpenRef = (0, import_react57.useRef)(false);
|
|
25446
|
+
const setKeepOpen = (0, import_react57.useCallback)((next) => {
|
|
25457
25447
|
keepOpenRef.current = next;
|
|
25458
25448
|
if (next) setIsVisible(true);
|
|
25459
25449
|
}, []);
|
|
25460
|
-
(0,
|
|
25450
|
+
(0, import_react57.useEffect)(() => {
|
|
25461
25451
|
const updatePosition = () => {
|
|
25462
25452
|
const { state, view } = editor;
|
|
25463
25453
|
const { from, to, empty } = state.selection;
|
|
@@ -25510,9 +25500,9 @@ var CustomBubbleMenu = ({ editor }) => {
|
|
|
25510
25500
|
);
|
|
25511
25501
|
};
|
|
25512
25502
|
var CustomFloatingMenu = ({ editor }) => {
|
|
25513
|
-
const [isVisible, setIsVisible] = (0,
|
|
25514
|
-
const [position, setPosition] = (0,
|
|
25515
|
-
(0,
|
|
25503
|
+
const [isVisible, setIsVisible] = (0, import_react57.useState)(false);
|
|
25504
|
+
const [position, setPosition] = (0, import_react57.useState)({ top: 0, left: 0 });
|
|
25505
|
+
(0, import_react57.useEffect)(() => {
|
|
25516
25506
|
const updatePosition = () => {
|
|
25517
25507
|
const { state, view } = editor;
|
|
25518
25508
|
const { $from, empty } = state.selection;
|
|
@@ -25831,7 +25821,7 @@ async function prepareUEditorContentForSave({
|
|
|
25831
25821
|
|
|
25832
25822
|
// src/components/UEditor/UEditor.tsx
|
|
25833
25823
|
var import_jsx_runtime88 = require("react/jsx-runtime");
|
|
25834
|
-
var UEditor =
|
|
25824
|
+
var UEditor = import_react58.default.forwardRef(({
|
|
25835
25825
|
content = "",
|
|
25836
25826
|
onChange,
|
|
25837
25827
|
onHtmlChange,
|
|
@@ -25854,12 +25844,12 @@ var UEditor = import_react57.default.forwardRef(({
|
|
|
25854
25844
|
}, ref) => {
|
|
25855
25845
|
const t = useSmartTranslations("UEditor");
|
|
25856
25846
|
const effectivePlaceholder = placeholder ?? t("placeholder");
|
|
25857
|
-
const inFlightPrepareRef = (0,
|
|
25858
|
-
const extensions = (0,
|
|
25847
|
+
const inFlightPrepareRef = (0, import_react58.useRef)(null);
|
|
25848
|
+
const extensions = (0, import_react58.useMemo)(
|
|
25859
25849
|
() => buildUEditorExtensions({ placeholder: effectivePlaceholder, translate: t, maxCharacters, uploadImage, imageInsertMode, editable }),
|
|
25860
25850
|
[effectivePlaceholder, t, maxCharacters, uploadImage, imageInsertMode, editable]
|
|
25861
25851
|
);
|
|
25862
|
-
const editor = (0,
|
|
25852
|
+
const editor = (0, import_react59.useEditor)({
|
|
25863
25853
|
immediatelyRender: false,
|
|
25864
25854
|
extensions,
|
|
25865
25855
|
content,
|
|
@@ -25973,7 +25963,7 @@ var UEditor = import_react57.default.forwardRef(({
|
|
|
25973
25963
|
onJsonChange?.(editor2.getJSON());
|
|
25974
25964
|
}
|
|
25975
25965
|
});
|
|
25976
|
-
(0,
|
|
25966
|
+
(0, import_react58.useImperativeHandle)(
|
|
25977
25967
|
ref,
|
|
25978
25968
|
() => ({
|
|
25979
25969
|
prepareContentForSave: async ({ throwOnError = false } = {}) => {
|
|
@@ -25995,7 +25985,7 @@ var UEditor = import_react57.default.forwardRef(({
|
|
|
25995
25985
|
}),
|
|
25996
25986
|
[content, editor, uploadImageForSave]
|
|
25997
25987
|
);
|
|
25998
|
-
(0,
|
|
25988
|
+
(0, import_react58.useEffect)(() => {
|
|
25999
25989
|
if (editor && content !== editor.getHTML()) {
|
|
26000
25990
|
if (editor.isEmpty && content) {
|
|
26001
25991
|
editor.commands.setContent(content);
|
|
@@ -26028,7 +26018,7 @@ var UEditor = import_react57.default.forwardRef(({
|
|
|
26028
26018
|
editable && showBubbleMenu && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(CustomBubbleMenu, { editor }),
|
|
26029
26019
|
editable && showFloatingMenu && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(CustomFloatingMenu, { editor }),
|
|
26030
26020
|
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
|
|
26031
|
-
|
|
26021
|
+
import_react59.EditorContent,
|
|
26032
26022
|
{
|
|
26033
26023
|
editor,
|
|
26034
26024
|
className: "flex-1 overflow-y-auto",
|