@underverse-ui/underverse 0.2.111 → 0.2.113
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +381 -245
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +553 -417
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -178,11 +178,11 @@ var variantStyles = {
|
|
|
178
178
|
gradient: "bg-linear-to-r from-primary to-secondary text-primary-foreground border-transparent hover:from-primary/90 hover:to-secondary/90"
|
|
179
179
|
};
|
|
180
180
|
var sizeStyles = {
|
|
181
|
-
xs: "px-1.5 py-0.5 text-xs font-medium min-h-
|
|
182
|
-
sm: "px-2 py-0.5 text-xs font-medium min-h-
|
|
183
|
-
md: "px-2.5 py-1 text-xs font-medium min-h-
|
|
184
|
-
lg: "px-3 py-1.5 text-sm font-medium min-h-
|
|
185
|
-
xl: "px-4 py-2 text-sm font-semibold min-h-
|
|
181
|
+
xs: "px-1.5 py-0.5 text-xs font-medium min-h-4.5",
|
|
182
|
+
sm: "px-2 py-0.5 text-xs font-medium min-h-5",
|
|
183
|
+
md: "px-2.5 py-1 text-xs font-medium min-h-6",
|
|
184
|
+
lg: "px-3 py-1.5 text-sm font-medium min-h-7",
|
|
185
|
+
xl: "px-4 py-2 text-sm font-semibold min-h-8"
|
|
186
186
|
};
|
|
187
187
|
var dotSizeStyles = {
|
|
188
188
|
xs: "w-1.5 h-1.5",
|
|
@@ -1774,9 +1774,9 @@ var Textarea2 = forwardRef5(
|
|
|
1774
1774
|
({ label, error, description, className, required, variant = "default", size = "md", ...rest }, ref) => {
|
|
1775
1775
|
const [isFocused, setIsFocused] = useState6(false);
|
|
1776
1776
|
const sizeClasses2 = {
|
|
1777
|
-
sm: "px-3 py-2 text-sm min-h-
|
|
1778
|
-
md: "px-4 py-3 text-sm min-h-
|
|
1779
|
-
lg: "px-5 py-4 text-base min-h-
|
|
1777
|
+
sm: "px-3 py-2 text-sm min-h-20",
|
|
1778
|
+
md: "px-4 py-3 text-sm min-h-25",
|
|
1779
|
+
lg: "px-5 py-4 text-base min-h-30"
|
|
1780
1780
|
};
|
|
1781
1781
|
const variantClasses2 = {
|
|
1782
1782
|
default: cn(
|
|
@@ -3844,28 +3844,28 @@ import { X as X6 } from "lucide-react";
|
|
|
3844
3844
|
import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
3845
3845
|
var sizeStyles4 = {
|
|
3846
3846
|
sm: {
|
|
3847
|
-
right: "w-
|
|
3848
|
-
left: "w-
|
|
3849
|
-
top: "h-
|
|
3850
|
-
bottom: "h-
|
|
3847
|
+
right: "w-75",
|
|
3848
|
+
left: "w-75",
|
|
3849
|
+
top: "h-50",
|
|
3850
|
+
bottom: "h-50"
|
|
3851
3851
|
},
|
|
3852
3852
|
md: {
|
|
3853
|
-
right: "w-
|
|
3854
|
-
left: "w-
|
|
3855
|
-
top: "h-
|
|
3856
|
-
bottom: "h-
|
|
3853
|
+
right: "w-100",
|
|
3854
|
+
left: "w-100",
|
|
3855
|
+
top: "h-75",
|
|
3856
|
+
bottom: "h-75"
|
|
3857
3857
|
},
|
|
3858
3858
|
lg: {
|
|
3859
|
-
right: "w-
|
|
3860
|
-
left: "w-
|
|
3861
|
-
top: "h-
|
|
3862
|
-
bottom: "h-
|
|
3859
|
+
right: "w-125",
|
|
3860
|
+
left: "w-125",
|
|
3861
|
+
top: "h-100",
|
|
3862
|
+
bottom: "h-100"
|
|
3863
3863
|
},
|
|
3864
3864
|
xl: {
|
|
3865
|
-
right: "w-
|
|
3866
|
-
left: "w-
|
|
3867
|
-
top: "h-
|
|
3868
|
-
bottom: "h-
|
|
3865
|
+
right: "w-150",
|
|
3866
|
+
left: "w-150",
|
|
3867
|
+
top: "h-125",
|
|
3868
|
+
bottom: "h-125"
|
|
3869
3869
|
},
|
|
3870
3870
|
full: {
|
|
3871
3871
|
right: "w-full",
|
|
@@ -6956,7 +6956,7 @@ function WheelColumn({
|
|
|
6956
6956
|
const ui = React25.useMemo(() => {
|
|
6957
6957
|
if (size === "sm") {
|
|
6958
6958
|
return {
|
|
6959
|
-
columnWidth: "min-w-
|
|
6959
|
+
columnWidth: "min-w-16 max-w-21",
|
|
6960
6960
|
label: "text-[9px] mb-2",
|
|
6961
6961
|
selectedText: "text-base",
|
|
6962
6962
|
unselectedText: "text-sm",
|
|
@@ -6965,7 +6965,7 @@ function WheelColumn({
|
|
|
6965
6965
|
}
|
|
6966
6966
|
if (size === "lg") {
|
|
6967
6967
|
return {
|
|
6968
|
-
columnWidth: "min-w-
|
|
6968
|
+
columnWidth: "min-w-20 max-w-27.5",
|
|
6969
6969
|
label: "text-[11px] mb-3",
|
|
6970
6970
|
selectedText: "text-xl",
|
|
6971
6971
|
unselectedText: "text-lg",
|
|
@@ -6973,7 +6973,7 @@ function WheelColumn({
|
|
|
6973
6973
|
};
|
|
6974
6974
|
}
|
|
6975
6975
|
return {
|
|
6976
|
-
columnWidth: "min-w-
|
|
6976
|
+
columnWidth: "min-w-17.5 max-w-22.5",
|
|
6977
6977
|
label: "text-[10px] mb-3",
|
|
6978
6978
|
selectedText: "text-lg",
|
|
6979
6979
|
unselectedText: "text-base",
|
|
@@ -7850,7 +7850,7 @@ function TimePicker({
|
|
|
7850
7850
|
{
|
|
7851
7851
|
className: cn(
|
|
7852
7852
|
"flex-1",
|
|
7853
|
-
size === "sm" ? "min-w-
|
|
7853
|
+
size === "sm" ? "min-w-16 max-w-21" : size === "lg" ? "min-w-20 max-w-27.5" : "min-w-17.5 max-w-22.5"
|
|
7854
7854
|
),
|
|
7855
7855
|
children: [
|
|
7856
7856
|
/* @__PURE__ */ jsx31("div", { className: cn(panelSz.periodLabel, "font-bold uppercase tracking-wider text-muted-foreground/70 text-center"), children: "Period" }),
|
|
@@ -8040,8 +8040,10 @@ var DateTimePicker = ({
|
|
|
8040
8040
|
const locale = useLocale();
|
|
8041
8041
|
const [open, setOpen] = React26.useState(false);
|
|
8042
8042
|
const [tempDate, setTempDate] = React26.useState(value);
|
|
8043
|
+
const [calendarMonth, setCalendarMonth] = React26.useState(() => value ?? /* @__PURE__ */ new Date());
|
|
8043
8044
|
React26.useEffect(() => {
|
|
8044
8045
|
setTempDate(value);
|
|
8046
|
+
setCalendarMonth(value ?? /* @__PURE__ */ new Date());
|
|
8045
8047
|
}, [value, open]);
|
|
8046
8048
|
const getTimeString = (date) => {
|
|
8047
8049
|
if (!date) return "";
|
|
@@ -8067,6 +8069,7 @@ var DateTimePicker = ({
|
|
|
8067
8069
|
}
|
|
8068
8070
|
return newDate;
|
|
8069
8071
|
});
|
|
8072
|
+
setCalendarMonth(date);
|
|
8070
8073
|
}
|
|
8071
8074
|
};
|
|
8072
8075
|
const handleTimeChange = (timeStr) => {
|
|
@@ -8190,9 +8193,8 @@ var DateTimePicker = ({
|
|
|
8190
8193
|
value: tempDate,
|
|
8191
8194
|
onSelect: handleDateSelect,
|
|
8192
8195
|
selectMode: "single",
|
|
8193
|
-
month:
|
|
8194
|
-
onMonthChange:
|
|
8195
|
-
},
|
|
8196
|
+
month: calendarMonth,
|
|
8197
|
+
onMonthChange: setCalendarMonth,
|
|
8196
8198
|
minDate,
|
|
8197
8199
|
maxDate,
|
|
8198
8200
|
className: "border-0 shadow-none w-auto",
|
|
@@ -8231,7 +8233,7 @@ var DateTimePicker = ({
|
|
|
8231
8233
|
};
|
|
8232
8234
|
|
|
8233
8235
|
// ../../components/ui/CalendarTimeline/CalendarTimeline.tsx
|
|
8234
|
-
import * as
|
|
8236
|
+
import * as React32 from "react";
|
|
8235
8237
|
import { Plus as Plus2 } from "lucide-react";
|
|
8236
8238
|
|
|
8237
8239
|
// ../../components/ui/CalendarTimeline/date.ts
|
|
@@ -8693,6 +8695,7 @@ function resourcesById(resources) {
|
|
|
8693
8695
|
}
|
|
8694
8696
|
|
|
8695
8697
|
// ../../components/ui/CalendarTimeline/CalendarTimelineHeader.tsx
|
|
8698
|
+
import * as React28 from "react";
|
|
8696
8699
|
import { Calendar as Calendar3, CalendarDays, CalendarRange, ChevronLeft as ChevronLeft4, ChevronRight as ChevronRight5, GripVertical, Plus } from "lucide-react";
|
|
8697
8700
|
import { jsx as jsx34, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
8698
8701
|
var VIEW_ICONS = {
|
|
@@ -8711,7 +8714,8 @@ function CalendarTimelineHeader(props) {
|
|
|
8711
8714
|
activeView,
|
|
8712
8715
|
sizeConfig,
|
|
8713
8716
|
navigate,
|
|
8714
|
-
|
|
8717
|
+
now,
|
|
8718
|
+
onApplyDateTime,
|
|
8715
8719
|
setView,
|
|
8716
8720
|
effectiveResourceColumnWidth,
|
|
8717
8721
|
canResizeColumn,
|
|
@@ -8719,6 +8723,64 @@ function CalendarTimelineHeader(props) {
|
|
|
8719
8723
|
headerRef,
|
|
8720
8724
|
slotHeaderNodes
|
|
8721
8725
|
} = props;
|
|
8726
|
+
const dt = useTranslations("DateTimePicker");
|
|
8727
|
+
const locale = useLocale();
|
|
8728
|
+
const [todayOpen, setTodayOpen] = React28.useState(false);
|
|
8729
|
+
const [tempDate, setTempDate] = React28.useState(() => now);
|
|
8730
|
+
const [calendarMonth, setCalendarMonth] = React28.useState(() => now);
|
|
8731
|
+
React28.useEffect(() => {
|
|
8732
|
+
if (!todayOpen) return;
|
|
8733
|
+
setTempDate(now);
|
|
8734
|
+
setCalendarMonth(now);
|
|
8735
|
+
}, [now, todayOpen]);
|
|
8736
|
+
const monthLabel = React28.useCallback(
|
|
8737
|
+
(date) => date.toLocaleDateString(locale === "vi" ? "vi-VN" : "en-US", {
|
|
8738
|
+
month: "long",
|
|
8739
|
+
year: "numeric"
|
|
8740
|
+
}),
|
|
8741
|
+
[locale]
|
|
8742
|
+
);
|
|
8743
|
+
const weekdays = React28.useMemo(() => {
|
|
8744
|
+
switch (locale) {
|
|
8745
|
+
case "vi":
|
|
8746
|
+
return ["CN", "T2", "T3", "T4", "T5", "T6", "T7"];
|
|
8747
|
+
case "ko":
|
|
8748
|
+
return ["\uC77C", "\uC6D4", "\uD654", "\uC218", "\uBAA9", "\uAE08", "\uD1A0"];
|
|
8749
|
+
case "ja":
|
|
8750
|
+
return ["\u65E5", "\u6708", "\u706B", "\u6C34", "\u6728", "\u91D1", "\u571F"];
|
|
8751
|
+
default:
|
|
8752
|
+
return ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
|
|
8753
|
+
}
|
|
8754
|
+
}, [locale]);
|
|
8755
|
+
const getTimeString = React28.useCallback((date) => {
|
|
8756
|
+
const h = date.getHours();
|
|
8757
|
+
const m = date.getMinutes();
|
|
8758
|
+
return `${h.toString().padStart(2, "0")}:${m.toString().padStart(2, "0")}`;
|
|
8759
|
+
}, []);
|
|
8760
|
+
const handleDateSelect = React28.useCallback((date) => {
|
|
8761
|
+
if (!(date instanceof Date)) return;
|
|
8762
|
+
setTempDate((prev) => {
|
|
8763
|
+
const next = new Date(date);
|
|
8764
|
+
next.setHours(prev.getHours(), prev.getMinutes(), prev.getSeconds());
|
|
8765
|
+
return next;
|
|
8766
|
+
});
|
|
8767
|
+
}, []);
|
|
8768
|
+
const handleTimeChange = React28.useCallback((timeStr) => {
|
|
8769
|
+
if (!timeStr) return;
|
|
8770
|
+
const [hStr, mStr] = timeStr.split(":");
|
|
8771
|
+
const h = parseInt(hStr, 10);
|
|
8772
|
+
const m = parseInt(mStr, 10);
|
|
8773
|
+
if (!Number.isFinite(h) || !Number.isFinite(m)) return;
|
|
8774
|
+
setTempDate((prev) => {
|
|
8775
|
+
const next = new Date(prev);
|
|
8776
|
+
next.setHours(h, m, prev.getSeconds());
|
|
8777
|
+
return next;
|
|
8778
|
+
});
|
|
8779
|
+
}, []);
|
|
8780
|
+
const applyDateTime = React28.useCallback(() => {
|
|
8781
|
+
onApplyDateTime(tempDate);
|
|
8782
|
+
setTodayOpen(false);
|
|
8783
|
+
}, [onApplyDateTime, tempDate]);
|
|
8722
8784
|
return /* @__PURE__ */ jsxs29("div", { className: "sticky top-0 z-30 bg-linear-to-b from-background via-background to-background/95 border-b border-border/40 backdrop-blur-xl", children: [
|
|
8723
8785
|
/* @__PURE__ */ jsxs29("div", { className: cn("flex items-center justify-between gap-4", sizeConfig.headerPaddingClass), children: [
|
|
8724
8786
|
/* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-1.5 min-w-0", children: [
|
|
@@ -8735,13 +8797,87 @@ function CalendarTimelineHeader(props) {
|
|
|
8735
8797
|
}
|
|
8736
8798
|
),
|
|
8737
8799
|
/* @__PURE__ */ jsx34(
|
|
8738
|
-
|
|
8800
|
+
Popover,
|
|
8739
8801
|
{
|
|
8740
|
-
|
|
8741
|
-
|
|
8742
|
-
|
|
8743
|
-
|
|
8744
|
-
|
|
8802
|
+
open: todayOpen,
|
|
8803
|
+
onOpenChange: setTodayOpen,
|
|
8804
|
+
placement: "bottom-start",
|
|
8805
|
+
trigger: /* @__PURE__ */ jsx34(
|
|
8806
|
+
Button_default,
|
|
8807
|
+
{
|
|
8808
|
+
variant: "ghost",
|
|
8809
|
+
size: "sm",
|
|
8810
|
+
className: cn(sizeConfig.controlButtonTextClass, "rounded-full hover:bg-background/80 font-medium transition-all duration-200"),
|
|
8811
|
+
children: labels.today
|
|
8812
|
+
}
|
|
8813
|
+
),
|
|
8814
|
+
contentClassName: cn(
|
|
8815
|
+
"w-auto p-0 rounded-2xl md:rounded-3xl overflow-hidden"
|
|
8816
|
+
),
|
|
8817
|
+
children: /* @__PURE__ */ jsxs29("div", { className: "max-w-[calc(100vw-1rem)] max-h-[calc(100vh-6rem)] overflow-auto", children: [
|
|
8818
|
+
/* @__PURE__ */ jsxs29("div", { className: "flex flex-col lg:flex-row divide-y lg:divide-y-0 lg:divide-x divide-border", children: [
|
|
8819
|
+
/* @__PURE__ */ jsx34("div", { className: "p-2", children: /* @__PURE__ */ jsx34(
|
|
8820
|
+
Calendar2,
|
|
8821
|
+
{
|
|
8822
|
+
value: tempDate,
|
|
8823
|
+
onSelect: handleDateSelect,
|
|
8824
|
+
selectMode: "single",
|
|
8825
|
+
month: calendarMonth,
|
|
8826
|
+
onMonthChange: setCalendarMonth,
|
|
8827
|
+
className: "border-0 shadow-none w-auto",
|
|
8828
|
+
size: "sm",
|
|
8829
|
+
labels: {
|
|
8830
|
+
month: monthLabel,
|
|
8831
|
+
weekdays
|
|
8832
|
+
}
|
|
8833
|
+
}
|
|
8834
|
+
) }),
|
|
8835
|
+
/* @__PURE__ */ jsxs29("div", { className: "p-2 flex flex-col gap-3", children: [
|
|
8836
|
+
/* @__PURE__ */ jsxs29("div", { className: "flex items-center justify-between gap-2", children: [
|
|
8837
|
+
/* @__PURE__ */ jsx34("div", { className: "text-sm font-semibold text-muted-foreground", children: dt?.("time") || "Time" }),
|
|
8838
|
+
/* @__PURE__ */ jsx34(
|
|
8839
|
+
Button_default,
|
|
8840
|
+
{
|
|
8841
|
+
variant: "ghost",
|
|
8842
|
+
size: "sm",
|
|
8843
|
+
className: "rounded-full text-muted-foreground hover:text-foreground",
|
|
8844
|
+
onClick: () => setTempDate(now),
|
|
8845
|
+
children: labels.today
|
|
8846
|
+
}
|
|
8847
|
+
)
|
|
8848
|
+
] }),
|
|
8849
|
+
/* @__PURE__ */ jsx34(
|
|
8850
|
+
TimePicker,
|
|
8851
|
+
{
|
|
8852
|
+
variant: "inline",
|
|
8853
|
+
value: getTimeString(tempDate),
|
|
8854
|
+
onChange: handleTimeChange,
|
|
8855
|
+
format: "24",
|
|
8856
|
+
includeSeconds: false,
|
|
8857
|
+
clearable: false,
|
|
8858
|
+
className: "border-0 shadow-none p-0 bg-transparent rounded-none",
|
|
8859
|
+
size: "sm"
|
|
8860
|
+
}
|
|
8861
|
+
)
|
|
8862
|
+
] })
|
|
8863
|
+
] }),
|
|
8864
|
+
/* @__PURE__ */ jsxs29("div", { className: "p-3 border-t border-border flex justify-between items-center bg-muted/20", children: [
|
|
8865
|
+
/* @__PURE__ */ jsx34(
|
|
8866
|
+
Button_default,
|
|
8867
|
+
{
|
|
8868
|
+
variant: "ghost",
|
|
8869
|
+
size: "sm",
|
|
8870
|
+
className: "rounded-full text-muted-foreground hover:text-foreground",
|
|
8871
|
+
onClick: () => {
|
|
8872
|
+
setTempDate(now);
|
|
8873
|
+
setCalendarMonth(now);
|
|
8874
|
+
},
|
|
8875
|
+
children: labels.today
|
|
8876
|
+
}
|
|
8877
|
+
),
|
|
8878
|
+
/* @__PURE__ */ jsx34(Button_default, { size: "sm", onClick: applyDateTime, className: "rounded-full", children: dt?.("done") || "Done" })
|
|
8879
|
+
] })
|
|
8880
|
+
] })
|
|
8745
8881
|
}
|
|
8746
8882
|
),
|
|
8747
8883
|
/* @__PURE__ */ jsx34(
|
|
@@ -8904,9 +9040,9 @@ function ResourceRowCell(props) {
|
|
|
8904
9040
|
}
|
|
8905
9041
|
|
|
8906
9042
|
// ../../components/ui/CalendarTimeline/CalendarTimelineGridOverlay.tsx
|
|
8907
|
-
import * as
|
|
9043
|
+
import * as React29 from "react";
|
|
8908
9044
|
import { jsx as jsx36, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
8909
|
-
var CalendarTimelineGridOverlay =
|
|
9045
|
+
var CalendarTimelineGridOverlay = React29.memo(function CalendarTimelineGridOverlay2(props) {
|
|
8910
9046
|
const { gridWidth, height, slotLefts, slotWidths, activeView, todaySlotIdx, dayAnchor, weekendSlotIdxs, visibleStartIdx, visibleEndIdx, className } = props;
|
|
8911
9047
|
const startIdx = Math.max(0, visibleStartIdx ?? 0);
|
|
8912
9048
|
const endIdx = Math.min(slotWidths.length, visibleEndIdx ?? slotWidths.length);
|
|
@@ -8935,19 +9071,19 @@ var CalendarTimelineGridOverlay = React28.memo(function CalendarTimelineGridOver
|
|
|
8935
9071
|
slotLefts.slice(startIdx, endIdx).map((left, j) => {
|
|
8936
9072
|
const i = startIdx + j;
|
|
8937
9073
|
const isAnchor = dayAnchor ? Boolean(dayAnchor[i]) : true;
|
|
8938
|
-
const opacityClass = activeView === "day" && dayAnchor ? isAnchor ? "bg-border/
|
|
9074
|
+
const opacityClass = activeView === "day" && dayAnchor ? isAnchor ? "bg-border/35" : "bg-border/15" : "bg-border/30";
|
|
8939
9075
|
return /* @__PURE__ */ jsx36("div", { className: cn("absolute top-0 h-full w-px", opacityClass), style: { left }, "aria-hidden": true }, i);
|
|
8940
9076
|
})
|
|
8941
9077
|
] });
|
|
8942
9078
|
});
|
|
8943
9079
|
|
|
8944
9080
|
// ../../components/ui/CalendarTimeline/CalendarTimelineSlotHeaderCell.tsx
|
|
8945
|
-
import * as
|
|
9081
|
+
import * as React30 from "react";
|
|
8946
9082
|
import { Dot } from "lucide-react";
|
|
8947
9083
|
import { jsx as jsx37, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
8948
|
-
var CalendarTimelineSlotHeaderCell =
|
|
9084
|
+
var CalendarTimelineSlotHeaderCell = React30.memo(function CalendarTimelineSlotHeaderCell2(props) {
|
|
8949
9085
|
const { width, activeView, isToday: isToday2, label, ariaLabel, borderClassName, dayHeaderMarks, idx, className } = props;
|
|
8950
|
-
const content =
|
|
9086
|
+
const content = React30.useMemo(() => {
|
|
8951
9087
|
if (activeView === "day" && dayHeaderMarks) {
|
|
8952
9088
|
if (dayHeaderMarks.showEllipsis[idx]) return /* @__PURE__ */ jsx37("span", { className: "text-xs text-muted-foreground/70 select-none", children: "\u2026" });
|
|
8953
9089
|
if (!dayHeaderMarks.showTime[idx]) return null;
|
|
@@ -8970,7 +9106,7 @@ var CalendarTimelineSlotHeaderCell = React29.memo(function CalendarTimelineSlotH
|
|
|
8970
9106
|
});
|
|
8971
9107
|
|
|
8972
9108
|
// ../../components/ui/CalendarTimeline/internal-hooks.ts
|
|
8973
|
-
import * as
|
|
9109
|
+
import * as React31 from "react";
|
|
8974
9110
|
function useTimelineSlots(args) {
|
|
8975
9111
|
const {
|
|
8976
9112
|
activeView,
|
|
@@ -8984,7 +9120,7 @@ function useTimelineSlots(args) {
|
|
|
8984
9120
|
resolvedNow,
|
|
8985
9121
|
formatters
|
|
8986
9122
|
} = args;
|
|
8987
|
-
const { slots, range } =
|
|
9123
|
+
const { slots, range } = React31.useMemo(() => {
|
|
8988
9124
|
const { start, end, slotStarts: slotStarts2 } = computeSlotStarts({
|
|
8989
9125
|
view: activeView,
|
|
8990
9126
|
date: activeDate,
|
|
@@ -9006,9 +9142,9 @@ function useTimelineSlots(args) {
|
|
|
9006
9142
|
}));
|
|
9007
9143
|
return { slots: slotItems, range: { start, end } };
|
|
9008
9144
|
}, [activeView, activeDate, dayRangeMode, dayTimeStepMinutes, formatters, resolvedLocale, resolvedNow, resolvedTimeZone, weekStartsOn, workHours]);
|
|
9009
|
-
const slotStarts =
|
|
9010
|
-
const todaySlotIdx =
|
|
9011
|
-
const weekendSlotIdxs =
|
|
9145
|
+
const slotStarts = React31.useMemo(() => slots.map((s) => s.start), [slots]);
|
|
9146
|
+
const todaySlotIdx = React31.useMemo(() => slots.findIndex((s) => s.isToday), [slots]);
|
|
9147
|
+
const weekendSlotIdxs = React31.useMemo(() => {
|
|
9012
9148
|
const out = [];
|
|
9013
9149
|
for (let i = 0; i < slots.length; i++) if (slots[i]?.isWeekend) out.push(i);
|
|
9014
9150
|
return out;
|
|
@@ -9017,16 +9153,16 @@ function useTimelineSlots(args) {
|
|
|
9017
9153
|
}
|
|
9018
9154
|
function useNormalizedEvents(args) {
|
|
9019
9155
|
const { events, range, activeView, resolvedTimeZone, resources } = args;
|
|
9020
|
-
const normalizedEvents =
|
|
9156
|
+
const normalizedEvents = React31.useMemo(() => {
|
|
9021
9157
|
return normalizeEvents({ events, range, view: activeView, timeZone: resolvedTimeZone });
|
|
9022
9158
|
}, [activeView, events, range, resolvedTimeZone]);
|
|
9023
|
-
const eventsByResource =
|
|
9024
|
-
const resourceById =
|
|
9159
|
+
const eventsByResource = React31.useMemo(() => eventsByResourceId(normalizedEvents), [normalizedEvents]);
|
|
9160
|
+
const resourceById = React31.useMemo(() => resourcesById(resources), [resources]);
|
|
9025
9161
|
return { normalizedEvents, eventsByResource, resourceById };
|
|
9026
9162
|
}
|
|
9027
9163
|
function useDayHeaderMarks(args) {
|
|
9028
9164
|
const { enabled, activeView, normalizedEvents, slotStarts, slotCount } = args;
|
|
9029
|
-
return
|
|
9165
|
+
return React31.useMemo(() => {
|
|
9030
9166
|
if (!enabled) return null;
|
|
9031
9167
|
if (activeView !== "day") return null;
|
|
9032
9168
|
const n = slotCount;
|
|
@@ -9061,14 +9197,14 @@ function useSlotMetrics(args) {
|
|
|
9061
9197
|
dayHeaderSmart,
|
|
9062
9198
|
daySlotCompression
|
|
9063
9199
|
} = args;
|
|
9064
|
-
const fixedSlotWidth =
|
|
9200
|
+
const fixedSlotWidth = React31.useMemo(() => {
|
|
9065
9201
|
const baseSlotWidth = activeView === "month" || activeView === "day" ? effectiveSlotMinWidth * 3 : effectiveSlotMinWidth;
|
|
9066
9202
|
if (activeView !== "week") return baseSlotWidth;
|
|
9067
9203
|
if (bodyClientWidth <= 0) return baseSlotWidth;
|
|
9068
9204
|
if (slotsLength <= 0) return baseSlotWidth;
|
|
9069
9205
|
return Math.max(baseSlotWidth, bodyClientWidth / slotsLength);
|
|
9070
9206
|
}, [activeView, bodyClientWidth, effectiveSlotMinWidth, slotsLength]);
|
|
9071
|
-
const slotMetrics =
|
|
9207
|
+
const slotMetrics = React31.useMemo(() => {
|
|
9072
9208
|
const n = slotsLength;
|
|
9073
9209
|
const widths = new Array(n).fill(fixedSlotWidth);
|
|
9074
9210
|
const isAdaptiveView = activeView === "month" || activeView === "day";
|
|
@@ -9198,7 +9334,7 @@ function useSlotMetrics(args) {
|
|
|
9198
9334
|
}
|
|
9199
9335
|
function useLayoutsByResource(args) {
|
|
9200
9336
|
const { eventsByResource, preview, slotStarts, slotsLength, slotLefts, getResourceRowHeight, laneGap, lanePaddingY, effectiveMaxLanesPerRow, eventHeight } = args;
|
|
9201
|
-
return
|
|
9337
|
+
return React31.useMemo(() => {
|
|
9202
9338
|
const map = /* @__PURE__ */ new Map();
|
|
9203
9339
|
for (const [resourceId, list] of eventsByResource.entries()) {
|
|
9204
9340
|
const mapped = list.map((ev) => {
|
|
@@ -9245,9 +9381,9 @@ function lowerBound2(arr, target) {
|
|
|
9245
9381
|
}
|
|
9246
9382
|
function useVisibleSlotRange(args) {
|
|
9247
9383
|
const { enabled, overscan, scrollRef, slotLefts, slotCount } = args;
|
|
9248
|
-
const [scrollLeft, setScrollLeft] =
|
|
9249
|
-
const [viewportWidth, setViewportWidth] =
|
|
9250
|
-
|
|
9384
|
+
const [scrollLeft, setScrollLeft] = React31.useState(0);
|
|
9385
|
+
const [viewportWidth, setViewportWidth] = React31.useState(0);
|
|
9386
|
+
React31.useEffect(() => {
|
|
9251
9387
|
if (!enabled) return;
|
|
9252
9388
|
const el = scrollRef.current;
|
|
9253
9389
|
if (!el) return;
|
|
@@ -9262,7 +9398,7 @@ function useVisibleSlotRange(args) {
|
|
|
9262
9398
|
el.removeEventListener("scroll", onScroll);
|
|
9263
9399
|
};
|
|
9264
9400
|
}, [enabled, scrollRef]);
|
|
9265
|
-
return
|
|
9401
|
+
return React31.useMemo(() => {
|
|
9266
9402
|
if (!enabled) return { startIdx: 0, endIdx: slotCount };
|
|
9267
9403
|
if (slotCount <= 0) return { startIdx: 0, endIdx: 0 };
|
|
9268
9404
|
if (viewportWidth <= 0) return { startIdx: 0, endIdx: slotCount };
|
|
@@ -9354,14 +9490,14 @@ function CalendarTimeline({
|
|
|
9354
9490
|
}) {
|
|
9355
9491
|
const t = useTranslations("CalendarTimeline");
|
|
9356
9492
|
const detectedLocale = useLocale();
|
|
9357
|
-
const resolvedLocale =
|
|
9358
|
-
const resolvedTimeZone =
|
|
9493
|
+
const resolvedLocale = React32.useMemo(() => localeToBCP47(locale ?? detectedLocale), [locale, detectedLocale]);
|
|
9494
|
+
const resolvedTimeZone = React32.useMemo(() => timeZone ?? Intl.DateTimeFormat().resolvedOptions().timeZone ?? "UTC", [timeZone]);
|
|
9359
9495
|
const effectiveEnableEventSheet = enableEventSheet ?? Boolean(renderEventSheet);
|
|
9360
9496
|
const isViewOnly = interactions?.mode === "view";
|
|
9361
9497
|
const isControlledSelectedEventId = selectedEventId !== void 0;
|
|
9362
|
-
const [internalSelectedEventId, setInternalSelectedEventId] =
|
|
9498
|
+
const [internalSelectedEventId, setInternalSelectedEventId] = React32.useState(defaultSelectedEventId ?? null);
|
|
9363
9499
|
const activeSelectedEventId = isControlledSelectedEventId ? selectedEventId : internalSelectedEventId;
|
|
9364
|
-
const setSelectedEventId =
|
|
9500
|
+
const setSelectedEventId = React32.useCallback(
|
|
9365
9501
|
(next) => {
|
|
9366
9502
|
if (!isControlledSelectedEventId) setInternalSelectedEventId(next);
|
|
9367
9503
|
onSelectedEventIdChange?.(next);
|
|
@@ -9369,9 +9505,9 @@ function CalendarTimeline({
|
|
|
9369
9505
|
[isControlledSelectedEventId, onSelectedEventIdChange]
|
|
9370
9506
|
);
|
|
9371
9507
|
const isControlledEventSheetOpen = eventSheetOpen !== void 0;
|
|
9372
|
-
const [internalEventSheetOpen, setInternalEventSheetOpen] =
|
|
9508
|
+
const [internalEventSheetOpen, setInternalEventSheetOpen] = React32.useState(defaultEventSheetOpen ?? false);
|
|
9373
9509
|
const activeEventSheetOpen = isControlledEventSheetOpen ? Boolean(eventSheetOpen) : internalEventSheetOpen;
|
|
9374
|
-
const setEventSheetOpen =
|
|
9510
|
+
const setEventSheetOpen = React32.useCallback(
|
|
9375
9511
|
(next) => {
|
|
9376
9512
|
if (!isControlledEventSheetOpen) setInternalEventSheetOpen(next);
|
|
9377
9513
|
onEventSheetOpenChange?.(next);
|
|
@@ -9379,19 +9515,19 @@ function CalendarTimeline({
|
|
|
9379
9515
|
},
|
|
9380
9516
|
[isControlledEventSheetOpen, onEventSheetOpenChange, setSelectedEventId]
|
|
9381
9517
|
);
|
|
9382
|
-
const sizeConfig =
|
|
9518
|
+
const sizeConfig = React32.useMemo(() => getSizeConfig(size), [size]);
|
|
9383
9519
|
const densityClass = sizeConfig.densityClass;
|
|
9384
9520
|
const eventHeight = sizeConfig.eventHeight;
|
|
9385
9521
|
const laneGap = sizeConfig.laneGap;
|
|
9386
9522
|
const lanePaddingY = sizeConfig.lanePaddingY;
|
|
9387
|
-
const canResizeColumn =
|
|
9523
|
+
const canResizeColumn = React32.useMemo(() => {
|
|
9388
9524
|
const cfg = enableLayoutResize;
|
|
9389
9525
|
if (!cfg) return false;
|
|
9390
9526
|
if (isViewOnly) return false;
|
|
9391
9527
|
if (cfg === true) return true;
|
|
9392
9528
|
return cfg.column !== false;
|
|
9393
9529
|
}, [enableLayoutResize, isViewOnly]);
|
|
9394
|
-
const canResizeRow =
|
|
9530
|
+
const canResizeRow = React32.useMemo(() => {
|
|
9395
9531
|
const cfg = enableLayoutResize;
|
|
9396
9532
|
if (!cfg) return false;
|
|
9397
9533
|
if (isViewOnly) return false;
|
|
@@ -9399,19 +9535,19 @@ function CalendarTimeline({
|
|
|
9399
9535
|
return cfg.row !== false;
|
|
9400
9536
|
}, [enableLayoutResize, isViewOnly]);
|
|
9401
9537
|
const isControlledResourceColumnWidth = resourceColumnWidth !== void 0;
|
|
9402
|
-
const [internalResourceColumnWidth, setInternalResourceColumnWidth] =
|
|
9538
|
+
const [internalResourceColumnWidth, setInternalResourceColumnWidth] = React32.useState(() => {
|
|
9403
9539
|
const init = defaultResourceColumnWidth ?? sizeConfig.resourceColumnWidth;
|
|
9404
9540
|
return typeof init === "number" ? init : sizeConfig.resourceColumnWidth;
|
|
9405
9541
|
});
|
|
9406
|
-
|
|
9542
|
+
React32.useEffect(() => {
|
|
9407
9543
|
if (isControlledResourceColumnWidth) return;
|
|
9408
9544
|
if (defaultResourceColumnWidth == null) return;
|
|
9409
9545
|
setInternalResourceColumnWidth(defaultResourceColumnWidth);
|
|
9410
9546
|
}, [defaultResourceColumnWidth, isControlledResourceColumnWidth]);
|
|
9411
9547
|
const effectiveResourceColumnWidth = isControlledResourceColumnWidth ? resourceColumnWidth : internalResourceColumnWidth;
|
|
9412
9548
|
const isControlledRowHeight = rowHeight !== void 0;
|
|
9413
|
-
const [internalRowHeight, setInternalRowHeight] =
|
|
9414
|
-
|
|
9549
|
+
const [internalRowHeight, setInternalRowHeight] = React32.useState(() => defaultRowHeight ?? sizeConfig.rowHeight);
|
|
9550
|
+
React32.useEffect(() => {
|
|
9415
9551
|
if (isControlledRowHeight) return;
|
|
9416
9552
|
if (defaultRowHeight == null) return;
|
|
9417
9553
|
setInternalRowHeight(defaultRowHeight);
|
|
@@ -9423,13 +9559,13 @@ function CalendarTimeline({
|
|
|
9423
9559
|
const rowMin = minRowHeight ?? 36;
|
|
9424
9560
|
const rowMax = maxRowHeight ?? 120;
|
|
9425
9561
|
const isControlledView = view !== void 0;
|
|
9426
|
-
const [internalView, setInternalView] =
|
|
9562
|
+
const [internalView, setInternalView] = React32.useState(defaultView);
|
|
9427
9563
|
const activeView = isControlledView ? view : internalView;
|
|
9428
9564
|
const isControlledDate = date !== void 0;
|
|
9429
|
-
const [internalDate, setInternalDate] =
|
|
9565
|
+
const [internalDate, setInternalDate] = React32.useState(() => defaultDate ?? /* @__PURE__ */ new Date());
|
|
9430
9566
|
const activeDate = isControlledDate ? date : internalDate;
|
|
9431
|
-
const resolvedNow = now ?? /* @__PURE__ */ new Date();
|
|
9432
|
-
const l =
|
|
9567
|
+
const resolvedNow = React32.useMemo(() => now ?? /* @__PURE__ */ new Date(), [now]);
|
|
9568
|
+
const l = React32.useMemo(
|
|
9433
9569
|
() => ({
|
|
9434
9570
|
today: labels?.today ?? t("today"),
|
|
9435
9571
|
prev: labels?.prev ?? t("prev"),
|
|
@@ -9451,21 +9587,21 @@ function CalendarTimeline({
|
|
|
9451
9587
|
}),
|
|
9452
9588
|
[labels, t]
|
|
9453
9589
|
);
|
|
9454
|
-
const setView =
|
|
9590
|
+
const setView = React32.useCallback(
|
|
9455
9591
|
(next) => {
|
|
9456
9592
|
if (!isControlledView) setInternalView(next);
|
|
9457
9593
|
onViewChange?.(next);
|
|
9458
9594
|
},
|
|
9459
9595
|
[isControlledView, onViewChange]
|
|
9460
9596
|
);
|
|
9461
|
-
const setDate =
|
|
9597
|
+
const setDate = React32.useCallback(
|
|
9462
9598
|
(next) => {
|
|
9463
9599
|
if (!isControlledDate) setInternalDate(next);
|
|
9464
9600
|
onDateChange?.(next);
|
|
9465
9601
|
},
|
|
9466
9602
|
[isControlledDate, onDateChange]
|
|
9467
9603
|
);
|
|
9468
|
-
const navigate =
|
|
9604
|
+
const navigate = React32.useCallback(
|
|
9469
9605
|
(dir) => {
|
|
9470
9606
|
const base = activeDate;
|
|
9471
9607
|
if (activeView === "month") {
|
|
@@ -9480,18 +9616,17 @@ function CalendarTimeline({
|
|
|
9480
9616
|
},
|
|
9481
9617
|
[activeDate, activeView, resolvedTimeZone, setDate]
|
|
9482
9618
|
);
|
|
9483
|
-
const
|
|
9484
|
-
const [internalCollapsed, setInternalCollapsed] = React31.useState(() => defaultGroupCollapsed ?? {});
|
|
9619
|
+
const [internalCollapsed, setInternalCollapsed] = React32.useState(() => defaultGroupCollapsed ?? {});
|
|
9485
9620
|
const collapsed = groupCollapsed ?? internalCollapsed;
|
|
9486
|
-
const setCollapsed =
|
|
9621
|
+
const setCollapsed = React32.useCallback(
|
|
9487
9622
|
(next) => {
|
|
9488
9623
|
if (!groupCollapsed) setInternalCollapsed(next);
|
|
9489
9624
|
onGroupCollapsedChange?.(next);
|
|
9490
9625
|
},
|
|
9491
9626
|
[groupCollapsed, onGroupCollapsedChange]
|
|
9492
9627
|
);
|
|
9493
|
-
const rows =
|
|
9494
|
-
const groupResourceCounts =
|
|
9628
|
+
const rows = React32.useMemo(() => buildRows({ resources, groups, collapsed }), [resources, groups, collapsed]);
|
|
9629
|
+
const groupResourceCounts = React32.useMemo(() => getGroupResourceCounts(resources), [resources]);
|
|
9495
9630
|
const { slots, range, slotStarts, todaySlotIdx, weekendSlotIdxs } = useTimelineSlots({
|
|
9496
9631
|
activeView,
|
|
9497
9632
|
activeDate,
|
|
@@ -9504,12 +9639,12 @@ function CalendarTimeline({
|
|
|
9504
9639
|
resolvedNow,
|
|
9505
9640
|
formatters
|
|
9506
9641
|
});
|
|
9507
|
-
|
|
9642
|
+
React32.useEffect(() => {
|
|
9508
9643
|
onRangeChange?.(range);
|
|
9509
9644
|
}, [range.start, range.end, onRangeChange]);
|
|
9510
|
-
const leftRef =
|
|
9511
|
-
const bodyRef =
|
|
9512
|
-
const headerRef =
|
|
9645
|
+
const leftRef = React32.useRef(null);
|
|
9646
|
+
const bodyRef = React32.useRef(null);
|
|
9647
|
+
const headerRef = React32.useRef(null);
|
|
9513
9648
|
const bodyClientWidth = useClientWidth(bodyRef);
|
|
9514
9649
|
const { normalizedEvents, eventsByResource, resourceById } = useNormalizedEvents({
|
|
9515
9650
|
events,
|
|
@@ -9541,16 +9676,16 @@ function CalendarTimeline({
|
|
|
9541
9676
|
slotLefts,
|
|
9542
9677
|
slotCount: slots.length
|
|
9543
9678
|
});
|
|
9544
|
-
const selectedEvent =
|
|
9679
|
+
const selectedEvent = React32.useMemo(() => {
|
|
9545
9680
|
if (!activeSelectedEventId) return null;
|
|
9546
9681
|
const found = normalizedEvents.find((e) => e.id === activeSelectedEventId);
|
|
9547
9682
|
return found ?? null;
|
|
9548
9683
|
}, [activeSelectedEventId, normalizedEvents]);
|
|
9549
|
-
const selectedResource =
|
|
9684
|
+
const selectedResource = React32.useMemo(() => {
|
|
9550
9685
|
if (!selectedEvent) return void 0;
|
|
9551
9686
|
return resourceById.get(selectedEvent.resourceId);
|
|
9552
9687
|
}, [resourceById, selectedEvent]);
|
|
9553
|
-
const selectedTimeText =
|
|
9688
|
+
const selectedTimeText = React32.useMemo(() => {
|
|
9554
9689
|
if (!selectedEvent) return "";
|
|
9555
9690
|
return formatters?.eventTime?.({
|
|
9556
9691
|
start: selectedEvent._start,
|
|
@@ -9560,7 +9695,7 @@ function CalendarTimeline({
|
|
|
9560
9695
|
view: activeView
|
|
9561
9696
|
}) ?? defaultEventTime({ start: selectedEvent._start, end: selectedEvent._end, locale: resolvedLocale, timeZone: resolvedTimeZone, view: activeView });
|
|
9562
9697
|
}, [activeView, formatters, resolvedLocale, resolvedTimeZone, selectedEvent]);
|
|
9563
|
-
|
|
9698
|
+
React32.useEffect(() => {
|
|
9564
9699
|
if (!effectiveEnableEventSheet) return;
|
|
9565
9700
|
if (activeEventSheetOpen && activeSelectedEventId && !selectedEvent) {
|
|
9566
9701
|
setEventSheetOpen(false);
|
|
@@ -9570,24 +9705,24 @@ function CalendarTimeline({
|
|
|
9570
9705
|
const virt = virtualization?.enabled;
|
|
9571
9706
|
const overscan = virtualization?.overscan ?? 8;
|
|
9572
9707
|
const isControlledRowHeights = rowHeights !== void 0;
|
|
9573
|
-
const [internalRowHeights, setInternalRowHeights] =
|
|
9574
|
-
|
|
9708
|
+
const [internalRowHeights, setInternalRowHeights] = React32.useState(() => defaultRowHeights ?? {});
|
|
9709
|
+
React32.useEffect(() => {
|
|
9575
9710
|
if (isControlledRowHeights) return;
|
|
9576
9711
|
if (!defaultRowHeights) return;
|
|
9577
9712
|
setInternalRowHeights(defaultRowHeights);
|
|
9578
9713
|
}, [defaultRowHeights, isControlledRowHeights]);
|
|
9579
9714
|
const activeRowHeights = isControlledRowHeights ? rowHeights : internalRowHeights;
|
|
9580
|
-
const autoRowHeightCfg =
|
|
9715
|
+
const autoRowHeightCfg = React32.useMemo(() => {
|
|
9581
9716
|
if (!autoRowHeight) return null;
|
|
9582
9717
|
return autoRowHeight === true ? {} : autoRowHeight;
|
|
9583
9718
|
}, [autoRowHeight]);
|
|
9584
|
-
const effectiveMaxLanesPerRow =
|
|
9719
|
+
const effectiveMaxLanesPerRow = React32.useMemo(() => {
|
|
9585
9720
|
if (!autoRowHeightCfg) return maxLanesPerRow;
|
|
9586
9721
|
const maxLanes = autoRowHeightCfg.maxLanesPerRow;
|
|
9587
9722
|
if (typeof maxLanes === "number" && Number.isFinite(maxLanes) && maxLanes > 0) return Math.floor(maxLanes);
|
|
9588
9723
|
return Number.POSITIVE_INFINITY;
|
|
9589
9724
|
}, [autoRowHeightCfg, maxLanesPerRow]);
|
|
9590
|
-
const autoRowHeightsByResource =
|
|
9725
|
+
const autoRowHeightsByResource = React32.useMemo(() => {
|
|
9591
9726
|
if (!autoRowHeightCfg) return null;
|
|
9592
9727
|
const maxRowHeight2 = autoRowHeightCfg.maxRowHeight;
|
|
9593
9728
|
const out = /* @__PURE__ */ new Map();
|
|
@@ -9605,7 +9740,7 @@ function CalendarTimeline({
|
|
|
9605
9740
|
}
|
|
9606
9741
|
return out;
|
|
9607
9742
|
}, [autoRowHeightCfg, eventHeight, eventsByResource, laneGap, lanePaddingY, slotStarts, slots.length, effectiveMaxLanesPerRow]);
|
|
9608
|
-
const getResourceRowHeight =
|
|
9743
|
+
const getResourceRowHeight = React32.useCallback(
|
|
9609
9744
|
(resourceId) => {
|
|
9610
9745
|
const h = activeRowHeights[resourceId];
|
|
9611
9746
|
const base = typeof h === "number" && Number.isFinite(h) && h > 0 ? h : effectiveRowHeight;
|
|
@@ -9615,7 +9750,7 @@ function CalendarTimeline({
|
|
|
9615
9750
|
},
|
|
9616
9751
|
[activeRowHeights, autoRowHeightsByResource, effectiveRowHeight]
|
|
9617
9752
|
);
|
|
9618
|
-
const setRowHeightForResource =
|
|
9753
|
+
const setRowHeightForResource = React32.useCallback(
|
|
9619
9754
|
(resourceId, height) => {
|
|
9620
9755
|
const clamped = clamp4(Math.round(height), rowMin, rowMax);
|
|
9621
9756
|
onRowHeightChange?.(clamped);
|
|
@@ -9632,7 +9767,7 @@ function CalendarTimeline({
|
|
|
9632
9767
|
},
|
|
9633
9768
|
[activeRowHeights, isControlledRowHeights, onRowHeightChange, onRowHeightsChange, rowMax, rowMin]
|
|
9634
9769
|
);
|
|
9635
|
-
const rowHeightsArray =
|
|
9770
|
+
const rowHeightsArray = React32.useMemo(() => {
|
|
9636
9771
|
return rows.map((r) => {
|
|
9637
9772
|
if (r.kind === "resource") return getResourceRowHeight(r.resource.id);
|
|
9638
9773
|
return sizeConfig.groupRowHeight;
|
|
@@ -9648,13 +9783,13 @@ function CalendarTimeline({
|
|
|
9648
9783
|
const endRow = virt ? virtualResult.endIndex : rows.length;
|
|
9649
9784
|
const topSpacer = virt ? virtualResult.topSpacer : 0;
|
|
9650
9785
|
const bottomSpacer = virt ? virtualResult.bottomSpacer : 0;
|
|
9651
|
-
const renderedRowsHeight =
|
|
9786
|
+
const renderedRowsHeight = React32.useMemo(() => {
|
|
9652
9787
|
let h = 0;
|
|
9653
9788
|
for (let i = startRow; i < endRow; i++) h += rowHeightsArray[i] ?? effectiveRowHeight;
|
|
9654
9789
|
return h;
|
|
9655
9790
|
}, [effectiveRowHeight, endRow, rowHeightsArray, startRow]);
|
|
9656
|
-
const resizeRef =
|
|
9657
|
-
const setResourceColumnWidth =
|
|
9791
|
+
const resizeRef = React32.useRef(null);
|
|
9792
|
+
const setResourceColumnWidth = React32.useCallback(
|
|
9658
9793
|
(next) => {
|
|
9659
9794
|
const clamped = clamp4(Math.round(next), colMin, colMax);
|
|
9660
9795
|
if (!isControlledResourceColumnWidth) setInternalResourceColumnWidth(clamped);
|
|
@@ -9662,7 +9797,7 @@ function CalendarTimeline({
|
|
|
9662
9797
|
},
|
|
9663
9798
|
[colMax, colMin, isControlledResourceColumnWidth, onResourceColumnWidthChange]
|
|
9664
9799
|
);
|
|
9665
|
-
const startResize =
|
|
9800
|
+
const startResize = React32.useCallback(
|
|
9666
9801
|
(mode, e, args) => {
|
|
9667
9802
|
if (e.button !== 0 || e.ctrlKey) return;
|
|
9668
9803
|
resizeRef.current = {
|
|
@@ -9705,7 +9840,7 @@ function CalendarTimeline({
|
|
|
9705
9840
|
},
|
|
9706
9841
|
[setResourceColumnWidth, setRowHeightForResource]
|
|
9707
9842
|
);
|
|
9708
|
-
|
|
9843
|
+
React32.useEffect(() => {
|
|
9709
9844
|
return () => {
|
|
9710
9845
|
if (!resizeRef.current) return;
|
|
9711
9846
|
resizeRef.current = null;
|
|
@@ -9713,7 +9848,7 @@ function CalendarTimeline({
|
|
|
9713
9848
|
document.body.style.userSelect = "";
|
|
9714
9849
|
};
|
|
9715
9850
|
}, []);
|
|
9716
|
-
const beginResizeColumn =
|
|
9851
|
+
const beginResizeColumn = React32.useCallback(
|
|
9717
9852
|
(e) => {
|
|
9718
9853
|
if (!canResizeColumn) return;
|
|
9719
9854
|
if (typeof effectiveResourceColumnWidth !== "number") return;
|
|
@@ -9721,7 +9856,7 @@ function CalendarTimeline({
|
|
|
9721
9856
|
},
|
|
9722
9857
|
[canResizeColumn, effectiveResourceColumnWidth, effectiveRowHeight, startResize]
|
|
9723
9858
|
);
|
|
9724
|
-
const beginResizeResourceRow =
|
|
9859
|
+
const beginResizeResourceRow = React32.useCallback(
|
|
9725
9860
|
(resourceId) => (e) => {
|
|
9726
9861
|
if (!canResizeRow) return;
|
|
9727
9862
|
startResize("row", e, {
|
|
@@ -9732,7 +9867,7 @@ function CalendarTimeline({
|
|
|
9732
9867
|
},
|
|
9733
9868
|
[canResizeRow, effectiveResourceColumnWidth, getResourceRowHeight, startResize]
|
|
9734
9869
|
);
|
|
9735
|
-
const title =
|
|
9870
|
+
const title = React32.useMemo(() => {
|
|
9736
9871
|
if (activeView === "month") {
|
|
9737
9872
|
return formatters?.monthTitle?.(activeDate, { locale: resolvedLocale, timeZone: resolvedTimeZone }) ?? defaultMonthTitle(activeDate, resolvedLocale, resolvedTimeZone);
|
|
9738
9873
|
}
|
|
@@ -9753,11 +9888,11 @@ function CalendarTimeline({
|
|
|
9753
9888
|
}, [activeDate, activeView, formatters, l.week, range.end, range.start, resolvedLocale, resolvedTimeZone]);
|
|
9754
9889
|
const createMode = interactions?.createMode ?? "drag";
|
|
9755
9890
|
const canCreate = !isViewOnly && (interactions?.creatable ?? false) && !!onCreateEvent;
|
|
9756
|
-
const [createOpen, setCreateOpen] =
|
|
9757
|
-
const [createResourceId, setCreateResourceId] =
|
|
9758
|
-
const [createStartIdx, setCreateStartIdx] =
|
|
9759
|
-
const [createEndIdx, setCreateEndIdx] =
|
|
9760
|
-
const resourceOptions =
|
|
9891
|
+
const [createOpen, setCreateOpen] = React32.useState(false);
|
|
9892
|
+
const [createResourceId, setCreateResourceId] = React32.useState(null);
|
|
9893
|
+
const [createStartIdx, setCreateStartIdx] = React32.useState(0);
|
|
9894
|
+
const [createEndIdx, setCreateEndIdx] = React32.useState(1);
|
|
9895
|
+
const resourceOptions = React32.useMemo(() => {
|
|
9761
9896
|
return resources.map((r) => ({
|
|
9762
9897
|
label: typeof r.label === "string" ? r.label : r.id,
|
|
9763
9898
|
value: r.id,
|
|
@@ -9765,12 +9900,12 @@ function CalendarTimeline({
|
|
|
9765
9900
|
disabled: r.disabled ?? false
|
|
9766
9901
|
}));
|
|
9767
9902
|
}, [resources]);
|
|
9768
|
-
const slotPickerLabel =
|
|
9903
|
+
const slotPickerLabel = React32.useMemo(() => {
|
|
9769
9904
|
const timeFmt = getDtf(resolvedLocale, resolvedTimeZone, { hour: "2-digit", minute: "2-digit", hourCycle: "h23" });
|
|
9770
9905
|
const dayFmt = getDtf(resolvedLocale, resolvedTimeZone, { weekday: "short", month: "short", day: "numeric" });
|
|
9771
9906
|
return (d) => activeView === "day" ? timeFmt.format(d) : dayFmt.format(d);
|
|
9772
9907
|
}, [activeView, resolvedLocale, resolvedTimeZone]);
|
|
9773
|
-
const openCreate =
|
|
9908
|
+
const openCreate = React32.useCallback(() => {
|
|
9774
9909
|
if (!canCreate) return;
|
|
9775
9910
|
if (activeEventSheetOpen) setEventSheetOpen(false);
|
|
9776
9911
|
const firstResource = resources.find((r) => !r.disabled)?.id ?? resources[0]?.id ?? null;
|
|
@@ -9802,13 +9937,13 @@ function CalendarTimeline({
|
|
|
9802
9937
|
slotStarts,
|
|
9803
9938
|
slots.length
|
|
9804
9939
|
]);
|
|
9805
|
-
|
|
9940
|
+
React32.useEffect(() => {
|
|
9806
9941
|
setCreateEndIdx((prev) => Math.min(slots.length, Math.max(prev, createStartIdx + 1)));
|
|
9807
9942
|
}, [createStartIdx, slots.length]);
|
|
9808
|
-
const createStartOptions =
|
|
9943
|
+
const createStartOptions = React32.useMemo(() => {
|
|
9809
9944
|
return slotStarts.map((d, idx) => ({ label: slotPickerLabel(d), value: idx }));
|
|
9810
9945
|
}, [slotStarts, slotPickerLabel]);
|
|
9811
|
-
const createEndOptions =
|
|
9946
|
+
const createEndOptions = React32.useMemo(() => {
|
|
9812
9947
|
const out = [];
|
|
9813
9948
|
for (let idx = createStartIdx + 1; idx <= slotStarts.length; idx++) {
|
|
9814
9949
|
const boundary = idx >= slotStarts.length ? range.end : slotStarts[idx];
|
|
@@ -9816,7 +9951,7 @@ function CalendarTimeline({
|
|
|
9816
9951
|
}
|
|
9817
9952
|
return out;
|
|
9818
9953
|
}, [createStartIdx, range.end, slotPickerLabel, slotStarts]);
|
|
9819
|
-
const commitCreate =
|
|
9954
|
+
const commitCreate = React32.useCallback(() => {
|
|
9820
9955
|
if (!onCreateEvent) return;
|
|
9821
9956
|
if (!createResourceId) return;
|
|
9822
9957
|
const start = slotStarts[clamp4(createStartIdx, 0, Math.max(0, slotStarts.length - 1))];
|
|
@@ -9827,24 +9962,24 @@ function CalendarTimeline({
|
|
|
9827
9962
|
onCreateEvent({ resourceId: createResourceId, start, end: endBoundary });
|
|
9828
9963
|
setCreateOpen(false);
|
|
9829
9964
|
}, [createEndIdx, createResourceId, createStartIdx, onCreateEvent, range.end, slotStarts]);
|
|
9830
|
-
const dragRef =
|
|
9831
|
-
const [preview, setPreview] =
|
|
9832
|
-
const suppressNextEventClickRef =
|
|
9833
|
-
const [hoverCell, setHoverCell] =
|
|
9834
|
-
const autoScrollStateRef =
|
|
9965
|
+
const dragRef = React32.useRef(null);
|
|
9966
|
+
const [preview, setPreview] = React32.useState(null);
|
|
9967
|
+
const suppressNextEventClickRef = React32.useRef(false);
|
|
9968
|
+
const [hoverCell, setHoverCell] = React32.useState(null);
|
|
9969
|
+
const autoScrollStateRef = React32.useRef({
|
|
9835
9970
|
dir: 0,
|
|
9836
9971
|
speed: 0,
|
|
9837
9972
|
lastClientX: 0,
|
|
9838
9973
|
lastClientY: 0
|
|
9839
9974
|
});
|
|
9840
|
-
const autoScrollRafRef =
|
|
9841
|
-
const stopAutoScroll =
|
|
9975
|
+
const autoScrollRafRef = React32.useRef(null);
|
|
9976
|
+
const stopAutoScroll = React32.useCallback(() => {
|
|
9842
9977
|
if (autoScrollRafRef.current != null) cancelAnimationFrame(autoScrollRafRef.current);
|
|
9843
9978
|
autoScrollRafRef.current = null;
|
|
9844
9979
|
autoScrollStateRef.current.dir = 0;
|
|
9845
9980
|
autoScrollStateRef.current.speed = 0;
|
|
9846
9981
|
}, []);
|
|
9847
|
-
const getPointerContext =
|
|
9982
|
+
const getPointerContext = React32.useCallback(
|
|
9848
9983
|
(clientX, clientY, opts) => {
|
|
9849
9984
|
const body = bodyRef.current;
|
|
9850
9985
|
if (!body) return null;
|
|
@@ -9862,7 +9997,7 @@ function CalendarTimeline({
|
|
|
9862
9997
|
},
|
|
9863
9998
|
[xToSlotIdx]
|
|
9864
9999
|
);
|
|
9865
|
-
const slotToDate =
|
|
10000
|
+
const slotToDate = React32.useCallback(
|
|
9866
10001
|
(slotIdx) => {
|
|
9867
10002
|
const start = slotStarts[clamp4(slotIdx, 0, slotStarts.length - 1)];
|
|
9868
10003
|
if (activeView === "day") {
|
|
@@ -9873,7 +10008,7 @@ function CalendarTimeline({
|
|
|
9873
10008
|
},
|
|
9874
10009
|
[activeView, dayTimeStepMinutes, resolvedTimeZone, slotStarts]
|
|
9875
10010
|
);
|
|
9876
|
-
const updateDragPreview =
|
|
10011
|
+
const updateDragPreview = React32.useCallback(
|
|
9877
10012
|
(clientX, clientY) => {
|
|
9878
10013
|
const drag = dragRef.current;
|
|
9879
10014
|
if (!drag) return;
|
|
@@ -9917,7 +10052,7 @@ function CalendarTimeline({
|
|
|
9917
10052
|
},
|
|
9918
10053
|
[getPointerContext, range.end, range.start, slotToDate, slots.length]
|
|
9919
10054
|
);
|
|
9920
|
-
const autoScrollTick =
|
|
10055
|
+
const autoScrollTick = React32.useCallback(() => {
|
|
9921
10056
|
const drag = dragRef.current;
|
|
9922
10057
|
const body = bodyRef.current;
|
|
9923
10058
|
const st = autoScrollStateRef.current;
|
|
@@ -9936,7 +10071,7 @@ function CalendarTimeline({
|
|
|
9936
10071
|
updateDragPreview(st.lastClientX, st.lastClientY);
|
|
9937
10072
|
autoScrollRafRef.current = requestAnimationFrame(autoScrollTick);
|
|
9938
10073
|
}, [stopAutoScroll, updateDragPreview]);
|
|
9939
|
-
const updateAutoScrollFromPointer =
|
|
10074
|
+
const updateAutoScrollFromPointer = React32.useCallback(
|
|
9940
10075
|
(clientX, clientY) => {
|
|
9941
10076
|
const body = bodyRef.current;
|
|
9942
10077
|
if (!body) return;
|
|
@@ -9967,7 +10102,7 @@ function CalendarTimeline({
|
|
|
9967
10102
|
},
|
|
9968
10103
|
[autoScrollTick, stopAutoScroll]
|
|
9969
10104
|
);
|
|
9970
|
-
|
|
10105
|
+
React32.useEffect(() => stopAutoScroll, [stopAutoScroll]);
|
|
9971
10106
|
const onPointerDownEvent = (e, ev, mode) => {
|
|
9972
10107
|
if (e.button !== 0 || e.ctrlKey) return;
|
|
9973
10108
|
if (isViewOnly) return;
|
|
@@ -10119,7 +10254,7 @@ function CalendarTimeline({
|
|
|
10119
10254
|
}
|
|
10120
10255
|
);
|
|
10121
10256
|
};
|
|
10122
|
-
const slotHeaderNodes =
|
|
10257
|
+
const slotHeaderNodes = React32.useMemo(() => {
|
|
10123
10258
|
const startIdx = colVirtEnabled ? visibleSlots.startIdx : 0;
|
|
10124
10259
|
const endIdx = colVirtEnabled ? visibleSlots.endIdx : slots.length;
|
|
10125
10260
|
const leftSpacer = startIdx > 0 ? slotLefts[startIdx] ?? 0 : 0;
|
|
@@ -10189,7 +10324,8 @@ function CalendarTimeline({
|
|
|
10189
10324
|
activeView,
|
|
10190
10325
|
sizeConfig,
|
|
10191
10326
|
navigate,
|
|
10192
|
-
|
|
10327
|
+
now: resolvedNow,
|
|
10328
|
+
onApplyDateTime: setDate,
|
|
10193
10329
|
setView,
|
|
10194
10330
|
effectiveResourceColumnWidth,
|
|
10195
10331
|
canResizeColumn,
|
|
@@ -10440,7 +10576,7 @@ function CalendarTimeline({
|
|
|
10440
10576
|
]
|
|
10441
10577
|
}
|
|
10442
10578
|
);
|
|
10443
|
-
if (!enableEventTooltips) return /* @__PURE__ */ jsx38(
|
|
10579
|
+
if (!enableEventTooltips) return /* @__PURE__ */ jsx38(React32.Fragment, { children: block }, ev.id);
|
|
10444
10580
|
const tooltipContent = /* @__PURE__ */ jsxs33("div", { className: "flex flex-col gap-0.5", children: [
|
|
10445
10581
|
/* @__PURE__ */ jsx38("div", { className: "font-semibold", children: tooltipTitle }),
|
|
10446
10582
|
/* @__PURE__ */ jsx38("div", { className: "text-xs opacity-80", children: timeText }),
|
|
@@ -10596,7 +10732,7 @@ function CalendarTimeline({
|
|
|
10596
10732
|
}
|
|
10597
10733
|
|
|
10598
10734
|
// ../../components/ui/MultiCombobox.tsx
|
|
10599
|
-
import * as
|
|
10735
|
+
import * as React33 from "react";
|
|
10600
10736
|
import { useId as useId5 } from "react";
|
|
10601
10737
|
import { ChevronDown as ChevronDown3, Search as Search4, Check as Check5, SearchX as SearchX2, Loader2 as Loader24, X as X11, Sparkles as Sparkles3 } from "lucide-react";
|
|
10602
10738
|
import { Fragment as Fragment13, jsx as jsx39, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
@@ -10631,27 +10767,27 @@ var MultiCombobox = ({
|
|
|
10631
10767
|
helperText,
|
|
10632
10768
|
maxTagsVisible = 3
|
|
10633
10769
|
}) => {
|
|
10634
|
-
const [query, setQuery] =
|
|
10635
|
-
const [open, setOpen] =
|
|
10636
|
-
const [activeIndex, setActiveIndex] =
|
|
10637
|
-
const inputRef =
|
|
10638
|
-
const listRef =
|
|
10639
|
-
const triggerRef =
|
|
10770
|
+
const [query, setQuery] = React33.useState("");
|
|
10771
|
+
const [open, setOpen] = React33.useState(false);
|
|
10772
|
+
const [activeIndex, setActiveIndex] = React33.useState(null);
|
|
10773
|
+
const inputRef = React33.useRef(null);
|
|
10774
|
+
const listRef = React33.useRef([]);
|
|
10775
|
+
const triggerRef = React33.useRef(null);
|
|
10640
10776
|
useShadCNAnimations();
|
|
10641
|
-
const normalizedOptions =
|
|
10777
|
+
const normalizedOptions = React33.useMemo(
|
|
10642
10778
|
() => options.map(
|
|
10643
10779
|
(o) => typeof o === "string" ? { value: o, label: o } : { value: o.value, label: o.label, icon: o.icon, description: o.description, disabled: o.disabled, group: o.group }
|
|
10644
10780
|
),
|
|
10645
10781
|
[options]
|
|
10646
10782
|
);
|
|
10647
10783
|
const enableSearch = normalizedOptions.length > 10;
|
|
10648
|
-
const filtered =
|
|
10784
|
+
const filtered = React33.useMemo(
|
|
10649
10785
|
() => enableSearch ? normalizedOptions.filter(
|
|
10650
10786
|
(opt) => opt.label.toLowerCase().includes(query.toLowerCase()) || opt.description?.toLowerCase().includes(query.toLowerCase())
|
|
10651
10787
|
) : normalizedOptions,
|
|
10652
10788
|
[normalizedOptions, query, enableSearch]
|
|
10653
10789
|
);
|
|
10654
|
-
const groupedOptions =
|
|
10790
|
+
const groupedOptions = React33.useMemo(() => {
|
|
10655
10791
|
if (!groupBy) return null;
|
|
10656
10792
|
const groups = /* @__PURE__ */ new Map();
|
|
10657
10793
|
filtered.forEach((opt) => {
|
|
@@ -10687,7 +10823,7 @@ var MultiCombobox = ({
|
|
|
10687
10823
|
const handleClearAll = () => {
|
|
10688
10824
|
onChange([]);
|
|
10689
10825
|
};
|
|
10690
|
-
|
|
10826
|
+
React33.useEffect(() => {
|
|
10691
10827
|
if (open && enableSearch) {
|
|
10692
10828
|
setTimeout(() => {
|
|
10693
10829
|
inputRef.current?.focus();
|
|
@@ -10912,7 +11048,7 @@ var MultiCombobox = ({
|
|
|
10912
11048
|
/* @__PURE__ */ jsx39("div", { className: "flex items-center gap-1.5 flex-wrap min-h-6 flex-1", children: value.length > 0 ? showTags ? /* @__PURE__ */ jsxs34(Fragment13, { children: [
|
|
10913
11049
|
visibleTags.map((option) => {
|
|
10914
11050
|
if (renderTag) {
|
|
10915
|
-
return /* @__PURE__ */ jsx39(
|
|
11051
|
+
return /* @__PURE__ */ jsx39(React33.Fragment, { children: renderTag(option, () => handleRemove(option.value)) }, option.value);
|
|
10916
11052
|
}
|
|
10917
11053
|
return /* @__PURE__ */ jsxs34(
|
|
10918
11054
|
"span",
|
|
@@ -11053,17 +11189,17 @@ var MultiCombobox = ({
|
|
|
11053
11189
|
};
|
|
11054
11190
|
|
|
11055
11191
|
// ../../components/ui/RadioGroup.tsx
|
|
11056
|
-
import * as
|
|
11192
|
+
import * as React34 from "react";
|
|
11057
11193
|
import { jsx as jsx40, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
11058
|
-
var RadioGroupContext =
|
|
11194
|
+
var RadioGroupContext = React34.createContext(void 0);
|
|
11059
11195
|
var useRadioGroup = () => {
|
|
11060
|
-
const context =
|
|
11196
|
+
const context = React34.useContext(RadioGroupContext);
|
|
11061
11197
|
if (!context) {
|
|
11062
11198
|
throw new Error("RadioGroupItem must be used within a RadioGroup");
|
|
11063
11199
|
}
|
|
11064
11200
|
return context;
|
|
11065
11201
|
};
|
|
11066
|
-
var RadioGroup =
|
|
11202
|
+
var RadioGroup = React34.forwardRef(
|
|
11067
11203
|
({
|
|
11068
11204
|
value,
|
|
11069
11205
|
defaultValue,
|
|
@@ -11079,7 +11215,7 @@ var RadioGroup = React33.forwardRef(
|
|
|
11079
11215
|
error = false,
|
|
11080
11216
|
errorMessage
|
|
11081
11217
|
}, ref) => {
|
|
11082
|
-
const [internalValue, setInternalValue] =
|
|
11218
|
+
const [internalValue, setInternalValue] = React34.useState(defaultValue || "");
|
|
11083
11219
|
const isControlled = value !== void 0;
|
|
11084
11220
|
const currentValue = isControlled ? value : internalValue;
|
|
11085
11221
|
const handleValueChange = (newValue) => {
|
|
@@ -11090,7 +11226,7 @@ var RadioGroup = React33.forwardRef(
|
|
|
11090
11226
|
onValueChange?.(newValue);
|
|
11091
11227
|
}
|
|
11092
11228
|
};
|
|
11093
|
-
const uniqueId =
|
|
11229
|
+
const uniqueId = React34.useId();
|
|
11094
11230
|
const radioName = name || `radio-group-${uniqueId}`;
|
|
11095
11231
|
return /* @__PURE__ */ jsx40(
|
|
11096
11232
|
RadioGroupContext.Provider,
|
|
@@ -11148,7 +11284,7 @@ var sizeStyles7 = {
|
|
|
11148
11284
|
padding: "p-4"
|
|
11149
11285
|
}
|
|
11150
11286
|
};
|
|
11151
|
-
var RadioGroupItem =
|
|
11287
|
+
var RadioGroupItem = React34.forwardRef(
|
|
11152
11288
|
({ value, id, disabled, className, children, label, description, icon }, ref) => {
|
|
11153
11289
|
const { value: selectedValue, onValueChange, name, disabled: groupDisabled, size = "md", variant = "default" } = useRadioGroup();
|
|
11154
11290
|
const isDisabled = disabled || groupDisabled;
|
|
@@ -11325,7 +11461,7 @@ var RadioGroupItem = React33.forwardRef(
|
|
|
11325
11461
|
RadioGroupItem.displayName = "RadioGroupItem";
|
|
11326
11462
|
|
|
11327
11463
|
// ../../components/ui/Slider.tsx
|
|
11328
|
-
import * as
|
|
11464
|
+
import * as React35 from "react";
|
|
11329
11465
|
import { Fragment as Fragment14, jsx as jsx41, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
11330
11466
|
var SIZE_STYLES = {
|
|
11331
11467
|
sm: {
|
|
@@ -11345,7 +11481,7 @@ var SIZE_STYLES = {
|
|
|
11345
11481
|
}
|
|
11346
11482
|
};
|
|
11347
11483
|
var clamp5 = (n, min, max) => Math.min(max, Math.max(min, n));
|
|
11348
|
-
var Slider =
|
|
11484
|
+
var Slider = React35.forwardRef(
|
|
11349
11485
|
({
|
|
11350
11486
|
className,
|
|
11351
11487
|
mode = "single",
|
|
@@ -11377,15 +11513,15 @@ var Slider = React34.forwardRef(
|
|
|
11377
11513
|
...props
|
|
11378
11514
|
}, ref) => {
|
|
11379
11515
|
const isRange = mode === "range";
|
|
11380
|
-
const trackRef =
|
|
11381
|
-
const [internalValue, setInternalValue] =
|
|
11382
|
-
const [internalRange, setInternalRange] =
|
|
11516
|
+
const trackRef = React35.useRef(null);
|
|
11517
|
+
const [internalValue, setInternalValue] = React35.useState(defaultValue);
|
|
11518
|
+
const [internalRange, setInternalRange] = React35.useState(() => {
|
|
11383
11519
|
if (defaultRangeValue) return defaultRangeValue;
|
|
11384
11520
|
const v = clamp5(defaultValue, min, max);
|
|
11385
11521
|
return [min, v];
|
|
11386
11522
|
});
|
|
11387
|
-
const [activeThumb, setActiveThumb] =
|
|
11388
|
-
const dragRef =
|
|
11523
|
+
const [activeThumb, setActiveThumb] = React35.useState(null);
|
|
11524
|
+
const dragRef = React35.useRef(null);
|
|
11389
11525
|
const isControlled = value !== void 0;
|
|
11390
11526
|
const currentValue = isControlled ? value : internalValue;
|
|
11391
11527
|
const isRangeControlled = rangeValue !== void 0;
|
|
@@ -11393,7 +11529,7 @@ var Slider = React34.forwardRef(
|
|
|
11393
11529
|
const rangeMin = clamp5(currentRange[0] ?? min, min, max);
|
|
11394
11530
|
const rangeMax = clamp5(currentRange[1] ?? max, min, max);
|
|
11395
11531
|
const normalizedRange = rangeMin <= rangeMax ? [rangeMin, rangeMax] : [rangeMax, rangeMin];
|
|
11396
|
-
const handleSingleChange =
|
|
11532
|
+
const handleSingleChange = React35.useCallback(
|
|
11397
11533
|
(e) => {
|
|
11398
11534
|
const newValue = Number(e.target.value);
|
|
11399
11535
|
if (!isControlled) {
|
|
@@ -11404,14 +11540,14 @@ var Slider = React34.forwardRef(
|
|
|
11404
11540
|
},
|
|
11405
11541
|
[isControlled, onChange, onValueChange]
|
|
11406
11542
|
);
|
|
11407
|
-
const emitRange =
|
|
11543
|
+
const emitRange = React35.useCallback(
|
|
11408
11544
|
(next) => {
|
|
11409
11545
|
onRangeChange?.(next);
|
|
11410
11546
|
onRangeValueChange?.(next);
|
|
11411
11547
|
},
|
|
11412
11548
|
[onRangeChange, onRangeValueChange]
|
|
11413
11549
|
);
|
|
11414
|
-
const handleRangeChange =
|
|
11550
|
+
const handleRangeChange = React35.useCallback(
|
|
11415
11551
|
(thumb) => (e) => {
|
|
11416
11552
|
const nextVal = Number(e.target.value);
|
|
11417
11553
|
const [curMin, curMax] = normalizedRange;
|
|
@@ -11426,7 +11562,7 @@ var Slider = React34.forwardRef(
|
|
|
11426
11562
|
const rangeStartPct = (normalizedRange[0] - min) / denom * 100;
|
|
11427
11563
|
const rangeEndPct = (normalizedRange[1] - min) / denom * 100;
|
|
11428
11564
|
const sizeStyles8 = SIZE_STYLES[size];
|
|
11429
|
-
const displayValue =
|
|
11565
|
+
const displayValue = React35.useMemo(() => {
|
|
11430
11566
|
if (isRange) {
|
|
11431
11567
|
const a = formatValue ? formatValue(normalizedRange[0]) : normalizedRange[0].toString();
|
|
11432
11568
|
const b = formatValue ? formatValue(normalizedRange[1]) : normalizedRange[1].toString();
|
|
@@ -11434,7 +11570,7 @@ var Slider = React34.forwardRef(
|
|
|
11434
11570
|
}
|
|
11435
11571
|
return formatValue ? formatValue(currentValue) : currentValue.toString();
|
|
11436
11572
|
}, [currentValue, formatValue, isRange, normalizedRange]);
|
|
11437
|
-
const quantize =
|
|
11573
|
+
const quantize = React35.useCallback(
|
|
11438
11574
|
(v) => {
|
|
11439
11575
|
const stepped = Math.round((v - min) / step) * step + min;
|
|
11440
11576
|
const fixed = Number(stepped.toFixed(10));
|
|
@@ -11442,7 +11578,7 @@ var Slider = React34.forwardRef(
|
|
|
11442
11578
|
},
|
|
11443
11579
|
[max, min, step]
|
|
11444
11580
|
);
|
|
11445
|
-
const valueFromClientX =
|
|
11581
|
+
const valueFromClientX = React35.useCallback(
|
|
11446
11582
|
(clientX) => {
|
|
11447
11583
|
const el = trackRef.current;
|
|
11448
11584
|
if (!el) return min;
|
|
@@ -11633,7 +11769,7 @@ Slider.displayName = "Slider";
|
|
|
11633
11769
|
|
|
11634
11770
|
// ../../components/ui/OverlayControls.tsx
|
|
11635
11771
|
import { Dot as Dot2, Maximize2, Pause, Play, RotateCcw, RotateCw, Volume2, VolumeX } from "lucide-react";
|
|
11636
|
-
import
|
|
11772
|
+
import React36 from "react";
|
|
11637
11773
|
import { Fragment as Fragment15, jsx as jsx42, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
11638
11774
|
function OverlayControls({
|
|
11639
11775
|
mode,
|
|
@@ -11664,24 +11800,24 @@ function OverlayControls({
|
|
|
11664
11800
|
}) {
|
|
11665
11801
|
const hoverClasses = showOnHover ? "opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto" : "opacity-100 pointer-events-auto";
|
|
11666
11802
|
const showControlsBar = mode === "review";
|
|
11667
|
-
const [rateOpen, setRateOpen] =
|
|
11668
|
-
const rateWrapRef =
|
|
11669
|
-
const [controlsVisible, setControlsVisible] =
|
|
11670
|
-
const hideTimerRef =
|
|
11671
|
-
const [previewData, setPreviewData] =
|
|
11672
|
-
const sliderRef =
|
|
11673
|
-
const [isDragging, setIsDragging] =
|
|
11674
|
-
const [dragValue, setDragValue] =
|
|
11675
|
-
|
|
11803
|
+
const [rateOpen, setRateOpen] = React36.useState(false);
|
|
11804
|
+
const rateWrapRef = React36.useRef(null);
|
|
11805
|
+
const [controlsVisible, setControlsVisible] = React36.useState(true);
|
|
11806
|
+
const hideTimerRef = React36.useRef(null);
|
|
11807
|
+
const [previewData, setPreviewData] = React36.useState(null);
|
|
11808
|
+
const sliderRef = React36.useRef(null);
|
|
11809
|
+
const [isDragging, setIsDragging] = React36.useState(false);
|
|
11810
|
+
const [dragValue, setDragValue] = React36.useState(value);
|
|
11811
|
+
React36.useEffect(() => {
|
|
11676
11812
|
if (!isDragging) {
|
|
11677
11813
|
setDragValue(value);
|
|
11678
11814
|
}
|
|
11679
11815
|
}, [value, isDragging]);
|
|
11680
|
-
const [keyboardFeedback, setKeyboardFeedback] =
|
|
11681
|
-
const feedbackTimerRef =
|
|
11682
|
-
const seekAccumulatorRef =
|
|
11683
|
-
const seekAccumulatorTimerRef =
|
|
11684
|
-
|
|
11816
|
+
const [keyboardFeedback, setKeyboardFeedback] = React36.useState(null);
|
|
11817
|
+
const feedbackTimerRef = React36.useRef(null);
|
|
11818
|
+
const seekAccumulatorRef = React36.useRef(0);
|
|
11819
|
+
const seekAccumulatorTimerRef = React36.useRef(null);
|
|
11820
|
+
React36.useEffect(() => {
|
|
11685
11821
|
const onDocDown = (e) => {
|
|
11686
11822
|
if (!rateOpen) return;
|
|
11687
11823
|
const wrap = rateWrapRef.current;
|
|
@@ -11692,7 +11828,7 @@ function OverlayControls({
|
|
|
11692
11828
|
document.addEventListener("mousedown", onDocDown);
|
|
11693
11829
|
return () => document.removeEventListener("mousedown", onDocDown);
|
|
11694
11830
|
}, [rateOpen]);
|
|
11695
|
-
|
|
11831
|
+
React36.useEffect(() => {
|
|
11696
11832
|
if (!autoHide || showOnHover) return;
|
|
11697
11833
|
const resetTimer = () => {
|
|
11698
11834
|
if (hideTimerRef.current) clearTimeout(hideTimerRef.current);
|
|
@@ -11730,7 +11866,7 @@ function OverlayControls({
|
|
|
11730
11866
|
seekAccumulatorRef.current = 0;
|
|
11731
11867
|
}, 1e3);
|
|
11732
11868
|
};
|
|
11733
|
-
|
|
11869
|
+
React36.useEffect(() => {
|
|
11734
11870
|
if (!enableKeyboardShortcuts) return;
|
|
11735
11871
|
const handleKeyDown = (e) => {
|
|
11736
11872
|
if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement) return;
|
|
@@ -12065,7 +12201,7 @@ function OverlayControls({
|
|
|
12065
12201
|
}
|
|
12066
12202
|
|
|
12067
12203
|
// ../../components/ui/CategoryTreeSelect.tsx
|
|
12068
|
-
import { useState as
|
|
12204
|
+
import { useState as useState30, useEffect as useEffect20 } from "react";
|
|
12069
12205
|
import { ChevronRight as ChevronRight6, ChevronDown as ChevronDown4, Check as Check6, FolderTree, Layers } from "lucide-react";
|
|
12070
12206
|
import { Fragment as Fragment16, jsx as jsx43, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
12071
12207
|
var defaultLabels = {
|
|
@@ -12085,8 +12221,8 @@ function CategoryTreeSelect(props) {
|
|
|
12085
12221
|
className,
|
|
12086
12222
|
singleSelect = false
|
|
12087
12223
|
} = props;
|
|
12088
|
-
const [isOpen, setIsOpen] =
|
|
12089
|
-
const [expandedNodes, setExpandedNodes] =
|
|
12224
|
+
const [isOpen, setIsOpen] = useState30(false);
|
|
12225
|
+
const [expandedNodes, setExpandedNodes] = useState30(/* @__PURE__ */ new Set());
|
|
12090
12226
|
const mergedLabels = { ...defaultLabels, ...labels };
|
|
12091
12227
|
const valueArray = singleSelect ? props.value != null ? [props.value] : [] : props.value || [];
|
|
12092
12228
|
const parentCategories = categories.filter((c) => !c.parent_id);
|
|
@@ -12099,7 +12235,7 @@ function CategoryTreeSelect(props) {
|
|
|
12099
12235
|
childrenMap.get(cat.parent_id).push(cat);
|
|
12100
12236
|
}
|
|
12101
12237
|
});
|
|
12102
|
-
|
|
12238
|
+
useEffect20(() => {
|
|
12103
12239
|
if ((viewOnly || inline) && defaultExpanded) {
|
|
12104
12240
|
const allParentIds = categories.filter((c) => childrenMap.has(c.id)).map((c) => c.id);
|
|
12105
12241
|
setExpandedNodes(new Set(allParentIds));
|
|
@@ -12324,7 +12460,7 @@ function CategoryTreeSelect(props) {
|
|
|
12324
12460
|
}
|
|
12325
12461
|
|
|
12326
12462
|
// ../../components/ui/ImageUpload.tsx
|
|
12327
|
-
import { useState as
|
|
12463
|
+
import { useState as useState31, useRef as useRef14, useCallback as useCallback12 } from "react";
|
|
12328
12464
|
import { Upload, X as X12, Image as ImageIcon, Loader2 as Loader25, Check as Check7 } from "lucide-react";
|
|
12329
12465
|
import { jsx as jsx44, jsxs as jsxs39 } from "react/jsx-runtime";
|
|
12330
12466
|
function ImageUpload({
|
|
@@ -12342,9 +12478,9 @@ function ImageUpload({
|
|
|
12342
12478
|
browseText,
|
|
12343
12479
|
supportedFormatsText
|
|
12344
12480
|
}) {
|
|
12345
|
-
const [isDragging, setIsDragging] =
|
|
12346
|
-
const [uploading, setUploading] =
|
|
12347
|
-
const [uploadedImages, setUploadedImages] =
|
|
12481
|
+
const [isDragging, setIsDragging] = useState31(false);
|
|
12482
|
+
const [uploading, setUploading] = useState31(false);
|
|
12483
|
+
const [uploadedImages, setUploadedImages] = useState31([]);
|
|
12348
12484
|
const fileInputRef = useRef14(null);
|
|
12349
12485
|
const { addToast } = useToast();
|
|
12350
12486
|
const t = useTranslations("OCR.imageUpload");
|
|
@@ -12353,7 +12489,7 @@ function ImageUpload({
|
|
|
12353
12489
|
md: "w-24 h-24",
|
|
12354
12490
|
lg: "w-32 h-32"
|
|
12355
12491
|
};
|
|
12356
|
-
const handleDragOver =
|
|
12492
|
+
const handleDragOver = useCallback12(
|
|
12357
12493
|
(e) => {
|
|
12358
12494
|
e.preventDefault();
|
|
12359
12495
|
if (!disabled) {
|
|
@@ -12362,11 +12498,11 @@ function ImageUpload({
|
|
|
12362
12498
|
},
|
|
12363
12499
|
[disabled]
|
|
12364
12500
|
);
|
|
12365
|
-
const handleDragLeave =
|
|
12501
|
+
const handleDragLeave = useCallback12((e) => {
|
|
12366
12502
|
e.preventDefault();
|
|
12367
12503
|
setIsDragging(false);
|
|
12368
12504
|
}, []);
|
|
12369
|
-
const handleFiles =
|
|
12505
|
+
const handleFiles = useCallback12(
|
|
12370
12506
|
async (files) => {
|
|
12371
12507
|
if (files.length === 0) return;
|
|
12372
12508
|
const validFiles = files.filter((file) => {
|
|
@@ -12433,7 +12569,7 @@ function ImageUpload({
|
|
|
12433
12569
|
},
|
|
12434
12570
|
[maxSize, addToast, onUpload]
|
|
12435
12571
|
);
|
|
12436
|
-
const handleDrop =
|
|
12572
|
+
const handleDrop = useCallback12(
|
|
12437
12573
|
(e) => {
|
|
12438
12574
|
e.preventDefault();
|
|
12439
12575
|
setIsDragging(false);
|
|
@@ -12443,7 +12579,7 @@ function ImageUpload({
|
|
|
12443
12579
|
},
|
|
12444
12580
|
[disabled, handleFiles]
|
|
12445
12581
|
);
|
|
12446
|
-
const handleFileSelect =
|
|
12582
|
+
const handleFileSelect = useCallback12(
|
|
12447
12583
|
(e) => {
|
|
12448
12584
|
const files = Array.from(e.target.files || []);
|
|
12449
12585
|
handleFiles(files);
|
|
@@ -12546,7 +12682,7 @@ function ImageUpload({
|
|
|
12546
12682
|
}
|
|
12547
12683
|
|
|
12548
12684
|
// ../../components/ui/Carousel.tsx
|
|
12549
|
-
import * as
|
|
12685
|
+
import * as React38 from "react";
|
|
12550
12686
|
import { ChevronLeft as ChevronLeft5, ChevronRight as ChevronRight7 } from "lucide-react";
|
|
12551
12687
|
import { Fragment as Fragment17, jsx as jsx45, jsxs as jsxs40 } from "react/jsx-runtime";
|
|
12552
12688
|
function Carousel({
|
|
@@ -12569,19 +12705,19 @@ function Carousel({
|
|
|
12569
12705
|
thumbnailRenderer,
|
|
12570
12706
|
ariaLabel = "Carousel"
|
|
12571
12707
|
}) {
|
|
12572
|
-
const [currentIndex, setCurrentIndex] =
|
|
12573
|
-
const [isPaused, setIsPaused] =
|
|
12574
|
-
const [isDragging, setIsDragging] =
|
|
12575
|
-
const [startPos, setStartPos] =
|
|
12576
|
-
const [currentTranslate, setCurrentTranslate] =
|
|
12577
|
-
const [prevTranslate, setPrevTranslate] =
|
|
12578
|
-
const progressElRef =
|
|
12579
|
-
const carouselRef =
|
|
12580
|
-
const rafRef =
|
|
12581
|
-
const totalSlides =
|
|
12708
|
+
const [currentIndex, setCurrentIndex] = React38.useState(0);
|
|
12709
|
+
const [isPaused, setIsPaused] = React38.useState(false);
|
|
12710
|
+
const [isDragging, setIsDragging] = React38.useState(false);
|
|
12711
|
+
const [startPos, setStartPos] = React38.useState(0);
|
|
12712
|
+
const [currentTranslate, setCurrentTranslate] = React38.useState(0);
|
|
12713
|
+
const [prevTranslate, setPrevTranslate] = React38.useState(0);
|
|
12714
|
+
const progressElRef = React38.useRef(null);
|
|
12715
|
+
const carouselRef = React38.useRef(null);
|
|
12716
|
+
const rafRef = React38.useRef(null);
|
|
12717
|
+
const totalSlides = React38.Children.count(children);
|
|
12582
12718
|
const maxIndex = Math.max(0, totalSlides - slidesToShow);
|
|
12583
12719
|
const isHorizontal = orientation === "horizontal";
|
|
12584
|
-
const scrollPrev =
|
|
12720
|
+
const scrollPrev = React38.useCallback(() => {
|
|
12585
12721
|
setCurrentIndex((prev) => {
|
|
12586
12722
|
if (prev === 0) {
|
|
12587
12723
|
return loop ? maxIndex : 0;
|
|
@@ -12589,7 +12725,7 @@ function Carousel({
|
|
|
12589
12725
|
return Math.max(0, prev - slidesToScroll);
|
|
12590
12726
|
});
|
|
12591
12727
|
}, [loop, maxIndex, slidesToScroll]);
|
|
12592
|
-
const scrollNext =
|
|
12728
|
+
const scrollNext = React38.useCallback(() => {
|
|
12593
12729
|
setCurrentIndex((prev) => {
|
|
12594
12730
|
if (prev >= maxIndex) {
|
|
12595
12731
|
return loop ? 0 : maxIndex;
|
|
@@ -12597,13 +12733,13 @@ function Carousel({
|
|
|
12597
12733
|
return Math.min(maxIndex, prev + slidesToScroll);
|
|
12598
12734
|
});
|
|
12599
12735
|
}, [loop, maxIndex, slidesToScroll]);
|
|
12600
|
-
const scrollTo =
|
|
12736
|
+
const scrollTo = React38.useCallback(
|
|
12601
12737
|
(index) => {
|
|
12602
12738
|
setCurrentIndex(Math.min(maxIndex, Math.max(0, index)));
|
|
12603
12739
|
},
|
|
12604
12740
|
[maxIndex]
|
|
12605
12741
|
);
|
|
12606
|
-
|
|
12742
|
+
React38.useEffect(() => {
|
|
12607
12743
|
const handleKeyDown = (e) => {
|
|
12608
12744
|
if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
|
|
12609
12745
|
e.preventDefault();
|
|
@@ -12625,7 +12761,7 @@ function Carousel({
|
|
|
12625
12761
|
return () => carousel.removeEventListener("keydown", handleKeyDown);
|
|
12626
12762
|
}
|
|
12627
12763
|
}, [scrollPrev, scrollNext, scrollTo, maxIndex]);
|
|
12628
|
-
|
|
12764
|
+
React38.useEffect(() => {
|
|
12629
12765
|
const stop = () => {
|
|
12630
12766
|
if (rafRef.current != null) {
|
|
12631
12767
|
cancelAnimationFrame(rafRef.current);
|
|
@@ -12684,7 +12820,7 @@ function Carousel({
|
|
|
12684
12820
|
setCurrentTranslate(0);
|
|
12685
12821
|
setPrevTranslate(0);
|
|
12686
12822
|
};
|
|
12687
|
-
|
|
12823
|
+
React38.useEffect(() => {
|
|
12688
12824
|
onSlideChange?.(currentIndex);
|
|
12689
12825
|
}, [currentIndex, onSlideChange]);
|
|
12690
12826
|
const getAnimationStyles2 = () => {
|
|
@@ -12737,7 +12873,7 @@ function Carousel({
|
|
|
12737
12873
|
role: "group",
|
|
12738
12874
|
"aria-atomic": "false",
|
|
12739
12875
|
"aria-live": autoScroll ? "off" : "polite",
|
|
12740
|
-
children:
|
|
12876
|
+
children: React38.Children.map(children, (child, idx) => /* @__PURE__ */ jsx45(
|
|
12741
12877
|
"div",
|
|
12742
12878
|
{
|
|
12743
12879
|
className: cn(
|
|
@@ -12827,7 +12963,7 @@ function Carousel({
|
|
|
12827
12963
|
"absolute bottom-0 left-0 right-0 flex gap-2 p-4 bg-linear-to-t from-black/50 to-transparent overflow-x-auto",
|
|
12828
12964
|
isHorizontal ? "flex-row" : "flex-col"
|
|
12829
12965
|
),
|
|
12830
|
-
children:
|
|
12966
|
+
children: React38.Children.map(children, (child, idx) => /* @__PURE__ */ jsx45(
|
|
12831
12967
|
"button",
|
|
12832
12968
|
{
|
|
12833
12969
|
onClick: () => scrollTo(idx),
|
|
@@ -12848,7 +12984,7 @@ function Carousel({
|
|
|
12848
12984
|
}
|
|
12849
12985
|
|
|
12850
12986
|
// ../../components/ui/FallingIcons.tsx
|
|
12851
|
-
import
|
|
12987
|
+
import React39 from "react";
|
|
12852
12988
|
import { jsx as jsx46, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
12853
12989
|
var DEFAULT_COUNT = 24;
|
|
12854
12990
|
var DEFAULT_SPEED_RANGE = [6, 14];
|
|
@@ -12876,10 +13012,10 @@ function FallingIcons({
|
|
|
12876
13012
|
physics,
|
|
12877
13013
|
easingFunction = "linear"
|
|
12878
13014
|
}) {
|
|
12879
|
-
const uid =
|
|
12880
|
-
const containerRef =
|
|
12881
|
-
const [fallDist, setFallDist] =
|
|
12882
|
-
const idRef =
|
|
13015
|
+
const uid = React39.useId().replace(/[:]/g, "");
|
|
13016
|
+
const containerRef = React39.useRef(null);
|
|
13017
|
+
const [fallDist, setFallDist] = React39.useState(null);
|
|
13018
|
+
const idRef = React39.useRef(1);
|
|
12883
13019
|
const gravity = physics?.gravity ?? 1;
|
|
12884
13020
|
const windDirection = physics?.windDirection ?? 0;
|
|
12885
13021
|
const windStrength = physics?.windStrength ?? 0;
|
|
@@ -12893,7 +13029,7 @@ function FallingIcons({
|
|
|
12893
13029
|
bounce: "cubic-bezier(0.68, -0.55, 0.265, 1.55)",
|
|
12894
13030
|
elastic: "cubic-bezier(0.175, 0.885, 0.32, 1.275)"
|
|
12895
13031
|
};
|
|
12896
|
-
const makeParticle =
|
|
13032
|
+
const makeParticle = React39.useCallback(() => {
|
|
12897
13033
|
const rnd = (min, max) => min + Math.random() * (max - min);
|
|
12898
13034
|
return {
|
|
12899
13035
|
leftPct: rnd(0, 100),
|
|
@@ -12907,12 +13043,12 @@ function FallingIcons({
|
|
|
12907
13043
|
key: idRef.current++
|
|
12908
13044
|
};
|
|
12909
13045
|
}, [sizeRange, speedRange, horizontalDrift, gravity, windDirection, windStrength]);
|
|
12910
|
-
const [particles, setParticles] =
|
|
12911
|
-
|
|
13046
|
+
const [particles, setParticles] = React39.useState([]);
|
|
13047
|
+
React39.useEffect(() => {
|
|
12912
13048
|
const arr = Array.from({ length: Math.max(0, count) }).map(() => makeParticle());
|
|
12913
13049
|
setParticles(arr);
|
|
12914
13050
|
}, [count, makeParticle]);
|
|
12915
|
-
|
|
13051
|
+
React39.useEffect(() => {
|
|
12916
13052
|
if (fullScreen) {
|
|
12917
13053
|
const measure2 = () => setFallDist(window.innerHeight + 200);
|
|
12918
13054
|
measure2();
|
|
@@ -12937,14 +13073,14 @@ function FallingIcons({
|
|
|
12937
13073
|
const SpinName = `uv-spin-${uid}`;
|
|
12938
13074
|
const PopName = `uv-pop-${uid}`;
|
|
12939
13075
|
const PhysicsSpinName = `uv-physics-spin-${uid}`;
|
|
12940
|
-
const glowStyles =
|
|
13076
|
+
const glowStyles = React39.useMemo(() => {
|
|
12941
13077
|
if (!glow) return {};
|
|
12942
13078
|
const intensity = Math.max(0, Math.min(1, glowIntensity));
|
|
12943
13079
|
return {
|
|
12944
13080
|
filter: `drop-shadow(0 0 ${4 * intensity}px ${glowColor}) drop-shadow(0 0 ${8 * intensity}px ${glowColor})`
|
|
12945
13081
|
};
|
|
12946
13082
|
}, [glow, glowColor, glowIntensity]);
|
|
12947
|
-
const FallbackIcon =
|
|
13083
|
+
const FallbackIcon = React39.useMemo(
|
|
12948
13084
|
() => (props) => /* @__PURE__ */ jsx46("svg", { viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", ...props, children: /* @__PURE__ */ jsx46("circle", { cx: "12", cy: "12", r: "10" }) }),
|
|
12949
13085
|
[]
|
|
12950
13086
|
);
|
|
@@ -13002,7 +13138,7 @@ function FallingIcons({
|
|
|
13002
13138
|
});
|
|
13003
13139
|
};
|
|
13004
13140
|
const trailParticles = trail ? Array.from({ length: Math.min(5, Math.max(1, trailLength)) }) : [];
|
|
13005
|
-
return /* @__PURE__ */ jsxs41(
|
|
13141
|
+
return /* @__PURE__ */ jsxs41(React39.Fragment, { children: [
|
|
13006
13142
|
trail && trailParticles.map((_, trailIndex) => {
|
|
13007
13143
|
const trailDelay = p.delay - (trailIndex + 1) * 0.15;
|
|
13008
13144
|
const trailOpacity = 1 - (trailIndex + 1) * (1 / (trailParticles.length + 1));
|
|
@@ -13120,7 +13256,7 @@ function FallingIcons({
|
|
|
13120
13256
|
}
|
|
13121
13257
|
|
|
13122
13258
|
// ../../components/ui/List.tsx
|
|
13123
|
-
import * as
|
|
13259
|
+
import * as React40 from "react";
|
|
13124
13260
|
import { ChevronRight as ChevronRight8 } from "lucide-react";
|
|
13125
13261
|
import { Fragment as Fragment18, jsx as jsx47, jsxs as jsxs42 } from "react/jsx-runtime";
|
|
13126
13262
|
var SIZE_STYLES2 = {
|
|
@@ -13146,7 +13282,7 @@ var ListItemSkeleton = ({ size }) => {
|
|
|
13146
13282
|
] })
|
|
13147
13283
|
] });
|
|
13148
13284
|
};
|
|
13149
|
-
var ListRoot =
|
|
13285
|
+
var ListRoot = React40.forwardRef(
|
|
13150
13286
|
({
|
|
13151
13287
|
as = "ul",
|
|
13152
13288
|
ordered,
|
|
@@ -13166,7 +13302,7 @@ var ListRoot = React39.forwardRef(
|
|
|
13166
13302
|
...rest
|
|
13167
13303
|
}, ref) => {
|
|
13168
13304
|
const Comp = ordered ? "ol" : as;
|
|
13169
|
-
const childCount =
|
|
13305
|
+
const childCount = React40.Children.count(children);
|
|
13170
13306
|
const hasChildren = childCount > 0;
|
|
13171
13307
|
const variantClasses2 = {
|
|
13172
13308
|
plain: "",
|
|
@@ -13204,14 +13340,14 @@ var ListRoot = React39.forwardRef(
|
|
|
13204
13340
|
className
|
|
13205
13341
|
),
|
|
13206
13342
|
...rest,
|
|
13207
|
-
children:
|
|
13208
|
-
if (!
|
|
13343
|
+
children: React40.Children.map(children, (child, idx) => {
|
|
13344
|
+
if (!React40.isValidElement(child)) return child;
|
|
13209
13345
|
const childClass = cn(
|
|
13210
13346
|
child.props?.className,
|
|
13211
13347
|
hoverable && variant !== "flush" && "hover:bg-accent/50 focus:bg-accent/60 focus:outline-none transition-colors",
|
|
13212
13348
|
variant === "flush" && "hover:bg-accent/30"
|
|
13213
13349
|
);
|
|
13214
|
-
return
|
|
13350
|
+
return React40.cloneElement(child, {
|
|
13215
13351
|
className: childClass,
|
|
13216
13352
|
// Pass global item class to contentClassName of ListItem
|
|
13217
13353
|
contentClassName: cn(itemClassName, child.props?.contentClassName),
|
|
@@ -13226,7 +13362,7 @@ var ListRoot = React39.forwardRef(
|
|
|
13226
13362
|
}
|
|
13227
13363
|
);
|
|
13228
13364
|
ListRoot.displayName = "List";
|
|
13229
|
-
var ListItem =
|
|
13365
|
+
var ListItem = React40.forwardRef(
|
|
13230
13366
|
({
|
|
13231
13367
|
as = "li",
|
|
13232
13368
|
selected = false,
|
|
@@ -13249,7 +13385,7 @@ var ListItem = React39.forwardRef(
|
|
|
13249
13385
|
children,
|
|
13250
13386
|
...rest
|
|
13251
13387
|
}, ref) => {
|
|
13252
|
-
const [internalExpanded, setInternalExpanded] =
|
|
13388
|
+
const [internalExpanded, setInternalExpanded] = React40.useState(false);
|
|
13253
13389
|
const isExpanded = controlledExpanded !== void 0 ? controlledExpanded : internalExpanded;
|
|
13254
13390
|
const sizeAttr = rest["data-size"];
|
|
13255
13391
|
const resolvedSize = sizeAttr && ["xs", "sm", "md", "lg"].includes(sizeAttr) ? sizeAttr : "md";
|
|
@@ -13317,7 +13453,7 @@ var List = Object.assign(ListRoot, { Item: ListItem });
|
|
|
13317
13453
|
var List_default = List;
|
|
13318
13454
|
|
|
13319
13455
|
// ../../components/ui/Watermark.tsx
|
|
13320
|
-
import * as
|
|
13456
|
+
import * as React41 from "react";
|
|
13321
13457
|
import { createPortal as createPortal5 } from "react-dom";
|
|
13322
13458
|
import { Fragment as Fragment19, jsx as jsx48, jsxs as jsxs43 } from "react/jsx-runtime";
|
|
13323
13459
|
var PRESETS2 = {
|
|
@@ -13329,8 +13465,8 @@ var PRESETS2 = {
|
|
|
13329
13465
|
internal: { text: "INTERNAL USE ONLY", color: "rgba(156, 163, 175, 0.15)", rotate: -22, fontSize: 13, fontWeight: "600" }
|
|
13330
13466
|
};
|
|
13331
13467
|
function useWatermarkDataURL(opts) {
|
|
13332
|
-
const [url, setUrl] =
|
|
13333
|
-
|
|
13468
|
+
const [url, setUrl] = React41.useState(null);
|
|
13469
|
+
React41.useEffect(() => {
|
|
13334
13470
|
let cancelled = false;
|
|
13335
13471
|
const text = opts.text;
|
|
13336
13472
|
const image = opts.image;
|
|
@@ -13507,9 +13643,9 @@ var Watermark = ({
|
|
|
13507
13643
|
children,
|
|
13508
13644
|
...rest
|
|
13509
13645
|
}) => {
|
|
13510
|
-
const [visible, setVisible] =
|
|
13511
|
-
const [isDark, setIsDark] =
|
|
13512
|
-
|
|
13646
|
+
const [visible, setVisible] = React41.useState(true);
|
|
13647
|
+
const [isDark, setIsDark] = React41.useState(false);
|
|
13648
|
+
React41.useEffect(() => {
|
|
13513
13649
|
if (!darkMode) return;
|
|
13514
13650
|
const checkDarkMode = () => {
|
|
13515
13651
|
const isDarkMode = document.documentElement.classList.contains("dark") || window.matchMedia("(prefers-color-scheme: dark)").matches;
|
|
@@ -13611,7 +13747,7 @@ var Watermark = ({
|
|
|
13611
13747
|
var Watermark_default = Watermark;
|
|
13612
13748
|
|
|
13613
13749
|
// ../../components/ui/Timeline.tsx
|
|
13614
|
-
import * as
|
|
13750
|
+
import * as React42 from "react";
|
|
13615
13751
|
import { ChevronDown as ChevronDown5 } from "lucide-react";
|
|
13616
13752
|
import { jsx as jsx49, jsxs as jsxs44 } from "react/jsx-runtime";
|
|
13617
13753
|
var SIZE_STYLE = {
|
|
@@ -13664,7 +13800,7 @@ var STATUS_COLOR = {
|
|
|
13664
13800
|
error: "bg-destructive",
|
|
13665
13801
|
info: "bg-info"
|
|
13666
13802
|
};
|
|
13667
|
-
var TimelineContext =
|
|
13803
|
+
var TimelineContext = React42.createContext(null);
|
|
13668
13804
|
var LINE_STYLE_MAP = {
|
|
13669
13805
|
solid: "border-solid",
|
|
13670
13806
|
dashed: "border-dashed",
|
|
@@ -13692,7 +13828,7 @@ var Marker = ({ index, last, size, color, status = "default", lineColor, lineSty
|
|
|
13692
13828
|
!last && showLine && /* @__PURE__ */ jsx49("div", { className: cn("flex-1 border-l-2", LINE_STYLE_MAP[lineStyle]), style: { borderColor: lineColor || "hsl(var(--border))" } })
|
|
13693
13829
|
] });
|
|
13694
13830
|
};
|
|
13695
|
-
var TimelineRoot =
|
|
13831
|
+
var TimelineRoot = React42.forwardRef(
|
|
13696
13832
|
({
|
|
13697
13833
|
align = "left",
|
|
13698
13834
|
variant = "default",
|
|
@@ -13722,7 +13858,7 @@ var TimelineRoot = React41.forwardRef(
|
|
|
13722
13858
|
}
|
|
13723
13859
|
);
|
|
13724
13860
|
TimelineRoot.displayName = "Timeline";
|
|
13725
|
-
var TimelineItem =
|
|
13861
|
+
var TimelineItem = React42.forwardRef(
|
|
13726
13862
|
({
|
|
13727
13863
|
title,
|
|
13728
13864
|
description,
|
|
@@ -13741,11 +13877,11 @@ var TimelineItem = React41.forwardRef(
|
|
|
13741
13877
|
children,
|
|
13742
13878
|
...rest
|
|
13743
13879
|
}, ref) => {
|
|
13744
|
-
const ctx =
|
|
13880
|
+
const ctx = React42.useContext(TimelineContext);
|
|
13745
13881
|
const idx = rest["data-index"];
|
|
13746
13882
|
const isLast = Boolean(rest["data-last"]);
|
|
13747
13883
|
const sz = SIZE_STYLE[ctx.size];
|
|
13748
|
-
const [internalExpanded, setInternalExpanded] =
|
|
13884
|
+
const [internalExpanded, setInternalExpanded] = React42.useState(false);
|
|
13749
13885
|
const isExpanded = controlledExpanded !== void 0 ? controlledExpanded : internalExpanded;
|
|
13750
13886
|
const toggleExpanded = () => {
|
|
13751
13887
|
const newExpanded = !isExpanded;
|
|
@@ -13843,7 +13979,7 @@ var TimelineItem = React41.forwardRef(
|
|
|
13843
13979
|
const horizontalItem = /* @__PURE__ */ jsxs44(
|
|
13844
13980
|
"div",
|
|
13845
13981
|
{
|
|
13846
|
-
className: cn("flex flex-col items-center gap-2 min-w-
|
|
13982
|
+
className: cn("flex flex-col items-center gap-2 min-w-50", ctx.animate && "animate-in fade-in-50 zoom-in-95 duration-500"),
|
|
13847
13983
|
style: { animationDelay: ctx.animate ? `${(idx ?? 0) * 100}ms` : void 0 },
|
|
13848
13984
|
children: [
|
|
13849
13985
|
/* @__PURE__ */ jsx49(
|
|
@@ -13887,7 +14023,7 @@ var Timeline = Object.assign(TimelineRoot, { Item: TimelineItem });
|
|
|
13887
14023
|
var Timeline_default = Timeline;
|
|
13888
14024
|
|
|
13889
14025
|
// ../../components/ui/ColorPicker.tsx
|
|
13890
|
-
import * as
|
|
14026
|
+
import * as React43 from "react";
|
|
13891
14027
|
import { Pipette, X as X13, Copy, Check as Check8, Palette, History } from "lucide-react";
|
|
13892
14028
|
import { jsx as jsx50, jsxs as jsxs45 } from "react/jsx-runtime";
|
|
13893
14029
|
var clamp6 = (n, min, max) => Math.max(min, Math.min(max, n));
|
|
@@ -14081,12 +14217,12 @@ function ColorPicker({
|
|
|
14081
14217
|
}) {
|
|
14082
14218
|
const isControlled = value !== void 0;
|
|
14083
14219
|
const initial = parseAnyColor(isControlled ? value : defaultValue) || { r: 79, g: 70, b: 229, a: 1 };
|
|
14084
|
-
const [rgba, setRgba] =
|
|
14085
|
-
const [open, setOpen] =
|
|
14086
|
-
const [text, setText] =
|
|
14087
|
-
const [copied, setCopied] =
|
|
14088
|
-
const [recentColors, setRecentColors] =
|
|
14089
|
-
|
|
14220
|
+
const [rgba, setRgba] = React43.useState(initial);
|
|
14221
|
+
const [open, setOpen] = React43.useState(false);
|
|
14222
|
+
const [text, setText] = React43.useState(() => formatOutput(initial, withAlpha, format));
|
|
14223
|
+
const [copied, setCopied] = React43.useState(false);
|
|
14224
|
+
const [recentColors, setRecentColors] = React43.useState([]);
|
|
14225
|
+
React43.useEffect(() => {
|
|
14090
14226
|
if (isControlled) {
|
|
14091
14227
|
const parsed = parseAnyColor(value);
|
|
14092
14228
|
if (parsed) {
|
|
@@ -14409,7 +14545,7 @@ function ColorPicker({
|
|
|
14409
14545
|
}
|
|
14410
14546
|
|
|
14411
14547
|
// ../../components/ui/Grid.tsx
|
|
14412
|
-
import
|
|
14548
|
+
import React44, { useId as useId7 } from "react";
|
|
14413
14549
|
import { Fragment as Fragment20, jsx as jsx51, jsxs as jsxs46 } from "react/jsx-runtime";
|
|
14414
14550
|
var BP_MIN = {
|
|
14415
14551
|
sm: 640,
|
|
@@ -14449,7 +14585,7 @@ function getVariantClasses(variant = "default", outlined) {
|
|
|
14449
14585
|
};
|
|
14450
14586
|
return variants[variant] || "";
|
|
14451
14587
|
}
|
|
14452
|
-
var GridRoot =
|
|
14588
|
+
var GridRoot = React44.forwardRef(
|
|
14453
14589
|
({
|
|
14454
14590
|
columns,
|
|
14455
14591
|
rows,
|
|
@@ -14533,7 +14669,7 @@ var GridRoot = React43.forwardRef(
|
|
|
14533
14669
|
}
|
|
14534
14670
|
);
|
|
14535
14671
|
GridRoot.displayName = "Grid";
|
|
14536
|
-
var GridItem =
|
|
14672
|
+
var GridItem = React44.forwardRef(
|
|
14537
14673
|
({
|
|
14538
14674
|
colSpan,
|
|
14539
14675
|
rowSpan,
|
|
@@ -14597,19 +14733,19 @@ var Grid = Object.assign(GridRoot, { Item: GridItem });
|
|
|
14597
14733
|
var Grid_default = Grid;
|
|
14598
14734
|
|
|
14599
14735
|
// ../../components/ui/LineChart.tsx
|
|
14600
|
-
import { useMemo as
|
|
14736
|
+
import { useMemo as useMemo15, useState as useState38, useRef as useRef16 } from "react";
|
|
14601
14737
|
|
|
14602
14738
|
// ../../components/ui/ChartTooltip.tsx
|
|
14603
|
-
import { useEffect as
|
|
14739
|
+
import { useEffect as useEffect24, useState as useState37 } from "react";
|
|
14604
14740
|
import { createPortal as createPortal6 } from "react-dom";
|
|
14605
14741
|
import { Fragment as Fragment21, jsx as jsx52, jsxs as jsxs47 } from "react/jsx-runtime";
|
|
14606
14742
|
function ChartTooltip({ x, y, visible, label, value, color, secondaryLabel, secondaryValue, items, containerRef }) {
|
|
14607
|
-
const [isMounted, setIsMounted] =
|
|
14608
|
-
const [position, setPosition] =
|
|
14609
|
-
|
|
14743
|
+
const [isMounted, setIsMounted] = useState37(false);
|
|
14744
|
+
const [position, setPosition] = useState37(null);
|
|
14745
|
+
useEffect24(() => {
|
|
14610
14746
|
setIsMounted(true);
|
|
14611
14747
|
}, []);
|
|
14612
|
-
|
|
14748
|
+
useEffect24(() => {
|
|
14613
14749
|
if (visible && containerRef?.current) {
|
|
14614
14750
|
const rect = containerRef.current.getBoundingClientRect();
|
|
14615
14751
|
setPosition({
|
|
@@ -14695,8 +14831,8 @@ function LineChart({
|
|
|
14695
14831
|
const padding = { top: 20, right: 20, bottom: 40, left: 40 };
|
|
14696
14832
|
const chartWidth = width - padding.left - padding.right;
|
|
14697
14833
|
const chartHeight = height - padding.top - padding.bottom;
|
|
14698
|
-
const [hoveredPoint, setHoveredPoint] =
|
|
14699
|
-
const { minValue, maxValue, points, linePath, areaPath } =
|
|
14834
|
+
const [hoveredPoint, setHoveredPoint] = useState38(null);
|
|
14835
|
+
const { minValue, maxValue, points, linePath, areaPath } = useMemo15(() => {
|
|
14700
14836
|
if (!data.length) return { minValue: 0, maxValue: 0, points: [], linePath: "", areaPath: "" };
|
|
14701
14837
|
const values = data.map((d) => d.value);
|
|
14702
14838
|
const min = Math.min(...values);
|
|
@@ -14731,7 +14867,7 @@ function LineChart({
|
|
|
14731
14867
|
}
|
|
14732
14868
|
return { minValue: min, maxValue: max, points: pts, linePath: path, areaPath: area };
|
|
14733
14869
|
}, [data, chartWidth, chartHeight, curved, padding.left, padding.top]);
|
|
14734
|
-
const gridLines =
|
|
14870
|
+
const gridLines = useMemo15(() => {
|
|
14735
14871
|
const lines = [];
|
|
14736
14872
|
const steps = 5;
|
|
14737
14873
|
for (let i = 0; i <= steps; i++) {
|
|
@@ -14849,7 +14985,7 @@ function LineChart({
|
|
|
14849
14985
|
}
|
|
14850
14986
|
|
|
14851
14987
|
// ../../components/ui/BarChart.tsx
|
|
14852
|
-
import { useMemo as
|
|
14988
|
+
import { useMemo as useMemo16, useState as useState39, useRef as useRef17 } from "react";
|
|
14853
14989
|
import { Fragment as Fragment23, jsx as jsx54, jsxs as jsxs49 } from "react/jsx-runtime";
|
|
14854
14990
|
function BarChart({
|
|
14855
14991
|
data,
|
|
@@ -14869,8 +15005,8 @@ function BarChart({
|
|
|
14869
15005
|
const padding = horizontal ? { top: 20, right: 40, bottom: 20, left: 80 } : { top: 20, right: 20, bottom: 40, left: 40 };
|
|
14870
15006
|
const chartWidth = width - padding.left - padding.right;
|
|
14871
15007
|
const chartHeight = height - padding.top - padding.bottom;
|
|
14872
|
-
const [hoveredBar, setHoveredBar] =
|
|
14873
|
-
const { maxValue, bars, gridLines } =
|
|
15008
|
+
const [hoveredBar, setHoveredBar] = useState39(null);
|
|
15009
|
+
const { maxValue, bars, gridLines } = useMemo16(() => {
|
|
14874
15010
|
if (!data.length) return { maxValue: 0, bars: [], gridLines: [] };
|
|
14875
15011
|
const max = Math.max(...data.map((d) => d.value));
|
|
14876
15012
|
const barCount = data.length;
|
|
@@ -15031,7 +15167,7 @@ function BarChart({
|
|
|
15031
15167
|
}
|
|
15032
15168
|
|
|
15033
15169
|
// ../../components/ui/PieChart.tsx
|
|
15034
|
-
import { useMemo as
|
|
15170
|
+
import { useMemo as useMemo17, useState as useState40, useRef as useRef18 } from "react";
|
|
15035
15171
|
import { jsx as jsx55, jsxs as jsxs50 } from "react/jsx-runtime";
|
|
15036
15172
|
function PieChart({
|
|
15037
15173
|
data,
|
|
@@ -15049,7 +15185,7 @@ function PieChart({
|
|
|
15049
15185
|
const center = size / 2;
|
|
15050
15186
|
const radius = size / 2 - 10;
|
|
15051
15187
|
const innerRadius = donut ? radius - donutWidth : 0;
|
|
15052
|
-
const { segments, total } =
|
|
15188
|
+
const { segments, total } = useMemo17(() => {
|
|
15053
15189
|
if (!data.length) return { segments: [], total: 0 };
|
|
15054
15190
|
const sum = data.reduce((acc, d) => acc + d.value, 0);
|
|
15055
15191
|
let currentAngle = startAngle;
|
|
@@ -15095,7 +15231,7 @@ function PieChart({
|
|
|
15095
15231
|
});
|
|
15096
15232
|
return { segments: segs, total: sum };
|
|
15097
15233
|
}, [data, center, radius, innerRadius, donut, startAngle]);
|
|
15098
|
-
const [hoveredSegment, setHoveredSegment] =
|
|
15234
|
+
const [hoveredSegment, setHoveredSegment] = useState40(null);
|
|
15099
15235
|
return /* @__PURE__ */ jsxs50("div", { ref: containerRef, className: `relative flex items-center gap-6 ${className}`, children: [
|
|
15100
15236
|
/* @__PURE__ */ jsxs50("svg", { width: size + 40, height: size + 40, className: "overflow-visible", style: { fontFamily: "inherit" }, children: [
|
|
15101
15237
|
/* @__PURE__ */ jsxs50("g", { transform: `translate(20, 20)`, children: [
|
|
@@ -15196,7 +15332,7 @@ function PieChart({
|
|
|
15196
15332
|
}
|
|
15197
15333
|
|
|
15198
15334
|
// ../../components/ui/AreaChart.tsx
|
|
15199
|
-
import { useMemo as
|
|
15335
|
+
import { useMemo as useMemo18, useState as useState41, useRef as useRef19 } from "react";
|
|
15200
15336
|
import { jsx as jsx56, jsxs as jsxs51 } from "react/jsx-runtime";
|
|
15201
15337
|
function getCatmullRomSpline(points) {
|
|
15202
15338
|
if (points.length < 2) return "";
|
|
@@ -15235,8 +15371,8 @@ function AreaChart({
|
|
|
15235
15371
|
const padding = { top: 20, right: 20, bottom: 40, left: 50 };
|
|
15236
15372
|
const chartWidth = width - padding.left - padding.right;
|
|
15237
15373
|
const chartHeight = height - padding.top - padding.bottom;
|
|
15238
|
-
const [hoveredPoint, setHoveredPoint] =
|
|
15239
|
-
const { processedSeries, gridLines, maxValue, labels } =
|
|
15374
|
+
const [hoveredPoint, setHoveredPoint] = useState41(null);
|
|
15375
|
+
const { processedSeries, gridLines, maxValue, labels } = useMemo18(() => {
|
|
15240
15376
|
if (!series.length || !series[0]?.data?.length) {
|
|
15241
15377
|
return { processedSeries: [], gridLines: [], maxValue: 0, labels: [] };
|
|
15242
15378
|
}
|
|
@@ -15450,7 +15586,7 @@ function AreaChart({
|
|
|
15450
15586
|
}
|
|
15451
15587
|
|
|
15452
15588
|
// ../../components/ui/Sparkline.tsx
|
|
15453
|
-
import { useMemo as
|
|
15589
|
+
import { useMemo as useMemo19 } from "react";
|
|
15454
15590
|
import { jsx as jsx57, jsxs as jsxs52 } from "react/jsx-runtime";
|
|
15455
15591
|
function getCatmullRomSpline2(points) {
|
|
15456
15592
|
if (points.length < 2) return "";
|
|
@@ -15489,7 +15625,7 @@ function Sparkline({
|
|
|
15489
15625
|
const padding = 4;
|
|
15490
15626
|
const chartWidth = width - padding * 2;
|
|
15491
15627
|
const chartHeight = height - padding * 2;
|
|
15492
|
-
const { points, linePath, areaPath, lineLength, trend } =
|
|
15628
|
+
const { points, linePath, areaPath, lineLength, trend } = useMemo19(() => {
|
|
15493
15629
|
const normalizedData = data.map((d) => typeof d === "number" ? d : d.value);
|
|
15494
15630
|
if (!normalizedData.length) {
|
|
15495
15631
|
return { points: [], linePath: "", areaPath: "", lineLength: 0, trend: 0 };
|
|
@@ -15593,7 +15729,7 @@ function Sparkline({
|
|
|
15593
15729
|
}
|
|
15594
15730
|
|
|
15595
15731
|
// ../../components/ui/RadarChart.tsx
|
|
15596
|
-
import { useMemo as
|
|
15732
|
+
import { useMemo as useMemo20, useState as useState42, useRef as useRef20 } from "react";
|
|
15597
15733
|
import { jsx as jsx58, jsxs as jsxs53 } from "react/jsx-runtime";
|
|
15598
15734
|
function RadarChart({
|
|
15599
15735
|
series,
|
|
@@ -15608,8 +15744,8 @@ function RadarChart({
|
|
|
15608
15744
|
const containerRef = useRef20(null);
|
|
15609
15745
|
const center = size / 2;
|
|
15610
15746
|
const radius = size / 2 - 40;
|
|
15611
|
-
const [hoveredPoint, setHoveredPoint] =
|
|
15612
|
-
const { axes, processedSeries, levelPaths } =
|
|
15747
|
+
const [hoveredPoint, setHoveredPoint] = useState42(null);
|
|
15748
|
+
const { axes, processedSeries, levelPaths } = useMemo20(() => {
|
|
15613
15749
|
if (!series.length || !series[0]?.data?.length) {
|
|
15614
15750
|
return { axes: [], processedSeries: [], levelPaths: [] };
|
|
15615
15751
|
}
|
|
@@ -15793,7 +15929,7 @@ function RadarChart({
|
|
|
15793
15929
|
}
|
|
15794
15930
|
|
|
15795
15931
|
// ../../components/ui/GaugeChart.tsx
|
|
15796
|
-
import { useMemo as
|
|
15932
|
+
import { useMemo as useMemo21 } from "react";
|
|
15797
15933
|
import { jsx as jsx59, jsxs as jsxs54 } from "react/jsx-runtime";
|
|
15798
15934
|
function GaugeChart({
|
|
15799
15935
|
value,
|
|
@@ -15813,7 +15949,7 @@ function GaugeChart({
|
|
|
15813
15949
|
}) {
|
|
15814
15950
|
const center = size / 2;
|
|
15815
15951
|
const radius = center - thickness / 2 - 10;
|
|
15816
|
-
const { backgroundPath, valuePath, percentage, needleAngle } =
|
|
15952
|
+
const { backgroundPath, valuePath, percentage, needleAngle } = useMemo21(() => {
|
|
15817
15953
|
const normalizedValue = Math.min(Math.max(value, min), max);
|
|
15818
15954
|
const pct = (normalizedValue - min) / (max - min);
|
|
15819
15955
|
const totalAngle = endAngle - startAngle;
|
|
@@ -15961,11 +16097,11 @@ function GaugeChart({
|
|
|
15961
16097
|
}
|
|
15962
16098
|
|
|
15963
16099
|
// ../../components/ui/ClientOnly.tsx
|
|
15964
|
-
import { useEffect as
|
|
16100
|
+
import { useEffect as useEffect25, useState as useState43 } from "react";
|
|
15965
16101
|
import { Fragment as Fragment24, jsx as jsx60 } from "react/jsx-runtime";
|
|
15966
16102
|
function ClientOnly({ children, fallback = null }) {
|
|
15967
|
-
const [hasMounted, setHasMounted] =
|
|
15968
|
-
|
|
16103
|
+
const [hasMounted, setHasMounted] = useState43(false);
|
|
16104
|
+
useEffect25(() => {
|
|
15969
16105
|
setHasMounted(true);
|
|
15970
16106
|
}, []);
|
|
15971
16107
|
if (!hasMounted) {
|
|
@@ -16061,9 +16197,9 @@ var LoadingBar = ({
|
|
|
16061
16197
|
};
|
|
16062
16198
|
|
|
16063
16199
|
// ../../components/ui/Table.tsx
|
|
16064
|
-
import
|
|
16200
|
+
import React53 from "react";
|
|
16065
16201
|
import { jsx as jsx62, jsxs as jsxs56 } from "react/jsx-runtime";
|
|
16066
|
-
var Table =
|
|
16202
|
+
var Table = React53.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx62(
|
|
16067
16203
|
"div",
|
|
16068
16204
|
{
|
|
16069
16205
|
className: cn(
|
|
@@ -16077,16 +16213,16 @@ var Table = React52.forwardRef(({ className, containerClassName, ...props }, ref
|
|
|
16077
16213
|
}
|
|
16078
16214
|
));
|
|
16079
16215
|
Table.displayName = "Table";
|
|
16080
|
-
var TableHeader =
|
|
16216
|
+
var TableHeader = React53.forwardRef(({ className, children, filterRow, ...props }, ref) => /* @__PURE__ */ jsxs56("thead", { ref, className: cn("[&_tr]:border-b [&_tr]:border-border", "bg-muted", className), ...props, children: [
|
|
16081
16217
|
children,
|
|
16082
16218
|
filterRow
|
|
16083
16219
|
] }));
|
|
16084
16220
|
TableHeader.displayName = "TableHeader";
|
|
16085
|
-
var TableBody =
|
|
16221
|
+
var TableBody = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("tbody", { ref, className: cn("[&_tr:last-child]:border-0", className), ...props }));
|
|
16086
16222
|
TableBody.displayName = "TableBody";
|
|
16087
|
-
var TableFooter =
|
|
16223
|
+
var TableFooter = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("tfoot", { ref, className: cn("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", className), ...props }));
|
|
16088
16224
|
TableFooter.displayName = "TableFooter";
|
|
16089
|
-
var TableRow =
|
|
16225
|
+
var TableRow = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62(
|
|
16090
16226
|
"tr",
|
|
16091
16227
|
{
|
|
16092
16228
|
ref,
|
|
@@ -16100,7 +16236,7 @@ var TableRow = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__
|
|
|
16100
16236
|
}
|
|
16101
16237
|
));
|
|
16102
16238
|
TableRow.displayName = "TableRow";
|
|
16103
|
-
var TableHead =
|
|
16239
|
+
var TableHead = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62(
|
|
16104
16240
|
"th",
|
|
16105
16241
|
{
|
|
16106
16242
|
ref,
|
|
@@ -16109,14 +16245,14 @@ var TableHead = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE_
|
|
|
16109
16245
|
}
|
|
16110
16246
|
));
|
|
16111
16247
|
TableHead.displayName = "TableHead";
|
|
16112
|
-
var TableCell =
|
|
16248
|
+
var TableCell = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("td", { ref, className: cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className), ...props }));
|
|
16113
16249
|
TableCell.displayName = "TableCell";
|
|
16114
|
-
var TableCaption =
|
|
16250
|
+
var TableCaption = React53.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx62("caption", { ref, className: cn("mt-4 text-sm text-muted-foreground", className), ...props }));
|
|
16115
16251
|
TableCaption.displayName = "TableCaption";
|
|
16116
16252
|
|
|
16117
16253
|
// ../../components/ui/DataTable/DataTable.tsx
|
|
16118
16254
|
import { Filter as FilterIcon } from "lucide-react";
|
|
16119
|
-
import
|
|
16255
|
+
import React57 from "react";
|
|
16120
16256
|
|
|
16121
16257
|
// ../../components/ui/DataTable/components/Pagination.tsx
|
|
16122
16258
|
import { jsx as jsx63, jsxs as jsxs57 } from "react/jsx-runtime";
|
|
@@ -16390,10 +16526,10 @@ function DataTableToolbar({
|
|
|
16390
16526
|
}
|
|
16391
16527
|
|
|
16392
16528
|
// ../../components/ui/DataTable/hooks/useDebounced.ts
|
|
16393
|
-
import
|
|
16529
|
+
import React54 from "react";
|
|
16394
16530
|
function useDebounced(value, delay = 300) {
|
|
16395
|
-
const [debounced, setDebounced] =
|
|
16396
|
-
|
|
16531
|
+
const [debounced, setDebounced] = React54.useState(value);
|
|
16532
|
+
React54.useEffect(() => {
|
|
16397
16533
|
const id = setTimeout(() => setDebounced(value), delay);
|
|
16398
16534
|
return () => clearTimeout(id);
|
|
16399
16535
|
}, [value, delay]);
|
|
@@ -16401,10 +16537,10 @@ function useDebounced(value, delay = 300) {
|
|
|
16401
16537
|
}
|
|
16402
16538
|
|
|
16403
16539
|
// ../../components/ui/DataTable/hooks/usePageSizeStorage.ts
|
|
16404
|
-
import
|
|
16540
|
+
import React55 from "react";
|
|
16405
16541
|
function usePageSizeStorage({ pageSize, storageKey }) {
|
|
16406
|
-
const loadedFromStorage =
|
|
16407
|
-
const [curPageSize, setCurPageSize] =
|
|
16542
|
+
const loadedFromStorage = React55.useRef(false);
|
|
16543
|
+
const [curPageSize, setCurPageSize] = React55.useState(() => {
|
|
16408
16544
|
if (typeof window === "undefined" || !storageKey) return pageSize;
|
|
16409
16545
|
try {
|
|
16410
16546
|
const saved = localStorage.getItem(`datatable_${storageKey}_pageSize`);
|
|
@@ -16419,11 +16555,11 @@ function usePageSizeStorage({ pageSize, storageKey }) {
|
|
|
16419
16555
|
}
|
|
16420
16556
|
return pageSize;
|
|
16421
16557
|
});
|
|
16422
|
-
const hasMounted =
|
|
16423
|
-
|
|
16558
|
+
const hasMounted = React55.useRef(false);
|
|
16559
|
+
React55.useEffect(() => {
|
|
16424
16560
|
hasMounted.current = true;
|
|
16425
16561
|
}, []);
|
|
16426
|
-
|
|
16562
|
+
React55.useEffect(() => {
|
|
16427
16563
|
if (typeof window === "undefined" || !storageKey) return;
|
|
16428
16564
|
if (!hasMounted.current) return;
|
|
16429
16565
|
try {
|
|
@@ -16431,7 +16567,7 @@ function usePageSizeStorage({ pageSize, storageKey }) {
|
|
|
16431
16567
|
} catch {
|
|
16432
16568
|
}
|
|
16433
16569
|
}, [curPageSize, storageKey]);
|
|
16434
|
-
|
|
16570
|
+
React55.useEffect(() => {
|
|
16435
16571
|
if (storageKey && loadedFromStorage.current) return;
|
|
16436
16572
|
setCurPageSize(pageSize);
|
|
16437
16573
|
}, [pageSize, storageKey]);
|
|
@@ -16439,7 +16575,7 @@ function usePageSizeStorage({ pageSize, storageKey }) {
|
|
|
16439
16575
|
}
|
|
16440
16576
|
|
|
16441
16577
|
// ../../components/ui/DataTable/hooks/useStickyColumns.ts
|
|
16442
|
-
import
|
|
16578
|
+
import React56 from "react";
|
|
16443
16579
|
|
|
16444
16580
|
// ../../components/ui/DataTable/utils/columns.ts
|
|
16445
16581
|
function getColumnWidth(col, fallback = 150) {
|
|
@@ -16457,9 +16593,9 @@ function getColumnWidth(col, fallback = 150) {
|
|
|
16457
16593
|
|
|
16458
16594
|
// ../../components/ui/DataTable/hooks/useStickyColumns.ts
|
|
16459
16595
|
function useStickyColumns(columns, visibleKeys) {
|
|
16460
|
-
const visibleColumns =
|
|
16461
|
-
const leafColumns =
|
|
16462
|
-
const stickyPositions =
|
|
16596
|
+
const visibleColumns = React56.useMemo(() => filterVisibleColumns(columns, visibleKeys), [columns, visibleKeys]);
|
|
16597
|
+
const leafColumns = React56.useMemo(() => getLeafColumnsWithFixedInheritance(visibleColumns), [visibleColumns]);
|
|
16598
|
+
const stickyPositions = React56.useMemo(() => {
|
|
16463
16599
|
const positions = {};
|
|
16464
16600
|
let leftOffset = 0;
|
|
16465
16601
|
for (const col of leafColumns) {
|
|
@@ -16478,7 +16614,7 @@ function useStickyColumns(columns, visibleKeys) {
|
|
|
16478
16614
|
}
|
|
16479
16615
|
return positions;
|
|
16480
16616
|
}, [leafColumns]);
|
|
16481
|
-
const getStickyColumnStyle =
|
|
16617
|
+
const getStickyColumnStyle = React56.useCallback(
|
|
16482
16618
|
(col) => {
|
|
16483
16619
|
if (!col.fixed) return {};
|
|
16484
16620
|
const pos = stickyPositions[col.key];
|
|
@@ -16489,7 +16625,7 @@ function useStickyColumns(columns, visibleKeys) {
|
|
|
16489
16625
|
},
|
|
16490
16626
|
[stickyPositions]
|
|
16491
16627
|
);
|
|
16492
|
-
const getStickyHeaderClass =
|
|
16628
|
+
const getStickyHeaderClass = React56.useCallback((col) => {
|
|
16493
16629
|
if (!col.fixed) return "";
|
|
16494
16630
|
return cn(
|
|
16495
16631
|
"sticky",
|
|
@@ -16498,7 +16634,7 @@ function useStickyColumns(columns, visibleKeys) {
|
|
|
16498
16634
|
"z-50 bg-muted!"
|
|
16499
16635
|
);
|
|
16500
16636
|
}, []);
|
|
16501
|
-
const getStickyCellClass =
|
|
16637
|
+
const getStickyCellClass = React56.useCallback((col, isStripedRow) => {
|
|
16502
16638
|
if (!col.fixed) return "";
|
|
16503
16639
|
return cn(
|
|
16504
16640
|
"sticky z-10",
|
|
@@ -16507,7 +16643,7 @@ function useStickyColumns(columns, visibleKeys) {
|
|
|
16507
16643
|
isStripedRow ? "bg-muted!" : "bg-card!"
|
|
16508
16644
|
);
|
|
16509
16645
|
}, []);
|
|
16510
|
-
const getStickyHeaderCellStyle =
|
|
16646
|
+
const getStickyHeaderCellStyle = React56.useCallback(
|
|
16511
16647
|
(headerCell) => {
|
|
16512
16648
|
const col = headerCell.column;
|
|
16513
16649
|
if (headerCell.isLeaf) {
|
|
@@ -16638,20 +16774,20 @@ function DataTable({
|
|
|
16638
16774
|
labels
|
|
16639
16775
|
}) {
|
|
16640
16776
|
const t = useTranslations("Common");
|
|
16641
|
-
const [headerAlign, setHeaderAlign] =
|
|
16642
|
-
const [visibleCols, setVisibleCols] =
|
|
16643
|
-
const [filters, setFilters] =
|
|
16644
|
-
const [sort, setSort] =
|
|
16645
|
-
const [density, setDensity] =
|
|
16646
|
-
const [curPage, setCurPage] =
|
|
16777
|
+
const [headerAlign, setHeaderAlign] = React57.useState("left");
|
|
16778
|
+
const [visibleCols, setVisibleCols] = React57.useState(() => columns.filter((c) => c.visible !== false).map((c) => c.key));
|
|
16779
|
+
const [filters, setFilters] = React57.useState({});
|
|
16780
|
+
const [sort, setSort] = React57.useState(null);
|
|
16781
|
+
const [density, setDensity] = React57.useState("normal");
|
|
16782
|
+
const [curPage, setCurPage] = React57.useState(page);
|
|
16647
16783
|
const { curPageSize, setCurPageSize } = usePageSizeStorage({ pageSize, storageKey });
|
|
16648
|
-
|
|
16784
|
+
React57.useEffect(() => {
|
|
16649
16785
|
if (process.env.NODE_ENV === "development") {
|
|
16650
16786
|
const warnings = validateColumns(columns);
|
|
16651
16787
|
warnings.forEach((w) => console.warn(`[DataTable] ${w}`));
|
|
16652
16788
|
}
|
|
16653
16789
|
}, [columns]);
|
|
16654
|
-
|
|
16790
|
+
React57.useEffect(() => {
|
|
16655
16791
|
const newColKeys = columns.filter((c) => c.visible !== false).map((c) => c.key);
|
|
16656
16792
|
setVisibleCols((prev) => {
|
|
16657
16793
|
const uniqueKeys = /* @__PURE__ */ new Set([...prev, ...newColKeys]);
|
|
@@ -16659,12 +16795,12 @@ function DataTable({
|
|
|
16659
16795
|
});
|
|
16660
16796
|
}, [columns]);
|
|
16661
16797
|
const debouncedFilters = useDebounced(filters, 350);
|
|
16662
|
-
|
|
16798
|
+
React57.useEffect(() => {
|
|
16663
16799
|
setCurPage(page);
|
|
16664
16800
|
}, [page]);
|
|
16665
16801
|
const isServerMode = Boolean(onQueryChange);
|
|
16666
|
-
const hasEmittedQuery =
|
|
16667
|
-
|
|
16802
|
+
const hasEmittedQuery = React57.useRef(false);
|
|
16803
|
+
React57.useEffect(() => {
|
|
16668
16804
|
if (!onQueryChange) return;
|
|
16669
16805
|
if (!hasEmittedQuery.current) {
|
|
16670
16806
|
hasEmittedQuery.current = true;
|
|
@@ -16674,14 +16810,14 @@ function DataTable({
|
|
|
16674
16810
|
}, [debouncedFilters, sort, curPage, curPageSize, onQueryChange]);
|
|
16675
16811
|
const densityRowClass = density === "compact" ? "h-9" : density === "comfortable" ? "h-14" : "h-12";
|
|
16676
16812
|
const cellPadding = density === "compact" ? "py-1.5 px-3" : density === "comfortable" ? "py-3 px-4" : "py-2.5 px-4";
|
|
16677
|
-
const visibleColsSet =
|
|
16678
|
-
const visibleColumns =
|
|
16813
|
+
const visibleColsSet = React57.useMemo(() => new Set(visibleCols), [visibleCols]);
|
|
16814
|
+
const visibleColumns = React57.useMemo(() => {
|
|
16679
16815
|
return filterVisibleColumns(columns, visibleColsSet);
|
|
16680
16816
|
}, [columns, visibleColsSet]);
|
|
16681
|
-
const leafColumns =
|
|
16817
|
+
const leafColumns = React57.useMemo(() => {
|
|
16682
16818
|
return getLeafColumns(visibleColumns);
|
|
16683
16819
|
}, [visibleColumns]);
|
|
16684
|
-
const totalColumnsWidth =
|
|
16820
|
+
const totalColumnsWidth = React57.useMemo(() => {
|
|
16685
16821
|
return leafColumns.reduce((sum, col) => sum + getColumnWidth(col), 0);
|
|
16686
16822
|
}, [leafColumns]);
|
|
16687
16823
|
const { getStickyCellClass, getStickyColumnStyle, getStickyHeaderClass, getStickyHeaderCellStyle } = useStickyColumns(
|
|
@@ -16743,7 +16879,7 @@ function DataTable({
|
|
|
16743
16879
|
}
|
|
16744
16880
|
return null;
|
|
16745
16881
|
};
|
|
16746
|
-
const headerRows =
|
|
16882
|
+
const headerRows = React57.useMemo(() => buildHeaderRows(visibleColumns), [visibleColumns]);
|
|
16747
16883
|
const renderHeaderContent = (col, isLeaf) => {
|
|
16748
16884
|
if (!isLeaf) {
|
|
16749
16885
|
return /* @__PURE__ */ jsx65(
|
|
@@ -16887,7 +17023,7 @@ function DataTable({
|
|
|
16887
17023
|
col.key
|
|
16888
17024
|
);
|
|
16889
17025
|
}) }, `header-row-${rowIndex}`)) });
|
|
16890
|
-
const processedData =
|
|
17026
|
+
const processedData = React57.useMemo(() => {
|
|
16891
17027
|
if (isServerMode) return data;
|
|
16892
17028
|
let result = [...data];
|
|
16893
17029
|
if (Object.keys(filters).length > 0) {
|
|
@@ -16919,7 +17055,7 @@ function DataTable({
|
|
|
16919
17055
|
return result;
|
|
16920
17056
|
}, [data, isServerMode, filters, sort, columns]);
|
|
16921
17057
|
const totalItems = isServerMode ? total : processedData.length;
|
|
16922
|
-
const displayedData = isServerMode ? data :
|
|
17058
|
+
const displayedData = isServerMode ? data : React57.useMemo(() => {
|
|
16923
17059
|
const start = (curPage - 1) * curPageSize;
|
|
16924
17060
|
return processedData.slice(start, start + curPageSize);
|
|
16925
17061
|
}, [processedData, curPage, curPageSize]);
|
|
@@ -17038,10 +17174,10 @@ function DataTable({
|
|
|
17038
17174
|
var DataTable_default = DataTable;
|
|
17039
17175
|
|
|
17040
17176
|
// ../../components/ui/Form.tsx
|
|
17041
|
-
import * as
|
|
17177
|
+
import * as React58 from "react";
|
|
17042
17178
|
import { Controller, FormProvider, useFormContext, useForm } from "react-hook-form";
|
|
17043
17179
|
import { jsx as jsx66, jsxs as jsxs60 } from "react/jsx-runtime";
|
|
17044
|
-
var FormConfigContext =
|
|
17180
|
+
var FormConfigContext = React58.createContext({ size: "md" });
|
|
17045
17181
|
var FormWrapper = ({
|
|
17046
17182
|
children,
|
|
17047
17183
|
onSubmit,
|
|
@@ -17054,7 +17190,7 @@ var FormWrapper = ({
|
|
|
17054
17190
|
const methods = useForm({
|
|
17055
17191
|
defaultValues: initialValues
|
|
17056
17192
|
});
|
|
17057
|
-
|
|
17193
|
+
React58.useEffect(() => {
|
|
17058
17194
|
if (initialValues) {
|
|
17059
17195
|
methods.reset(initialValues);
|
|
17060
17196
|
}
|
|
@@ -17063,15 +17199,15 @@ var FormWrapper = ({
|
|
|
17063
17199
|
return /* @__PURE__ */ jsx66(FormProvider, { ...methods, children: /* @__PURE__ */ jsx66(FormConfigContext.Provider, { value: { size }, children: /* @__PURE__ */ jsx66("form", { onSubmit: methods.handleSubmit(onSubmit), className, ...formProps, children }) }) });
|
|
17064
17200
|
};
|
|
17065
17201
|
var Form = FormWrapper;
|
|
17066
|
-
var FormFieldContext =
|
|
17202
|
+
var FormFieldContext = React58.createContext({});
|
|
17067
17203
|
var FormField = ({
|
|
17068
17204
|
...props
|
|
17069
17205
|
}) => {
|
|
17070
17206
|
return /* @__PURE__ */ jsx66(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx66(Controller, { ...props }) });
|
|
17071
17207
|
};
|
|
17072
17208
|
var useFormField = () => {
|
|
17073
|
-
const fieldContext =
|
|
17074
|
-
const itemContext =
|
|
17209
|
+
const fieldContext = React58.useContext(FormFieldContext);
|
|
17210
|
+
const itemContext = React58.useContext(FormItemContext);
|
|
17075
17211
|
const { getFieldState, formState } = useFormContext();
|
|
17076
17212
|
if (!fieldContext) {
|
|
17077
17213
|
try {
|
|
@@ -17092,16 +17228,16 @@ var useFormField = () => {
|
|
|
17092
17228
|
...fieldState
|
|
17093
17229
|
};
|
|
17094
17230
|
};
|
|
17095
|
-
var FormItemContext =
|
|
17096
|
-
var FormItem =
|
|
17097
|
-
const id =
|
|
17231
|
+
var FormItemContext = React58.createContext({});
|
|
17232
|
+
var FormItem = React58.forwardRef(({ className, ...props }, ref) => {
|
|
17233
|
+
const id = React58.useId();
|
|
17098
17234
|
return /* @__PURE__ */ jsx66(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx66("div", { ref, className: cn("space-y-2", className), ...props }) });
|
|
17099
17235
|
});
|
|
17100
17236
|
FormItem.displayName = "FormItem";
|
|
17101
|
-
var FormLabel =
|
|
17237
|
+
var FormLabel = React58.forwardRef(
|
|
17102
17238
|
({ className, children, required, ...props }, ref) => {
|
|
17103
17239
|
const { error, formItemId } = useFormField();
|
|
17104
|
-
const config =
|
|
17240
|
+
const config = React58.useContext(FormConfigContext);
|
|
17105
17241
|
const sizeClass = config.size === "sm" ? "text-xs" : config.size === "lg" ? "text-base" : "text-sm";
|
|
17106
17242
|
return /* @__PURE__ */ jsxs60(Label, { ref, className: cn(sizeClass, error && "text-destructive", className), htmlFor: formItemId, ...props, children: [
|
|
17107
17243
|
children,
|
|
@@ -17110,7 +17246,7 @@ var FormLabel = React57.forwardRef(
|
|
|
17110
17246
|
}
|
|
17111
17247
|
);
|
|
17112
17248
|
FormLabel.displayName = "FormLabel";
|
|
17113
|
-
var FormControl =
|
|
17249
|
+
var FormControl = React58.forwardRef(({ ...props }, ref) => {
|
|
17114
17250
|
const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
|
|
17115
17251
|
return /* @__PURE__ */ jsx66(
|
|
17116
17252
|
"div",
|
|
@@ -17124,12 +17260,12 @@ var FormControl = React57.forwardRef(({ ...props }, ref) => {
|
|
|
17124
17260
|
);
|
|
17125
17261
|
});
|
|
17126
17262
|
FormControl.displayName = "FormControl";
|
|
17127
|
-
var FormDescription =
|
|
17263
|
+
var FormDescription = React58.forwardRef(({ className, ...props }, ref) => {
|
|
17128
17264
|
const { formDescriptionId } = useFormField();
|
|
17129
17265
|
return /* @__PURE__ */ jsx66("p", { ref, id: formDescriptionId, className: cn("text-sm text-muted-foreground", className), ...props });
|
|
17130
17266
|
});
|
|
17131
17267
|
FormDescription.displayName = "FormDescription";
|
|
17132
|
-
var FormMessage =
|
|
17268
|
+
var FormMessage = React58.forwardRef(({ className, children, ...props }, ref) => {
|
|
17133
17269
|
const { error, formMessageId } = useFormField();
|
|
17134
17270
|
const body = error ? String(error?.message) : children;
|
|
17135
17271
|
if (!body) {
|
|
@@ -17138,7 +17274,7 @@ var FormMessage = React57.forwardRef(({ className, children, ...props }, ref) =>
|
|
|
17138
17274
|
return /* @__PURE__ */ jsx66("p", { ref, id: formMessageId, className: cn("text-sm font-medium text-destructive", className), ...props, children: body });
|
|
17139
17275
|
});
|
|
17140
17276
|
FormMessage.displayName = "FormMessage";
|
|
17141
|
-
var FormInput =
|
|
17277
|
+
var FormInput = React58.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ jsx66(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx66(
|
|
17142
17278
|
FormField,
|
|
17143
17279
|
{
|
|
17144
17280
|
name,
|
|
@@ -17149,7 +17285,7 @@ var FormInput = React57.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */
|
|
|
17149
17285
|
}
|
|
17150
17286
|
) }));
|
|
17151
17287
|
FormInput.displayName = "FormInput";
|
|
17152
|
-
var FormCheckbox =
|
|
17288
|
+
var FormCheckbox = React58.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ jsx66(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx66(
|
|
17153
17289
|
FormField,
|
|
17154
17290
|
{
|
|
17155
17291
|
name,
|
|
@@ -17173,9 +17309,9 @@ var FormCheckbox = React57.forwardRef(({ name, ...props }, ref) => /* @__PURE__
|
|
|
17173
17309
|
}
|
|
17174
17310
|
) }));
|
|
17175
17311
|
FormCheckbox.displayName = "FormCheckbox";
|
|
17176
|
-
var FormActions =
|
|
17312
|
+
var FormActions = React58.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx66("div", { ref, className: cn("flex gap-2 justify-end", className), ...props }));
|
|
17177
17313
|
FormActions.displayName = "FormActions";
|
|
17178
|
-
var FormSubmitButton =
|
|
17314
|
+
var FormSubmitButton = React58.forwardRef(
|
|
17179
17315
|
({ children, loading: loading2, ...props }, ref) => /* @__PURE__ */ jsx66(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx66(Button_default, { ref, type: "submit", size: props.size ?? size, disabled: loading2, ...props, children }) })
|
|
17180
17316
|
);
|
|
17181
17317
|
FormSubmitButton.displayName = "FormSubmitButton";
|
|
@@ -17350,7 +17486,7 @@ function AccessDenied({
|
|
|
17350
17486
|
|
|
17351
17487
|
// ../../components/ui/ThemeToggleHeadless.tsx
|
|
17352
17488
|
import { Moon as Moon2, Sun as Sun2, Monitor } from "lucide-react";
|
|
17353
|
-
import { useEffect as
|
|
17489
|
+
import { useEffect as useEffect27, useRef as useRef21, useState as useState44 } from "react";
|
|
17354
17490
|
import { createPortal as createPortal7 } from "react-dom";
|
|
17355
17491
|
import { Fragment as Fragment26, jsx as jsx70, jsxs as jsxs64 } from "react/jsx-runtime";
|
|
17356
17492
|
function ThemeToggleHeadless({
|
|
@@ -17359,11 +17495,11 @@ function ThemeToggleHeadless({
|
|
|
17359
17495
|
labels,
|
|
17360
17496
|
className
|
|
17361
17497
|
}) {
|
|
17362
|
-
const [isOpen, setIsOpen] =
|
|
17363
|
-
const [mounted, setMounted] =
|
|
17498
|
+
const [isOpen, setIsOpen] = useState44(false);
|
|
17499
|
+
const [mounted, setMounted] = useState44(false);
|
|
17364
17500
|
const triggerRef = useRef21(null);
|
|
17365
|
-
const [dropdownPosition, setDropdownPosition] =
|
|
17366
|
-
|
|
17501
|
+
const [dropdownPosition, setDropdownPosition] = useState44(null);
|
|
17502
|
+
useEffect27(() => setMounted(true), []);
|
|
17367
17503
|
const themes = [
|
|
17368
17504
|
{ value: "light", label: labels?.light ?? "Light", icon: Sun2 },
|
|
17369
17505
|
{ value: "dark", label: labels?.dark ?? "Dark", icon: Moon2 },
|
|
@@ -17452,7 +17588,7 @@ function ThemeToggleHeadless({
|
|
|
17452
17588
|
}
|
|
17453
17589
|
|
|
17454
17590
|
// ../../components/ui/LanguageSwitcherHeadless.tsx
|
|
17455
|
-
import { useRef as useRef22, useState as
|
|
17591
|
+
import { useRef as useRef22, useState as useState45 } from "react";
|
|
17456
17592
|
import { createPortal as createPortal8 } from "react-dom";
|
|
17457
17593
|
import { Globe } from "lucide-react";
|
|
17458
17594
|
import { Fragment as Fragment27, jsx as jsx71, jsxs as jsxs65 } from "react/jsx-runtime";
|
|
@@ -17463,8 +17599,8 @@ function LanguageSwitcherHeadless({
|
|
|
17463
17599
|
labels,
|
|
17464
17600
|
className
|
|
17465
17601
|
}) {
|
|
17466
|
-
const [isOpen, setIsOpen] =
|
|
17467
|
-
const [dropdownPosition, setDropdownPosition] =
|
|
17602
|
+
const [isOpen, setIsOpen] = useState45(false);
|
|
17603
|
+
const [dropdownPosition, setDropdownPosition] = useState45(null);
|
|
17468
17604
|
const triggerButtonRef = useRef22(null);
|
|
17469
17605
|
const currentLanguage = locales.find((l) => l.code === currentLocale) || locales[0];
|
|
17470
17606
|
const calculatePosition = () => {
|
|
@@ -17957,7 +18093,7 @@ var VARIANT_STYLES_ALERT = {
|
|
|
17957
18093
|
};
|
|
17958
18094
|
|
|
17959
18095
|
// src/contexts/TranslationContext.tsx
|
|
17960
|
-
import * as
|
|
18096
|
+
import * as React60 from "react";
|
|
17961
18097
|
|
|
17962
18098
|
// locales/en.json
|
|
17963
18099
|
var en_default = {
|
|
@@ -18315,9 +18451,9 @@ var defaultTranslations2 = {
|
|
|
18315
18451
|
ko: ko_default,
|
|
18316
18452
|
ja: ja_default
|
|
18317
18453
|
};
|
|
18318
|
-
var TranslationContext2 =
|
|
18454
|
+
var TranslationContext2 = React60.createContext(null);
|
|
18319
18455
|
var TranslationProvider = ({ children, locale = "en", translations }) => {
|
|
18320
|
-
const t =
|
|
18456
|
+
const t = React60.useCallback(
|
|
18321
18457
|
(namespace) => {
|
|
18322
18458
|
return (key) => {
|
|
18323
18459
|
const mergedTranslations = {
|
|
@@ -18345,7 +18481,7 @@ var TranslationProvider = ({ children, locale = "en", translations }) => {
|
|
|
18345
18481
|
return /* @__PURE__ */ jsx72(TranslationContext2.Provider, { value: { locale, t }, children });
|
|
18346
18482
|
};
|
|
18347
18483
|
var useUnderverseTranslations = (namespace) => {
|
|
18348
|
-
const context =
|
|
18484
|
+
const context = React60.useContext(TranslationContext2);
|
|
18349
18485
|
if (!context) {
|
|
18350
18486
|
return (key) => {
|
|
18351
18487
|
const parts = namespace.split(".");
|
|
@@ -18367,12 +18503,12 @@ var useUnderverseTranslations = (namespace) => {
|
|
|
18367
18503
|
return context.t(namespace);
|
|
18368
18504
|
};
|
|
18369
18505
|
var useUnderverseLocale = () => {
|
|
18370
|
-
const context =
|
|
18506
|
+
const context = React60.useContext(TranslationContext2);
|
|
18371
18507
|
return context?.locale || "en";
|
|
18372
18508
|
};
|
|
18373
18509
|
|
|
18374
18510
|
// src/hooks/useSmartTranslations.tsx
|
|
18375
|
-
import * as
|
|
18511
|
+
import * as React61 from "react";
|
|
18376
18512
|
import { jsx as jsx73 } from "react/jsx-runtime";
|
|
18377
18513
|
var nextIntlHooks = null;
|
|
18378
18514
|
try {
|
|
@@ -18384,12 +18520,12 @@ try {
|
|
|
18384
18520
|
} catch {
|
|
18385
18521
|
nextIntlHooks = null;
|
|
18386
18522
|
}
|
|
18387
|
-
var ForceInternalContext =
|
|
18523
|
+
var ForceInternalContext = React61.createContext(false);
|
|
18388
18524
|
var ForceInternalTranslationsProvider = ({ children }) => {
|
|
18389
18525
|
return /* @__PURE__ */ jsx73(ForceInternalContext.Provider, { value: true, children });
|
|
18390
18526
|
};
|
|
18391
18527
|
function useSmartTranslations(namespace) {
|
|
18392
|
-
const forceInternal =
|
|
18528
|
+
const forceInternal = React61.useContext(ForceInternalContext);
|
|
18393
18529
|
const internalT = useUnderverseTranslations(namespace);
|
|
18394
18530
|
if (forceInternal || !nextIntlHooks?.useTranslations) {
|
|
18395
18531
|
return internalT;
|
|
@@ -18402,7 +18538,7 @@ function useSmartTranslations(namespace) {
|
|
|
18402
18538
|
}
|
|
18403
18539
|
}
|
|
18404
18540
|
function useSmartLocale() {
|
|
18405
|
-
const forceInternal =
|
|
18541
|
+
const forceInternal = React61.useContext(ForceInternalContext);
|
|
18406
18542
|
const internalLocale = useUnderverseLocale();
|
|
18407
18543
|
if (forceInternal || !nextIntlHooks?.useLocale) {
|
|
18408
18544
|
return internalLocale;
|
|
@@ -18416,7 +18552,7 @@ function useSmartLocale() {
|
|
|
18416
18552
|
}
|
|
18417
18553
|
|
|
18418
18554
|
// ../../components/ui/UEditor/UEditor.tsx
|
|
18419
|
-
import { useEffect as
|
|
18555
|
+
import { useEffect as useEffect32, useMemo as useMemo24 } from "react";
|
|
18420
18556
|
import { useTranslations as useTranslations7 } from "next-intl";
|
|
18421
18557
|
import { useEditor, EditorContent } from "@tiptap/react";
|
|
18422
18558
|
|
|
@@ -18459,7 +18595,7 @@ import { common, createLowlight } from "lowlight";
|
|
|
18459
18595
|
import { Extension } from "@tiptap/core";
|
|
18460
18596
|
import Suggestion from "@tiptap/suggestion";
|
|
18461
18597
|
import { ReactRenderer } from "@tiptap/react";
|
|
18462
|
-
import { forwardRef as forwardRef13, useEffect as
|
|
18598
|
+
import { forwardRef as forwardRef13, useEffect as useEffect28, useImperativeHandle, useRef as useRef23, useState as useState46 } from "react";
|
|
18463
18599
|
import {
|
|
18464
18600
|
FileCode,
|
|
18465
18601
|
Heading1,
|
|
@@ -18476,12 +18612,12 @@ import {
|
|
|
18476
18612
|
import tippy from "tippy.js";
|
|
18477
18613
|
import { jsx as jsx74, jsxs as jsxs66 } from "react/jsx-runtime";
|
|
18478
18614
|
var CommandList = forwardRef13((props, ref) => {
|
|
18479
|
-
const [selectedIndex, setSelectedIndex] =
|
|
18615
|
+
const [selectedIndex, setSelectedIndex] = useState46(0);
|
|
18480
18616
|
const listRef = useRef23(null);
|
|
18481
|
-
|
|
18617
|
+
useEffect28(() => {
|
|
18482
18618
|
setSelectedIndex(0);
|
|
18483
18619
|
}, [props.items]);
|
|
18484
|
-
|
|
18620
|
+
useEffect28(() => {
|
|
18485
18621
|
const selectedElement = listRef.current?.querySelector(`[data-index="${selectedIndex}"]`);
|
|
18486
18622
|
selectedElement?.scrollIntoView({ block: "nearest" });
|
|
18487
18623
|
}, [selectedIndex, props.items]);
|
|
@@ -18790,7 +18926,7 @@ var ClipboardImages = Extension2.create({
|
|
|
18790
18926
|
});
|
|
18791
18927
|
|
|
18792
18928
|
// ../../components/ui/UEditor/resizable-image.tsx
|
|
18793
|
-
import { useEffect as
|
|
18929
|
+
import { useEffect as useEffect29, useRef as useRef24, useState as useState47 } from "react";
|
|
18794
18930
|
import Image3 from "@tiptap/extension-image";
|
|
18795
18931
|
import { mergeAttributes } from "@tiptap/core";
|
|
18796
18932
|
import { NodeViewWrapper, ReactNodeViewRenderer } from "@tiptap/react";
|
|
@@ -18812,13 +18948,13 @@ function ResizableImageNodeView(props) {
|
|
|
18812
18948
|
const { node, selected, updateAttributes, editor, getPos } = props;
|
|
18813
18949
|
const wrapperRef = useRef24(null);
|
|
18814
18950
|
const imgRef = useRef24(null);
|
|
18815
|
-
const [isHovered, setIsHovered] =
|
|
18816
|
-
const [isResizing, setIsResizing] =
|
|
18951
|
+
const [isHovered, setIsHovered] = useState47(false);
|
|
18952
|
+
const [isResizing, setIsResizing] = useState47(false);
|
|
18817
18953
|
const widthAttr = toNullableNumber(node.attrs["width"]);
|
|
18818
18954
|
const heightAttr = toNullableNumber(node.attrs["height"]);
|
|
18819
18955
|
const textAlign = String(node.attrs["textAlign"] ?? "");
|
|
18820
18956
|
const dragStateRef = useRef24(null);
|
|
18821
|
-
|
|
18957
|
+
useEffect29(() => {
|
|
18822
18958
|
const img = imgRef.current;
|
|
18823
18959
|
if (!img) return;
|
|
18824
18960
|
img.style.width = widthAttr ? `${widthAttr}px` : "";
|
|
@@ -19087,12 +19223,12 @@ function buildUEditorExtensions({
|
|
|
19087
19223
|
TableRow2,
|
|
19088
19224
|
TableCell2.configure({
|
|
19089
19225
|
HTMLAttributes: {
|
|
19090
|
-
class: "border border-border p-2 min-w-
|
|
19226
|
+
class: "border border-border p-2 min-w-25"
|
|
19091
19227
|
}
|
|
19092
19228
|
}),
|
|
19093
19229
|
TableHeader2.configure({
|
|
19094
19230
|
HTMLAttributes: {
|
|
19095
|
-
class: "border border-border p-2 bg-muted font-semibold min-w-
|
|
19231
|
+
class: "border border-border p-2 bg-muted font-semibold min-w-25"
|
|
19096
19232
|
}
|
|
19097
19233
|
}),
|
|
19098
19234
|
CharacterCount.configure({
|
|
@@ -19110,7 +19246,7 @@ function buildUEditorExtensions({
|
|
|
19110
19246
|
}
|
|
19111
19247
|
|
|
19112
19248
|
// ../../components/ui/UEditor/toolbar.tsx
|
|
19113
|
-
import
|
|
19249
|
+
import React66, { useRef as useRef26, useState as useState49 } from "react";
|
|
19114
19250
|
import { useTranslations as useTranslations4 } from "next-intl";
|
|
19115
19251
|
import {
|
|
19116
19252
|
AlignCenter,
|
|
@@ -19148,13 +19284,13 @@ import {
|
|
|
19148
19284
|
} from "lucide-react";
|
|
19149
19285
|
|
|
19150
19286
|
// ../../components/ui/UEditor/colors.tsx
|
|
19151
|
-
import { useMemo as
|
|
19287
|
+
import { useMemo as useMemo22 } from "react";
|
|
19152
19288
|
import { useTranslations as useTranslations2 } from "next-intl";
|
|
19153
19289
|
import { X as X14 } from "lucide-react";
|
|
19154
19290
|
import { jsx as jsx76, jsxs as jsxs68 } from "react/jsx-runtime";
|
|
19155
19291
|
var useEditorColors = () => {
|
|
19156
19292
|
const t = useTranslations2("UEditor");
|
|
19157
|
-
const textColors =
|
|
19293
|
+
const textColors = useMemo22(
|
|
19158
19294
|
() => [
|
|
19159
19295
|
{ name: t("colors.default"), color: "inherit", cssClass: "text-foreground" },
|
|
19160
19296
|
{ name: t("colors.muted"), color: "var(--muted-foreground)", cssClass: "text-muted-foreground" },
|
|
@@ -19167,7 +19303,7 @@ var useEditorColors = () => {
|
|
|
19167
19303
|
],
|
|
19168
19304
|
[t]
|
|
19169
19305
|
);
|
|
19170
|
-
const highlightColors =
|
|
19306
|
+
const highlightColors = useMemo22(
|
|
19171
19307
|
() => [
|
|
19172
19308
|
{ name: t("colors.default"), color: "", cssClass: "" },
|
|
19173
19309
|
{ name: t("colors.muted"), color: "var(--muted)", cssClass: "bg-muted" },
|
|
@@ -19212,7 +19348,7 @@ var EditorColorPalette = ({
|
|
|
19212
19348
|
] });
|
|
19213
19349
|
|
|
19214
19350
|
// ../../components/ui/UEditor/inputs.tsx
|
|
19215
|
-
import { useEffect as
|
|
19351
|
+
import { useEffect as useEffect30, useRef as useRef25, useState as useState48 } from "react";
|
|
19216
19352
|
import { useTranslations as useTranslations3 } from "next-intl";
|
|
19217
19353
|
import { Check as Check9, X as X15 } from "lucide-react";
|
|
19218
19354
|
import { jsx as jsx77, jsxs as jsxs69 } from "react/jsx-runtime";
|
|
@@ -19229,9 +19365,9 @@ var LinkInput = ({
|
|
|
19229
19365
|
initialUrl = ""
|
|
19230
19366
|
}) => {
|
|
19231
19367
|
const t = useTranslations3("UEditor");
|
|
19232
|
-
const [url, setUrl] =
|
|
19368
|
+
const [url, setUrl] = useState48(initialUrl);
|
|
19233
19369
|
const inputRef = useRef25(null);
|
|
19234
|
-
|
|
19370
|
+
useEffect30(() => {
|
|
19235
19371
|
inputRef.current?.focus();
|
|
19236
19372
|
inputRef.current?.select();
|
|
19237
19373
|
}, []);
|
|
@@ -19258,10 +19394,10 @@ var LinkInput = ({
|
|
|
19258
19394
|
};
|
|
19259
19395
|
var ImageInput = ({ onSubmit, onCancel }) => {
|
|
19260
19396
|
const t = useTranslations3("UEditor");
|
|
19261
|
-
const [url, setUrl] =
|
|
19262
|
-
const [alt, setAlt] =
|
|
19397
|
+
const [url, setUrl] = useState48("");
|
|
19398
|
+
const [alt, setAlt] = useState48("");
|
|
19263
19399
|
const inputRef = useRef25(null);
|
|
19264
|
-
|
|
19400
|
+
useEffect30(() => {
|
|
19265
19401
|
inputRef.current?.focus();
|
|
19266
19402
|
}, []);
|
|
19267
19403
|
const handleSubmit = (e) => {
|
|
@@ -19323,7 +19459,7 @@ function fileToDataUrl2(file) {
|
|
|
19323
19459
|
reader.readAsDataURL(file);
|
|
19324
19460
|
});
|
|
19325
19461
|
}
|
|
19326
|
-
var ToolbarButton =
|
|
19462
|
+
var ToolbarButton = React66.forwardRef(({ onClick, onMouseDown, active, disabled, children, title, className }, ref) => {
|
|
19327
19463
|
const button = /* @__PURE__ */ jsx78(
|
|
19328
19464
|
"button",
|
|
19329
19465
|
{
|
|
@@ -19361,10 +19497,10 @@ var EditorToolbar = ({
|
|
|
19361
19497
|
}) => {
|
|
19362
19498
|
const t = useTranslations4("UEditor");
|
|
19363
19499
|
const { textColors, highlightColors } = useEditorColors();
|
|
19364
|
-
const [showImageInput, setShowImageInput] =
|
|
19500
|
+
const [showImageInput, setShowImageInput] = useState49(false);
|
|
19365
19501
|
const fileInputRef = useRef26(null);
|
|
19366
|
-
const [isUploadingImage, setIsUploadingImage] =
|
|
19367
|
-
const [imageUploadError, setImageUploadError] =
|
|
19502
|
+
const [isUploadingImage, setIsUploadingImage] = useState49(false);
|
|
19503
|
+
const [imageUploadError, setImageUploadError] = useState49(null);
|
|
19368
19504
|
const insertImageFiles = async (files) => {
|
|
19369
19505
|
if (files.length === 0) return;
|
|
19370
19506
|
setIsUploadingImage(true);
|
|
@@ -19781,7 +19917,7 @@ var EditorToolbar = ({
|
|
|
19781
19917
|
};
|
|
19782
19918
|
|
|
19783
19919
|
// ../../components/ui/UEditor/menus.tsx
|
|
19784
|
-
import { useCallback as
|
|
19920
|
+
import { useCallback as useCallback15, useEffect as useEffect31, useMemo as useMemo23, useRef as useRef27, useState as useState50 } from "react";
|
|
19785
19921
|
import { createPortal as createPortal9 } from "react-dom";
|
|
19786
19922
|
import { useTranslations as useTranslations5 } from "next-intl";
|
|
19787
19923
|
import {
|
|
@@ -19810,9 +19946,9 @@ import {
|
|
|
19810
19946
|
import { jsx as jsx79, jsxs as jsxs71 } from "react/jsx-runtime";
|
|
19811
19947
|
var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
|
|
19812
19948
|
const t = useTranslations5("UEditor");
|
|
19813
|
-
const [selectedIndex, setSelectedIndex] =
|
|
19949
|
+
const [selectedIndex, setSelectedIndex] = useState50(0);
|
|
19814
19950
|
const menuRef = useRef27(null);
|
|
19815
|
-
const allCommands =
|
|
19951
|
+
const allCommands = useMemo23(
|
|
19816
19952
|
() => [
|
|
19817
19953
|
{
|
|
19818
19954
|
icon: Type3,
|
|
@@ -19883,19 +20019,19 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
|
|
|
19883
20019
|
],
|
|
19884
20020
|
[editor, t]
|
|
19885
20021
|
);
|
|
19886
|
-
const commands =
|
|
20022
|
+
const commands = useMemo23(() => {
|
|
19887
20023
|
if (!filterText) return allCommands;
|
|
19888
20024
|
const lowerFilter = filterText.toLowerCase();
|
|
19889
20025
|
return allCommands.filter((cmd) => cmd.label.toLowerCase().includes(lowerFilter) || cmd.description.toLowerCase().includes(lowerFilter));
|
|
19890
20026
|
}, [allCommands, filterText]);
|
|
19891
|
-
|
|
20027
|
+
useEffect31(() => {
|
|
19892
20028
|
setSelectedIndex(0);
|
|
19893
20029
|
}, [filterText]);
|
|
19894
|
-
|
|
20030
|
+
useEffect31(() => {
|
|
19895
20031
|
const selectedElement = menuRef.current?.querySelector(`[data-index="${selectedIndex}"]`);
|
|
19896
20032
|
selectedElement?.scrollIntoView({ block: "nearest" });
|
|
19897
20033
|
}, [selectedIndex]);
|
|
19898
|
-
const selectCommand =
|
|
20034
|
+
const selectCommand = useCallback15(
|
|
19899
20035
|
(index) => {
|
|
19900
20036
|
const command = commands[index];
|
|
19901
20037
|
if (command) {
|
|
@@ -19905,7 +20041,7 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
|
|
|
19905
20041
|
},
|
|
19906
20042
|
[commands, onClose]
|
|
19907
20043
|
);
|
|
19908
|
-
|
|
20044
|
+
useEffect31(() => {
|
|
19909
20045
|
const handleKeyDown = (e) => {
|
|
19910
20046
|
if (commands.length === 0) return;
|
|
19911
20047
|
if (e.key === "ArrowDown") {
|
|
@@ -19965,7 +20101,7 @@ var SlashCommandMenu = ({ editor, onClose, filterText = "" }) => {
|
|
|
19965
20101
|
};
|
|
19966
20102
|
var FloatingMenuContent = ({ editor }) => {
|
|
19967
20103
|
const t = useTranslations5("UEditor");
|
|
19968
|
-
const [showCommands, setShowCommands] =
|
|
20104
|
+
const [showCommands, setShowCommands] = useState50(false);
|
|
19969
20105
|
if (showCommands) {
|
|
19970
20106
|
return /* @__PURE__ */ jsx79(SlashCommandMenu, { editor, onClose: () => setShowCommands(false) });
|
|
19971
20107
|
}
|
|
@@ -19988,12 +20124,12 @@ var BubbleMenuContent = ({
|
|
|
19988
20124
|
}) => {
|
|
19989
20125
|
const t = useTranslations5("UEditor");
|
|
19990
20126
|
const { textColors, highlightColors } = useEditorColors();
|
|
19991
|
-
const [showLinkInput, setShowLinkInput] =
|
|
19992
|
-
const [showEditorColorPalette, setShowEditorColorPalette] =
|
|
19993
|
-
|
|
20127
|
+
const [showLinkInput, setShowLinkInput] = useState50(false);
|
|
20128
|
+
const [showEditorColorPalette, setShowEditorColorPalette] = useState50(false);
|
|
20129
|
+
useEffect31(() => {
|
|
19994
20130
|
onKeepOpenChange?.(showLinkInput);
|
|
19995
20131
|
}, [onKeepOpenChange, showLinkInput]);
|
|
19996
|
-
|
|
20132
|
+
useEffect31(() => {
|
|
19997
20133
|
if (!showLinkInput) return;
|
|
19998
20134
|
const close = () => setShowLinkInput(false);
|
|
19999
20135
|
editor.on("selectionUpdate", close);
|
|
@@ -20116,15 +20252,15 @@ var BubbleMenuContent = ({
|
|
|
20116
20252
|
] });
|
|
20117
20253
|
};
|
|
20118
20254
|
var CustomBubbleMenu = ({ editor }) => {
|
|
20119
|
-
const [isVisible, setIsVisible] =
|
|
20120
|
-
const [position, setPosition] =
|
|
20255
|
+
const [isVisible, setIsVisible] = useState50(false);
|
|
20256
|
+
const [position, setPosition] = useState50({ top: 0, left: 0 });
|
|
20121
20257
|
const menuRef = useRef27(null);
|
|
20122
20258
|
const keepOpenRef = useRef27(false);
|
|
20123
|
-
const setKeepOpen =
|
|
20259
|
+
const setKeepOpen = useCallback15((next) => {
|
|
20124
20260
|
keepOpenRef.current = next;
|
|
20125
20261
|
if (next) setIsVisible(true);
|
|
20126
20262
|
}, []);
|
|
20127
|
-
|
|
20263
|
+
useEffect31(() => {
|
|
20128
20264
|
const updatePosition = () => {
|
|
20129
20265
|
const { state, view } = editor;
|
|
20130
20266
|
const { from, to, empty } = state.selection;
|
|
@@ -20177,9 +20313,9 @@ var CustomBubbleMenu = ({ editor }) => {
|
|
|
20177
20313
|
);
|
|
20178
20314
|
};
|
|
20179
20315
|
var CustomFloatingMenu = ({ editor }) => {
|
|
20180
|
-
const [isVisible, setIsVisible] =
|
|
20181
|
-
const [position, setPosition] =
|
|
20182
|
-
|
|
20316
|
+
const [isVisible, setIsVisible] = useState50(false);
|
|
20317
|
+
const [position, setPosition] = useState50({ top: 0, left: 0 });
|
|
20318
|
+
useEffect31(() => {
|
|
20183
20319
|
const updatePosition = () => {
|
|
20184
20320
|
const { state, view } = editor;
|
|
20185
20321
|
const { $from, empty } = state.selection;
|
|
@@ -20275,7 +20411,7 @@ var UEditor = ({
|
|
|
20275
20411
|
}) => {
|
|
20276
20412
|
const t = useTranslations7("UEditor");
|
|
20277
20413
|
const effectivePlaceholder = placeholder ?? t("placeholder");
|
|
20278
|
-
const extensions =
|
|
20414
|
+
const extensions = useMemo24(
|
|
20279
20415
|
() => buildUEditorExtensions({ placeholder: effectivePlaceholder, maxCharacters, uploadImage, imageInsertMode, editable }),
|
|
20280
20416
|
[effectivePlaceholder, maxCharacters, uploadImage, imageInsertMode, editable]
|
|
20281
20417
|
);
|
|
@@ -20384,7 +20520,7 @@ var UEditor = ({
|
|
|
20384
20520
|
onJsonChange?.(editor2.getJSON());
|
|
20385
20521
|
}
|
|
20386
20522
|
});
|
|
20387
|
-
|
|
20523
|
+
useEffect32(() => {
|
|
20388
20524
|
if (editor && content !== editor.getHTML()) {
|
|
20389
20525
|
if (editor.isEmpty && content) {
|
|
20390
20526
|
editor.commands.setContent(content);
|