@underverse-ui/underverse 1.0.47 → 1.0.48
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/api-reference.json +9 -2
- package/dist/index.cjs +945 -927
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +14 -8
- package/dist/index.d.ts +14 -8
- package/dist/index.js +704 -686
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -409,85 +409,103 @@ var PulseBadge = ({ speed = "normal", className, ...props }) => {
|
|
|
409
409
|
var Badge_default = Badge;
|
|
410
410
|
|
|
411
411
|
// src/components/Card.tsx
|
|
412
|
+
import React2 from "react";
|
|
412
413
|
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
413
414
|
var getPaddingInfo = (className) => {
|
|
414
415
|
if (!className) return { hasAll: false, hasX: false, hasY: false };
|
|
415
|
-
const hasAll =
|
|
416
|
-
const hasX = /\b(px|pl|pr|ps|pe)-/.test(className);
|
|
417
|
-
const hasY = /\b(py|pt|pb)-/.test(className);
|
|
416
|
+
const hasAll = /(?:^|\s)p-[\d[]/.test(className) || /(?:^|\s)(?:\w+:)?p-[\d[]/.test(className);
|
|
417
|
+
const hasX = /\b(?:\w+:)?(?:px|pl|pr|ps|pe)-/.test(className);
|
|
418
|
+
const hasY = /\b(?:\w+:)?(?:py|pt|pb)-/.test(className);
|
|
418
419
|
return { hasAll, hasX, hasY };
|
|
419
420
|
};
|
|
420
|
-
var Card = (
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
}
|
|
421
|
+
var Card = React2.forwardRef(
|
|
422
|
+
({
|
|
423
|
+
title,
|
|
424
|
+
description,
|
|
425
|
+
children,
|
|
426
|
+
footer,
|
|
427
|
+
className,
|
|
428
|
+
headerClassName,
|
|
429
|
+
footerClassName,
|
|
430
|
+
hoverable = false,
|
|
431
|
+
clickable = false,
|
|
432
|
+
innerClassName,
|
|
433
|
+
contentClassName,
|
|
434
|
+
noPadding = false,
|
|
435
|
+
onClick,
|
|
436
|
+
onKeyDown,
|
|
437
|
+
role,
|
|
438
|
+
tabIndex,
|
|
439
|
+
...rest
|
|
440
|
+
}, ref) => {
|
|
441
|
+
const isInteractive = clickable && typeof onClick === "function";
|
|
442
|
+
const padding = getPaddingInfo(contentClassName);
|
|
443
|
+
const skipAllPadding = noPadding || padding.hasAll;
|
|
444
|
+
const defaultPaddingX = !skipAllPadding && !padding.hasX ? "px-4 md:px-6 max-md:px-3" : "";
|
|
445
|
+
const defaultPaddingY = !skipAllPadding && !padding.hasY ? "pt-0 pb-4 md:pb-6 max-md:pb-3" : "";
|
|
446
|
+
return /* @__PURE__ */ jsx3(
|
|
447
|
+
"div",
|
|
448
|
+
{
|
|
449
|
+
ref,
|
|
450
|
+
className: cn(
|
|
451
|
+
"group rounded-2xl md:rounded-3xl bg-card text-card-foreground transition-[transform,box-shadow,border-color,background-color] duration-300 ease-soft max-md:rounded-xl",
|
|
452
|
+
"border border-border shadow-sm backdrop-blur-sm",
|
|
453
|
+
hoverable && "md:hover:-translate-y-0.5 md:hover:border-primary/15 md:hover:shadow-md",
|
|
454
|
+
clickable && "cursor-pointer active:translate-y-px active:bg-accent/5 md:hover:bg-accent/5 md:hover:shadow-md",
|
|
455
|
+
className
|
|
456
456
|
),
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
457
|
+
onClick,
|
|
458
|
+
onKeyDown: (e) => {
|
|
459
|
+
onKeyDown?.(e);
|
|
460
|
+
if (e.defaultPrevented || !isInteractive) return;
|
|
461
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
462
|
+
e.preventDefault();
|
|
463
|
+
e.currentTarget.click();
|
|
464
|
+
}
|
|
465
|
+
},
|
|
466
|
+
role: isInteractive ? role ?? "button" : role,
|
|
467
|
+
tabIndex: isInteractive ? tabIndex ?? 0 : tabIndex,
|
|
468
|
+
...rest,
|
|
469
|
+
children: /* @__PURE__ */ jsxs3("div", { className: cn("relative overflow-hidden rounded-2xl md:rounded-3xl max-md:rounded-xl", innerClassName), children: [
|
|
470
|
+
(hoverable || clickable) && /* @__PURE__ */ jsx3(
|
|
471
|
+
"div",
|
|
460
472
|
{
|
|
461
473
|
className: cn(
|
|
462
|
-
"
|
|
463
|
-
|
|
464
|
-
)
|
|
465
|
-
children: title
|
|
474
|
+
"pointer-events-none absolute inset-0 bg-linear-to-br from-primary/5 to-transparent opacity-0 transition-opacity duration-300",
|
|
475
|
+
"group-hover:opacity-100"
|
|
476
|
+
)
|
|
466
477
|
}
|
|
467
478
|
),
|
|
468
|
-
description && /* @__PURE__ */
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
}
|
|
479
|
+
(title || description) && /* @__PURE__ */ jsxs3("div", { className: cn("relative flex flex-col space-y-2 p-4 md:p-6 max-md:space-y-1.5 max-md:p-3", headerClassName), children: [
|
|
480
|
+
title && /* @__PURE__ */ jsx3(
|
|
481
|
+
"h3",
|
|
482
|
+
{
|
|
483
|
+
className: cn(
|
|
484
|
+
"text-base md:text-lg font-semibold leading-none tracking-tight transition-colors duration-200 max-md:text-sm",
|
|
485
|
+
hoverable && "group-hover:text-primary"
|
|
486
|
+
),
|
|
487
|
+
children: title
|
|
488
|
+
}
|
|
489
|
+
),
|
|
490
|
+
description && /* @__PURE__ */ jsx3("p", { className: "text-sm md:text-base text-muted-foreground leading-relaxed", children: description })
|
|
491
|
+
] }),
|
|
492
|
+
children && /* @__PURE__ */ jsx3("div", { className: cn("relative", defaultPaddingX, defaultPaddingY, contentClassName), children }),
|
|
493
|
+
footer && /* @__PURE__ */ jsx3("div", { className: cn("relative flex items-center p-4 md:p-6 pt-0 border-t border-border mt-4 max-md:mt-3 max-md:p-3 max-md:pt-0", footerClassName), children: footer })
|
|
494
|
+
] })
|
|
495
|
+
}
|
|
496
|
+
);
|
|
497
|
+
}
|
|
498
|
+
);
|
|
499
|
+
Card.displayName = "Card";
|
|
482
500
|
var Card_default = Card;
|
|
483
501
|
|
|
484
502
|
// src/components/CheckBox.tsx
|
|
485
|
-
import * as
|
|
503
|
+
import * as React3 from "react";
|
|
486
504
|
import { Check } from "lucide-react";
|
|
487
505
|
import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
488
|
-
var Checkbox =
|
|
506
|
+
var Checkbox = React3.forwardRef(
|
|
489
507
|
({ className, label, labelClassName, containerClassName, checked, defaultChecked, onChange, ...props }, ref) => {
|
|
490
|
-
const [internalChecked, setInternalChecked] =
|
|
508
|
+
const [internalChecked, setInternalChecked] = React3.useState(defaultChecked ?? false);
|
|
491
509
|
const isControlled = checked !== void 0;
|
|
492
510
|
const isChecked = isControlled ? checked : internalChecked;
|
|
493
511
|
const handleChange = (e) => {
|
|
@@ -516,13 +534,13 @@ var Checkbox = React2.forwardRef(
|
|
|
516
534
|
Checkbox.displayName = "Checkbox";
|
|
517
535
|
|
|
518
536
|
// src/components/Input.tsx
|
|
519
|
-
import
|
|
537
|
+
import React6, { forwardRef as forwardRef3, useId, useState as useState3 } from "react";
|
|
520
538
|
|
|
521
539
|
// src/hooks/useSmartTranslations.tsx
|
|
522
|
-
import * as
|
|
540
|
+
import * as React5 from "react";
|
|
523
541
|
|
|
524
542
|
// src/contexts/TranslationContext.tsx
|
|
525
|
-
import * as
|
|
543
|
+
import * as React4 from "react";
|
|
526
544
|
|
|
527
545
|
// locales/en.json
|
|
528
546
|
var en_default = {
|
|
@@ -1406,9 +1424,9 @@ var defaultTranslations = {
|
|
|
1406
1424
|
ko: ko_default,
|
|
1407
1425
|
ja: ja_default
|
|
1408
1426
|
};
|
|
1409
|
-
var TranslationContext =
|
|
1427
|
+
var TranslationContext = React4.createContext(null);
|
|
1410
1428
|
var TranslationProvider = ({ children, locale = "en", translations }) => {
|
|
1411
|
-
const t =
|
|
1429
|
+
const t = React4.useCallback(
|
|
1412
1430
|
(namespace) => {
|
|
1413
1431
|
return (key) => {
|
|
1414
1432
|
const mergedTranslations = {
|
|
@@ -1436,7 +1454,7 @@ var TranslationProvider = ({ children, locale = "en", translations }) => {
|
|
|
1436
1454
|
return /* @__PURE__ */ jsx5(TranslationContext.Provider, { value: { locale, t }, children });
|
|
1437
1455
|
};
|
|
1438
1456
|
var useUnderverseTranslations = (namespace) => {
|
|
1439
|
-
const context =
|
|
1457
|
+
const context = React4.useContext(TranslationContext);
|
|
1440
1458
|
if (!context) {
|
|
1441
1459
|
return (key) => {
|
|
1442
1460
|
const parts = namespace.split(".");
|
|
@@ -1458,7 +1476,7 @@ var useUnderverseTranslations = (namespace) => {
|
|
|
1458
1476
|
return context.t(namespace);
|
|
1459
1477
|
};
|
|
1460
1478
|
var useUnderverseLocale = () => {
|
|
1461
|
-
const context =
|
|
1479
|
+
const context = React4.useContext(TranslationContext);
|
|
1462
1480
|
return context?.locale || "en";
|
|
1463
1481
|
};
|
|
1464
1482
|
|
|
@@ -1474,12 +1492,12 @@ try {
|
|
|
1474
1492
|
} catch {
|
|
1475
1493
|
nextIntlHooks = null;
|
|
1476
1494
|
}
|
|
1477
|
-
var ForceInternalContext =
|
|
1495
|
+
var ForceInternalContext = React5.createContext(false);
|
|
1478
1496
|
var ForceInternalTranslationsProvider = ({ children }) => {
|
|
1479
1497
|
return /* @__PURE__ */ jsx6(ForceInternalContext.Provider, { value: true, children });
|
|
1480
1498
|
};
|
|
1481
1499
|
function useSmartTranslations(namespace) {
|
|
1482
|
-
const forceInternal =
|
|
1500
|
+
const forceInternal = React5.useContext(ForceInternalContext);
|
|
1483
1501
|
const internalT = useUnderverseTranslations(namespace);
|
|
1484
1502
|
if (forceInternal || !nextIntlHooks?.useTranslations) {
|
|
1485
1503
|
return internalT;
|
|
@@ -1492,7 +1510,7 @@ function useSmartTranslations(namespace) {
|
|
|
1492
1510
|
}
|
|
1493
1511
|
}
|
|
1494
1512
|
function useSmartLocale() {
|
|
1495
|
-
const forceInternal =
|
|
1513
|
+
const forceInternal = React5.useContext(ForceInternalContext);
|
|
1496
1514
|
const internalLocale = useUnderverseLocale();
|
|
1497
1515
|
if (forceInternal || !nextIntlHooks?.useLocale) {
|
|
1498
1516
|
return internalLocale;
|
|
@@ -1799,7 +1817,7 @@ Input.displayName = "Input";
|
|
|
1799
1817
|
var SearchInput = forwardRef3(
|
|
1800
1818
|
({ onSearch, searchDelay = 300, placeholder = "Search\u2026", ...props }, ref) => {
|
|
1801
1819
|
const [searchValue, setSearchValue] = useState3(props.value || "");
|
|
1802
|
-
|
|
1820
|
+
React6.useEffect(() => {
|
|
1803
1821
|
if (!onSearch) return;
|
|
1804
1822
|
const timer = setTimeout(() => {
|
|
1805
1823
|
onSearch(searchValue);
|
|
@@ -1872,16 +1890,16 @@ var NumberInput = forwardRef3(
|
|
|
1872
1890
|
const n = Number(v);
|
|
1873
1891
|
return Number.isFinite(n) ? n : 0;
|
|
1874
1892
|
};
|
|
1875
|
-
const format =
|
|
1893
|
+
const format = React6.useCallback((n) => new Intl.NumberFormat(locale, { maximumFractionDigits: 0 }).format(n), [locale]);
|
|
1876
1894
|
const parse = (s) => {
|
|
1877
1895
|
const digits = (s || "").replace(/\D+/g, "");
|
|
1878
1896
|
return digits ? Number(digits) : NaN;
|
|
1879
1897
|
};
|
|
1880
|
-
const [displayValue, setDisplayValue] =
|
|
1898
|
+
const [displayValue, setDisplayValue] = React6.useState(
|
|
1881
1899
|
formatThousands ? value !== void 0 && value !== null && value !== "" ? format(toNumber(value)) : "" : String(value ?? "")
|
|
1882
1900
|
);
|
|
1883
1901
|
const currentValue = toNumber(value);
|
|
1884
|
-
|
|
1902
|
+
React6.useEffect(() => {
|
|
1885
1903
|
if (formatThousands) {
|
|
1886
1904
|
const next = value === "" || value === void 0 || value === null ? "" : format(toNumber(value));
|
|
1887
1905
|
setDisplayValue((prev) => prev === next ? prev : next);
|
|
@@ -2386,7 +2404,7 @@ TagInput.displayName = "TagInput";
|
|
|
2386
2404
|
var TagInput_default = TagInput;
|
|
2387
2405
|
|
|
2388
2406
|
// src/components/Switch.tsx
|
|
2389
|
-
import * as
|
|
2407
|
+
import * as React8 from "react";
|
|
2390
2408
|
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
2391
2409
|
var Switch = ({
|
|
2392
2410
|
checked,
|
|
@@ -2399,7 +2417,7 @@ var Switch = ({
|
|
|
2399
2417
|
className,
|
|
2400
2418
|
...props
|
|
2401
2419
|
}) => {
|
|
2402
|
-
const [isPressed, setIsPressed] =
|
|
2420
|
+
const [isPressed, setIsPressed] = React8.useState(false);
|
|
2403
2421
|
const sizeClasses2 = {
|
|
2404
2422
|
sm: {
|
|
2405
2423
|
track: "w-8 h-4",
|
|
@@ -2417,7 +2435,7 @@ var Switch = ({
|
|
|
2417
2435
|
translate: "translate-x-6"
|
|
2418
2436
|
}
|
|
2419
2437
|
};
|
|
2420
|
-
const
|
|
2438
|
+
const variantClasses3 = {
|
|
2421
2439
|
default: {
|
|
2422
2440
|
active: "bg-primary border-primary",
|
|
2423
2441
|
inactive: "bg-input border-input"
|
|
@@ -2463,7 +2481,7 @@ var Switch = ({
|
|
|
2463
2481
|
{
|
|
2464
2482
|
className: cn(
|
|
2465
2483
|
"block w-full h-full rounded-full transition-colors duration-200 ease-out border",
|
|
2466
|
-
checked ?
|
|
2484
|
+
checked ? variantClasses3[variant].active : variantClasses3[variant].inactive
|
|
2467
2485
|
)
|
|
2468
2486
|
}
|
|
2469
2487
|
),
|
|
@@ -2494,13 +2512,13 @@ Switch.displayName = "Switch";
|
|
|
2494
2512
|
var Switch_default = Switch;
|
|
2495
2513
|
|
|
2496
2514
|
// src/components/label.tsx
|
|
2497
|
-
import * as
|
|
2515
|
+
import * as React9 from "react";
|
|
2498
2516
|
import { cva } from "class-variance-authority";
|
|
2499
2517
|
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
2500
2518
|
var labelVariants = cva(
|
|
2501
2519
|
"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
|
|
2502
2520
|
);
|
|
2503
|
-
var Label =
|
|
2521
|
+
var Label = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx10(
|
|
2504
2522
|
"label",
|
|
2505
2523
|
{
|
|
2506
2524
|
ref,
|
|
@@ -2512,7 +2530,7 @@ Label.displayName = "Label";
|
|
|
2512
2530
|
|
|
2513
2531
|
// src/components/SmartImage.tsx
|
|
2514
2532
|
import Image2 from "next/image";
|
|
2515
|
-
import
|
|
2533
|
+
import React10 from "react";
|
|
2516
2534
|
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
2517
2535
|
var DEFAULT_FALLBACK = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400' viewBox='0 0 400 400'%3E%3Crect fill='%23f3f4f6' width='400' height='400'/%3E%3Cpath fill='%239ca3af' d='M160 150h80v60h-80z'/%3E%3Ccircle fill='%239ca3af' cx='180' cy='130' r='20'/%3E%3Cpath fill='%239ca3af' d='M120 240l60-60 40 40 40-30 60 50v40H120z'/%3E%3C/svg%3E";
|
|
2518
2536
|
var FAILED_SRCS = /* @__PURE__ */ new Set();
|
|
@@ -2551,8 +2569,8 @@ function SmartImage({
|
|
|
2551
2569
|
const normalized = `/${raw.replace(/^\.\/?/, "")}`;
|
|
2552
2570
|
return FAILED_SRCS.has(normalized) ? fallbackSrc : normalized;
|
|
2553
2571
|
};
|
|
2554
|
-
const [resolvedSrc, setResolvedSrc] =
|
|
2555
|
-
|
|
2572
|
+
const [resolvedSrc, setResolvedSrc] = React10.useState(() => normalize(src));
|
|
2573
|
+
React10.useEffect(() => {
|
|
2556
2574
|
setResolvedSrc(normalize(src));
|
|
2557
2575
|
}, [src]);
|
|
2558
2576
|
const handleError = () => {
|
|
@@ -2715,7 +2733,7 @@ var Avatar_default = Avatar;
|
|
|
2715
2733
|
// src/components/Skeleton.tsx
|
|
2716
2734
|
import { jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
2717
2735
|
var Skeleton = ({ className, width, height, variant = "rectangular", animation = "pulse", lines = 1 }) => {
|
|
2718
|
-
const
|
|
2736
|
+
const variantClasses3 = {
|
|
2719
2737
|
rectangular: "rounded-2xl md:rounded-3xl",
|
|
2720
2738
|
circular: "rounded-full",
|
|
2721
2739
|
rounded: "rounded-2xl md:rounded-3xl",
|
|
@@ -2732,7 +2750,7 @@ var Skeleton = ({ className, width, height, variant = "rectangular", animation =
|
|
|
2732
2750
|
{
|
|
2733
2751
|
className: cn(
|
|
2734
2752
|
"h-4 bg-muted",
|
|
2735
|
-
|
|
2753
|
+
variantClasses3[variant],
|
|
2736
2754
|
animationClasses[animation],
|
|
2737
2755
|
index === lines - 1 && "w-3/4"
|
|
2738
2756
|
// Last line is shorter
|
|
@@ -2745,7 +2763,7 @@ var Skeleton = ({ className, width, height, variant = "rectangular", animation =
|
|
|
2745
2763
|
index
|
|
2746
2764
|
)) });
|
|
2747
2765
|
}
|
|
2748
|
-
return /* @__PURE__ */ jsx13("div", { className: cn("bg-muted",
|
|
2766
|
+
return /* @__PURE__ */ jsx13("div", { className: cn("bg-muted", variantClasses3[variant], animationClasses[animation], className), style: { width, height } });
|
|
2749
2767
|
};
|
|
2750
2768
|
var SkeletonAvatar = ({ size = "md", className }) => {
|
|
2751
2769
|
const sizeClasses2 = {
|
|
@@ -2837,7 +2855,7 @@ var SkeletonTable = ({ rows = 5, columns = 4, className }) => {
|
|
|
2837
2855
|
var Skeleton_default = Skeleton;
|
|
2838
2856
|
|
|
2839
2857
|
// src/components/Progress.tsx
|
|
2840
|
-
import
|
|
2858
|
+
import React11 from "react";
|
|
2841
2859
|
import { Check as Check2, X as X3, Clock } from "lucide-react";
|
|
2842
2860
|
import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
2843
2861
|
var variantStyles2 = {
|
|
@@ -2871,8 +2889,8 @@ var Progress = ({
|
|
|
2871
2889
|
const percentage = Math.min(Math.max(value / max * 100, 0), 100);
|
|
2872
2890
|
const isComplete = status === "complete" || percentage >= 100;
|
|
2873
2891
|
const isError = status === "error";
|
|
2874
|
-
const labelId =
|
|
2875
|
-
const descId =
|
|
2892
|
+
const labelId = React11.useId();
|
|
2893
|
+
const descId = React11.useId();
|
|
2876
2894
|
const getStatusIcon = () => {
|
|
2877
2895
|
if (isComplete) return /* @__PURE__ */ jsx14(Check2, { className: "w-4 h-4 text-success" });
|
|
2878
2896
|
if (isError) return /* @__PURE__ */ jsx14(X3, { className: "w-4 h-4 text-destructive" });
|
|
@@ -3203,7 +3221,7 @@ var LoadingProgress = ({
|
|
|
3203
3221
|
};
|
|
3204
3222
|
|
|
3205
3223
|
// src/components/Modal.tsx
|
|
3206
|
-
import * as
|
|
3224
|
+
import * as React12 from "react";
|
|
3207
3225
|
import { createPortal } from "react-dom";
|
|
3208
3226
|
import { X as X4 } from "lucide-react";
|
|
3209
3227
|
import { jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
@@ -3232,17 +3250,17 @@ var Modal = ({
|
|
|
3232
3250
|
width,
|
|
3233
3251
|
height
|
|
3234
3252
|
}) => {
|
|
3235
|
-
const [isMounted, setIsMounted] =
|
|
3236
|
-
const [isVisible, setIsVisible] =
|
|
3237
|
-
const [isAnimating, setIsAnimating] =
|
|
3238
|
-
const mouseDownTarget =
|
|
3239
|
-
const modalContentRef =
|
|
3240
|
-
|
|
3253
|
+
const [isMounted, setIsMounted] = React12.useState(false);
|
|
3254
|
+
const [isVisible, setIsVisible] = React12.useState(false);
|
|
3255
|
+
const [isAnimating, setIsAnimating] = React12.useState(true);
|
|
3256
|
+
const mouseDownTarget = React12.useRef(null);
|
|
3257
|
+
const modalContentRef = React12.useRef(null);
|
|
3258
|
+
React12.useEffect(() => {
|
|
3241
3259
|
setIsMounted(true);
|
|
3242
3260
|
return () => setIsMounted(false);
|
|
3243
3261
|
}, []);
|
|
3244
|
-
const animationRef =
|
|
3245
|
-
|
|
3262
|
+
const animationRef = React12.useRef(false);
|
|
3263
|
+
React12.useEffect(() => {
|
|
3246
3264
|
if (isOpen) {
|
|
3247
3265
|
if (animationRef.current) return;
|
|
3248
3266
|
animationRef.current = true;
|
|
@@ -3262,7 +3280,7 @@ var Modal = ({
|
|
|
3262
3280
|
}
|
|
3263
3281
|
}
|
|
3264
3282
|
}, [isOpen, isVisible]);
|
|
3265
|
-
|
|
3283
|
+
React12.useEffect(() => {
|
|
3266
3284
|
if (!isOpen || !closeOnEsc) return;
|
|
3267
3285
|
const handleEscape = (event) => {
|
|
3268
3286
|
if (event.key === "Escape") {
|
|
@@ -3272,7 +3290,7 @@ var Modal = ({
|
|
|
3272
3290
|
document.addEventListener("keydown", handleEscape);
|
|
3273
3291
|
return () => document.removeEventListener("keydown", handleEscape);
|
|
3274
3292
|
}, [isOpen, closeOnEsc, onClose]);
|
|
3275
|
-
|
|
3293
|
+
React12.useEffect(() => {
|
|
3276
3294
|
if (isOpen) {
|
|
3277
3295
|
document.body.style.overflow = "hidden";
|
|
3278
3296
|
} else {
|
|
@@ -3562,7 +3580,7 @@ var ToastComponent = ({ toast, onRemove }) => {
|
|
|
3562
3580
|
var Toast_default = ToastProvider;
|
|
3563
3581
|
|
|
3564
3582
|
// src/components/Tooltip.tsx
|
|
3565
|
-
import * as
|
|
3583
|
+
import * as React14 from "react";
|
|
3566
3584
|
import { createPortal as createPortal2 } from "react-dom";
|
|
3567
3585
|
import { Fragment as Fragment3, jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
3568
3586
|
var variantStyles3 = {
|
|
@@ -3637,21 +3655,21 @@ var Tooltip = ({
|
|
|
3637
3655
|
disabled = false,
|
|
3638
3656
|
variant = "default"
|
|
3639
3657
|
}) => {
|
|
3640
|
-
const [isOpen, setIsOpen] =
|
|
3641
|
-
const [isMounted, setIsMounted] =
|
|
3642
|
-
const triggerRef =
|
|
3643
|
-
const positionerRef =
|
|
3644
|
-
const panelRef =
|
|
3645
|
-
const timeoutRef =
|
|
3646
|
-
const lastAppliedRef =
|
|
3647
|
-
|
|
3658
|
+
const [isOpen, setIsOpen] = React14.useState(false);
|
|
3659
|
+
const [isMounted, setIsMounted] = React14.useState(false);
|
|
3660
|
+
const triggerRef = React14.useRef(null);
|
|
3661
|
+
const positionerRef = React14.useRef(null);
|
|
3662
|
+
const panelRef = React14.useRef(null);
|
|
3663
|
+
const timeoutRef = React14.useRef(void 0);
|
|
3664
|
+
const lastAppliedRef = React14.useRef(null);
|
|
3665
|
+
React14.useEffect(() => {
|
|
3648
3666
|
setIsMounted(true);
|
|
3649
3667
|
}, []);
|
|
3650
3668
|
const delayOpen = typeof delay === "object" ? delay.open || 700 : delay;
|
|
3651
3669
|
const delayClose = typeof delay === "object" ? delay.close || 300 : delay;
|
|
3652
3670
|
const offset = 8;
|
|
3653
3671
|
const padding = 8;
|
|
3654
|
-
const updatePosition =
|
|
3672
|
+
const updatePosition = React14.useCallback(() => {
|
|
3655
3673
|
const triggerEl = triggerRef.current;
|
|
3656
3674
|
const positionerEl = positionerRef.current;
|
|
3657
3675
|
const panelEl = panelRef.current;
|
|
@@ -3700,10 +3718,10 @@ var Tooltip = ({
|
|
|
3700
3718
|
const handleBlur = () => {
|
|
3701
3719
|
setIsOpen(false);
|
|
3702
3720
|
};
|
|
3703
|
-
|
|
3721
|
+
React14.useEffect(() => {
|
|
3704
3722
|
return () => clearTimeout(timeoutRef.current);
|
|
3705
3723
|
}, []);
|
|
3706
|
-
|
|
3724
|
+
React14.useLayoutEffect(() => {
|
|
3707
3725
|
if (!isOpen) {
|
|
3708
3726
|
lastAppliedRef.current = null;
|
|
3709
3727
|
return;
|
|
@@ -3720,7 +3738,7 @@ var Tooltip = ({
|
|
|
3720
3738
|
cancelAnimationFrame(raf2);
|
|
3721
3739
|
};
|
|
3722
3740
|
}, [isOpen, updatePosition]);
|
|
3723
|
-
|
|
3741
|
+
React14.useEffect(() => {
|
|
3724
3742
|
if (!isOpen) return;
|
|
3725
3743
|
let raf = 0;
|
|
3726
3744
|
const handler = () => {
|
|
@@ -3738,7 +3756,7 @@ var Tooltip = ({
|
|
|
3738
3756
|
document.removeEventListener("scroll", handler, true);
|
|
3739
3757
|
};
|
|
3740
3758
|
}, [isOpen, updatePosition]);
|
|
3741
|
-
|
|
3759
|
+
React14.useEffect(() => {
|
|
3742
3760
|
if (!isOpen) return;
|
|
3743
3761
|
if (typeof ResizeObserver === "undefined") return;
|
|
3744
3762
|
const ro = new ResizeObserver(() => updatePosition());
|
|
@@ -3750,7 +3768,7 @@ var Tooltip = ({
|
|
|
3750
3768
|
return children;
|
|
3751
3769
|
}
|
|
3752
3770
|
return /* @__PURE__ */ jsxs13(Fragment3, { children: [
|
|
3753
|
-
|
|
3771
|
+
React14.cloneElement(children, {
|
|
3754
3772
|
ref: (node) => {
|
|
3755
3773
|
triggerRef.current = node;
|
|
3756
3774
|
assignRef(children.props?.ref, node);
|
|
@@ -3814,7 +3832,7 @@ var Tooltip = ({
|
|
|
3814
3832
|
};
|
|
3815
3833
|
|
|
3816
3834
|
// src/components/Popover.tsx
|
|
3817
|
-
import * as
|
|
3835
|
+
import * as React15 from "react";
|
|
3818
3836
|
import { createPortal as createPortal3 } from "react-dom";
|
|
3819
3837
|
|
|
3820
3838
|
// src/utils/animations.ts
|
|
@@ -4109,14 +4127,14 @@ var Popover = ({
|
|
|
4109
4127
|
contentWidth
|
|
4110
4128
|
}) => {
|
|
4111
4129
|
const isControlled = open !== void 0;
|
|
4112
|
-
const [internalOpen, setInternalOpen] =
|
|
4113
|
-
const triggerRef =
|
|
4114
|
-
const positionerRef =
|
|
4115
|
-
const panelRef =
|
|
4116
|
-
const lastAppliedRef =
|
|
4130
|
+
const [internalOpen, setInternalOpen] = React15.useState(false);
|
|
4131
|
+
const triggerRef = React15.useRef(null);
|
|
4132
|
+
const positionerRef = React15.useRef(null);
|
|
4133
|
+
const panelRef = React15.useRef(null);
|
|
4134
|
+
const lastAppliedRef = React15.useRef(null);
|
|
4117
4135
|
useShadCNAnimations();
|
|
4118
4136
|
const isOpen = isControlled ? open : internalOpen;
|
|
4119
|
-
const setIsOpen =
|
|
4137
|
+
const setIsOpen = React15.useCallback(
|
|
4120
4138
|
(next) => {
|
|
4121
4139
|
if (!isControlled) setInternalOpen(next);
|
|
4122
4140
|
onOpenChange?.(next);
|
|
@@ -4125,8 +4143,8 @@ var Popover = ({
|
|
|
4125
4143
|
);
|
|
4126
4144
|
const offset = 4;
|
|
4127
4145
|
const padding = 8;
|
|
4128
|
-
const initialPlacement =
|
|
4129
|
-
const updatePosition =
|
|
4146
|
+
const initialPlacement = React15.useMemo(() => normalizePlacement(placement), [placement]);
|
|
4147
|
+
const updatePosition = React15.useCallback(() => {
|
|
4130
4148
|
const triggerEl = triggerRef.current;
|
|
4131
4149
|
const positionerEl = positionerRef.current;
|
|
4132
4150
|
const panelEl = panelRef.current;
|
|
@@ -4163,7 +4181,7 @@ var Popover = ({
|
|
|
4163
4181
|
if (positionerEl.style.visibility !== "visible") positionerEl.style.visibility = "visible";
|
|
4164
4182
|
if (positionerEl.style.pointerEvents !== "auto") positionerEl.style.pointerEvents = "auto";
|
|
4165
4183
|
}, [placement, matchTriggerWidth, contentWidth]);
|
|
4166
|
-
|
|
4184
|
+
React15.useLayoutEffect(() => {
|
|
4167
4185
|
if (!isOpen) return;
|
|
4168
4186
|
updatePosition();
|
|
4169
4187
|
let raf1 = 0;
|
|
@@ -4177,7 +4195,7 @@ var Popover = ({
|
|
|
4177
4195
|
cancelAnimationFrame(raf2);
|
|
4178
4196
|
};
|
|
4179
4197
|
}, [isOpen, updatePosition]);
|
|
4180
|
-
|
|
4198
|
+
React15.useEffect(() => {
|
|
4181
4199
|
if (!isOpen) return;
|
|
4182
4200
|
let raf = 0;
|
|
4183
4201
|
const tick = () => {
|
|
@@ -4187,7 +4205,7 @@ var Popover = ({
|
|
|
4187
4205
|
raf = window.requestAnimationFrame(tick);
|
|
4188
4206
|
return () => window.cancelAnimationFrame(raf);
|
|
4189
4207
|
}, [isOpen, updatePosition]);
|
|
4190
|
-
|
|
4208
|
+
React15.useEffect(() => {
|
|
4191
4209
|
if (!isOpen) return;
|
|
4192
4210
|
let raf = 0;
|
|
4193
4211
|
const handler = () => {
|
|
@@ -4205,7 +4223,7 @@ var Popover = ({
|
|
|
4205
4223
|
document.removeEventListener("scroll", handler, true);
|
|
4206
4224
|
};
|
|
4207
4225
|
}, [isOpen, updatePosition]);
|
|
4208
|
-
|
|
4226
|
+
React15.useEffect(() => {
|
|
4209
4227
|
if (!isOpen) return;
|
|
4210
4228
|
if (typeof ResizeObserver === "undefined") return;
|
|
4211
4229
|
const ro = new ResizeObserver(() => updatePosition());
|
|
@@ -4213,13 +4231,13 @@ var Popover = ({
|
|
|
4213
4231
|
if (triggerRef.current) ro.observe(triggerRef.current);
|
|
4214
4232
|
return () => ro.disconnect();
|
|
4215
4233
|
}, [isOpen, updatePosition]);
|
|
4216
|
-
|
|
4234
|
+
React15.useLayoutEffect(() => {
|
|
4217
4235
|
if (!isOpen) {
|
|
4218
4236
|
lastAppliedRef.current = null;
|
|
4219
4237
|
return;
|
|
4220
4238
|
}
|
|
4221
4239
|
}, [isOpen]);
|
|
4222
|
-
|
|
4240
|
+
React15.useEffect(() => {
|
|
4223
4241
|
if (!isOpen) return;
|
|
4224
4242
|
const handleClickOutside = (event) => {
|
|
4225
4243
|
const target = event.target;
|
|
@@ -4304,7 +4322,7 @@ var Popover = ({
|
|
|
4304
4322
|
return /* @__PURE__ */ jsxs14(Fragment4, { children: [
|
|
4305
4323
|
(() => {
|
|
4306
4324
|
const triggerEl = trigger;
|
|
4307
|
-
return
|
|
4325
|
+
return React15.cloneElement(triggerEl, {
|
|
4308
4326
|
ref: (node) => {
|
|
4309
4327
|
triggerRef.current = node;
|
|
4310
4328
|
assignRef2(triggerEl.props?.ref, node);
|
|
@@ -4330,7 +4348,7 @@ var Popover = ({
|
|
|
4330
4348
|
};
|
|
4331
4349
|
|
|
4332
4350
|
// src/components/Sheet.tsx
|
|
4333
|
-
import * as
|
|
4351
|
+
import * as React16 from "react";
|
|
4334
4352
|
import { createPortal as createPortal4 } from "react-dom";
|
|
4335
4353
|
import { X as X6 } from "lucide-react";
|
|
4336
4354
|
import { jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
@@ -4410,13 +4428,13 @@ var Sheet = ({
|
|
|
4410
4428
|
header,
|
|
4411
4429
|
footer
|
|
4412
4430
|
}) => {
|
|
4413
|
-
const [mounted, setMounted] =
|
|
4414
|
-
const [isAnimating, setIsAnimating] =
|
|
4415
|
-
const [isVisible, setIsVisible] =
|
|
4416
|
-
|
|
4431
|
+
const [mounted, setMounted] = React16.useState(false);
|
|
4432
|
+
const [isAnimating, setIsAnimating] = React16.useState(true);
|
|
4433
|
+
const [isVisible, setIsVisible] = React16.useState(false);
|
|
4434
|
+
React16.useEffect(() => {
|
|
4417
4435
|
setMounted(true);
|
|
4418
4436
|
}, []);
|
|
4419
|
-
|
|
4437
|
+
React16.useEffect(() => {
|
|
4420
4438
|
if (!closeOnEscape) return;
|
|
4421
4439
|
const handleEscape = (e) => {
|
|
4422
4440
|
if (e.key === "Escape" && open) {
|
|
@@ -4426,7 +4444,7 @@ var Sheet = ({
|
|
|
4426
4444
|
document.addEventListener("keydown", handleEscape);
|
|
4427
4445
|
return () => document.removeEventListener("keydown", handleEscape);
|
|
4428
4446
|
}, [open, closeOnEscape, onOpenChange]);
|
|
4429
|
-
|
|
4447
|
+
React16.useEffect(() => {
|
|
4430
4448
|
if (open) {
|
|
4431
4449
|
document.body.style.overflow = "hidden";
|
|
4432
4450
|
} else {
|
|
@@ -4436,7 +4454,7 @@ var Sheet = ({
|
|
|
4436
4454
|
document.body.style.overflow = "unset";
|
|
4437
4455
|
};
|
|
4438
4456
|
}, [open]);
|
|
4439
|
-
|
|
4457
|
+
React16.useEffect(() => {
|
|
4440
4458
|
if (open) {
|
|
4441
4459
|
setIsVisible(true);
|
|
4442
4460
|
setIsAnimating(true);
|
|
@@ -4623,7 +4641,7 @@ var Alert = ({ title, description, variant = "default", className, icon, dismiss
|
|
|
4623
4641
|
var Alert_default = Alert;
|
|
4624
4642
|
|
|
4625
4643
|
// src/components/GlobalLoading.tsx
|
|
4626
|
-
import
|
|
4644
|
+
import React17, { useEffect as useEffect6, useState as useState12 } from "react";
|
|
4627
4645
|
import { Activity as Activity2 } from "lucide-react";
|
|
4628
4646
|
|
|
4629
4647
|
// src/utils/loading.ts
|
|
@@ -4728,7 +4746,7 @@ var InlineLoading = ({ isLoading, text, className, size = "md" }) => {
|
|
|
4728
4746
|
] });
|
|
4729
4747
|
};
|
|
4730
4748
|
var ButtonLoading = ({ isLoading, children, className, disabled, loadingText }) => {
|
|
4731
|
-
const child =
|
|
4749
|
+
const child = React17.isValidElement(children) ? React17.cloneElement(children, {
|
|
4732
4750
|
disabled: (children.props?.disabled ?? false) || disabled || isLoading,
|
|
4733
4751
|
"aria-busy": isLoading || void 0
|
|
4734
4752
|
}) : children;
|
|
@@ -4742,7 +4760,7 @@ var ButtonLoading = ({ isLoading, children, className, disabled, loadingText })
|
|
|
4742
4760
|
};
|
|
4743
4761
|
|
|
4744
4762
|
// src/components/Breadcrumb.tsx
|
|
4745
|
-
import * as
|
|
4763
|
+
import * as React18 from "react";
|
|
4746
4764
|
import { ChevronRight, Home, MoreHorizontal } from "lucide-react";
|
|
4747
4765
|
import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
4748
4766
|
var NextLink = null;
|
|
@@ -4789,8 +4807,8 @@ var Breadcrumb = ({
|
|
|
4789
4807
|
homeHref = "/",
|
|
4790
4808
|
collapsible = true
|
|
4791
4809
|
}) => {
|
|
4792
|
-
const [isCollapsed, setIsCollapsed] =
|
|
4793
|
-
|
|
4810
|
+
const [isCollapsed, setIsCollapsed] = React18.useState(false);
|
|
4811
|
+
React18.useEffect(() => {
|
|
4794
4812
|
if (collapsible && items.length > maxItems) {
|
|
4795
4813
|
setIsCollapsed(true);
|
|
4796
4814
|
}
|
|
@@ -4808,7 +4826,7 @@ var Breadcrumb = ({
|
|
|
4808
4826
|
const SeparatorComponent = separator;
|
|
4809
4827
|
return /* @__PURE__ */ jsx22(SeparatorComponent, { className: cn("text-muted-foreground", sizeStyles5[size].icon) });
|
|
4810
4828
|
};
|
|
4811
|
-
const processedItems =
|
|
4829
|
+
const processedItems = React18.useMemo(() => {
|
|
4812
4830
|
let finalItems = [...items];
|
|
4813
4831
|
if (showHome && finalItems[0]?.href !== homeHref) {
|
|
4814
4832
|
finalItems.unshift({
|
|
@@ -4881,7 +4899,7 @@ var Breadcrumb = ({
|
|
|
4881
4899
|
var Breadcrumb_default = Breadcrumb;
|
|
4882
4900
|
|
|
4883
4901
|
// src/components/Tab.tsx
|
|
4884
|
-
import * as
|
|
4902
|
+
import * as React19 from "react";
|
|
4885
4903
|
import { jsx as jsx23, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
4886
4904
|
var sizeStyles6 = {
|
|
4887
4905
|
sm: {
|
|
@@ -4946,10 +4964,10 @@ var Tabs = ({
|
|
|
4946
4964
|
noContentPadding = false,
|
|
4947
4965
|
animateContent = true
|
|
4948
4966
|
}) => {
|
|
4949
|
-
const [active, setActive] =
|
|
4950
|
-
const [underlineStyle, setUnderlineStyle] =
|
|
4951
|
-
const tabRefs =
|
|
4952
|
-
const baseId =
|
|
4967
|
+
const [active, setActive] = React19.useState(defaultValue || tabs[0]?.value);
|
|
4968
|
+
const [underlineStyle, setUnderlineStyle] = React19.useState({});
|
|
4969
|
+
const tabRefs = React19.useRef([]);
|
|
4970
|
+
const baseId = React19.useMemo(() => {
|
|
4953
4971
|
const key = tabs.map((t) => t.value).join("-");
|
|
4954
4972
|
return `tabs-${key || "default"}`;
|
|
4955
4973
|
}, [tabs]);
|
|
@@ -4957,7 +4975,7 @@ var Tabs = ({
|
|
|
4957
4975
|
setActive(value);
|
|
4958
4976
|
onTabChange?.(value);
|
|
4959
4977
|
};
|
|
4960
|
-
|
|
4978
|
+
React19.useEffect(() => {
|
|
4961
4979
|
if (variant === "underline" && orientation === "horizontal") {
|
|
4962
4980
|
const activeIndex2 = tabs.findIndex((tab) => tab.value === active);
|
|
4963
4981
|
const activeTab2 = tabRefs.current[activeIndex2];
|
|
@@ -5078,7 +5096,7 @@ var VerticalTabs = ({ sidebarWidth = "w-48", className, ...props }) => {
|
|
|
5078
5096
|
};
|
|
5079
5097
|
|
|
5080
5098
|
// src/components/DropdownMenu.tsx
|
|
5081
|
-
import
|
|
5099
|
+
import React20, { useState as useState15 } from "react";
|
|
5082
5100
|
import { jsx as jsx24, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
5083
5101
|
var DropdownMenu = ({
|
|
5084
5102
|
trigger,
|
|
@@ -5093,17 +5111,17 @@ var DropdownMenu = ({
|
|
|
5093
5111
|
items
|
|
5094
5112
|
}) => {
|
|
5095
5113
|
const [internalOpen, setInternalOpen] = useState15(false);
|
|
5096
|
-
const triggerRef =
|
|
5097
|
-
const menuRef =
|
|
5098
|
-
const itemsRef =
|
|
5114
|
+
const triggerRef = React20.useRef(null);
|
|
5115
|
+
const menuRef = React20.useRef(null);
|
|
5116
|
+
const itemsRef = React20.useRef([]);
|
|
5099
5117
|
const [activeIndex, setActiveIndex] = useState15(-1);
|
|
5100
5118
|
useShadCNAnimations();
|
|
5101
5119
|
const open = isOpen !== void 0 ? isOpen : internalOpen;
|
|
5102
5120
|
const setOpen = onOpenChange || setInternalOpen;
|
|
5103
|
-
|
|
5121
|
+
React20.useEffect(() => {
|
|
5104
5122
|
if (open) setActiveIndex(-1);
|
|
5105
5123
|
}, [open]);
|
|
5106
|
-
|
|
5124
|
+
React20.useEffect(() => {
|
|
5107
5125
|
if (!open) return;
|
|
5108
5126
|
const handleKeyNav = (e) => {
|
|
5109
5127
|
const active = document.activeElement;
|
|
@@ -5177,7 +5195,7 @@ var DropdownMenu = ({
|
|
|
5177
5195
|
index
|
|
5178
5196
|
);
|
|
5179
5197
|
}) : children });
|
|
5180
|
-
const enhancedTrigger =
|
|
5198
|
+
const enhancedTrigger = React20.cloneElement(trigger, {
|
|
5181
5199
|
ref: triggerRef,
|
|
5182
5200
|
"aria-haspopup": "menu",
|
|
5183
5201
|
"aria-expanded": open,
|
|
@@ -5286,11 +5304,11 @@ var SelectDropdown = ({ options, value, onChange, placeholder = "Select...", cla
|
|
|
5286
5304
|
var DropdownMenu_default = DropdownMenu;
|
|
5287
5305
|
|
|
5288
5306
|
// src/components/Pagination.tsx
|
|
5289
|
-
import * as
|
|
5307
|
+
import * as React23 from "react";
|
|
5290
5308
|
import { ChevronLeft, ChevronRight as ChevronRight2, ChevronsLeft, ChevronsRight } from "lucide-react";
|
|
5291
5309
|
|
|
5292
5310
|
// src/components/Combobox.tsx
|
|
5293
|
-
import * as
|
|
5311
|
+
import * as React22 from "react";
|
|
5294
5312
|
import { useId as useId3 } from "react";
|
|
5295
5313
|
import { ChevronDown, Search as Search3, SearchX, Check as Check3, X as X8 } from "lucide-react";
|
|
5296
5314
|
|
|
@@ -5593,23 +5611,23 @@ var Combobox = ({
|
|
|
5593
5611
|
helperText,
|
|
5594
5612
|
useOverlayScrollbar = false
|
|
5595
5613
|
}) => {
|
|
5596
|
-
const [open, setOpen] =
|
|
5597
|
-
const [query, setQuery] =
|
|
5598
|
-
const [activeIndex, setActiveIndex] =
|
|
5614
|
+
const [open, setOpen] = React22.useState(false);
|
|
5615
|
+
const [query, setQuery] = React22.useState("");
|
|
5616
|
+
const [activeIndex, setActiveIndex] = React22.useState(null);
|
|
5599
5617
|
useShadCNAnimations();
|
|
5600
|
-
const listRef =
|
|
5601
|
-
const inputRef =
|
|
5602
|
-
const optionsViewportRef =
|
|
5618
|
+
const listRef = React22.useRef([]);
|
|
5619
|
+
const inputRef = React22.useRef(null);
|
|
5620
|
+
const optionsViewportRef = React22.useRef(null);
|
|
5603
5621
|
useOverlayScrollbarTarget(optionsViewportRef, { enabled: useOverlayScrollbar });
|
|
5604
5622
|
const autoId = useId3();
|
|
5605
5623
|
const resolvedId = id ? String(id) : `combobox-${autoId}`;
|
|
5606
5624
|
const labelId = label ? `${resolvedId}-label` : void 0;
|
|
5607
5625
|
const enableSearch = options.length > 10;
|
|
5608
|
-
const filteredOptions =
|
|
5626
|
+
const filteredOptions = React22.useMemo(
|
|
5609
5627
|
() => enableSearch ? options.filter((o) => getOptionLabel(o).toLowerCase().includes(query.trim().toLowerCase())) : options,
|
|
5610
5628
|
[options, query, enableSearch]
|
|
5611
5629
|
);
|
|
5612
|
-
const triggerRef =
|
|
5630
|
+
const triggerRef = React22.useRef(null);
|
|
5613
5631
|
const handleSelect = (option) => {
|
|
5614
5632
|
if (getOptionDisabled(option)) return;
|
|
5615
5633
|
const val = getOptionValue(option);
|
|
@@ -5624,7 +5642,7 @@ var Combobox = ({
|
|
|
5624
5642
|
onChange(null);
|
|
5625
5643
|
setOpen(false);
|
|
5626
5644
|
};
|
|
5627
|
-
|
|
5645
|
+
React22.useEffect(() => {
|
|
5628
5646
|
if (!open) {
|
|
5629
5647
|
setQuery("");
|
|
5630
5648
|
setActiveIndex(null);
|
|
@@ -5637,7 +5655,7 @@ var Combobox = ({
|
|
|
5637
5655
|
const selectedOption = findOptionByValue(options, value);
|
|
5638
5656
|
const displayValue = selectedOption ? getOptionLabel(selectedOption) : "";
|
|
5639
5657
|
const selectedIcon = selectedOption ? getOptionIcon(selectedOption) : void 0;
|
|
5640
|
-
const groupedOptions =
|
|
5658
|
+
const groupedOptions = React22.useMemo(() => {
|
|
5641
5659
|
if (!groupBy) return null;
|
|
5642
5660
|
const groups = {};
|
|
5643
5661
|
filteredOptions.forEach((opt) => {
|
|
@@ -5983,7 +6001,7 @@ var Pagination = ({
|
|
|
5983
6001
|
labels
|
|
5984
6002
|
}) => {
|
|
5985
6003
|
const t = useSmartTranslations("Pagination");
|
|
5986
|
-
|
|
6004
|
+
React23.useEffect(() => {
|
|
5987
6005
|
if (disabled) return;
|
|
5988
6006
|
const handleKey = (e) => {
|
|
5989
6007
|
if (e.target && e.target.tagName === "INPUT") return;
|
|
@@ -6286,17 +6304,17 @@ var CompactPagination = ({ page, totalPages, onChange, className, disabled = fal
|
|
|
6286
6304
|
};
|
|
6287
6305
|
|
|
6288
6306
|
// src/components/Section.tsx
|
|
6289
|
-
import
|
|
6307
|
+
import React24 from "react";
|
|
6290
6308
|
import { jsx as jsx28 } from "react/jsx-runtime";
|
|
6291
6309
|
var gradientDirectionMap = {
|
|
6292
|
-
"to-r": "
|
|
6293
|
-
"to-l": "
|
|
6294
|
-
"to-b": "
|
|
6295
|
-
"to-t": "
|
|
6296
|
-
"to-br": "
|
|
6297
|
-
"to-bl": "
|
|
6298
|
-
"to-tr": "
|
|
6299
|
-
"to-tl": "
|
|
6310
|
+
"to-r": "to right",
|
|
6311
|
+
"to-l": "to left",
|
|
6312
|
+
"to-b": "to bottom",
|
|
6313
|
+
"to-t": "to top",
|
|
6314
|
+
"to-br": "to bottom right",
|
|
6315
|
+
"to-bl": "to bottom left",
|
|
6316
|
+
"to-tr": "to top right",
|
|
6317
|
+
"to-tl": "to top left"
|
|
6300
6318
|
};
|
|
6301
6319
|
var spacingClasses = {
|
|
6302
6320
|
none: "",
|
|
@@ -6307,50 +6325,50 @@ var spacingClasses = {
|
|
|
6307
6325
|
};
|
|
6308
6326
|
var paddingXClasses = {
|
|
6309
6327
|
none: "",
|
|
6310
|
-
sm: "px-
|
|
6328
|
+
sm: "px-3 md:px-4",
|
|
6311
6329
|
md: "px-4 md:px-6",
|
|
6312
|
-
lg: "px-
|
|
6313
|
-
xl: "px-
|
|
6330
|
+
lg: "px-5 md:px-8",
|
|
6331
|
+
xl: "px-6 md:px-12"
|
|
6314
6332
|
};
|
|
6315
|
-
var
|
|
6333
|
+
var variantClasses = {
|
|
6334
|
+
default: "bg-background",
|
|
6335
|
+
muted: "bg-muted/30",
|
|
6336
|
+
primary: "bg-primary/5",
|
|
6337
|
+
accent: "bg-accent/10",
|
|
6338
|
+
gradient: ""
|
|
6339
|
+
};
|
|
6340
|
+
var Section = React24.forwardRef(
|
|
6316
6341
|
({
|
|
6317
6342
|
children,
|
|
6318
6343
|
className,
|
|
6344
|
+
as: Tag = "section",
|
|
6319
6345
|
variant = "default",
|
|
6320
6346
|
spacing = "none",
|
|
6321
6347
|
paddingX = "none",
|
|
6322
6348
|
contained = false,
|
|
6349
|
+
containerClassName,
|
|
6323
6350
|
outlined = false,
|
|
6324
|
-
gradientFrom = "
|
|
6325
|
-
gradientTo = "
|
|
6351
|
+
gradientFrom = "oklch(0.7 0.15 280 / 20%)",
|
|
6352
|
+
gradientTo = "oklch(0.7 0.2 200 / 20%)",
|
|
6326
6353
|
gradientDirection = "to-br",
|
|
6354
|
+
style,
|
|
6327
6355
|
...props
|
|
6328
6356
|
}, ref) => {
|
|
6329
|
-
const
|
|
6330
|
-
default: "bg-background",
|
|
6331
|
-
muted: "bg-muted/30",
|
|
6332
|
-
primary: "bg-primary/5",
|
|
6333
|
-
accent: "bg-accent/10",
|
|
6334
|
-
gradient: ""
|
|
6335
|
-
};
|
|
6336
|
-
const getGradientClasses = () => {
|
|
6337
|
-
if (variant !== "gradient") return "";
|
|
6338
|
-
return cn(gradientDirectionMap[gradientDirection], gradientFrom, gradientTo);
|
|
6339
|
-
};
|
|
6357
|
+
const gradientStyle = variant === "gradient" ? { backgroundImage: `linear-gradient(${gradientDirectionMap[gradientDirection]}, ${gradientFrom}, ${gradientTo})` } : {};
|
|
6340
6358
|
return /* @__PURE__ */ jsx28(
|
|
6341
|
-
|
|
6359
|
+
Tag,
|
|
6342
6360
|
{
|
|
6343
6361
|
ref,
|
|
6344
6362
|
className: cn(
|
|
6345
|
-
variant
|
|
6363
|
+
variant !== "gradient" && variantClasses[variant],
|
|
6346
6364
|
spacingClasses[spacing],
|
|
6347
|
-
paddingXClasses[paddingX],
|
|
6365
|
+
!contained && paddingXClasses[paddingX],
|
|
6348
6366
|
outlined && "rounded-2xl md:rounded-3xl border border-border/60 max-md:rounded-xl",
|
|
6349
|
-
contained && "container mx-auto",
|
|
6350
6367
|
className
|
|
6351
6368
|
),
|
|
6369
|
+
style: { ...gradientStyle, ...style },
|
|
6352
6370
|
...props,
|
|
6353
|
-
children
|
|
6371
|
+
children: contained ? /* @__PURE__ */ jsx28("div", { className: cn("container mx-auto", paddingXClasses[paddingX], containerClassName), children }) : children
|
|
6354
6372
|
}
|
|
6355
6373
|
);
|
|
6356
6374
|
}
|
|
@@ -6361,7 +6379,7 @@ var Section_default = Section;
|
|
|
6361
6379
|
// src/components/ScrollArea.tsx
|
|
6362
6380
|
import { forwardRef as forwardRef6, useRef as useRef9 } from "react";
|
|
6363
6381
|
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
6364
|
-
var
|
|
6382
|
+
var variantClasses2 = {
|
|
6365
6383
|
default: "bg-background",
|
|
6366
6384
|
muted: "bg-muted/30",
|
|
6367
6385
|
primary: "bg-primary/5",
|
|
@@ -6377,7 +6395,7 @@ var ScrollArea = forwardRef6(
|
|
|
6377
6395
|
ref,
|
|
6378
6396
|
className: cn(
|
|
6379
6397
|
"relative overflow-hidden rounded-2xl md:rounded-3xl",
|
|
6380
|
-
|
|
6398
|
+
variantClasses2[variant],
|
|
6381
6399
|
outlined && "border border-border/60",
|
|
6382
6400
|
className
|
|
6383
6401
|
),
|
|
@@ -6628,7 +6646,7 @@ function formatDateSmart(date, locale = "en") {
|
|
|
6628
6646
|
|
|
6629
6647
|
// src/components/DatePicker.tsx
|
|
6630
6648
|
import { Calendar, ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight3, Sparkles as Sparkles2, X as XIcon } from "lucide-react";
|
|
6631
|
-
import * as
|
|
6649
|
+
import * as React26 from "react";
|
|
6632
6650
|
import { useId as useId4 } from "react";
|
|
6633
6651
|
import { Fragment as Fragment6, jsx as jsx31, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
6634
6652
|
var DatePicker = ({
|
|
@@ -6651,19 +6669,19 @@ var DatePicker = ({
|
|
|
6651
6669
|
}) => {
|
|
6652
6670
|
const t = useSmartTranslations("DatePicker");
|
|
6653
6671
|
const locale = useSmartLocale();
|
|
6654
|
-
const [isOpen, setIsOpen] =
|
|
6655
|
-
const [viewDate, setViewDate] =
|
|
6656
|
-
const [viewMode, setViewMode] =
|
|
6657
|
-
const triggerRef =
|
|
6658
|
-
const wheelContainerRef =
|
|
6659
|
-
const wheelDeltaRef =
|
|
6660
|
-
const normalizeToLocalDay =
|
|
6672
|
+
const [isOpen, setIsOpen] = React26.useState(false);
|
|
6673
|
+
const [viewDate, setViewDate] = React26.useState(value || /* @__PURE__ */ new Date());
|
|
6674
|
+
const [viewMode, setViewMode] = React26.useState("calendar");
|
|
6675
|
+
const triggerRef = React26.useRef(null);
|
|
6676
|
+
const wheelContainerRef = React26.useRef(null);
|
|
6677
|
+
const wheelDeltaRef = React26.useRef(0);
|
|
6678
|
+
const normalizeToLocalDay = React26.useCallback((date) => {
|
|
6661
6679
|
if (!date) return null;
|
|
6662
6680
|
return new Date(date.getFullYear(), date.getMonth(), date.getDate());
|
|
6663
6681
|
}, []);
|
|
6664
|
-
const minDay =
|
|
6665
|
-
const maxDay =
|
|
6666
|
-
const isDateDisabled =
|
|
6682
|
+
const minDay = React26.useMemo(() => normalizeToLocalDay(minDate), [minDate, normalizeToLocalDay]);
|
|
6683
|
+
const maxDay = React26.useMemo(() => normalizeToLocalDay(maxDate), [maxDate, normalizeToLocalDay]);
|
|
6684
|
+
const isDateDisabled = React26.useCallback(
|
|
6667
6685
|
(date) => {
|
|
6668
6686
|
const day = normalizeToLocalDay(date);
|
|
6669
6687
|
if (!day) return false;
|
|
@@ -6732,14 +6750,14 @@ var DatePicker = ({
|
|
|
6732
6750
|
footerMargin: "mt-5 pt-4 gap-2.5"
|
|
6733
6751
|
}
|
|
6734
6752
|
};
|
|
6735
|
-
|
|
6753
|
+
React26.useEffect(() => {
|
|
6736
6754
|
if (value) {
|
|
6737
6755
|
setViewDate(value);
|
|
6738
6756
|
} else {
|
|
6739
6757
|
setViewDate(/* @__PURE__ */ new Date());
|
|
6740
6758
|
}
|
|
6741
6759
|
}, [value]);
|
|
6742
|
-
|
|
6760
|
+
React26.useEffect(() => {
|
|
6743
6761
|
if (!isOpen) {
|
|
6744
6762
|
setViewMode("calendar");
|
|
6745
6763
|
}
|
|
@@ -6768,7 +6786,7 @@ var DatePicker = ({
|
|
|
6768
6786
|
const getFirstDayOfMonth = (date) => {
|
|
6769
6787
|
return new Date(date.getFullYear(), date.getMonth(), 1).getDay();
|
|
6770
6788
|
};
|
|
6771
|
-
const navigateMonth =
|
|
6789
|
+
const navigateMonth = React26.useCallback((direction) => {
|
|
6772
6790
|
setViewDate((prev) => {
|
|
6773
6791
|
const newDate = new Date(prev);
|
|
6774
6792
|
newDate.setMonth(prev.getMonth() + (direction === "next" ? 1 : -1));
|
|
@@ -6782,7 +6800,7 @@ var DatePicker = ({
|
|
|
6782
6800
|
const node = el;
|
|
6783
6801
|
return node.scrollHeight > node.clientHeight + 1;
|
|
6784
6802
|
};
|
|
6785
|
-
|
|
6803
|
+
React26.useEffect(() => {
|
|
6786
6804
|
if (!isOpen) return;
|
|
6787
6805
|
const container = wheelContainerRef.current;
|
|
6788
6806
|
if (!container) return;
|
|
@@ -7158,9 +7176,9 @@ var DatePicker = ({
|
|
|
7158
7176
|
var DateRangePicker = ({ startDate, endDate, onChange, placeholder = "Select date range...", className, disablePastDates = false, minDate, maxDate, size = "md" }) => {
|
|
7159
7177
|
const locale = useSmartLocale();
|
|
7160
7178
|
const t = useSmartTranslations("DatePicker");
|
|
7161
|
-
const [isOpen, setIsOpen] =
|
|
7162
|
-
const wheelContainerRef =
|
|
7163
|
-
const wheelDeltaRef =
|
|
7179
|
+
const [isOpen, setIsOpen] = React26.useState(false);
|
|
7180
|
+
const wheelContainerRef = React26.useRef(null);
|
|
7181
|
+
const wheelDeltaRef = React26.useRef(0);
|
|
7164
7182
|
const sizeStyles8 = {
|
|
7165
7183
|
sm: {
|
|
7166
7184
|
trigger: "px-2.5 py-1.5 text-sm h-8 md:h-7 md:text-xs md:py-1",
|
|
@@ -7218,16 +7236,16 @@ var DateRangePicker = ({ startDate, endDate, onChange, placeholder = "Select dat
|
|
|
7218
7236
|
if (!date) return null;
|
|
7219
7237
|
return new Date(date.getFullYear(), date.getMonth(), date.getDate());
|
|
7220
7238
|
};
|
|
7221
|
-
const minDay =
|
|
7222
|
-
const maxDay =
|
|
7223
|
-
const [viewDate, setViewDate] =
|
|
7224
|
-
const [tempStart, setTempStart] =
|
|
7225
|
-
const [tempEnd, setTempEnd] =
|
|
7226
|
-
const [hoveredDate, setHoveredDate] =
|
|
7227
|
-
|
|
7239
|
+
const minDay = React26.useMemo(() => normalizeToLocal(minDate), [minDate]);
|
|
7240
|
+
const maxDay = React26.useMemo(() => normalizeToLocal(maxDate), [maxDate]);
|
|
7241
|
+
const [viewDate, setViewDate] = React26.useState(startDate || /* @__PURE__ */ new Date());
|
|
7242
|
+
const [tempStart, setTempStart] = React26.useState(normalizeToLocal(startDate));
|
|
7243
|
+
const [tempEnd, setTempEnd] = React26.useState(normalizeToLocal(endDate));
|
|
7244
|
+
const [hoveredDate, setHoveredDate] = React26.useState(null);
|
|
7245
|
+
React26.useEffect(() => {
|
|
7228
7246
|
setTempStart(normalizeToLocal(startDate));
|
|
7229
7247
|
}, [startDate]);
|
|
7230
|
-
|
|
7248
|
+
React26.useEffect(() => {
|
|
7231
7249
|
setTempEnd(normalizeToLocal(endDate));
|
|
7232
7250
|
}, [endDate]);
|
|
7233
7251
|
const isSameDay2 = (a, b) => {
|
|
@@ -7237,7 +7255,7 @@ var DateRangePicker = ({ startDate, endDate, onChange, placeholder = "Select dat
|
|
|
7237
7255
|
const inRange = (d, s, e) => d > s && d < e;
|
|
7238
7256
|
const getDaysInMonth = (d) => new Date(d.getFullYear(), d.getMonth() + 1, 0).getDate();
|
|
7239
7257
|
const getFirstDayOfMonth = (d) => new Date(d.getFullYear(), d.getMonth(), 1).getDay();
|
|
7240
|
-
const navigateMonth =
|
|
7258
|
+
const navigateMonth = React26.useCallback((direction) => {
|
|
7241
7259
|
setViewDate((prev) => new Date(prev.getFullYear(), prev.getMonth() + (direction === "next" ? 1 : -1), 1));
|
|
7242
7260
|
}, []);
|
|
7243
7261
|
const isElementVerticallyScrollable = (el) => {
|
|
@@ -7247,7 +7265,7 @@ var DateRangePicker = ({ startDate, endDate, onChange, placeholder = "Select dat
|
|
|
7247
7265
|
const node = el;
|
|
7248
7266
|
return node.scrollHeight > node.clientHeight + 1;
|
|
7249
7267
|
};
|
|
7250
|
-
|
|
7268
|
+
React26.useEffect(() => {
|
|
7251
7269
|
if (!isOpen) return;
|
|
7252
7270
|
const container = wheelContainerRef.current;
|
|
7253
7271
|
if (!container) return;
|
|
@@ -7485,15 +7503,15 @@ var CompactDatePicker = ({ value, onChange, className }) => {
|
|
|
7485
7503
|
};
|
|
7486
7504
|
|
|
7487
7505
|
// src/components/DateTimePicker.tsx
|
|
7488
|
-
import * as
|
|
7506
|
+
import * as React30 from "react";
|
|
7489
7507
|
import { Calendar as CalendarIcon, X as X11 } from "lucide-react";
|
|
7490
7508
|
|
|
7491
7509
|
// src/components/Calendar.tsx
|
|
7492
7510
|
import { ChevronLeft as ChevronLeft3, ChevronRight as ChevronRight4 } from "lucide-react";
|
|
7493
|
-
import * as
|
|
7511
|
+
import * as React28 from "react";
|
|
7494
7512
|
|
|
7495
7513
|
// src/components/MonthYearPicker.tsx
|
|
7496
|
-
import * as
|
|
7514
|
+
import * as React27 from "react";
|
|
7497
7515
|
import { Calendar as Calendar2, X as X9, Check as Check4, ChevronDown as ChevronDown2 } from "lucide-react";
|
|
7498
7516
|
import { jsx as jsx32, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
7499
7517
|
var DEFAULT_MONTH_NAMES = [
|
|
@@ -7536,20 +7554,20 @@ function WheelColumn({
|
|
|
7536
7554
|
}) {
|
|
7537
7555
|
const height = itemHeight * WHEEL_VISIBLE_ITEMS;
|
|
7538
7556
|
const paddingY = (height - itemHeight) / 2;
|
|
7539
|
-
const rafRef =
|
|
7540
|
-
const lastVirtualIndexRef =
|
|
7541
|
-
const wheelDeltaRef =
|
|
7542
|
-
const scrollEndTimeoutRef =
|
|
7543
|
-
const suppressScrollSelectUntilRef =
|
|
7544
|
-
const suppressItemClickUntilRef =
|
|
7545
|
-
const dragRef =
|
|
7546
|
-
const draggingRef =
|
|
7547
|
-
const inertialRef =
|
|
7548
|
-
const inertiaRafRef =
|
|
7549
|
-
const inertiaVelocityRef =
|
|
7550
|
-
const inertiaLastTimeRef =
|
|
7551
|
-
const moveSamplesRef =
|
|
7552
|
-
const ui =
|
|
7557
|
+
const rafRef = React27.useRef(0);
|
|
7558
|
+
const lastVirtualIndexRef = React27.useRef(null);
|
|
7559
|
+
const wheelDeltaRef = React27.useRef(0);
|
|
7560
|
+
const scrollEndTimeoutRef = React27.useRef(null);
|
|
7561
|
+
const suppressScrollSelectUntilRef = React27.useRef(0);
|
|
7562
|
+
const suppressItemClickUntilRef = React27.useRef(0);
|
|
7563
|
+
const dragRef = React27.useRef(null);
|
|
7564
|
+
const draggingRef = React27.useRef(false);
|
|
7565
|
+
const inertialRef = React27.useRef(false);
|
|
7566
|
+
const inertiaRafRef = React27.useRef(null);
|
|
7567
|
+
const inertiaVelocityRef = React27.useRef(0);
|
|
7568
|
+
const inertiaLastTimeRef = React27.useRef(0);
|
|
7569
|
+
const moveSamplesRef = React27.useRef([]);
|
|
7570
|
+
const ui = React27.useMemo(() => {
|
|
7553
7571
|
if (size === "sm") {
|
|
7554
7572
|
return {
|
|
7555
7573
|
columnWidth: column === "month" ? "min-w-24 max-w-32" : "min-w-16 max-w-20",
|
|
@@ -7576,9 +7594,9 @@ function WheelColumn({
|
|
|
7576
7594
|
fadeHeight: "h-12"
|
|
7577
7595
|
};
|
|
7578
7596
|
}, [size, column]);
|
|
7579
|
-
const baseOffset =
|
|
7580
|
-
const extendedItems =
|
|
7581
|
-
const getNearestVirtualIndex =
|
|
7597
|
+
const baseOffset = React27.useMemo(() => loop ? items.length : 0, [items.length, loop]);
|
|
7598
|
+
const extendedItems = React27.useMemo(() => loop ? [...items, ...items, ...items] : items, [items, loop]);
|
|
7599
|
+
const getNearestVirtualIndex = React27.useCallback(
|
|
7582
7600
|
(realIndex, fromVirtual) => {
|
|
7583
7601
|
const len = items.length;
|
|
7584
7602
|
if (len <= 0) return 0;
|
|
@@ -7597,7 +7615,7 @@ function WheelColumn({
|
|
|
7597
7615
|
},
|
|
7598
7616
|
[items.length, loop]
|
|
7599
7617
|
);
|
|
7600
|
-
|
|
7618
|
+
React27.useLayoutEffect(() => {
|
|
7601
7619
|
const el = scrollRef.current;
|
|
7602
7620
|
if (!el) return;
|
|
7603
7621
|
const maxVirtual = Math.max(0, extendedItems.length - 1);
|
|
@@ -7625,7 +7643,7 @@ function WheelColumn({
|
|
|
7625
7643
|
cancelAnimationFrame(rafRef.current);
|
|
7626
7644
|
};
|
|
7627
7645
|
}, [animate, baseOffset, extendedItems.length, getNearestVirtualIndex, itemHeight, loop, scrollRef, valueIndex]);
|
|
7628
|
-
|
|
7646
|
+
React27.useEffect(() => {
|
|
7629
7647
|
const el = scrollRef.current;
|
|
7630
7648
|
if (!el) return;
|
|
7631
7649
|
const lastWheelSignRef = { current: 0 };
|
|
@@ -7713,13 +7731,13 @@ function WheelColumn({
|
|
|
7713
7731
|
}, 120);
|
|
7714
7732
|
});
|
|
7715
7733
|
};
|
|
7716
|
-
const currentVirtual =
|
|
7734
|
+
const currentVirtual = React27.useMemo(() => {
|
|
7717
7735
|
if (!loop || items.length <= 0) return valueIndex;
|
|
7718
7736
|
const fallback = baseOffset + valueIndex;
|
|
7719
7737
|
const from = lastVirtualIndexRef.current ?? fallback;
|
|
7720
7738
|
return getNearestVirtualIndex(valueIndex, from);
|
|
7721
7739
|
}, [baseOffset, getNearestVirtualIndex, items.length, loop, valueIndex]);
|
|
7722
|
-
const commitFromScrollTop =
|
|
7740
|
+
const commitFromScrollTop = React27.useCallback(
|
|
7723
7741
|
(behavior) => {
|
|
7724
7742
|
const el = scrollRef.current;
|
|
7725
7743
|
if (!el) return;
|
|
@@ -7797,7 +7815,7 @@ function WheelColumn({
|
|
|
7797
7815
|
if (dt > 0) inertiaVelocityRef.current = (el.scrollTop - oldest.top) / dt;
|
|
7798
7816
|
}
|
|
7799
7817
|
};
|
|
7800
|
-
const startInertia =
|
|
7818
|
+
const startInertia = React27.useCallback(() => {
|
|
7801
7819
|
const el = scrollRef.current;
|
|
7802
7820
|
if (!el) return;
|
|
7803
7821
|
if (items.length <= 0) return;
|
|
@@ -7988,22 +8006,22 @@ function MonthYearPicker({
|
|
|
7988
8006
|
};
|
|
7989
8007
|
const isControlled = value !== void 0;
|
|
7990
8008
|
const initial = parseValue(isControlled ? value : defaultValue) ?? { month: now.getMonth(), year: currentYear };
|
|
7991
|
-
const [open, setOpen] =
|
|
7992
|
-
const [parts, setParts] =
|
|
7993
|
-
const [focusedColumn, setFocusedColumn] =
|
|
7994
|
-
const monthScrollRef =
|
|
7995
|
-
const yearScrollRef =
|
|
7996
|
-
|
|
8009
|
+
const [open, setOpen] = React27.useState(false);
|
|
8010
|
+
const [parts, setParts] = React27.useState(initial);
|
|
8011
|
+
const [focusedColumn, setFocusedColumn] = React27.useState(null);
|
|
8012
|
+
const monthScrollRef = React27.useRef(null);
|
|
8013
|
+
const yearScrollRef = React27.useRef(null);
|
|
8014
|
+
React27.useEffect(() => {
|
|
7997
8015
|
if (isControlled) {
|
|
7998
8016
|
const parsed = parseValue(value);
|
|
7999
8017
|
if (parsed) setParts(parsed);
|
|
8000
8018
|
}
|
|
8001
8019
|
}, [value, isControlled]);
|
|
8002
|
-
const years =
|
|
8020
|
+
const years = React27.useMemo(() => {
|
|
8003
8021
|
return Array.from({ length: resolvedMaxYear - resolvedMinYear + 1 }, (_, i) => resolvedMinYear + i);
|
|
8004
8022
|
}, [resolvedMinYear, resolvedMaxYear]);
|
|
8005
|
-
const months =
|
|
8006
|
-
const isDateInRange =
|
|
8023
|
+
const months = React27.useMemo(() => Array.from({ length: 12 }, (_, i) => i), []);
|
|
8024
|
+
const isDateInRange = React27.useCallback(
|
|
8007
8025
|
(month, year) => {
|
|
8008
8026
|
if (minDate) {
|
|
8009
8027
|
const minMonth = minDate.getMonth();
|
|
@@ -8019,7 +8037,7 @@ function MonthYearPicker({
|
|
|
8019
8037
|
},
|
|
8020
8038
|
[minDate, maxDate]
|
|
8021
8039
|
);
|
|
8022
|
-
const emit =
|
|
8040
|
+
const emit = React27.useCallback(
|
|
8023
8041
|
(next) => {
|
|
8024
8042
|
if (!next) {
|
|
8025
8043
|
onChange?.(void 0);
|
|
@@ -8031,7 +8049,7 @@ function MonthYearPicker({
|
|
|
8031
8049
|
},
|
|
8032
8050
|
[isDateInRange, onChange]
|
|
8033
8051
|
);
|
|
8034
|
-
const tryUpdate =
|
|
8052
|
+
const tryUpdate = React27.useCallback(
|
|
8035
8053
|
(next) => {
|
|
8036
8054
|
if (!isDateInRange(next.month, next.year)) return false;
|
|
8037
8055
|
setParts(next);
|
|
@@ -8422,12 +8440,12 @@ function Calendar3({
|
|
|
8422
8440
|
...rest
|
|
8423
8441
|
}) {
|
|
8424
8442
|
const isControlledMonth = month != null;
|
|
8425
|
-
const [view, setView] =
|
|
8426
|
-
|
|
8443
|
+
const [view, setView] = React28.useState(() => month ?? defaultMonth ?? /* @__PURE__ */ new Date());
|
|
8444
|
+
React28.useEffect(() => {
|
|
8427
8445
|
if (isControlledMonth && month) setView(month);
|
|
8428
8446
|
}, [isControlledMonth, month]);
|
|
8429
8447
|
const isControlledValue = value !== void 0;
|
|
8430
|
-
const [internal, setInternal] =
|
|
8448
|
+
const [internal, setInternal] = React28.useState(defaultValue);
|
|
8431
8449
|
const selected = isControlledValue ? value : internal;
|
|
8432
8450
|
const goByView = (delta) => {
|
|
8433
8451
|
const next = display === "week" ? addDays(view, delta * 7) : addMonths(view, delta);
|
|
@@ -8439,7 +8457,7 @@ function Calendar3({
|
|
|
8439
8457
|
const weekdays = rotate(weekNames, weekStartsOn);
|
|
8440
8458
|
const days = getMonthGrid(view, weekStartsOn);
|
|
8441
8459
|
const today = /* @__PURE__ */ new Date();
|
|
8442
|
-
const byDay =
|
|
8460
|
+
const byDay = React28.useMemo(() => {
|
|
8443
8461
|
const map = /* @__PURE__ */ new Map();
|
|
8444
8462
|
for (const e of events) {
|
|
8445
8463
|
const d = toDate(e.date);
|
|
@@ -8451,11 +8469,11 @@ function Calendar3({
|
|
|
8451
8469
|
}, [events]);
|
|
8452
8470
|
const effectiveEnableEventSheet = enableEventSheet ?? !!renderEventSheet;
|
|
8453
8471
|
const isEventSheetOpenControlled = eventSheetOpen !== void 0;
|
|
8454
|
-
const [internalEventSheetOpen, setInternalEventSheetOpen] =
|
|
8472
|
+
const [internalEventSheetOpen, setInternalEventSheetOpen] = React28.useState(false);
|
|
8455
8473
|
const activeEventSheetOpen = isEventSheetOpenControlled ? !!eventSheetOpen : internalEventSheetOpen;
|
|
8456
8474
|
const isSelectedEventControlled = selectedEventId !== void 0;
|
|
8457
|
-
const [internalSelectedEventRef, setInternalSelectedEventRef] =
|
|
8458
|
-
const setEventSheetOpen =
|
|
8475
|
+
const [internalSelectedEventRef, setInternalSelectedEventRef] = React28.useState(null);
|
|
8476
|
+
const setEventSheetOpen = React28.useCallback(
|
|
8459
8477
|
(open) => {
|
|
8460
8478
|
if (!isEventSheetOpenControlled) setInternalEventSheetOpen(open);
|
|
8461
8479
|
onEventSheetOpenChange?.(open);
|
|
@@ -8466,7 +8484,7 @@ function Calendar3({
|
|
|
8466
8484
|
},
|
|
8467
8485
|
[isEventSheetOpenControlled, isSelectedEventControlled, onEventSheetOpenChange, onSelectedEventIdChange]
|
|
8468
8486
|
);
|
|
8469
|
-
const selectedEventRef =
|
|
8487
|
+
const selectedEventRef = React28.useMemo(() => {
|
|
8470
8488
|
if (isSelectedEventControlled && selectedEventId != null) {
|
|
8471
8489
|
const ev = events.find((e) => e.id === selectedEventId);
|
|
8472
8490
|
if (!ev) return null;
|
|
@@ -8476,7 +8494,7 @@ function Calendar3({
|
|
|
8476
8494
|
}
|
|
8477
8495
|
return internalSelectedEventRef;
|
|
8478
8496
|
}, [events, internalSelectedEventRef, isSelectedEventControlled, selectedEventId]);
|
|
8479
|
-
const selectedEvent =
|
|
8497
|
+
const selectedEvent = React28.useMemo(() => {
|
|
8480
8498
|
if (!selectedEventRef) return null;
|
|
8481
8499
|
const list = byDay.get(selectedEventRef.dayKey) || [];
|
|
8482
8500
|
if (selectedEventRef.eventId != null) {
|
|
@@ -8485,13 +8503,13 @@ function Calendar3({
|
|
|
8485
8503
|
const idx = selectedEventRef.index ?? -1;
|
|
8486
8504
|
return idx >= 0 && idx < list.length ? list[idx] : null;
|
|
8487
8505
|
}, [byDay, selectedEventRef]);
|
|
8488
|
-
const selectedEventDate =
|
|
8506
|
+
const selectedEventDate = React28.useMemo(() => {
|
|
8489
8507
|
if (!selectedEventRef) return null;
|
|
8490
8508
|
const [y, m, d] = selectedEventRef.dayKey.split("-").map((x) => Number(x));
|
|
8491
8509
|
if (!Number.isFinite(y) || !Number.isFinite(m) || !Number.isFinite(d)) return null;
|
|
8492
8510
|
return new Date(y, m, d);
|
|
8493
8511
|
}, [selectedEventRef]);
|
|
8494
|
-
const handleEventActivate =
|
|
8512
|
+
const handleEventActivate = React28.useCallback(
|
|
8495
8513
|
(event, date, dayKey, index) => {
|
|
8496
8514
|
onEventClick?.(event, date);
|
|
8497
8515
|
onSelectedEventIdChange?.(event.id ?? void 0);
|
|
@@ -8544,7 +8562,7 @@ function Calendar3({
|
|
|
8544
8562
|
}
|
|
8545
8563
|
}
|
|
8546
8564
|
};
|
|
8547
|
-
const isDateDisabled =
|
|
8565
|
+
const isDateDisabled = React28.useCallback(
|
|
8548
8566
|
(d) => {
|
|
8549
8567
|
if (minDate && d < new Date(minDate.getFullYear(), minDate.getMonth(), minDate.getDate())) return true;
|
|
8550
8568
|
if (maxDate && d > new Date(maxDate.getFullYear(), maxDate.getMonth(), maxDate.getDate())) return true;
|
|
@@ -8578,7 +8596,7 @@ function Calendar3({
|
|
|
8578
8596
|
card: "border border-border/50 rounded-3xl bg-linear-to-br from-card via-background/95 to-card shadow-lg hover:shadow-xl transition-shadow duration-300 backdrop-blur-md",
|
|
8579
8597
|
minimal: "bg-transparent"
|
|
8580
8598
|
};
|
|
8581
|
-
const weekDays =
|
|
8599
|
+
const weekDays = React28.useMemo(() => {
|
|
8582
8600
|
const s = startOfWeek(view, weekStartsOn);
|
|
8583
8601
|
return Array.from({ length: 7 }, (_, i) => addDays(s, i));
|
|
8584
8602
|
}, [view, weekStartsOn]);
|
|
@@ -8599,7 +8617,7 @@ function Calendar3({
|
|
|
8599
8617
|
const holidayMatch = isHoliday(d, holidays);
|
|
8600
8618
|
const isHolidayDay = highlightHolidays && !!holidayMatch;
|
|
8601
8619
|
const customDay = renderDay?.({ date: d, isCurrentMonth: inMonth, isToday: isToday2, isSelected: selectedDay, events: dayEvents });
|
|
8602
|
-
if (customDay) return /* @__PURE__ */ jsx33(
|
|
8620
|
+
if (customDay) return /* @__PURE__ */ jsx33(React28.Fragment, { children: customDay }, `${monthLabel}-${idx}`);
|
|
8603
8621
|
if (cellMode === "events") {
|
|
8604
8622
|
const limit = Math.max(0, maxEventsPerDay);
|
|
8605
8623
|
const visibleEvents = dayEvents.slice(0, limit);
|
|
@@ -8718,9 +8736,9 @@ function Calendar3({
|
|
|
8718
8736
|
}) })
|
|
8719
8737
|
] });
|
|
8720
8738
|
};
|
|
8721
|
-
const minBound =
|
|
8722
|
-
const maxBound =
|
|
8723
|
-
const prevDisabled =
|
|
8739
|
+
const minBound = React28.useMemo(() => minDate ? new Date(minDate.getFullYear(), minDate.getMonth(), minDate.getDate()) : void 0, [minDate]);
|
|
8740
|
+
const maxBound = React28.useMemo(() => maxDate ? new Date(maxDate.getFullYear(), maxDate.getMonth(), maxDate.getDate()) : void 0, [maxDate]);
|
|
8741
|
+
const prevDisabled = React28.useMemo(() => {
|
|
8724
8742
|
if (!minBound) return false;
|
|
8725
8743
|
if (display === "week") {
|
|
8726
8744
|
const start = startOfWeek(view, weekStartsOn);
|
|
@@ -8730,7 +8748,7 @@ function Calendar3({
|
|
|
8730
8748
|
const prevEnd = endOfMonth(addMonths(view, -1));
|
|
8731
8749
|
return prevEnd < minBound;
|
|
8732
8750
|
}, [display, view, weekStartsOn, minBound]);
|
|
8733
|
-
const nextDisabled =
|
|
8751
|
+
const nextDisabled = React28.useMemo(() => {
|
|
8734
8752
|
if (!maxBound) return false;
|
|
8735
8753
|
if (display === "week") {
|
|
8736
8754
|
const start = startOfWeek(view, weekStartsOn);
|
|
@@ -8807,7 +8825,7 @@ function Calendar3({
|
|
|
8807
8825
|
const holidayMatch = isHoliday(d, holidays);
|
|
8808
8826
|
const isHolidayDay = highlightHolidays && !!holidayMatch;
|
|
8809
8827
|
const customDay = renderDay?.({ date: d, isCurrentMonth: inMonth, isToday: isToday2, isSelected: selectedDay, events: dayEvents });
|
|
8810
|
-
if (customDay) return /* @__PURE__ */ jsx33(
|
|
8828
|
+
if (customDay) return /* @__PURE__ */ jsx33(React28.Fragment, { children: customDay }, `wd-${idx}`);
|
|
8811
8829
|
if (cellMode === "events") {
|
|
8812
8830
|
const limit = Math.max(0, maxEventsPerDay);
|
|
8813
8831
|
const visibleEvents = dayEvents.slice(0, limit);
|
|
@@ -8918,7 +8936,7 @@ function Calendar3({
|
|
|
8918
8936
|
`wd-${idx}`
|
|
8919
8937
|
);
|
|
8920
8938
|
}) })
|
|
8921
|
-
] }) : /* @__PURE__ */ jsx33("div", { className: cn(months > 1 ? "grid md:grid-cols-2 lg:grid-cols-3 gap-4" : ""), children: Array.from({ length: Math.max(1, months) }, (_, i) => /* @__PURE__ */ jsx33(
|
|
8939
|
+
] }) : /* @__PURE__ */ jsx33("div", { className: cn(months > 1 ? "grid md:grid-cols-2 lg:grid-cols-3 gap-4" : ""), children: Array.from({ length: Math.max(1, months) }, (_, i) => /* @__PURE__ */ jsx33(React28.Fragment, { children: renderMonth(addMonths(view, i)) }, `cal-month-${view.getFullYear()}-${view.getMonth()}-${i}`)) }),
|
|
8922
8940
|
effectiveEnableEventSheet && selectedEvent && selectedEventDate ? /* @__PURE__ */ jsx33(
|
|
8923
8941
|
Sheet,
|
|
8924
8942
|
{
|
|
@@ -8948,7 +8966,7 @@ function Calendar3({
|
|
|
8948
8966
|
}
|
|
8949
8967
|
|
|
8950
8968
|
// src/components/TimePicker.tsx
|
|
8951
|
-
import * as
|
|
8969
|
+
import * as React29 from "react";
|
|
8952
8970
|
import { Clock as Clock2, X as X10, Check as Check5, Sun, Moon, Sunset, Coffee } from "lucide-react";
|
|
8953
8971
|
import { Fragment as Fragment9, jsx as jsx34, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
8954
8972
|
var pad = (n) => n.toString().padStart(2, "0");
|
|
@@ -8975,21 +8993,21 @@ function WheelColumn2({
|
|
|
8975
8993
|
}) {
|
|
8976
8994
|
const height = itemHeight * WHEEL_VISIBLE_ITEMS2;
|
|
8977
8995
|
const paddingY = (height - itemHeight) / 2;
|
|
8978
|
-
const rafRef =
|
|
8979
|
-
const lastVirtualIndexRef =
|
|
8980
|
-
const wheelDeltaRef =
|
|
8981
|
-
const scrollEndTimeoutRef =
|
|
8982
|
-
const suppressScrollSelectUntilRef =
|
|
8983
|
-
const suppressItemClickUntilRef =
|
|
8984
|
-
const dragRef =
|
|
8985
|
-
const draggingRef =
|
|
8986
|
-
const inertialRef =
|
|
8987
|
-
const inertiaRafRef =
|
|
8988
|
-
const inertiaVelocityRef =
|
|
8989
|
-
const inertiaLastTimeRef =
|
|
8990
|
-
const moveSamplesRef =
|
|
8996
|
+
const rafRef = React29.useRef(0);
|
|
8997
|
+
const lastVirtualIndexRef = React29.useRef(null);
|
|
8998
|
+
const wheelDeltaRef = React29.useRef(0);
|
|
8999
|
+
const scrollEndTimeoutRef = React29.useRef(null);
|
|
9000
|
+
const suppressScrollSelectUntilRef = React29.useRef(0);
|
|
9001
|
+
const suppressItemClickUntilRef = React29.useRef(0);
|
|
9002
|
+
const dragRef = React29.useRef(null);
|
|
9003
|
+
const draggingRef = React29.useRef(false);
|
|
9004
|
+
const inertialRef = React29.useRef(false);
|
|
9005
|
+
const inertiaRafRef = React29.useRef(null);
|
|
9006
|
+
const inertiaVelocityRef = React29.useRef(0);
|
|
9007
|
+
const inertiaLastTimeRef = React29.useRef(0);
|
|
9008
|
+
const moveSamplesRef = React29.useRef([]);
|
|
8991
9009
|
const loop = true;
|
|
8992
|
-
const ui =
|
|
9010
|
+
const ui = React29.useMemo(() => {
|
|
8993
9011
|
if (size === "sm") {
|
|
8994
9012
|
return {
|
|
8995
9013
|
columnWidth: "min-w-16 max-w-21",
|
|
@@ -9016,9 +9034,9 @@ function WheelColumn2({
|
|
|
9016
9034
|
fadeHeight: "h-12"
|
|
9017
9035
|
};
|
|
9018
9036
|
}, [size]);
|
|
9019
|
-
const baseOffset =
|
|
9020
|
-
const extendedItems =
|
|
9021
|
-
const getNearestVirtualIndex =
|
|
9037
|
+
const baseOffset = React29.useMemo(() => loop ? items.length : 0, [items.length, loop]);
|
|
9038
|
+
const extendedItems = React29.useMemo(() => loop ? [...items, ...items, ...items] : items, [items, loop]);
|
|
9039
|
+
const getNearestVirtualIndex = React29.useCallback(
|
|
9022
9040
|
(realIndex, fromVirtual) => {
|
|
9023
9041
|
const len = items.length;
|
|
9024
9042
|
if (len <= 0) return 0;
|
|
@@ -9037,7 +9055,7 @@ function WheelColumn2({
|
|
|
9037
9055
|
},
|
|
9038
9056
|
[items.length, loop]
|
|
9039
9057
|
);
|
|
9040
|
-
|
|
9058
|
+
React29.useLayoutEffect(() => {
|
|
9041
9059
|
const el = scrollRef.current;
|
|
9042
9060
|
if (!el) return;
|
|
9043
9061
|
const maxVirtual = Math.max(0, extendedItems.length - 1);
|
|
@@ -9065,7 +9083,7 @@ function WheelColumn2({
|
|
|
9065
9083
|
cancelAnimationFrame(rafRef.current);
|
|
9066
9084
|
};
|
|
9067
9085
|
}, [animate, baseOffset, extendedItems.length, getNearestVirtualIndex, itemHeight, loop, scrollRef, valueIndex]);
|
|
9068
|
-
|
|
9086
|
+
React29.useEffect(() => {
|
|
9069
9087
|
const el = scrollRef.current;
|
|
9070
9088
|
if (!el) return;
|
|
9071
9089
|
const lastWheelSignRef = { current: 0 };
|
|
@@ -9153,13 +9171,13 @@ function WheelColumn2({
|
|
|
9153
9171
|
}, 120);
|
|
9154
9172
|
});
|
|
9155
9173
|
};
|
|
9156
|
-
const currentVirtual =
|
|
9174
|
+
const currentVirtual = React29.useMemo(() => {
|
|
9157
9175
|
if (!loop || items.length <= 0) return valueIndex;
|
|
9158
9176
|
const fallback = baseOffset + valueIndex;
|
|
9159
9177
|
const from = lastVirtualIndexRef.current ?? fallback;
|
|
9160
9178
|
return getNearestVirtualIndex(valueIndex, from);
|
|
9161
9179
|
}, [baseOffset, getNearestVirtualIndex, items.length, loop, valueIndex]);
|
|
9162
|
-
const commitFromScrollTop =
|
|
9180
|
+
const commitFromScrollTop = React29.useCallback(
|
|
9163
9181
|
(behavior) => {
|
|
9164
9182
|
const el = scrollRef.current;
|
|
9165
9183
|
if (!el) return;
|
|
@@ -9237,7 +9255,7 @@ function WheelColumn2({
|
|
|
9237
9255
|
if (dt > 0) inertiaVelocityRef.current = (el.scrollTop - oldest.top) / dt;
|
|
9238
9256
|
}
|
|
9239
9257
|
};
|
|
9240
|
-
const startInertia =
|
|
9258
|
+
const startInertia = React29.useCallback(() => {
|
|
9241
9259
|
const el = scrollRef.current;
|
|
9242
9260
|
if (!el) return;
|
|
9243
9261
|
if (items.length <= 0) return;
|
|
@@ -9439,20 +9457,20 @@ function TimePicker({
|
|
|
9439
9457
|
const isControlled = value !== void 0;
|
|
9440
9458
|
const now = /* @__PURE__ */ new Date();
|
|
9441
9459
|
const initial = parseTime(isControlled ? value : defaultValue, format, includeSeconds) || (format === "12" ? { h: now.getHours() % 12 || 12, m: now.getMinutes(), s: now.getSeconds(), p: now.getHours() >= 12 ? "PM" : "AM" } : { h: now.getHours(), m: now.getMinutes(), s: now.getSeconds() });
|
|
9442
|
-
const [open, setOpen] =
|
|
9443
|
-
const [parts, setParts] =
|
|
9444
|
-
const [manualInput, setManualInput] =
|
|
9445
|
-
const [focusedColumn, setFocusedColumn] =
|
|
9446
|
-
const hourScrollRef =
|
|
9447
|
-
const minuteScrollRef =
|
|
9448
|
-
const secondScrollRef =
|
|
9449
|
-
|
|
9460
|
+
const [open, setOpen] = React29.useState(false);
|
|
9461
|
+
const [parts, setParts] = React29.useState(initial);
|
|
9462
|
+
const [manualInput, setManualInput] = React29.useState("");
|
|
9463
|
+
const [focusedColumn, setFocusedColumn] = React29.useState(null);
|
|
9464
|
+
const hourScrollRef = React29.useRef(null);
|
|
9465
|
+
const minuteScrollRef = React29.useRef(null);
|
|
9466
|
+
const secondScrollRef = React29.useRef(null);
|
|
9467
|
+
React29.useEffect(() => {
|
|
9450
9468
|
if (isControlled) {
|
|
9451
9469
|
const parsed = parseTime(value, format, includeSeconds);
|
|
9452
9470
|
if (parsed) setParts(parsed);
|
|
9453
9471
|
}
|
|
9454
9472
|
}, [value, isControlled, format, includeSeconds]);
|
|
9455
|
-
const isTimeDisabled =
|
|
9473
|
+
const isTimeDisabled = React29.useCallback(
|
|
9456
9474
|
(timeStr) => {
|
|
9457
9475
|
if (!disabledTimes) return false;
|
|
9458
9476
|
if (typeof disabledTimes === "function") return disabledTimes(timeStr);
|
|
@@ -9462,7 +9480,7 @@ function TimePicker({
|
|
|
9462
9480
|
);
|
|
9463
9481
|
const resolvedMinTime = minTime ?? min;
|
|
9464
9482
|
const resolvedMaxTime = maxTime ?? max;
|
|
9465
|
-
const toSeconds =
|
|
9483
|
+
const toSeconds = React29.useCallback(
|
|
9466
9484
|
(p) => {
|
|
9467
9485
|
let h = p.h;
|
|
9468
9486
|
if (format === "12") {
|
|
@@ -9474,7 +9492,7 @@ function TimePicker({
|
|
|
9474
9492
|
},
|
|
9475
9493
|
[format, includeSeconds]
|
|
9476
9494
|
);
|
|
9477
|
-
const isTimeInRange =
|
|
9495
|
+
const isTimeInRange = React29.useCallback(
|
|
9478
9496
|
(timeStr) => {
|
|
9479
9497
|
if (!resolvedMinTime && !resolvedMaxTime) return true;
|
|
9480
9498
|
const parsed = parseTime(timeStr, format, includeSeconds);
|
|
@@ -9492,7 +9510,7 @@ function TimePicker({
|
|
|
9492
9510
|
},
|
|
9493
9511
|
[format, includeSeconds, resolvedMaxTime, resolvedMinTime, toSeconds]
|
|
9494
9512
|
);
|
|
9495
|
-
const canEmit =
|
|
9513
|
+
const canEmit = React29.useCallback(
|
|
9496
9514
|
(next) => {
|
|
9497
9515
|
const timeStr = next ? formatTime2(next, format, includeSeconds) : void 0;
|
|
9498
9516
|
if (!timeStr) return true;
|
|
@@ -9502,7 +9520,7 @@ function TimePicker({
|
|
|
9502
9520
|
},
|
|
9503
9521
|
[format, includeSeconds, isTimeDisabled, isTimeInRange]
|
|
9504
9522
|
);
|
|
9505
|
-
const emit =
|
|
9523
|
+
const emit = React29.useCallback(
|
|
9506
9524
|
(next) => {
|
|
9507
9525
|
const timeStr = next ? formatTime2(next, format, includeSeconds) : void 0;
|
|
9508
9526
|
if (!canEmit(next)) return;
|
|
@@ -9510,7 +9528,7 @@ function TimePicker({
|
|
|
9510
9528
|
},
|
|
9511
9529
|
[canEmit, format, includeSeconds, onChange]
|
|
9512
9530
|
);
|
|
9513
|
-
const tryUpdate =
|
|
9531
|
+
const tryUpdate = React29.useCallback(
|
|
9514
9532
|
(next) => {
|
|
9515
9533
|
if (!canEmit(next)) return false;
|
|
9516
9534
|
setParts(next);
|
|
@@ -10074,7 +10092,7 @@ var DateTimePicker = ({
|
|
|
10074
10092
|
}) => {
|
|
10075
10093
|
const t = useSmartTranslations("DateTimePicker");
|
|
10076
10094
|
const locale = useSmartLocale();
|
|
10077
|
-
const [open, setOpen] =
|
|
10095
|
+
const [open, setOpen] = React30.useState(false);
|
|
10078
10096
|
const sizeStyles8 = {
|
|
10079
10097
|
sm: {
|
|
10080
10098
|
trigger: "h-8 px-2.5 py-1.5 text-sm md:h-7 md:text-xs",
|
|
@@ -10107,9 +10125,9 @@ var DateTimePicker = ({
|
|
|
10107
10125
|
gap: "gap-4"
|
|
10108
10126
|
}
|
|
10109
10127
|
};
|
|
10110
|
-
const [tempDate, setTempDate] =
|
|
10111
|
-
const [calendarMonth, setCalendarMonth] =
|
|
10112
|
-
|
|
10128
|
+
const [tempDate, setTempDate] = React30.useState(value);
|
|
10129
|
+
const [calendarMonth, setCalendarMonth] = React30.useState(() => value ?? /* @__PURE__ */ new Date());
|
|
10130
|
+
React30.useEffect(() => {
|
|
10113
10131
|
setTempDate(value);
|
|
10114
10132
|
setCalendarMonth(value ?? /* @__PURE__ */ new Date());
|
|
10115
10133
|
}, [value, open]);
|
|
@@ -10302,7 +10320,7 @@ var DateTimePicker = ({
|
|
|
10302
10320
|
};
|
|
10303
10321
|
|
|
10304
10322
|
// src/components/CalendarTimeline/CalendarTimeline.tsx
|
|
10305
|
-
import * as
|
|
10323
|
+
import * as React36 from "react";
|
|
10306
10324
|
import { Plus as Plus2 } from "lucide-react";
|
|
10307
10325
|
|
|
10308
10326
|
// src/components/CalendarTimeline/date.ts
|
|
@@ -10542,10 +10560,10 @@ function intervalPack(items) {
|
|
|
10542
10560
|
}
|
|
10543
10561
|
|
|
10544
10562
|
// src/components/CalendarTimeline/hooks.ts
|
|
10545
|
-
import * as
|
|
10563
|
+
import * as React31 from "react";
|
|
10546
10564
|
function useHorizontalScrollSync(args) {
|
|
10547
10565
|
const { bodyRef, headerRef, leftRef } = args;
|
|
10548
|
-
|
|
10566
|
+
React31.useEffect(() => {
|
|
10549
10567
|
const body = bodyRef.current;
|
|
10550
10568
|
const header = headerRef.current;
|
|
10551
10569
|
const left = leftRef?.current ?? null;
|
|
@@ -10603,9 +10621,9 @@ function lowerBound(arr, target) {
|
|
|
10603
10621
|
function useVirtualVariableRows(args) {
|
|
10604
10622
|
const { enabled, overscan, rowHeights, scrollRef } = args;
|
|
10605
10623
|
const itemCount = rowHeights.length;
|
|
10606
|
-
const [viewportHeight, setViewportHeight] =
|
|
10607
|
-
const [scrollTop, setScrollTop] =
|
|
10608
|
-
|
|
10624
|
+
const [viewportHeight, setViewportHeight] = React31.useState(0);
|
|
10625
|
+
const [scrollTop, setScrollTop] = React31.useState(0);
|
|
10626
|
+
React31.useEffect(() => {
|
|
10609
10627
|
if (!enabled) {
|
|
10610
10628
|
setViewportHeight(0);
|
|
10611
10629
|
return;
|
|
@@ -10618,7 +10636,7 @@ function useVirtualVariableRows(args) {
|
|
|
10618
10636
|
ro.observe(el);
|
|
10619
10637
|
return () => ro.disconnect();
|
|
10620
10638
|
}, [enabled, scrollRef]);
|
|
10621
|
-
|
|
10639
|
+
React31.useEffect(() => {
|
|
10622
10640
|
if (!enabled) {
|
|
10623
10641
|
setScrollTop(0);
|
|
10624
10642
|
return;
|
|
@@ -10643,7 +10661,7 @@ function useVirtualVariableRows(args) {
|
|
|
10643
10661
|
el.removeEventListener("scroll", onScroll);
|
|
10644
10662
|
};
|
|
10645
10663
|
}, [enabled, scrollRef]);
|
|
10646
|
-
const prefix =
|
|
10664
|
+
const prefix = React31.useMemo(() => {
|
|
10647
10665
|
const out = new Array(itemCount + 1);
|
|
10648
10666
|
out[0] = 0;
|
|
10649
10667
|
for (let i = 0; i < itemCount; i++) {
|
|
@@ -10651,7 +10669,7 @@ function useVirtualVariableRows(args) {
|
|
|
10651
10669
|
}
|
|
10652
10670
|
return out;
|
|
10653
10671
|
}, [itemCount, rowHeights]);
|
|
10654
|
-
return
|
|
10672
|
+
return React31.useMemo(() => {
|
|
10655
10673
|
if (!enabled) {
|
|
10656
10674
|
return { startIndex: 0, endIndex: itemCount, topSpacer: 0, bottomSpacer: 0, totalHeight: prefix[itemCount] ?? 0 };
|
|
10657
10675
|
}
|
|
@@ -10667,8 +10685,8 @@ function useVirtualVariableRows(args) {
|
|
|
10667
10685
|
}, [enabled, itemCount, overscan, prefix, scrollTop, viewportHeight]);
|
|
10668
10686
|
}
|
|
10669
10687
|
function useClientWidth(ref) {
|
|
10670
|
-
const [width, setWidth] =
|
|
10671
|
-
|
|
10688
|
+
const [width, setWidth] = React31.useState(0);
|
|
10689
|
+
React31.useEffect(() => {
|
|
10672
10690
|
const el = ref.current;
|
|
10673
10691
|
if (!el) return;
|
|
10674
10692
|
const update = () => setWidth(el.clientWidth);
|
|
@@ -10891,7 +10909,7 @@ function resourcesById(resources) {
|
|
|
10891
10909
|
}
|
|
10892
10910
|
|
|
10893
10911
|
// src/components/CalendarTimeline/CalendarTimelineHeader.tsx
|
|
10894
|
-
import * as
|
|
10912
|
+
import * as React32 from "react";
|
|
10895
10913
|
import { Calendar as Calendar4, CalendarDays, CalendarRange, ChevronLeft as ChevronLeft4, ChevronRight as ChevronRight5, GripVertical, Plus } from "lucide-react";
|
|
10896
10914
|
import { jsx as jsx37, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
10897
10915
|
var VIEW_ICONS = {
|
|
@@ -10922,7 +10940,7 @@ function CalendarTimelineHeader(props) {
|
|
|
10922
10940
|
headerRef,
|
|
10923
10941
|
slotHeaderNodes
|
|
10924
10942
|
} = props;
|
|
10925
|
-
const resolvedAvailableViews =
|
|
10943
|
+
const resolvedAvailableViews = React32.useMemo(
|
|
10926
10944
|
() => availableViews?.length ? availableViews : ["month", "week", "day", "sprint"],
|
|
10927
10945
|
[availableViews]
|
|
10928
10946
|
);
|
|
@@ -10930,22 +10948,22 @@ function CalendarTimelineHeader(props) {
|
|
|
10930
10948
|
const showLeftColumn = showResourceColumn ?? true;
|
|
10931
10949
|
const dt = useSmartTranslations("DateTimePicker");
|
|
10932
10950
|
const locale = useSmartLocale();
|
|
10933
|
-
const [todayOpen, setTodayOpen] =
|
|
10934
|
-
const [tempDate, setTempDate] =
|
|
10935
|
-
const [calendarMonth, setCalendarMonth] =
|
|
10936
|
-
|
|
10951
|
+
const [todayOpen, setTodayOpen] = React32.useState(false);
|
|
10952
|
+
const [tempDate, setTempDate] = React32.useState(() => now);
|
|
10953
|
+
const [calendarMonth, setCalendarMonth] = React32.useState(() => now);
|
|
10954
|
+
React32.useEffect(() => {
|
|
10937
10955
|
if (!todayOpen) return;
|
|
10938
10956
|
setTempDate(now);
|
|
10939
10957
|
setCalendarMonth(now);
|
|
10940
10958
|
}, [now, todayOpen]);
|
|
10941
|
-
const monthLabel =
|
|
10959
|
+
const monthLabel = React32.useCallback(
|
|
10942
10960
|
(date) => date.toLocaleDateString(locale === "vi" ? "vi-VN" : "en-US", {
|
|
10943
10961
|
month: "long",
|
|
10944
10962
|
year: "numeric"
|
|
10945
10963
|
}),
|
|
10946
10964
|
[locale]
|
|
10947
10965
|
);
|
|
10948
|
-
const weekdays =
|
|
10966
|
+
const weekdays = React32.useMemo(() => {
|
|
10949
10967
|
switch (locale) {
|
|
10950
10968
|
case "vi":
|
|
10951
10969
|
return ["CN", "T2", "T3", "T4", "T5", "T6", "T7"];
|
|
@@ -10957,12 +10975,12 @@ function CalendarTimelineHeader(props) {
|
|
|
10957
10975
|
return ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
|
|
10958
10976
|
}
|
|
10959
10977
|
}, [locale]);
|
|
10960
|
-
const getTimeString =
|
|
10978
|
+
const getTimeString = React32.useCallback((date) => {
|
|
10961
10979
|
const h = date.getHours();
|
|
10962
10980
|
const m = date.getMinutes();
|
|
10963
10981
|
return `${h.toString().padStart(2, "0")}:${m.toString().padStart(2, "0")}`;
|
|
10964
10982
|
}, []);
|
|
10965
|
-
const handleDateSelect =
|
|
10983
|
+
const handleDateSelect = React32.useCallback((date) => {
|
|
10966
10984
|
if (!(date instanceof Date)) return;
|
|
10967
10985
|
setTempDate((prev) => {
|
|
10968
10986
|
const next = new Date(date);
|
|
@@ -10970,7 +10988,7 @@ function CalendarTimelineHeader(props) {
|
|
|
10970
10988
|
return next;
|
|
10971
10989
|
});
|
|
10972
10990
|
}, []);
|
|
10973
|
-
const handleTimeChange =
|
|
10991
|
+
const handleTimeChange = React32.useCallback((timeStr) => {
|
|
10974
10992
|
if (!timeStr) return;
|
|
10975
10993
|
const [hStr, mStr] = timeStr.split(":");
|
|
10976
10994
|
const h = parseInt(hStr, 10);
|
|
@@ -10982,7 +11000,7 @@ function CalendarTimelineHeader(props) {
|
|
|
10982
11000
|
return next;
|
|
10983
11001
|
});
|
|
10984
11002
|
}, []);
|
|
10985
|
-
const applyDateTime =
|
|
11003
|
+
const applyDateTime = React32.useCallback(() => {
|
|
10986
11004
|
onApplyDateTime(tempDate);
|
|
10987
11005
|
setTodayOpen(false);
|
|
10988
11006
|
}, [onApplyDateTime, tempDate]);
|
|
@@ -11245,9 +11263,9 @@ function ResourceRowCell(props) {
|
|
|
11245
11263
|
}
|
|
11246
11264
|
|
|
11247
11265
|
// src/components/CalendarTimeline/CalendarTimelineGridOverlay.tsx
|
|
11248
|
-
import * as
|
|
11266
|
+
import * as React33 from "react";
|
|
11249
11267
|
import { jsx as jsx39, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
11250
|
-
var CalendarTimelineGridOverlay =
|
|
11268
|
+
var CalendarTimelineGridOverlay = React33.memo(function CalendarTimelineGridOverlay2(props) {
|
|
11251
11269
|
const {
|
|
11252
11270
|
gridWidth,
|
|
11253
11271
|
height,
|
|
@@ -11295,12 +11313,12 @@ var CalendarTimelineGridOverlay = React32.memo(function CalendarTimelineGridOver
|
|
|
11295
11313
|
});
|
|
11296
11314
|
|
|
11297
11315
|
// src/components/CalendarTimeline/CalendarTimelineSlotHeaderCell.tsx
|
|
11298
|
-
import * as
|
|
11316
|
+
import * as React34 from "react";
|
|
11299
11317
|
import { Dot } from "lucide-react";
|
|
11300
11318
|
import { jsx as jsx40, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
11301
|
-
var CalendarTimelineSlotHeaderCell =
|
|
11319
|
+
var CalendarTimelineSlotHeaderCell = React34.memo(function CalendarTimelineSlotHeaderCell2(props) {
|
|
11302
11320
|
const { width, activeView, isToday: isToday2, label, ariaLabel, borderClassName, dayHeaderMarks, idx, className } = props;
|
|
11303
|
-
const content =
|
|
11321
|
+
const content = React34.useMemo(() => {
|
|
11304
11322
|
if (activeView === "day" && dayHeaderMarks) {
|
|
11305
11323
|
if (dayHeaderMarks.showEllipsis[idx]) return /* @__PURE__ */ jsx40("span", { className: "text-xs text-muted-foreground/70 select-none", children: "\u2026" });
|
|
11306
11324
|
if (!dayHeaderMarks.showTime[idx]) return null;
|
|
@@ -11323,7 +11341,7 @@ var CalendarTimelineSlotHeaderCell = React33.memo(function CalendarTimelineSlotH
|
|
|
11323
11341
|
});
|
|
11324
11342
|
|
|
11325
11343
|
// src/components/CalendarTimeline/internal-hooks.ts
|
|
11326
|
-
import * as
|
|
11344
|
+
import * as React35 from "react";
|
|
11327
11345
|
function useTimelineSlots(args) {
|
|
11328
11346
|
const {
|
|
11329
11347
|
activeView,
|
|
@@ -11338,7 +11356,7 @@ function useTimelineSlots(args) {
|
|
|
11338
11356
|
formatters,
|
|
11339
11357
|
dueDateSprint
|
|
11340
11358
|
} = args;
|
|
11341
|
-
const { slots, range } =
|
|
11359
|
+
const { slots, range } = React35.useMemo(() => {
|
|
11342
11360
|
const { start, end, slotStarts: slotStarts2 } = computeSlotStarts({
|
|
11343
11361
|
view: activeView,
|
|
11344
11362
|
date: activeDate,
|
|
@@ -11393,18 +11411,18 @@ function useTimelineSlots(args) {
|
|
|
11393
11411
|
const match = matchSprintDef(s, idx);
|
|
11394
11412
|
if (match && sprintRangeText) {
|
|
11395
11413
|
const rangeText = sprintRangeText(match.startMs, match.endMs);
|
|
11396
|
-
return
|
|
11414
|
+
return React35.createElement(
|
|
11397
11415
|
"span",
|
|
11398
11416
|
{ className: "inline-flex flex-col items-center leading-tight" },
|
|
11399
|
-
|
|
11400
|
-
|
|
11417
|
+
React35.createElement("span", { className: "text-[11px] font-semibold text-foreground truncate max-w-32" }, match.title),
|
|
11418
|
+
React35.createElement("span", { className: "text-[10px] font-medium text-muted-foreground/70" }, rangeText)
|
|
11401
11419
|
);
|
|
11402
11420
|
}
|
|
11403
|
-
return
|
|
11421
|
+
return React35.createElement(
|
|
11404
11422
|
"span",
|
|
11405
11423
|
{ className: "inline-flex flex-col items-center leading-tight" },
|
|
11406
|
-
|
|
11407
|
-
|
|
11424
|
+
React35.createElement("span", { className: "text-[10px] font-medium uppercase tracking-wider text-muted-foreground/70" }, "S"),
|
|
11425
|
+
React35.createElement("span", { className: "text-sm font-semibold text-foreground" }, String(idx + 1).padStart(2, "0"))
|
|
11408
11426
|
);
|
|
11409
11427
|
})(),
|
|
11410
11428
|
isToday: (() => {
|
|
@@ -11432,9 +11450,9 @@ function useTimelineSlots(args) {
|
|
|
11432
11450
|
weekStartsOn,
|
|
11433
11451
|
workHours
|
|
11434
11452
|
]);
|
|
11435
|
-
const slotStarts =
|
|
11436
|
-
const todaySlotIdx =
|
|
11437
|
-
const weekendSlotIdxs =
|
|
11453
|
+
const slotStarts = React35.useMemo(() => slots.map((s) => s.start), [slots]);
|
|
11454
|
+
const todaySlotIdx = React35.useMemo(() => slots.findIndex((s) => s.isToday), [slots]);
|
|
11455
|
+
const weekendSlotIdxs = React35.useMemo(() => {
|
|
11438
11456
|
const out = [];
|
|
11439
11457
|
for (let i = 0; i < slots.length; i++) if (slots[i]?.isWeekend) out.push(i);
|
|
11440
11458
|
return out;
|
|
@@ -11443,16 +11461,16 @@ function useTimelineSlots(args) {
|
|
|
11443
11461
|
}
|
|
11444
11462
|
function useNormalizedEvents(args) {
|
|
11445
11463
|
const { events, range, activeView, resolvedTimeZone, resources } = args;
|
|
11446
|
-
const normalizedEvents =
|
|
11464
|
+
const normalizedEvents = React35.useMemo(() => {
|
|
11447
11465
|
return normalizeEvents({ events, range, view: activeView, timeZone: resolvedTimeZone });
|
|
11448
11466
|
}, [activeView, events, range, resolvedTimeZone]);
|
|
11449
|
-
const eventsByResource =
|
|
11450
|
-
const resourceById =
|
|
11467
|
+
const eventsByResource = React35.useMemo(() => eventsByResourceId(normalizedEvents), [normalizedEvents]);
|
|
11468
|
+
const resourceById = React35.useMemo(() => resourcesById(resources), [resources]);
|
|
11451
11469
|
return { normalizedEvents, eventsByResource, resourceById };
|
|
11452
11470
|
}
|
|
11453
11471
|
function useDayHeaderMarks(args) {
|
|
11454
11472
|
const { enabled, activeView, normalizedEvents, slotStarts, slotCount } = args;
|
|
11455
|
-
return
|
|
11473
|
+
return React35.useMemo(() => {
|
|
11456
11474
|
if (!enabled) return null;
|
|
11457
11475
|
if (activeView !== "day") return null;
|
|
11458
11476
|
const n = slotCount;
|
|
@@ -11487,14 +11505,14 @@ function useSlotMetrics(args) {
|
|
|
11487
11505
|
dayHeaderSmart,
|
|
11488
11506
|
daySlotCompression
|
|
11489
11507
|
} = args;
|
|
11490
|
-
const fixedSlotWidth =
|
|
11508
|
+
const fixedSlotWidth = React35.useMemo(() => {
|
|
11491
11509
|
const baseSlotWidth = activeView === "month" || activeView === "day" ? effectiveSlotMinWidth * 3 : effectiveSlotMinWidth;
|
|
11492
11510
|
if (activeView !== "week") return baseSlotWidth;
|
|
11493
11511
|
if (bodyClientWidth <= 0) return baseSlotWidth;
|
|
11494
11512
|
if (slotsLength <= 0) return baseSlotWidth;
|
|
11495
11513
|
return Math.max(baseSlotWidth, bodyClientWidth / slotsLength);
|
|
11496
11514
|
}, [activeView, bodyClientWidth, effectiveSlotMinWidth, slotsLength]);
|
|
11497
|
-
const slotMetrics =
|
|
11515
|
+
const slotMetrics = React35.useMemo(() => {
|
|
11498
11516
|
const n = slotsLength;
|
|
11499
11517
|
const widths = new Array(n).fill(fixedSlotWidth);
|
|
11500
11518
|
const isAdaptiveView = activeView === "month" || activeView === "day";
|
|
@@ -11624,7 +11642,7 @@ function useSlotMetrics(args) {
|
|
|
11624
11642
|
}
|
|
11625
11643
|
function useLayoutsByResource(args) {
|
|
11626
11644
|
const { eventsByResource, preview, slotStarts, slotsLength, slotLefts, getResourceRowHeight, laneGap, lanePaddingY, effectiveMaxLanesPerRow, eventHeight } = args;
|
|
11627
|
-
return
|
|
11645
|
+
return React35.useMemo(() => {
|
|
11628
11646
|
const map = /* @__PURE__ */ new Map();
|
|
11629
11647
|
for (const [resourceId, list] of eventsByResource.entries()) {
|
|
11630
11648
|
const mapped = list.map((ev) => {
|
|
@@ -11671,9 +11689,9 @@ function lowerBound2(arr, target) {
|
|
|
11671
11689
|
}
|
|
11672
11690
|
function useVisibleSlotRange(args) {
|
|
11673
11691
|
const { enabled, overscan, scrollRef, slotLefts, slotCount } = args;
|
|
11674
|
-
const [scrollLeft, setScrollLeft] =
|
|
11675
|
-
const [viewportWidth, setViewportWidth] =
|
|
11676
|
-
|
|
11692
|
+
const [scrollLeft, setScrollLeft] = React35.useState(0);
|
|
11693
|
+
const [viewportWidth, setViewportWidth] = React35.useState(0);
|
|
11694
|
+
React35.useEffect(() => {
|
|
11677
11695
|
if (!enabled) return;
|
|
11678
11696
|
const el = scrollRef.current;
|
|
11679
11697
|
if (!el) return;
|
|
@@ -11700,7 +11718,7 @@ function useVisibleSlotRange(args) {
|
|
|
11700
11718
|
el.removeEventListener("scroll", onScroll);
|
|
11701
11719
|
};
|
|
11702
11720
|
}, [enabled, scrollRef]);
|
|
11703
|
-
return
|
|
11721
|
+
return React35.useMemo(() => {
|
|
11704
11722
|
if (!enabled) return { startIdx: 0, endIdx: slotCount };
|
|
11705
11723
|
if (slotCount <= 0) return { startIdx: 0, endIdx: 0 };
|
|
11706
11724
|
if (viewportWidth <= 0) return { startIdx: 0, endIdx: slotCount };
|
|
@@ -11797,14 +11815,14 @@ function CalendarTimeline({
|
|
|
11797
11815
|
}) {
|
|
11798
11816
|
const t = useSmartTranslations("CalendarTimeline");
|
|
11799
11817
|
const detectedLocale = useSmartLocale();
|
|
11800
|
-
const resolvedLocale =
|
|
11801
|
-
const resolvedTimeZone =
|
|
11818
|
+
const resolvedLocale = React36.useMemo(() => localeToBCP47(locale ?? detectedLocale), [locale, detectedLocale]);
|
|
11819
|
+
const resolvedTimeZone = React36.useMemo(() => timeZone ?? Intl.DateTimeFormat().resolvedOptions().timeZone ?? "UTC", [timeZone]);
|
|
11802
11820
|
const effectiveEnableEventSheet = enableEventSheet ?? Boolean(renderEventSheet);
|
|
11803
11821
|
const isViewOnly = interactions?.mode === "view";
|
|
11804
11822
|
const isControlledSelectedEventId = selectedEventId !== void 0;
|
|
11805
|
-
const [internalSelectedEventId, setInternalSelectedEventId] =
|
|
11823
|
+
const [internalSelectedEventId, setInternalSelectedEventId] = React36.useState(defaultSelectedEventId ?? null);
|
|
11806
11824
|
const activeSelectedEventId = isControlledSelectedEventId ? selectedEventId : internalSelectedEventId;
|
|
11807
|
-
const setSelectedEventId =
|
|
11825
|
+
const setSelectedEventId = React36.useCallback(
|
|
11808
11826
|
(next) => {
|
|
11809
11827
|
if (!isControlledSelectedEventId) setInternalSelectedEventId(next);
|
|
11810
11828
|
onSelectedEventIdChange?.(next);
|
|
@@ -11812,9 +11830,9 @@ function CalendarTimeline({
|
|
|
11812
11830
|
[isControlledSelectedEventId, onSelectedEventIdChange]
|
|
11813
11831
|
);
|
|
11814
11832
|
const isControlledEventSheetOpen = eventSheetOpen !== void 0;
|
|
11815
|
-
const [internalEventSheetOpen, setInternalEventSheetOpen] =
|
|
11833
|
+
const [internalEventSheetOpen, setInternalEventSheetOpen] = React36.useState(defaultEventSheetOpen ?? false);
|
|
11816
11834
|
const activeEventSheetOpen = isControlledEventSheetOpen ? Boolean(eventSheetOpen) : internalEventSheetOpen;
|
|
11817
|
-
const setEventSheetOpen =
|
|
11835
|
+
const setEventSheetOpen = React36.useCallback(
|
|
11818
11836
|
(next) => {
|
|
11819
11837
|
if (!isControlledEventSheetOpen) setInternalEventSheetOpen(next);
|
|
11820
11838
|
onEventSheetOpenChange?.(next);
|
|
@@ -11823,12 +11841,12 @@ function CalendarTimeline({
|
|
|
11823
11841
|
[isControlledEventSheetOpen, onEventSheetOpenChange, setSelectedEventId]
|
|
11824
11842
|
);
|
|
11825
11843
|
const showResourceColumn = !hideResourceColumn;
|
|
11826
|
-
const sizeConfig =
|
|
11844
|
+
const sizeConfig = React36.useMemo(() => getSizeConfig(size), [size]);
|
|
11827
11845
|
const densityClass = sizeConfig.densityClass;
|
|
11828
11846
|
const eventHeight = sizeConfig.eventHeight;
|
|
11829
11847
|
const laneGap = sizeConfig.laneGap;
|
|
11830
11848
|
const lanePaddingY = sizeConfig.lanePaddingY;
|
|
11831
|
-
const canResizeColumn =
|
|
11849
|
+
const canResizeColumn = React36.useMemo(() => {
|
|
11832
11850
|
const cfg = enableLayoutResize;
|
|
11833
11851
|
if (!cfg) return false;
|
|
11834
11852
|
if (isViewOnly) return false;
|
|
@@ -11836,7 +11854,7 @@ function CalendarTimeline({
|
|
|
11836
11854
|
if (cfg === true) return true;
|
|
11837
11855
|
return cfg.column !== false;
|
|
11838
11856
|
}, [enableLayoutResize, isViewOnly, showResourceColumn]);
|
|
11839
|
-
const canResizeRow =
|
|
11857
|
+
const canResizeRow = React36.useMemo(() => {
|
|
11840
11858
|
const cfg = enableLayoutResize;
|
|
11841
11859
|
if (!cfg) return false;
|
|
11842
11860
|
if (isViewOnly) return false;
|
|
@@ -11845,19 +11863,19 @@ function CalendarTimeline({
|
|
|
11845
11863
|
return cfg.row !== false;
|
|
11846
11864
|
}, [enableLayoutResize, isViewOnly, showResourceColumn]);
|
|
11847
11865
|
const isControlledResourceColumnWidth = resourceColumnWidth !== void 0;
|
|
11848
|
-
const [internalResourceColumnWidth, setInternalResourceColumnWidth] =
|
|
11866
|
+
const [internalResourceColumnWidth, setInternalResourceColumnWidth] = React36.useState(() => {
|
|
11849
11867
|
const init = defaultResourceColumnWidth ?? sizeConfig.resourceColumnWidth;
|
|
11850
11868
|
return typeof init === "number" ? init : sizeConfig.resourceColumnWidth;
|
|
11851
11869
|
});
|
|
11852
|
-
|
|
11870
|
+
React36.useEffect(() => {
|
|
11853
11871
|
if (isControlledResourceColumnWidth) return;
|
|
11854
11872
|
if (defaultResourceColumnWidth == null) return;
|
|
11855
11873
|
setInternalResourceColumnWidth(defaultResourceColumnWidth);
|
|
11856
11874
|
}, [defaultResourceColumnWidth, isControlledResourceColumnWidth]);
|
|
11857
11875
|
const effectiveResourceColumnWidth = showResourceColumn ? isControlledResourceColumnWidth ? resourceColumnWidth : internalResourceColumnWidth : 0;
|
|
11858
11876
|
const isControlledRowHeight = rowHeight !== void 0;
|
|
11859
|
-
const [internalRowHeight, setInternalRowHeight] =
|
|
11860
|
-
|
|
11877
|
+
const [internalRowHeight, setInternalRowHeight] = React36.useState(() => defaultRowHeight ?? sizeConfig.rowHeight);
|
|
11878
|
+
React36.useEffect(() => {
|
|
11861
11879
|
if (isControlledRowHeight) return;
|
|
11862
11880
|
if (defaultRowHeight == null) return;
|
|
11863
11881
|
setInternalRowHeight(defaultRowHeight);
|
|
@@ -11868,14 +11886,14 @@ function CalendarTimeline({
|
|
|
11868
11886
|
const colMax = maxResourceColumnWidth ?? 520;
|
|
11869
11887
|
const rowMin = minRowHeight ?? 36;
|
|
11870
11888
|
const rowMax = maxRowHeight ?? 120;
|
|
11871
|
-
const viewList =
|
|
11872
|
-
const availableViews =
|
|
11889
|
+
const viewList = React36.useMemo(() => Array.isArray(view) ? view : void 0, [view]);
|
|
11890
|
+
const availableViews = React36.useMemo(() => {
|
|
11873
11891
|
if (onlyView) return [onlyView];
|
|
11874
11892
|
if (viewList?.length) return viewList;
|
|
11875
11893
|
return ["month", "week", "day", "sprint"];
|
|
11876
11894
|
}, [onlyView, viewList]);
|
|
11877
11895
|
const isControlledView = view !== void 0 && !Array.isArray(view);
|
|
11878
|
-
const [internalView, setInternalView] =
|
|
11896
|
+
const [internalView, setInternalView] = React36.useState(() => {
|
|
11879
11897
|
if (onlyView) return onlyView;
|
|
11880
11898
|
if (viewList?.length) {
|
|
11881
11899
|
if (defaultView && viewList.includes(defaultView)) return defaultView;
|
|
@@ -11884,13 +11902,13 @@ function CalendarTimeline({
|
|
|
11884
11902
|
return defaultView ?? "month";
|
|
11885
11903
|
});
|
|
11886
11904
|
const activeView = onlyView ? onlyView : isControlledView ? view : internalView;
|
|
11887
|
-
|
|
11905
|
+
React36.useEffect(() => {
|
|
11888
11906
|
if (onlyView || isControlledView) return;
|
|
11889
11907
|
if (!availableViews.includes(internalView)) {
|
|
11890
11908
|
setInternalView(availableViews[0] ?? "month");
|
|
11891
11909
|
}
|
|
11892
11910
|
}, [availableViews, internalView, isControlledView, onlyView]);
|
|
11893
|
-
const effectiveSlotMinWidth =
|
|
11911
|
+
const effectiveSlotMinWidth = React36.useMemo(() => {
|
|
11894
11912
|
if (slotMinWidth == null) {
|
|
11895
11913
|
if (activeView === "month" && monthEventStyle === "compact") {
|
|
11896
11914
|
return clamp5(Math.round(sizeConfig.slotMinWidth * 0.55), 32, sizeConfig.slotMinWidth);
|
|
@@ -11902,17 +11920,17 @@ function CalendarTimeline({
|
|
|
11902
11920
|
return baseSlotMinWidth;
|
|
11903
11921
|
}, [activeView, baseSlotMinWidth, monthEventStyle, sizeConfig.slotMinWidth, slotMinWidth]);
|
|
11904
11922
|
const isControlledDate = date !== void 0;
|
|
11905
|
-
const [internalDate, setInternalDate] =
|
|
11923
|
+
const [internalDate, setInternalDate] = React36.useState(() => defaultDate ?? /* @__PURE__ */ new Date());
|
|
11906
11924
|
const activeDate = isControlledDate ? date : internalDate;
|
|
11907
|
-
const resolvedNow =
|
|
11908
|
-
const formatToken =
|
|
11925
|
+
const resolvedNow = React36.useMemo(() => now ?? /* @__PURE__ */ new Date(), [now]);
|
|
11926
|
+
const formatToken = React36.useCallback((key, params) => {
|
|
11909
11927
|
let message = t(key);
|
|
11910
11928
|
for (const [name, value] of Object.entries(params)) {
|
|
11911
11929
|
message = message.replaceAll(`{${name}}`, String(value));
|
|
11912
11930
|
}
|
|
11913
11931
|
return message;
|
|
11914
11932
|
}, [t]);
|
|
11915
|
-
const l =
|
|
11933
|
+
const l = React36.useMemo(
|
|
11916
11934
|
() => ({
|
|
11917
11935
|
today: labels?.today ?? t("today"),
|
|
11918
11936
|
prev: labels?.prev ?? t("prev"),
|
|
@@ -11935,7 +11953,7 @@ function CalendarTimeline({
|
|
|
11935
11953
|
}),
|
|
11936
11954
|
[formatToken, labels, t]
|
|
11937
11955
|
);
|
|
11938
|
-
const setView =
|
|
11956
|
+
const setView = React36.useCallback(
|
|
11939
11957
|
(next) => {
|
|
11940
11958
|
if (onlyView) return;
|
|
11941
11959
|
if (!availableViews.includes(next)) return;
|
|
@@ -11944,14 +11962,14 @@ function CalendarTimeline({
|
|
|
11944
11962
|
},
|
|
11945
11963
|
[availableViews, isControlledView, onViewChange, onlyView]
|
|
11946
11964
|
);
|
|
11947
|
-
const setDate =
|
|
11965
|
+
const setDate = React36.useCallback(
|
|
11948
11966
|
(next) => {
|
|
11949
11967
|
if (!isControlledDate) setInternalDate(next);
|
|
11950
11968
|
onDateChange?.(next);
|
|
11951
11969
|
},
|
|
11952
11970
|
[isControlledDate, onDateChange]
|
|
11953
11971
|
);
|
|
11954
|
-
const navigate =
|
|
11972
|
+
const navigate = React36.useCallback(
|
|
11955
11973
|
(dir) => {
|
|
11956
11974
|
const base = activeDate;
|
|
11957
11975
|
if (activeView === "month") {
|
|
@@ -11970,17 +11988,17 @@ function CalendarTimeline({
|
|
|
11970
11988
|
},
|
|
11971
11989
|
[activeDate, activeView, resolvedTimeZone, setDate]
|
|
11972
11990
|
);
|
|
11973
|
-
const [internalCollapsed, setInternalCollapsed] =
|
|
11991
|
+
const [internalCollapsed, setInternalCollapsed] = React36.useState(() => defaultGroupCollapsed ?? {});
|
|
11974
11992
|
const collapsed = groupCollapsed ?? internalCollapsed;
|
|
11975
|
-
const setCollapsed =
|
|
11993
|
+
const setCollapsed = React36.useCallback(
|
|
11976
11994
|
(next) => {
|
|
11977
11995
|
if (!groupCollapsed) setInternalCollapsed(next);
|
|
11978
11996
|
onGroupCollapsedChange?.(next);
|
|
11979
11997
|
},
|
|
11980
11998
|
[groupCollapsed, onGroupCollapsedChange]
|
|
11981
11999
|
);
|
|
11982
|
-
const rows =
|
|
11983
|
-
const groupResourceCounts =
|
|
12000
|
+
const rows = React36.useMemo(() => buildRows({ resources, groups, collapsed }), [resources, groups, collapsed]);
|
|
12001
|
+
const groupResourceCounts = React36.useMemo(() => getGroupResourceCounts(resources), [resources]);
|
|
11984
12002
|
const { slots, range, slotStarts, todaySlotIdx, weekendSlotIdxs } = useTimelineSlots({
|
|
11985
12003
|
activeView,
|
|
11986
12004
|
activeDate,
|
|
@@ -11994,12 +12012,12 @@ function CalendarTimeline({
|
|
|
11994
12012
|
formatters,
|
|
11995
12013
|
dueDateSprint
|
|
11996
12014
|
});
|
|
11997
|
-
|
|
12015
|
+
React36.useEffect(() => {
|
|
11998
12016
|
onRangeChange?.(range);
|
|
11999
12017
|
}, [range.start, range.end, onRangeChange]);
|
|
12000
|
-
const leftRef =
|
|
12001
|
-
const bodyRef =
|
|
12002
|
-
const headerRef =
|
|
12018
|
+
const leftRef = React36.useRef(null);
|
|
12019
|
+
const bodyRef = React36.useRef(null);
|
|
12020
|
+
const headerRef = React36.useRef(null);
|
|
12003
12021
|
const bodyClientWidth = useClientWidth(bodyRef);
|
|
12004
12022
|
const { normalizedEvents, eventsByResource, resourceById } = useNormalizedEvents({
|
|
12005
12023
|
events,
|
|
@@ -12031,16 +12049,16 @@ function CalendarTimeline({
|
|
|
12031
12049
|
slotLefts,
|
|
12032
12050
|
slotCount: slots.length
|
|
12033
12051
|
});
|
|
12034
|
-
const selectedEvent =
|
|
12052
|
+
const selectedEvent = React36.useMemo(() => {
|
|
12035
12053
|
if (!activeSelectedEventId) return null;
|
|
12036
12054
|
const found = normalizedEvents.find((e) => e.id === activeSelectedEventId);
|
|
12037
12055
|
return found ?? null;
|
|
12038
12056
|
}, [activeSelectedEventId, normalizedEvents]);
|
|
12039
|
-
const selectedResource =
|
|
12057
|
+
const selectedResource = React36.useMemo(() => {
|
|
12040
12058
|
if (!selectedEvent) return void 0;
|
|
12041
12059
|
return resourceById.get(selectedEvent.resourceId);
|
|
12042
12060
|
}, [resourceById, selectedEvent]);
|
|
12043
|
-
const selectedTimeText =
|
|
12061
|
+
const selectedTimeText = React36.useMemo(() => {
|
|
12044
12062
|
if (!selectedEvent) return "";
|
|
12045
12063
|
return formatters?.eventTime?.({
|
|
12046
12064
|
start: selectedEvent._start,
|
|
@@ -12050,7 +12068,7 @@ function CalendarTimeline({
|
|
|
12050
12068
|
view: activeView
|
|
12051
12069
|
}) ?? defaultEventTime({ start: selectedEvent._start, end: selectedEvent._end, locale: resolvedLocale, timeZone: resolvedTimeZone, view: activeView });
|
|
12052
12070
|
}, [activeView, formatters, resolvedLocale, resolvedTimeZone, selectedEvent]);
|
|
12053
|
-
|
|
12071
|
+
React36.useEffect(() => {
|
|
12054
12072
|
if (!effectiveEnableEventSheet) return;
|
|
12055
12073
|
if (activeEventSheetOpen && activeSelectedEventId && !selectedEvent) {
|
|
12056
12074
|
setEventSheetOpen(false);
|
|
@@ -12060,24 +12078,24 @@ function CalendarTimeline({
|
|
|
12060
12078
|
const virt = virtualization == null ? rows.length > 60 : Boolean(virtualization.enabled);
|
|
12061
12079
|
const overscan = virtualization?.overscan ?? 8;
|
|
12062
12080
|
const isControlledRowHeights = rowHeights !== void 0;
|
|
12063
|
-
const [internalRowHeights, setInternalRowHeights] =
|
|
12064
|
-
|
|
12081
|
+
const [internalRowHeights, setInternalRowHeights] = React36.useState(() => defaultRowHeights ?? {});
|
|
12082
|
+
React36.useEffect(() => {
|
|
12065
12083
|
if (isControlledRowHeights) return;
|
|
12066
12084
|
if (!defaultRowHeights) return;
|
|
12067
12085
|
setInternalRowHeights(defaultRowHeights);
|
|
12068
12086
|
}, [defaultRowHeights, isControlledRowHeights]);
|
|
12069
12087
|
const activeRowHeights = isControlledRowHeights ? rowHeights : internalRowHeights;
|
|
12070
|
-
const autoRowHeightCfg =
|
|
12088
|
+
const autoRowHeightCfg = React36.useMemo(() => {
|
|
12071
12089
|
if (!autoRowHeight) return null;
|
|
12072
12090
|
return autoRowHeight === true ? {} : autoRowHeight;
|
|
12073
12091
|
}, [autoRowHeight]);
|
|
12074
|
-
const effectiveMaxLanesPerRow =
|
|
12092
|
+
const effectiveMaxLanesPerRow = React36.useMemo(() => {
|
|
12075
12093
|
if (!autoRowHeightCfg) return maxLanesPerRow;
|
|
12076
12094
|
const maxLanes = autoRowHeightCfg.maxLanesPerRow;
|
|
12077
12095
|
if (typeof maxLanes === "number" && Number.isFinite(maxLanes) && maxLanes > 0) return Math.floor(maxLanes);
|
|
12078
12096
|
return Number.POSITIVE_INFINITY;
|
|
12079
12097
|
}, [autoRowHeightCfg, maxLanesPerRow]);
|
|
12080
|
-
const autoRowHeightsByResource =
|
|
12098
|
+
const autoRowHeightsByResource = React36.useMemo(() => {
|
|
12081
12099
|
if (!autoRowHeightCfg) return null;
|
|
12082
12100
|
const maxRowHeight2 = autoRowHeightCfg.maxRowHeight;
|
|
12083
12101
|
const out = /* @__PURE__ */ new Map();
|
|
@@ -12095,7 +12113,7 @@ function CalendarTimeline({
|
|
|
12095
12113
|
}
|
|
12096
12114
|
return out;
|
|
12097
12115
|
}, [autoRowHeightCfg, eventHeight, eventsByResource, laneGap, lanePaddingY, slotStarts, slots.length, effectiveMaxLanesPerRow]);
|
|
12098
|
-
const getResourceRowHeight =
|
|
12116
|
+
const getResourceRowHeight = React36.useCallback(
|
|
12099
12117
|
(resourceId) => {
|
|
12100
12118
|
const h = activeRowHeights[resourceId];
|
|
12101
12119
|
const base = typeof h === "number" && Number.isFinite(h) && h > 0 ? h : effectiveRowHeight;
|
|
@@ -12105,7 +12123,7 @@ function CalendarTimeline({
|
|
|
12105
12123
|
},
|
|
12106
12124
|
[activeRowHeights, autoRowHeightsByResource, effectiveRowHeight]
|
|
12107
12125
|
);
|
|
12108
|
-
const setRowHeightForResource =
|
|
12126
|
+
const setRowHeightForResource = React36.useCallback(
|
|
12109
12127
|
(resourceId, height) => {
|
|
12110
12128
|
const clamped = clamp5(Math.round(height), rowMin, rowMax);
|
|
12111
12129
|
onRowHeightChange?.(clamped);
|
|
@@ -12122,7 +12140,7 @@ function CalendarTimeline({
|
|
|
12122
12140
|
},
|
|
12123
12141
|
[activeRowHeights, isControlledRowHeights, onRowHeightChange, onRowHeightsChange, rowMax, rowMin]
|
|
12124
12142
|
);
|
|
12125
|
-
const rowHeightsArray =
|
|
12143
|
+
const rowHeightsArray = React36.useMemo(() => {
|
|
12126
12144
|
return rows.map((r) => {
|
|
12127
12145
|
if (r.kind === "resource") return getResourceRowHeight(r.resource.id);
|
|
12128
12146
|
return sizeConfig.groupRowHeight;
|
|
@@ -12138,13 +12156,13 @@ function CalendarTimeline({
|
|
|
12138
12156
|
const endRow = virt ? virtualResult.endIndex : rows.length;
|
|
12139
12157
|
const topSpacer = virt ? virtualResult.topSpacer : 0;
|
|
12140
12158
|
const bottomSpacer = virt ? virtualResult.bottomSpacer : 0;
|
|
12141
|
-
const renderedRowsHeight =
|
|
12159
|
+
const renderedRowsHeight = React36.useMemo(() => {
|
|
12142
12160
|
let h = 0;
|
|
12143
12161
|
for (let i = startRow; i < endRow; i++) h += rowHeightsArray[i] ?? effectiveRowHeight;
|
|
12144
12162
|
return h;
|
|
12145
12163
|
}, [effectiveRowHeight, endRow, rowHeightsArray, startRow]);
|
|
12146
|
-
const resizeRef =
|
|
12147
|
-
const setResourceColumnWidth =
|
|
12164
|
+
const resizeRef = React36.useRef(null);
|
|
12165
|
+
const setResourceColumnWidth = React36.useCallback(
|
|
12148
12166
|
(next) => {
|
|
12149
12167
|
const clamped = clamp5(Math.round(next), colMin, colMax);
|
|
12150
12168
|
if (!isControlledResourceColumnWidth) setInternalResourceColumnWidth(clamped);
|
|
@@ -12152,7 +12170,7 @@ function CalendarTimeline({
|
|
|
12152
12170
|
},
|
|
12153
12171
|
[colMax, colMin, isControlledResourceColumnWidth, onResourceColumnWidthChange]
|
|
12154
12172
|
);
|
|
12155
|
-
const startResize =
|
|
12173
|
+
const startResize = React36.useCallback(
|
|
12156
12174
|
(mode, e, args) => {
|
|
12157
12175
|
if (e.button !== 0 || e.ctrlKey) return;
|
|
12158
12176
|
resizeRef.current = {
|
|
@@ -12195,7 +12213,7 @@ function CalendarTimeline({
|
|
|
12195
12213
|
},
|
|
12196
12214
|
[setResourceColumnWidth, setRowHeightForResource]
|
|
12197
12215
|
);
|
|
12198
|
-
|
|
12216
|
+
React36.useEffect(() => {
|
|
12199
12217
|
return () => {
|
|
12200
12218
|
if (!resizeRef.current) return;
|
|
12201
12219
|
resizeRef.current = null;
|
|
@@ -12203,7 +12221,7 @@ function CalendarTimeline({
|
|
|
12203
12221
|
document.body.style.userSelect = "";
|
|
12204
12222
|
};
|
|
12205
12223
|
}, []);
|
|
12206
|
-
const beginResizeColumn =
|
|
12224
|
+
const beginResizeColumn = React36.useCallback(
|
|
12207
12225
|
(e) => {
|
|
12208
12226
|
if (!canResizeColumn) return;
|
|
12209
12227
|
if (typeof effectiveResourceColumnWidth !== "number") return;
|
|
@@ -12211,7 +12229,7 @@ function CalendarTimeline({
|
|
|
12211
12229
|
},
|
|
12212
12230
|
[canResizeColumn, effectiveResourceColumnWidth, effectiveRowHeight, startResize]
|
|
12213
12231
|
);
|
|
12214
|
-
const beginResizeResourceRow =
|
|
12232
|
+
const beginResizeResourceRow = React36.useCallback(
|
|
12215
12233
|
(resourceId) => (e) => {
|
|
12216
12234
|
if (!canResizeRow) return;
|
|
12217
12235
|
startResize("row", e, {
|
|
@@ -12222,7 +12240,7 @@ function CalendarTimeline({
|
|
|
12222
12240
|
},
|
|
12223
12241
|
[canResizeRow, effectiveResourceColumnWidth, getResourceRowHeight, startResize]
|
|
12224
12242
|
);
|
|
12225
|
-
const title =
|
|
12243
|
+
const title = React36.useMemo(() => {
|
|
12226
12244
|
if (activeView === "month") {
|
|
12227
12245
|
return formatters?.monthTitle?.(activeDate, { locale: resolvedLocale, timeZone: resolvedTimeZone }) ?? defaultMonthTitle(activeDate, resolvedLocale, resolvedTimeZone);
|
|
12228
12246
|
}
|
|
@@ -12249,11 +12267,11 @@ function CalendarTimeline({
|
|
|
12249
12267
|
}, [activeDate, activeView, formatToken, formatters, l.sprint, l.week, range.end, range.start, resolvedLocale, resolvedTimeZone, slots.length]);
|
|
12250
12268
|
const createMode = interactions?.createMode ?? "drag";
|
|
12251
12269
|
const canCreate = !isViewOnly && (interactions?.creatable ?? false) && !!onCreateEvent;
|
|
12252
|
-
const [createOpen, setCreateOpen] =
|
|
12253
|
-
const [createResourceId, setCreateResourceId] =
|
|
12254
|
-
const [createStartIdx, setCreateStartIdx] =
|
|
12255
|
-
const [createEndIdx, setCreateEndIdx] =
|
|
12256
|
-
const resourceOptions =
|
|
12270
|
+
const [createOpen, setCreateOpen] = React36.useState(false);
|
|
12271
|
+
const [createResourceId, setCreateResourceId] = React36.useState(null);
|
|
12272
|
+
const [createStartIdx, setCreateStartIdx] = React36.useState(0);
|
|
12273
|
+
const [createEndIdx, setCreateEndIdx] = React36.useState(1);
|
|
12274
|
+
const resourceOptions = React36.useMemo(() => {
|
|
12257
12275
|
return resources.map((r) => ({
|
|
12258
12276
|
label: typeof r.label === "string" ? r.label : r.id,
|
|
12259
12277
|
value: r.id,
|
|
@@ -12261,7 +12279,7 @@ function CalendarTimeline({
|
|
|
12261
12279
|
disabled: r.disabled ?? false
|
|
12262
12280
|
}));
|
|
12263
12281
|
}, [resources]);
|
|
12264
|
-
const formatCreateBoundaryLabel =
|
|
12282
|
+
const formatCreateBoundaryLabel = React36.useMemo(() => {
|
|
12265
12283
|
const timeFmt = getDtf(resolvedLocale, resolvedTimeZone, { hour: "2-digit", minute: "2-digit", hourCycle: "h23" });
|
|
12266
12284
|
const dayFmt = getDtf(resolvedLocale, resolvedTimeZone, { weekday: "short", month: "short", day: "numeric" });
|
|
12267
12285
|
const yearFmt = getDtf(resolvedLocale, resolvedTimeZone, { year: "numeric" });
|
|
@@ -12309,7 +12327,7 @@ function CalendarTimeline({
|
|
|
12309
12327
|
return dayFmt.format(d);
|
|
12310
12328
|
};
|
|
12311
12329
|
}, [activeView, dueDateSprint, l.sprint, resolvedLocale, resolvedTimeZone, slotStarts, slotStarts.length]);
|
|
12312
|
-
const openCreate =
|
|
12330
|
+
const openCreate = React36.useCallback(() => {
|
|
12313
12331
|
if (!canCreate) return;
|
|
12314
12332
|
if (activeEventSheetOpen) setEventSheetOpen(false);
|
|
12315
12333
|
const firstResource = resources.find((r) => !r.disabled)?.id ?? resources[0]?.id ?? null;
|
|
@@ -12341,13 +12359,13 @@ function CalendarTimeline({
|
|
|
12341
12359
|
slotStarts,
|
|
12342
12360
|
slots.length
|
|
12343
12361
|
]);
|
|
12344
|
-
|
|
12362
|
+
React36.useEffect(() => {
|
|
12345
12363
|
setCreateEndIdx((prev) => Math.min(slots.length, Math.max(prev, createStartIdx + 1)));
|
|
12346
12364
|
}, [createStartIdx, slots.length]);
|
|
12347
|
-
const createStartOptions =
|
|
12365
|
+
const createStartOptions = React36.useMemo(() => {
|
|
12348
12366
|
return slotStarts.map((d, idx) => ({ label: formatCreateBoundaryLabel(d, { kind: "start", boundaryIdx: idx }), value: idx }));
|
|
12349
12367
|
}, [formatCreateBoundaryLabel, slotStarts]);
|
|
12350
|
-
const createEndOptions =
|
|
12368
|
+
const createEndOptions = React36.useMemo(() => {
|
|
12351
12369
|
const out = [];
|
|
12352
12370
|
for (let idx = createStartIdx + 1; idx <= slotStarts.length; idx++) {
|
|
12353
12371
|
const boundary = idx >= slotStarts.length ? range.end : slotStarts[idx];
|
|
@@ -12355,7 +12373,7 @@ function CalendarTimeline({
|
|
|
12355
12373
|
}
|
|
12356
12374
|
return out;
|
|
12357
12375
|
}, [createStartIdx, formatCreateBoundaryLabel, range.end, slotStarts]);
|
|
12358
|
-
const commitCreate =
|
|
12376
|
+
const commitCreate = React36.useCallback(() => {
|
|
12359
12377
|
if (!onCreateEvent) return;
|
|
12360
12378
|
if (!createResourceId) return;
|
|
12361
12379
|
const start = slotStarts[clamp5(createStartIdx, 0, Math.max(0, slotStarts.length - 1))];
|
|
@@ -12366,38 +12384,38 @@ function CalendarTimeline({
|
|
|
12366
12384
|
onCreateEvent({ resourceId: createResourceId, start, end: endBoundary });
|
|
12367
12385
|
setCreateOpen(false);
|
|
12368
12386
|
}, [createEndIdx, createResourceId, createStartIdx, onCreateEvent, range.end, slotStarts]);
|
|
12369
|
-
const dragRef =
|
|
12370
|
-
const [preview, setPreviewState] =
|
|
12371
|
-
const previewRef =
|
|
12372
|
-
const setPreview =
|
|
12387
|
+
const dragRef = React36.useRef(null);
|
|
12388
|
+
const [preview, setPreviewState] = React36.useState(null);
|
|
12389
|
+
const previewRef = React36.useRef(null);
|
|
12390
|
+
const setPreview = React36.useCallback((next) => {
|
|
12373
12391
|
previewRef.current = next;
|
|
12374
12392
|
setPreviewState(next);
|
|
12375
12393
|
}, []);
|
|
12376
|
-
const suppressNextEventClickRef =
|
|
12377
|
-
const [hoverCell, setHoverCellState] =
|
|
12378
|
-
const hoverCellRef =
|
|
12379
|
-
const setHoverCell =
|
|
12394
|
+
const suppressNextEventClickRef = React36.useRef(false);
|
|
12395
|
+
const [hoverCell, setHoverCellState] = React36.useState(null);
|
|
12396
|
+
const hoverCellRef = React36.useRef(null);
|
|
12397
|
+
const setHoverCell = React36.useCallback((next) => {
|
|
12380
12398
|
hoverCellRef.current = next;
|
|
12381
12399
|
setHoverCellState(next);
|
|
12382
12400
|
}, []);
|
|
12383
|
-
const autoScrollStateRef =
|
|
12401
|
+
const autoScrollStateRef = React36.useRef({
|
|
12384
12402
|
dir: 0,
|
|
12385
12403
|
speed: 0,
|
|
12386
12404
|
lastClientX: 0,
|
|
12387
12405
|
lastClientY: 0
|
|
12388
12406
|
});
|
|
12389
|
-
const autoScrollRafRef =
|
|
12390
|
-
const dragPreviewRafRef =
|
|
12391
|
-
const dragPreviewPointRef =
|
|
12392
|
-
const hoverCellRafRef =
|
|
12393
|
-
const hoverCellPendingRef =
|
|
12394
|
-
const stopAutoScroll =
|
|
12407
|
+
const autoScrollRafRef = React36.useRef(null);
|
|
12408
|
+
const dragPreviewRafRef = React36.useRef(null);
|
|
12409
|
+
const dragPreviewPointRef = React36.useRef(null);
|
|
12410
|
+
const hoverCellRafRef = React36.useRef(null);
|
|
12411
|
+
const hoverCellPendingRef = React36.useRef(null);
|
|
12412
|
+
const stopAutoScroll = React36.useCallback(() => {
|
|
12395
12413
|
if (autoScrollRafRef.current != null) cancelAnimationFrame(autoScrollRafRef.current);
|
|
12396
12414
|
autoScrollRafRef.current = null;
|
|
12397
12415
|
autoScrollStateRef.current.dir = 0;
|
|
12398
12416
|
autoScrollStateRef.current.speed = 0;
|
|
12399
12417
|
}, []);
|
|
12400
|
-
const getPointerContext =
|
|
12418
|
+
const getPointerContext = React36.useCallback(
|
|
12401
12419
|
(clientX, clientY, opts) => {
|
|
12402
12420
|
const body = bodyRef.current;
|
|
12403
12421
|
if (!body) return null;
|
|
@@ -12415,7 +12433,7 @@ function CalendarTimeline({
|
|
|
12415
12433
|
},
|
|
12416
12434
|
[xToSlotIdx]
|
|
12417
12435
|
);
|
|
12418
|
-
const slotToDate =
|
|
12436
|
+
const slotToDate = React36.useCallback(
|
|
12419
12437
|
(slotIdx) => {
|
|
12420
12438
|
const start = slotStarts[clamp5(slotIdx, 0, slotStarts.length - 1)];
|
|
12421
12439
|
if (activeView === "day") {
|
|
@@ -12429,7 +12447,7 @@ function CalendarTimeline({
|
|
|
12429
12447
|
},
|
|
12430
12448
|
[activeView, dayTimeStepMinutes, resolvedTimeZone, slotStarts]
|
|
12431
12449
|
);
|
|
12432
|
-
const updateDragPreview =
|
|
12450
|
+
const updateDragPreview = React36.useCallback(
|
|
12433
12451
|
(clientX, clientY) => {
|
|
12434
12452
|
const drag = dragRef.current;
|
|
12435
12453
|
if (!drag) return;
|
|
@@ -12473,13 +12491,13 @@ function CalendarTimeline({
|
|
|
12473
12491
|
},
|
|
12474
12492
|
[getPointerContext, range.end, range.start, slotToDate, slots.length]
|
|
12475
12493
|
);
|
|
12476
|
-
const flushDragPreview =
|
|
12494
|
+
const flushDragPreview = React36.useCallback(() => {
|
|
12477
12495
|
dragPreviewRafRef.current = null;
|
|
12478
12496
|
const point = dragPreviewPointRef.current;
|
|
12479
12497
|
if (!point) return;
|
|
12480
12498
|
updateDragPreview(point.x, point.y);
|
|
12481
12499
|
}, [updateDragPreview]);
|
|
12482
|
-
const scheduleDragPreview =
|
|
12500
|
+
const scheduleDragPreview = React36.useCallback(
|
|
12483
12501
|
(clientX, clientY) => {
|
|
12484
12502
|
dragPreviewPointRef.current = { x: clientX, y: clientY };
|
|
12485
12503
|
if (dragPreviewRafRef.current != null) return;
|
|
@@ -12487,7 +12505,7 @@ function CalendarTimeline({
|
|
|
12487
12505
|
},
|
|
12488
12506
|
[flushDragPreview]
|
|
12489
12507
|
);
|
|
12490
|
-
const applyHoverCell =
|
|
12508
|
+
const applyHoverCell = React36.useCallback(
|
|
12491
12509
|
(next) => {
|
|
12492
12510
|
const prev = hoverCellRef.current;
|
|
12493
12511
|
const same = prev == null && next == null || prev != null && next != null && prev.resourceId === next.resourceId && prev.slotIdx === next.slotIdx && Math.abs(prev.y - next.y) <= 0.5;
|
|
@@ -12496,11 +12514,11 @@ function CalendarTimeline({
|
|
|
12496
12514
|
},
|
|
12497
12515
|
[setHoverCell]
|
|
12498
12516
|
);
|
|
12499
|
-
const flushHoverCell =
|
|
12517
|
+
const flushHoverCell = React36.useCallback(() => {
|
|
12500
12518
|
hoverCellRafRef.current = null;
|
|
12501
12519
|
applyHoverCell(hoverCellPendingRef.current);
|
|
12502
12520
|
}, [applyHoverCell]);
|
|
12503
|
-
const scheduleHoverCell =
|
|
12521
|
+
const scheduleHoverCell = React36.useCallback(
|
|
12504
12522
|
(next) => {
|
|
12505
12523
|
hoverCellPendingRef.current = next;
|
|
12506
12524
|
if (hoverCellRafRef.current != null) return;
|
|
@@ -12508,7 +12526,7 @@ function CalendarTimeline({
|
|
|
12508
12526
|
},
|
|
12509
12527
|
[flushHoverCell]
|
|
12510
12528
|
);
|
|
12511
|
-
const autoScrollTick =
|
|
12529
|
+
const autoScrollTick = React36.useCallback(() => {
|
|
12512
12530
|
const drag = dragRef.current;
|
|
12513
12531
|
const body = bodyRef.current;
|
|
12514
12532
|
const st = autoScrollStateRef.current;
|
|
@@ -12527,7 +12545,7 @@ function CalendarTimeline({
|
|
|
12527
12545
|
updateDragPreview(st.lastClientX, st.lastClientY);
|
|
12528
12546
|
autoScrollRafRef.current = requestAnimationFrame(autoScrollTick);
|
|
12529
12547
|
}, [stopAutoScroll, updateDragPreview]);
|
|
12530
|
-
const updateAutoScrollFromPointer =
|
|
12548
|
+
const updateAutoScrollFromPointer = React36.useCallback(
|
|
12531
12549
|
(clientX, clientY) => {
|
|
12532
12550
|
const body = bodyRef.current;
|
|
12533
12551
|
if (!body) return;
|
|
@@ -12558,8 +12576,8 @@ function CalendarTimeline({
|
|
|
12558
12576
|
},
|
|
12559
12577
|
[autoScrollTick, stopAutoScroll]
|
|
12560
12578
|
);
|
|
12561
|
-
|
|
12562
|
-
|
|
12579
|
+
React36.useEffect(() => stopAutoScroll, [stopAutoScroll]);
|
|
12580
|
+
React36.useEffect(() => {
|
|
12563
12581
|
return () => {
|
|
12564
12582
|
if (dragPreviewRafRef.current != null) cancelAnimationFrame(dragPreviewRafRef.current);
|
|
12565
12583
|
if (hoverCellRafRef.current != null) cancelAnimationFrame(hoverCellRafRef.current);
|
|
@@ -12706,7 +12724,7 @@ function CalendarTimeline({
|
|
|
12706
12724
|
}
|
|
12707
12725
|
setPreview(null);
|
|
12708
12726
|
};
|
|
12709
|
-
const onBodyPointerLeave =
|
|
12727
|
+
const onBodyPointerLeave = React36.useCallback(() => {
|
|
12710
12728
|
hoverCellPendingRef.current = null;
|
|
12711
12729
|
if (hoverCellRafRef.current != null) {
|
|
12712
12730
|
cancelAnimationFrame(hoverCellRafRef.current);
|
|
@@ -12733,7 +12751,7 @@ function CalendarTimeline({
|
|
|
12733
12751
|
}
|
|
12734
12752
|
);
|
|
12735
12753
|
};
|
|
12736
|
-
const slotHeaderNodes =
|
|
12754
|
+
const slotHeaderNodes = React36.useMemo(() => {
|
|
12737
12755
|
const startIdx = colVirtEnabled ? visibleSlots.startIdx : 0;
|
|
12738
12756
|
const endIdx = colVirtEnabled ? visibleSlots.endIdx : slots.length;
|
|
12739
12757
|
const leftSpacer = startIdx > 0 ? slotLefts[startIdx] ?? 0 : 0;
|
|
@@ -13058,7 +13076,7 @@ function CalendarTimeline({
|
|
|
13058
13076
|
]
|
|
13059
13077
|
}
|
|
13060
13078
|
);
|
|
13061
|
-
if (!enableEventTooltips) return /* @__PURE__ */ jsx41(
|
|
13079
|
+
if (!enableEventTooltips) return /* @__PURE__ */ jsx41(React36.Fragment, { children: block }, ev.id);
|
|
13062
13080
|
const tooltipContent = /* @__PURE__ */ jsxs33("div", { className: "flex flex-col gap-0.5", children: [
|
|
13063
13081
|
/* @__PURE__ */ jsx41("div", { className: "font-semibold", children: tooltipTitle }),
|
|
13064
13082
|
/* @__PURE__ */ jsx41("div", { className: "text-xs opacity-80", children: timeText }),
|
|
@@ -13214,7 +13232,7 @@ function CalendarTimeline({
|
|
|
13214
13232
|
}
|
|
13215
13233
|
|
|
13216
13234
|
// src/components/MultiCombobox.tsx
|
|
13217
|
-
import * as
|
|
13235
|
+
import * as React37 from "react";
|
|
13218
13236
|
import { useId as useId5 } from "react";
|
|
13219
13237
|
import { ChevronDown as ChevronDown4, Search as Search4, Check as Check6, SearchX as SearchX2, Loader2 as Loader24, X as X12, Sparkles as Sparkles3 } from "lucide-react";
|
|
13220
13238
|
import { Fragment as Fragment13, jsx as jsx42, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
@@ -13251,29 +13269,29 @@ var MultiCombobox = ({
|
|
|
13251
13269
|
maxTagsVisible = 3,
|
|
13252
13270
|
useOverlayScrollbar = false
|
|
13253
13271
|
}) => {
|
|
13254
|
-
const [query, setQuery] =
|
|
13255
|
-
const [open, setOpen] =
|
|
13256
|
-
const [activeIndex, setActiveIndex] =
|
|
13257
|
-
const inputRef =
|
|
13258
|
-
const listRef =
|
|
13259
|
-
const optionsListRef =
|
|
13272
|
+
const [query, setQuery] = React37.useState("");
|
|
13273
|
+
const [open, setOpen] = React37.useState(false);
|
|
13274
|
+
const [activeIndex, setActiveIndex] = React37.useState(null);
|
|
13275
|
+
const inputRef = React37.useRef(null);
|
|
13276
|
+
const listRef = React37.useRef([]);
|
|
13277
|
+
const optionsListRef = React37.useRef(null);
|
|
13260
13278
|
useOverlayScrollbarTarget(optionsListRef, { enabled: useOverlayScrollbar });
|
|
13261
|
-
const triggerRef =
|
|
13279
|
+
const triggerRef = React37.useRef(null);
|
|
13262
13280
|
useShadCNAnimations();
|
|
13263
|
-
const normalizedOptions =
|
|
13281
|
+
const normalizedOptions = React37.useMemo(
|
|
13264
13282
|
() => options.map(
|
|
13265
13283
|
(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 }
|
|
13266
13284
|
),
|
|
13267
13285
|
[options]
|
|
13268
13286
|
);
|
|
13269
13287
|
const enableSearch = normalizedOptions.length > 10;
|
|
13270
|
-
const filtered =
|
|
13288
|
+
const filtered = React37.useMemo(
|
|
13271
13289
|
() => enableSearch ? normalizedOptions.filter(
|
|
13272
13290
|
(opt) => opt.label.toLowerCase().includes(query.trim().toLowerCase()) || opt.description?.toLowerCase().includes(query.trim().toLowerCase())
|
|
13273
13291
|
) : normalizedOptions,
|
|
13274
13292
|
[normalizedOptions, query, enableSearch]
|
|
13275
13293
|
);
|
|
13276
|
-
const groupedOptions =
|
|
13294
|
+
const groupedOptions = React37.useMemo(() => {
|
|
13277
13295
|
if (!groupBy) return null;
|
|
13278
13296
|
const groups = /* @__PURE__ */ new Map();
|
|
13279
13297
|
filtered.forEach((opt) => {
|
|
@@ -13309,7 +13327,7 @@ var MultiCombobox = ({
|
|
|
13309
13327
|
const handleClearAll = () => {
|
|
13310
13328
|
onChange([]);
|
|
13311
13329
|
};
|
|
13312
|
-
|
|
13330
|
+
React37.useEffect(() => {
|
|
13313
13331
|
if (open && enableSearch) {
|
|
13314
13332
|
setTimeout(() => {
|
|
13315
13333
|
inputRef.current?.focus();
|
|
@@ -13533,7 +13551,7 @@ var MultiCombobox = ({
|
|
|
13533
13551
|
/* @__PURE__ */ jsx42("div", { className: cn("flex items-center gap-1.5 flex-1 overflow-hidden", size === "sm" ? "min-h-4" : size === "lg" ? "min-h-8" : "min-h-6"), children: value.length > 0 ? showTags ? /* @__PURE__ */ jsxs34(Fragment13, { children: [
|
|
13534
13552
|
visibleTags.map((option) => {
|
|
13535
13553
|
if (renderTag) {
|
|
13536
|
-
return /* @__PURE__ */ jsx42(
|
|
13554
|
+
return /* @__PURE__ */ jsx42(React37.Fragment, { children: renderTag(option, () => handleRemove(option.value)) }, option.value);
|
|
13537
13555
|
}
|
|
13538
13556
|
return /* @__PURE__ */ jsxs34(
|
|
13539
13557
|
"span",
|
|
@@ -13676,17 +13694,17 @@ var MultiCombobox = ({
|
|
|
13676
13694
|
};
|
|
13677
13695
|
|
|
13678
13696
|
// src/components/RadioGroup.tsx
|
|
13679
|
-
import * as
|
|
13697
|
+
import * as React38 from "react";
|
|
13680
13698
|
import { jsx as jsx43, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
13681
|
-
var RadioGroupContext =
|
|
13699
|
+
var RadioGroupContext = React38.createContext(void 0);
|
|
13682
13700
|
var useRadioGroup = () => {
|
|
13683
|
-
const context =
|
|
13701
|
+
const context = React38.useContext(RadioGroupContext);
|
|
13684
13702
|
if (!context) {
|
|
13685
13703
|
throw new Error("RadioGroupItem must be used within a RadioGroup");
|
|
13686
13704
|
}
|
|
13687
13705
|
return context;
|
|
13688
13706
|
};
|
|
13689
|
-
var RadioGroup =
|
|
13707
|
+
var RadioGroup = React38.forwardRef(
|
|
13690
13708
|
({
|
|
13691
13709
|
value,
|
|
13692
13710
|
defaultValue,
|
|
@@ -13702,7 +13720,7 @@ var RadioGroup = React37.forwardRef(
|
|
|
13702
13720
|
error = false,
|
|
13703
13721
|
errorMessage
|
|
13704
13722
|
}, ref) => {
|
|
13705
|
-
const [internalValue, setInternalValue] =
|
|
13723
|
+
const [internalValue, setInternalValue] = React38.useState(defaultValue || "");
|
|
13706
13724
|
const isControlled = value !== void 0;
|
|
13707
13725
|
const currentValue = isControlled ? value : internalValue;
|
|
13708
13726
|
const handleValueChange = (newValue) => {
|
|
@@ -13713,7 +13731,7 @@ var RadioGroup = React37.forwardRef(
|
|
|
13713
13731
|
onValueChange?.(newValue);
|
|
13714
13732
|
}
|
|
13715
13733
|
};
|
|
13716
|
-
const uniqueId =
|
|
13734
|
+
const uniqueId = React38.useId();
|
|
13717
13735
|
const radioName = name || `radio-group-${uniqueId}`;
|
|
13718
13736
|
return /* @__PURE__ */ jsx43(
|
|
13719
13737
|
RadioGroupContext.Provider,
|
|
@@ -13771,7 +13789,7 @@ var sizeStyles7 = {
|
|
|
13771
13789
|
padding: "p-4"
|
|
13772
13790
|
}
|
|
13773
13791
|
};
|
|
13774
|
-
var RadioGroupItem =
|
|
13792
|
+
var RadioGroupItem = React38.forwardRef(
|
|
13775
13793
|
({ value, id, disabled, className, children, label, labelClassName, description, icon }, ref) => {
|
|
13776
13794
|
const { value: selectedValue, onValueChange, name, disabled: groupDisabled, size = "md", variant = "default" } = useRadioGroup();
|
|
13777
13795
|
const isDisabled = disabled || groupDisabled;
|
|
@@ -13949,7 +13967,7 @@ var RadioGroupItem = React37.forwardRef(
|
|
|
13949
13967
|
RadioGroupItem.displayName = "RadioGroupItem";
|
|
13950
13968
|
|
|
13951
13969
|
// src/components/Slider.tsx
|
|
13952
|
-
import * as
|
|
13970
|
+
import * as React39 from "react";
|
|
13953
13971
|
import { Fragment as Fragment14, jsx as jsx44, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
13954
13972
|
var SIZE_STYLES = {
|
|
13955
13973
|
sm: {
|
|
@@ -13972,7 +13990,7 @@ var SIZE_STYLES = {
|
|
|
13972
13990
|
}
|
|
13973
13991
|
};
|
|
13974
13992
|
var clamp6 = (n, min, max) => Math.min(max, Math.max(min, n));
|
|
13975
|
-
var Slider =
|
|
13993
|
+
var Slider = React39.forwardRef(
|
|
13976
13994
|
({
|
|
13977
13995
|
className,
|
|
13978
13996
|
mode = "single",
|
|
@@ -14007,17 +14025,17 @@ var Slider = React38.forwardRef(
|
|
|
14007
14025
|
...props
|
|
14008
14026
|
}, ref) => {
|
|
14009
14027
|
const isRange = mode === "range";
|
|
14010
|
-
const trackRef =
|
|
14011
|
-
const [internalValue, setInternalValue] =
|
|
14012
|
-
const [internalRange, setInternalRange] =
|
|
14028
|
+
const trackRef = React39.useRef(null);
|
|
14029
|
+
const [internalValue, setInternalValue] = React39.useState(defaultValue);
|
|
14030
|
+
const [internalRange, setInternalRange] = React39.useState(() => {
|
|
14013
14031
|
if (defaultRangeValue) return defaultRangeValue;
|
|
14014
14032
|
const v = clamp6(defaultValue, min, max);
|
|
14015
14033
|
return [min, v];
|
|
14016
14034
|
});
|
|
14017
|
-
const [activeThumb, setActiveThumb] =
|
|
14018
|
-
const dragRef =
|
|
14019
|
-
const [isHovering, setIsHovering] =
|
|
14020
|
-
const [isDragging, setIsDragging] =
|
|
14035
|
+
const [activeThumb, setActiveThumb] = React39.useState(null);
|
|
14036
|
+
const dragRef = React39.useRef(null);
|
|
14037
|
+
const [isHovering, setIsHovering] = React39.useState(false);
|
|
14038
|
+
const [isDragging, setIsDragging] = React39.useState(false);
|
|
14021
14039
|
const isControlled = value !== void 0;
|
|
14022
14040
|
const currentValue = isControlled ? value : internalValue;
|
|
14023
14041
|
const isRangeControlled = rangeValue !== void 0;
|
|
@@ -14025,7 +14043,7 @@ var Slider = React38.forwardRef(
|
|
|
14025
14043
|
const rangeMin = clamp6(currentRange[0] ?? min, min, max);
|
|
14026
14044
|
const rangeMax = clamp6(currentRange[1] ?? max, min, max);
|
|
14027
14045
|
const normalizedRange = rangeMin <= rangeMax ? [rangeMin, rangeMax] : [rangeMax, rangeMin];
|
|
14028
|
-
const handleSingleChange =
|
|
14046
|
+
const handleSingleChange = React39.useCallback(
|
|
14029
14047
|
(e) => {
|
|
14030
14048
|
const newValue = Number(e.target.value);
|
|
14031
14049
|
if (!isControlled) {
|
|
@@ -14036,14 +14054,14 @@ var Slider = React38.forwardRef(
|
|
|
14036
14054
|
},
|
|
14037
14055
|
[isControlled, onChange, onValueChange]
|
|
14038
14056
|
);
|
|
14039
|
-
const emitRange =
|
|
14057
|
+
const emitRange = React39.useCallback(
|
|
14040
14058
|
(next) => {
|
|
14041
14059
|
onRangeChange?.(next);
|
|
14042
14060
|
onRangeValueChange?.(next);
|
|
14043
14061
|
},
|
|
14044
14062
|
[onRangeChange, onRangeValueChange]
|
|
14045
14063
|
);
|
|
14046
|
-
const handleRangeChange =
|
|
14064
|
+
const handleRangeChange = React39.useCallback(
|
|
14047
14065
|
(thumb) => (e) => {
|
|
14048
14066
|
const nextVal = Number(e.target.value);
|
|
14049
14067
|
const [curMin, curMax] = normalizedRange;
|
|
@@ -14058,7 +14076,7 @@ var Slider = React38.forwardRef(
|
|
|
14058
14076
|
const rangeStartPct = (normalizedRange[0] - min) / denom * 100;
|
|
14059
14077
|
const rangeEndPct = (normalizedRange[1] - min) / denom * 100;
|
|
14060
14078
|
const sizeStyles8 = SIZE_STYLES[size];
|
|
14061
|
-
const displayValue =
|
|
14079
|
+
const displayValue = React39.useMemo(() => {
|
|
14062
14080
|
if (isRange) {
|
|
14063
14081
|
const a = formatValue ? formatValue(normalizedRange[0]) : normalizedRange[0].toString();
|
|
14064
14082
|
const b = formatValue ? formatValue(normalizedRange[1]) : normalizedRange[1].toString();
|
|
@@ -14066,7 +14084,7 @@ var Slider = React38.forwardRef(
|
|
|
14066
14084
|
}
|
|
14067
14085
|
return formatValue ? formatValue(currentValue) : currentValue.toString();
|
|
14068
14086
|
}, [currentValue, formatValue, isRange, normalizedRange]);
|
|
14069
|
-
const quantize =
|
|
14087
|
+
const quantize = React39.useCallback(
|
|
14070
14088
|
(v) => {
|
|
14071
14089
|
const stepped = Math.round((v - min) / step) * step + min;
|
|
14072
14090
|
const fixed = Number(stepped.toFixed(10));
|
|
@@ -14074,7 +14092,7 @@ var Slider = React38.forwardRef(
|
|
|
14074
14092
|
},
|
|
14075
14093
|
[max, min, step]
|
|
14076
14094
|
);
|
|
14077
|
-
const valueFromClientX =
|
|
14095
|
+
const valueFromClientX = React39.useCallback(
|
|
14078
14096
|
(clientX) => {
|
|
14079
14097
|
const el = trackRef.current;
|
|
14080
14098
|
if (!el) return min;
|
|
@@ -14330,7 +14348,7 @@ Slider.displayName = "Slider";
|
|
|
14330
14348
|
|
|
14331
14349
|
// src/components/OverlayControls.tsx
|
|
14332
14350
|
import { Dot as Dot2, Maximize2, Pause, Play, RotateCcw, RotateCw, Volume2, VolumeX } from "lucide-react";
|
|
14333
|
-
import
|
|
14351
|
+
import React40 from "react";
|
|
14334
14352
|
import { Fragment as Fragment15, jsx as jsx45, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
14335
14353
|
function OverlayControls({
|
|
14336
14354
|
mode,
|
|
@@ -14361,24 +14379,24 @@ function OverlayControls({
|
|
|
14361
14379
|
}) {
|
|
14362
14380
|
const hoverClasses = showOnHover ? "opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto" : "opacity-100 pointer-events-auto";
|
|
14363
14381
|
const showControlsBar = mode === "review";
|
|
14364
|
-
const [rateOpen, setRateOpen] =
|
|
14365
|
-
const rateWrapRef =
|
|
14366
|
-
const [controlsVisible, setControlsVisible] =
|
|
14367
|
-
const hideTimerRef =
|
|
14368
|
-
const [previewData, setPreviewData] =
|
|
14369
|
-
const sliderRef =
|
|
14370
|
-
const [isDragging, setIsDragging] =
|
|
14371
|
-
const [dragValue, setDragValue] =
|
|
14372
|
-
|
|
14382
|
+
const [rateOpen, setRateOpen] = React40.useState(false);
|
|
14383
|
+
const rateWrapRef = React40.useRef(null);
|
|
14384
|
+
const [controlsVisible, setControlsVisible] = React40.useState(true);
|
|
14385
|
+
const hideTimerRef = React40.useRef(null);
|
|
14386
|
+
const [previewData, setPreviewData] = React40.useState(null);
|
|
14387
|
+
const sliderRef = React40.useRef(null);
|
|
14388
|
+
const [isDragging, setIsDragging] = React40.useState(false);
|
|
14389
|
+
const [dragValue, setDragValue] = React40.useState(value);
|
|
14390
|
+
React40.useEffect(() => {
|
|
14373
14391
|
if (!isDragging) {
|
|
14374
14392
|
setDragValue(value);
|
|
14375
14393
|
}
|
|
14376
14394
|
}, [value, isDragging]);
|
|
14377
|
-
const [keyboardFeedback, setKeyboardFeedback] =
|
|
14378
|
-
const feedbackTimerRef =
|
|
14379
|
-
const seekAccumulatorRef =
|
|
14380
|
-
const seekAccumulatorTimerRef =
|
|
14381
|
-
|
|
14395
|
+
const [keyboardFeedback, setKeyboardFeedback] = React40.useState(null);
|
|
14396
|
+
const feedbackTimerRef = React40.useRef(null);
|
|
14397
|
+
const seekAccumulatorRef = React40.useRef(0);
|
|
14398
|
+
const seekAccumulatorTimerRef = React40.useRef(null);
|
|
14399
|
+
React40.useEffect(() => {
|
|
14382
14400
|
const onDocDown = (e) => {
|
|
14383
14401
|
if (!rateOpen) return;
|
|
14384
14402
|
const wrap = rateWrapRef.current;
|
|
@@ -14389,7 +14407,7 @@ function OverlayControls({
|
|
|
14389
14407
|
document.addEventListener("mousedown", onDocDown);
|
|
14390
14408
|
return () => document.removeEventListener("mousedown", onDocDown);
|
|
14391
14409
|
}, [rateOpen]);
|
|
14392
|
-
|
|
14410
|
+
React40.useEffect(() => {
|
|
14393
14411
|
if (!autoHide || showOnHover) return;
|
|
14394
14412
|
const resetTimer = () => {
|
|
14395
14413
|
if (hideTimerRef.current) clearTimeout(hideTimerRef.current);
|
|
@@ -14427,7 +14445,7 @@ function OverlayControls({
|
|
|
14427
14445
|
seekAccumulatorRef.current = 0;
|
|
14428
14446
|
}, 1e3);
|
|
14429
14447
|
};
|
|
14430
|
-
|
|
14448
|
+
React40.useEffect(() => {
|
|
14431
14449
|
if (!enableKeyboardShortcuts) return;
|
|
14432
14450
|
const handleKeyDown = (e) => {
|
|
14433
14451
|
if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement) return;
|
|
@@ -15991,7 +16009,7 @@ function FileUpload({
|
|
|
15991
16009
|
}
|
|
15992
16010
|
|
|
15993
16011
|
// src/components/Carousel.tsx
|
|
15994
|
-
import * as
|
|
16012
|
+
import * as React42 from "react";
|
|
15995
16013
|
import { ChevronLeft as ChevronLeft5, ChevronRight as ChevronRight7 } from "lucide-react";
|
|
15996
16014
|
import { Fragment as Fragment18, jsx as jsx49, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
15997
16015
|
function Carousel({
|
|
@@ -16014,19 +16032,19 @@ function Carousel({
|
|
|
16014
16032
|
thumbnailRenderer,
|
|
16015
16033
|
ariaLabel = "Carousel"
|
|
16016
16034
|
}) {
|
|
16017
|
-
const [currentIndex, setCurrentIndex] =
|
|
16018
|
-
const [isPaused, setIsPaused] =
|
|
16019
|
-
const [isDragging, setIsDragging] =
|
|
16020
|
-
const [startPos, setStartPos] =
|
|
16021
|
-
const [currentTranslate, setCurrentTranslate] =
|
|
16022
|
-
const [prevTranslate, setPrevTranslate] =
|
|
16023
|
-
const progressElRef =
|
|
16024
|
-
const carouselRef =
|
|
16025
|
-
const rafRef =
|
|
16026
|
-
const totalSlides =
|
|
16035
|
+
const [currentIndex, setCurrentIndex] = React42.useState(0);
|
|
16036
|
+
const [isPaused, setIsPaused] = React42.useState(false);
|
|
16037
|
+
const [isDragging, setIsDragging] = React42.useState(false);
|
|
16038
|
+
const [startPos, setStartPos] = React42.useState(0);
|
|
16039
|
+
const [currentTranslate, setCurrentTranslate] = React42.useState(0);
|
|
16040
|
+
const [prevTranslate, setPrevTranslate] = React42.useState(0);
|
|
16041
|
+
const progressElRef = React42.useRef(null);
|
|
16042
|
+
const carouselRef = React42.useRef(null);
|
|
16043
|
+
const rafRef = React42.useRef(null);
|
|
16044
|
+
const totalSlides = React42.Children.count(children);
|
|
16027
16045
|
const maxIndex = Math.max(0, totalSlides - slidesToShow);
|
|
16028
16046
|
const isHorizontal = orientation === "horizontal";
|
|
16029
|
-
const scrollPrev =
|
|
16047
|
+
const scrollPrev = React42.useCallback(() => {
|
|
16030
16048
|
setCurrentIndex((prev) => {
|
|
16031
16049
|
if (prev === 0) {
|
|
16032
16050
|
return loop ? maxIndex : 0;
|
|
@@ -16034,7 +16052,7 @@ function Carousel({
|
|
|
16034
16052
|
return Math.max(0, prev - slidesToScroll);
|
|
16035
16053
|
});
|
|
16036
16054
|
}, [loop, maxIndex, slidesToScroll]);
|
|
16037
|
-
const scrollNext =
|
|
16055
|
+
const scrollNext = React42.useCallback(() => {
|
|
16038
16056
|
setCurrentIndex((prev) => {
|
|
16039
16057
|
if (prev >= maxIndex) {
|
|
16040
16058
|
return loop ? 0 : maxIndex;
|
|
@@ -16042,13 +16060,13 @@ function Carousel({
|
|
|
16042
16060
|
return Math.min(maxIndex, prev + slidesToScroll);
|
|
16043
16061
|
});
|
|
16044
16062
|
}, [loop, maxIndex, slidesToScroll]);
|
|
16045
|
-
const scrollTo =
|
|
16063
|
+
const scrollTo = React42.useCallback(
|
|
16046
16064
|
(index) => {
|
|
16047
16065
|
setCurrentIndex(Math.min(maxIndex, Math.max(0, index)));
|
|
16048
16066
|
},
|
|
16049
16067
|
[maxIndex]
|
|
16050
16068
|
);
|
|
16051
|
-
|
|
16069
|
+
React42.useEffect(() => {
|
|
16052
16070
|
const handleKeyDown = (e) => {
|
|
16053
16071
|
if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
|
|
16054
16072
|
e.preventDefault();
|
|
@@ -16070,7 +16088,7 @@ function Carousel({
|
|
|
16070
16088
|
return () => carousel.removeEventListener("keydown", handleKeyDown);
|
|
16071
16089
|
}
|
|
16072
16090
|
}, [scrollPrev, scrollNext, scrollTo, maxIndex]);
|
|
16073
|
-
|
|
16091
|
+
React42.useEffect(() => {
|
|
16074
16092
|
const stop = () => {
|
|
16075
16093
|
if (rafRef.current != null) {
|
|
16076
16094
|
cancelAnimationFrame(rafRef.current);
|
|
@@ -16129,7 +16147,7 @@ function Carousel({
|
|
|
16129
16147
|
setCurrentTranslate(0);
|
|
16130
16148
|
setPrevTranslate(0);
|
|
16131
16149
|
};
|
|
16132
|
-
|
|
16150
|
+
React42.useEffect(() => {
|
|
16133
16151
|
onSlideChange?.(currentIndex);
|
|
16134
16152
|
}, [currentIndex, onSlideChange]);
|
|
16135
16153
|
const getAnimationStyles2 = () => {
|
|
@@ -16182,7 +16200,7 @@ function Carousel({
|
|
|
16182
16200
|
role: "group",
|
|
16183
16201
|
"aria-atomic": "false",
|
|
16184
16202
|
"aria-live": autoScroll ? "off" : "polite",
|
|
16185
|
-
children:
|
|
16203
|
+
children: React42.Children.map(children, (child, idx) => /* @__PURE__ */ jsx49(
|
|
16186
16204
|
"div",
|
|
16187
16205
|
{
|
|
16188
16206
|
className: cn(
|
|
@@ -16272,7 +16290,7 @@ function Carousel({
|
|
|
16272
16290
|
"absolute bottom-0 left-0 right-0 flex gap-2 p-4 bg-linear-to-t from-black/50 to-transparent overflow-x-auto",
|
|
16273
16291
|
isHorizontal ? "flex-row" : "flex-col"
|
|
16274
16292
|
),
|
|
16275
|
-
children:
|
|
16293
|
+
children: React42.Children.map(children, (child, idx) => /* @__PURE__ */ jsx49(
|
|
16276
16294
|
"button",
|
|
16277
16295
|
{
|
|
16278
16296
|
onClick: () => scrollTo(idx),
|
|
@@ -16293,7 +16311,7 @@ function Carousel({
|
|
|
16293
16311
|
}
|
|
16294
16312
|
|
|
16295
16313
|
// src/components/FallingIcons.tsx
|
|
16296
|
-
import
|
|
16314
|
+
import React43 from "react";
|
|
16297
16315
|
import { jsx as jsx50, jsxs as jsxs42 } from "react/jsx-runtime";
|
|
16298
16316
|
var DEFAULT_COUNT = 24;
|
|
16299
16317
|
var DEFAULT_SPEED_RANGE = [6, 14];
|
|
@@ -16321,10 +16339,10 @@ function FallingIcons({
|
|
|
16321
16339
|
physics,
|
|
16322
16340
|
easingFunction = "linear"
|
|
16323
16341
|
}) {
|
|
16324
|
-
const uid =
|
|
16325
|
-
const containerRef =
|
|
16326
|
-
const [fallDist, setFallDist] =
|
|
16327
|
-
const idRef =
|
|
16342
|
+
const uid = React43.useId().replace(/[:]/g, "");
|
|
16343
|
+
const containerRef = React43.useRef(null);
|
|
16344
|
+
const [fallDist, setFallDist] = React43.useState(null);
|
|
16345
|
+
const idRef = React43.useRef(1);
|
|
16328
16346
|
const gravity = physics?.gravity ?? 1;
|
|
16329
16347
|
const windDirection = physics?.windDirection ?? 0;
|
|
16330
16348
|
const windStrength = physics?.windStrength ?? 0;
|
|
@@ -16338,7 +16356,7 @@ function FallingIcons({
|
|
|
16338
16356
|
bounce: "cubic-bezier(0.68, -0.55, 0.265, 1.55)",
|
|
16339
16357
|
elastic: "cubic-bezier(0.175, 0.885, 0.32, 1.275)"
|
|
16340
16358
|
};
|
|
16341
|
-
const makeParticle =
|
|
16359
|
+
const makeParticle = React43.useCallback(() => {
|
|
16342
16360
|
const rnd = (min, max) => min + Math.random() * (max - min);
|
|
16343
16361
|
return {
|
|
16344
16362
|
leftPct: rnd(0, 100),
|
|
@@ -16352,12 +16370,12 @@ function FallingIcons({
|
|
|
16352
16370
|
key: idRef.current++
|
|
16353
16371
|
};
|
|
16354
16372
|
}, [sizeRange, speedRange, horizontalDrift, gravity, windDirection, windStrength]);
|
|
16355
|
-
const [particles, setParticles] =
|
|
16356
|
-
|
|
16373
|
+
const [particles, setParticles] = React43.useState([]);
|
|
16374
|
+
React43.useEffect(() => {
|
|
16357
16375
|
const arr = Array.from({ length: Math.max(0, count) }).map(() => makeParticle());
|
|
16358
16376
|
setParticles(arr);
|
|
16359
16377
|
}, [count, makeParticle]);
|
|
16360
|
-
|
|
16378
|
+
React43.useEffect(() => {
|
|
16361
16379
|
if (fullScreen) {
|
|
16362
16380
|
const measure2 = () => setFallDist(window.innerHeight + 200);
|
|
16363
16381
|
measure2();
|
|
@@ -16382,14 +16400,14 @@ function FallingIcons({
|
|
|
16382
16400
|
const SpinName = `uv-spin-${uid}`;
|
|
16383
16401
|
const PopName = `uv-pop-${uid}`;
|
|
16384
16402
|
const PhysicsSpinName = `uv-physics-spin-${uid}`;
|
|
16385
|
-
const glowStyles =
|
|
16403
|
+
const glowStyles = React43.useMemo(() => {
|
|
16386
16404
|
if (!glow) return {};
|
|
16387
16405
|
const intensity = Math.max(0, Math.min(1, glowIntensity));
|
|
16388
16406
|
return {
|
|
16389
16407
|
filter: `drop-shadow(0 0 ${4 * intensity}px ${glowColor}) drop-shadow(0 0 ${8 * intensity}px ${glowColor})`
|
|
16390
16408
|
};
|
|
16391
16409
|
}, [glow, glowColor, glowIntensity]);
|
|
16392
|
-
const FallbackIcon =
|
|
16410
|
+
const FallbackIcon = React43.useMemo(
|
|
16393
16411
|
() => (props) => /* @__PURE__ */ jsx50("svg", { viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", ...props, children: /* @__PURE__ */ jsx50("circle", { cx: "12", cy: "12", r: "10" }) }),
|
|
16394
16412
|
[]
|
|
16395
16413
|
);
|
|
@@ -16447,7 +16465,7 @@ function FallingIcons({
|
|
|
16447
16465
|
});
|
|
16448
16466
|
};
|
|
16449
16467
|
const trailParticles = trail ? Array.from({ length: Math.min(5, Math.max(1, trailLength)) }) : [];
|
|
16450
|
-
return /* @__PURE__ */ jsxs42(
|
|
16468
|
+
return /* @__PURE__ */ jsxs42(React43.Fragment, { children: [
|
|
16451
16469
|
trail && trailParticles.map((_, trailIndex) => {
|
|
16452
16470
|
const trailDelay = p.delay - (trailIndex + 1) * 0.15;
|
|
16453
16471
|
const trailOpacity = 1 - (trailIndex + 1) * (1 / (trailParticles.length + 1));
|
|
@@ -16565,7 +16583,7 @@ function FallingIcons({
|
|
|
16565
16583
|
}
|
|
16566
16584
|
|
|
16567
16585
|
// src/components/List.tsx
|
|
16568
|
-
import * as
|
|
16586
|
+
import * as React44 from "react";
|
|
16569
16587
|
import { ChevronRight as ChevronRight8 } from "lucide-react";
|
|
16570
16588
|
import { Fragment as Fragment19, jsx as jsx51, jsxs as jsxs43 } from "react/jsx-runtime";
|
|
16571
16589
|
var SIZE_STYLES2 = {
|
|
@@ -16591,7 +16609,7 @@ var ListItemSkeleton = ({ size }) => {
|
|
|
16591
16609
|
] })
|
|
16592
16610
|
] });
|
|
16593
16611
|
};
|
|
16594
|
-
var ListRoot =
|
|
16612
|
+
var ListRoot = React44.forwardRef(
|
|
16595
16613
|
({
|
|
16596
16614
|
as = "ul",
|
|
16597
16615
|
ordered,
|
|
@@ -16611,9 +16629,9 @@ var ListRoot = React43.forwardRef(
|
|
|
16611
16629
|
...rest
|
|
16612
16630
|
}, ref) => {
|
|
16613
16631
|
const Comp = ordered ? "ol" : as;
|
|
16614
|
-
const childCount =
|
|
16632
|
+
const childCount = React44.Children.count(children);
|
|
16615
16633
|
const hasChildren = childCount > 0;
|
|
16616
|
-
const
|
|
16634
|
+
const variantClasses3 = {
|
|
16617
16635
|
plain: "",
|
|
16618
16636
|
outlined: "rounded-2xl md:rounded-3xl bg-card text-card-foreground border border-border shadow-sm max-md:rounded-xl",
|
|
16619
16637
|
soft: "rounded-2xl md:rounded-3xl bg-muted/40 border border-border/60 max-md:rounded-xl",
|
|
@@ -16627,14 +16645,14 @@ var ListRoot = React43.forwardRef(
|
|
|
16627
16645
|
Comp,
|
|
16628
16646
|
{
|
|
16629
16647
|
ref,
|
|
16630
|
-
className: cn("group/list",
|
|
16648
|
+
className: cn("group/list", variantClasses3[variant], inset && "p-1.5 md:p-2 max-md:p-1", divided && "divide-y divide-border/60", className),
|
|
16631
16649
|
...rest,
|
|
16632
16650
|
children: Array.from({ length: loadingCount }).map((_, i) => /* @__PURE__ */ jsx51(ListItemSkeleton, { size }, i))
|
|
16633
16651
|
}
|
|
16634
16652
|
);
|
|
16635
16653
|
}
|
|
16636
16654
|
if (!hasChildren && emptyText) {
|
|
16637
|
-
return /* @__PURE__ */ jsx51(Comp, { ref, className: cn("group/list",
|
|
16655
|
+
return /* @__PURE__ */ jsx51(Comp, { ref, className: cn("group/list", variantClasses3[variant], inset && "p-1.5 md:p-2 max-md:p-1", className), ...rest, children: /* @__PURE__ */ jsx51("div", { className: "text-center py-8 text-muted-foreground text-sm", children: emptyText }) });
|
|
16638
16656
|
}
|
|
16639
16657
|
return /* @__PURE__ */ jsx51(
|
|
16640
16658
|
Comp,
|
|
@@ -16642,21 +16660,21 @@ var ListRoot = React43.forwardRef(
|
|
|
16642
16660
|
ref,
|
|
16643
16661
|
className: cn(
|
|
16644
16662
|
"group/list",
|
|
16645
|
-
|
|
16663
|
+
variantClasses3[variant],
|
|
16646
16664
|
inset && "p-1.5 md:p-2 max-md:p-1",
|
|
16647
16665
|
divided && "divide-y divide-border/60",
|
|
16648
16666
|
variant === "striped" && "[&>*:nth-child(even)]:bg-muted/30",
|
|
16649
16667
|
className
|
|
16650
16668
|
),
|
|
16651
16669
|
...rest,
|
|
16652
|
-
children:
|
|
16653
|
-
if (!
|
|
16670
|
+
children: React44.Children.map(children, (child, idx) => {
|
|
16671
|
+
if (!React44.isValidElement(child)) return child;
|
|
16654
16672
|
const childClass = cn(
|
|
16655
16673
|
child.props?.className,
|
|
16656
16674
|
hoverable && variant !== "flush" && "hover:bg-accent/50 focus:bg-accent/60 focus:outline-none transition-colors",
|
|
16657
16675
|
variant === "flush" && "hover:bg-accent/30"
|
|
16658
16676
|
);
|
|
16659
|
-
return
|
|
16677
|
+
return React44.cloneElement(child, {
|
|
16660
16678
|
className: childClass,
|
|
16661
16679
|
// Pass global item class to contentClassName of ListItem
|
|
16662
16680
|
contentClassName: cn(itemClassName, child.props?.contentClassName),
|
|
@@ -16671,7 +16689,7 @@ var ListRoot = React43.forwardRef(
|
|
|
16671
16689
|
}
|
|
16672
16690
|
);
|
|
16673
16691
|
ListRoot.displayName = "List";
|
|
16674
|
-
var ListItem =
|
|
16692
|
+
var ListItem = React44.forwardRef(
|
|
16675
16693
|
({
|
|
16676
16694
|
as = "li",
|
|
16677
16695
|
selected = false,
|
|
@@ -16694,7 +16712,7 @@ var ListItem = React43.forwardRef(
|
|
|
16694
16712
|
children,
|
|
16695
16713
|
...rest
|
|
16696
16714
|
}, ref) => {
|
|
16697
|
-
const [internalExpanded, setInternalExpanded] =
|
|
16715
|
+
const [internalExpanded, setInternalExpanded] = React44.useState(false);
|
|
16698
16716
|
const isExpanded = controlledExpanded !== void 0 ? controlledExpanded : internalExpanded;
|
|
16699
16717
|
const sizeAttr = rest["data-size"];
|
|
16700
16718
|
const resolvedSize = sizeAttr && ["xs", "sm", "md", "lg"].includes(sizeAttr) ? sizeAttr : "md";
|
|
@@ -16762,7 +16780,7 @@ var List = Object.assign(ListRoot, { Item: ListItem });
|
|
|
16762
16780
|
var List_default = List;
|
|
16763
16781
|
|
|
16764
16782
|
// src/components/Watermark.tsx
|
|
16765
|
-
import * as
|
|
16783
|
+
import * as React45 from "react";
|
|
16766
16784
|
import { createPortal as createPortal5 } from "react-dom";
|
|
16767
16785
|
import { Fragment as Fragment20, jsx as jsx52, jsxs as jsxs44 } from "react/jsx-runtime";
|
|
16768
16786
|
var PRESETS2 = {
|
|
@@ -16774,8 +16792,8 @@ var PRESETS2 = {
|
|
|
16774
16792
|
internal: { text: "INTERNAL USE ONLY", color: "rgba(156, 163, 175, 0.15)", rotate: -22, fontSize: 13, fontWeight: "600" }
|
|
16775
16793
|
};
|
|
16776
16794
|
function useWatermarkDataURL(opts) {
|
|
16777
|
-
const [url, setUrl] =
|
|
16778
|
-
|
|
16795
|
+
const [url, setUrl] = React45.useState(null);
|
|
16796
|
+
React45.useEffect(() => {
|
|
16779
16797
|
let cancelled = false;
|
|
16780
16798
|
const text = opts.text;
|
|
16781
16799
|
const image = opts.image;
|
|
@@ -16952,9 +16970,9 @@ var Watermark = ({
|
|
|
16952
16970
|
children,
|
|
16953
16971
|
...rest
|
|
16954
16972
|
}) => {
|
|
16955
|
-
const [visible, setVisible] =
|
|
16956
|
-
const [isDark, setIsDark] =
|
|
16957
|
-
|
|
16973
|
+
const [visible, setVisible] = React45.useState(true);
|
|
16974
|
+
const [isDark, setIsDark] = React45.useState(false);
|
|
16975
|
+
React45.useEffect(() => {
|
|
16958
16976
|
if (!darkMode) return;
|
|
16959
16977
|
const checkDarkMode = () => {
|
|
16960
16978
|
const isDarkMode = document.documentElement.classList.contains("dark") || window.matchMedia("(prefers-color-scheme: dark)").matches;
|
|
@@ -17056,7 +17074,7 @@ var Watermark = ({
|
|
|
17056
17074
|
var Watermark_default = Watermark;
|
|
17057
17075
|
|
|
17058
17076
|
// src/components/Timeline.tsx
|
|
17059
|
-
import * as
|
|
17077
|
+
import * as React46 from "react";
|
|
17060
17078
|
import { ChevronDown as ChevronDown6 } from "lucide-react";
|
|
17061
17079
|
import { jsx as jsx53, jsxs as jsxs45 } from "react/jsx-runtime";
|
|
17062
17080
|
var SIZE_STYLE = {
|
|
@@ -17109,7 +17127,7 @@ var STATUS_COLOR = {
|
|
|
17109
17127
|
error: "bg-destructive",
|
|
17110
17128
|
info: "bg-info"
|
|
17111
17129
|
};
|
|
17112
|
-
var TimelineContext =
|
|
17130
|
+
var TimelineContext = React46.createContext(null);
|
|
17113
17131
|
var LINE_STYLE_MAP = {
|
|
17114
17132
|
solid: "border-solid",
|
|
17115
17133
|
dashed: "border-dashed",
|
|
@@ -17137,7 +17155,7 @@ var Marker = ({ index, last, size, color, status = "default", lineColor, lineSty
|
|
|
17137
17155
|
!last && showLine && /* @__PURE__ */ jsx53("div", { className: cn("flex-1 border-l-2", LINE_STYLE_MAP[lineStyle]), style: { borderColor: lineColor || "hsl(var(--border))" } })
|
|
17138
17156
|
] });
|
|
17139
17157
|
};
|
|
17140
|
-
var TimelineRoot =
|
|
17158
|
+
var TimelineRoot = React46.forwardRef(
|
|
17141
17159
|
({
|
|
17142
17160
|
align = "left",
|
|
17143
17161
|
variant = "default",
|
|
@@ -17167,7 +17185,7 @@ var TimelineRoot = React45.forwardRef(
|
|
|
17167
17185
|
}
|
|
17168
17186
|
);
|
|
17169
17187
|
TimelineRoot.displayName = "Timeline";
|
|
17170
|
-
var TimelineItem =
|
|
17188
|
+
var TimelineItem = React46.forwardRef(
|
|
17171
17189
|
({
|
|
17172
17190
|
title,
|
|
17173
17191
|
description,
|
|
@@ -17186,11 +17204,11 @@ var TimelineItem = React45.forwardRef(
|
|
|
17186
17204
|
children,
|
|
17187
17205
|
...rest
|
|
17188
17206
|
}, ref) => {
|
|
17189
|
-
const ctx =
|
|
17207
|
+
const ctx = React46.useContext(TimelineContext);
|
|
17190
17208
|
const idx = rest["data-index"];
|
|
17191
17209
|
const isLast = Boolean(rest["data-last"]);
|
|
17192
17210
|
const sz = SIZE_STYLE[ctx.size];
|
|
17193
|
-
const [internalExpanded, setInternalExpanded] =
|
|
17211
|
+
const [internalExpanded, setInternalExpanded] = React46.useState(false);
|
|
17194
17212
|
const isExpanded = controlledExpanded !== void 0 ? controlledExpanded : internalExpanded;
|
|
17195
17213
|
const toggleExpanded = () => {
|
|
17196
17214
|
const newExpanded = !isExpanded;
|
|
@@ -17201,7 +17219,7 @@ var TimelineItem = React45.forwardRef(
|
|
|
17201
17219
|
}
|
|
17202
17220
|
};
|
|
17203
17221
|
const padding = ctx.dense ? sz.densePadY : sz.padY;
|
|
17204
|
-
const
|
|
17222
|
+
const variantClasses3 = {
|
|
17205
17223
|
default: "",
|
|
17206
17224
|
outlined: "rounded-xl border border-border bg-card shadow-sm px-4 py-3",
|
|
17207
17225
|
card: "rounded-2xl border border-border bg-card shadow-md px-5 py-4",
|
|
@@ -17209,7 +17227,7 @@ var TimelineItem = React45.forwardRef(
|
|
|
17209
17227
|
modern: "rounded-xl bg-linear-to-r from-card to-muted/20 border border-border/50 px-5 py-4 backdrop-blur-sm",
|
|
17210
17228
|
gradient: "rounded-2xl bg-linear-to-br from-primary/10 via-card to-accent/10 border border-primary/20 px-5 py-4 shadow-lg"
|
|
17211
17229
|
};
|
|
17212
|
-
const contentBox = /* @__PURE__ */ jsxs45("div", { className: cn("min-w-0 flex-1",
|
|
17230
|
+
const contentBox = /* @__PURE__ */ jsxs45("div", { className: cn("min-w-0 flex-1", variantClasses3[ctx.variant]), children: [
|
|
17213
17231
|
/* @__PURE__ */ jsxs45("div", { className: "flex items-start justify-between gap-2", children: [
|
|
17214
17232
|
/* @__PURE__ */ jsxs45("div", { className: "flex-1 min-w-0", children: [
|
|
17215
17233
|
title && /* @__PURE__ */ jsxs45("div", { className: "flex items-center gap-2", children: [
|
|
@@ -17332,7 +17350,7 @@ var Timeline = Object.assign(TimelineRoot, { Item: TimelineItem });
|
|
|
17332
17350
|
var Timeline_default = Timeline;
|
|
17333
17351
|
|
|
17334
17352
|
// src/components/ColorPicker.tsx
|
|
17335
|
-
import * as
|
|
17353
|
+
import * as React47 from "react";
|
|
17336
17354
|
import { Pipette, X as X15, Copy, Check as Check9, Palette, History } from "lucide-react";
|
|
17337
17355
|
import { jsx as jsx54, jsxs as jsxs46 } from "react/jsx-runtime";
|
|
17338
17356
|
var clamp7 = (n, min, max) => Math.max(min, Math.min(max, n));
|
|
@@ -17526,12 +17544,12 @@ function ColorPicker({
|
|
|
17526
17544
|
}) {
|
|
17527
17545
|
const isControlled = value !== void 0;
|
|
17528
17546
|
const initial = parseAnyColor(isControlled ? value : defaultValue) || { r: 79, g: 70, b: 229, a: 1 };
|
|
17529
|
-
const [rgba, setRgba] =
|
|
17530
|
-
const [open, setOpen] =
|
|
17531
|
-
const [text, setText] =
|
|
17532
|
-
const [copied, setCopied] =
|
|
17533
|
-
const [recentColors, setRecentColors] =
|
|
17534
|
-
|
|
17547
|
+
const [rgba, setRgba] = React47.useState(initial);
|
|
17548
|
+
const [open, setOpen] = React47.useState(false);
|
|
17549
|
+
const [text, setText] = React47.useState(() => formatOutput(initial, withAlpha, format));
|
|
17550
|
+
const [copied, setCopied] = React47.useState(false);
|
|
17551
|
+
const [recentColors, setRecentColors] = React47.useState([]);
|
|
17552
|
+
React47.useEffect(() => {
|
|
17535
17553
|
if (isControlled) {
|
|
17536
17554
|
const parsed = parseAnyColor(value);
|
|
17537
17555
|
if (parsed) {
|
|
@@ -18207,7 +18225,7 @@ var MusicPlayer = ({
|
|
|
18207
18225
|
var MusicPlayer_default = MusicPlayer;
|
|
18208
18226
|
|
|
18209
18227
|
// src/components/Grid.tsx
|
|
18210
|
-
import
|
|
18228
|
+
import React49, { useId as useId8 } from "react";
|
|
18211
18229
|
import { Fragment as Fragment21, jsx as jsx56, jsxs as jsxs48 } from "react/jsx-runtime";
|
|
18212
18230
|
var BP_MIN = {
|
|
18213
18231
|
sm: 640,
|
|
@@ -18247,7 +18265,7 @@ function getVariantClasses(variant = "default", outlined) {
|
|
|
18247
18265
|
};
|
|
18248
18266
|
return variants[variant] || "";
|
|
18249
18267
|
}
|
|
18250
|
-
var GridRoot =
|
|
18268
|
+
var GridRoot = React49.forwardRef(
|
|
18251
18269
|
({
|
|
18252
18270
|
columns,
|
|
18253
18271
|
rows,
|
|
@@ -18331,7 +18349,7 @@ var GridRoot = React48.forwardRef(
|
|
|
18331
18349
|
}
|
|
18332
18350
|
);
|
|
18333
18351
|
GridRoot.displayName = "Grid";
|
|
18334
|
-
var GridItem =
|
|
18352
|
+
var GridItem = React49.forwardRef(
|
|
18335
18353
|
({
|
|
18336
18354
|
colSpan,
|
|
18337
18355
|
rowSpan,
|
|
@@ -20143,7 +20161,7 @@ var LoadingBar = ({
|
|
|
20143
20161
|
};
|
|
20144
20162
|
|
|
20145
20163
|
// src/components/Table.tsx
|
|
20146
|
-
import
|
|
20164
|
+
import React58 from "react";
|
|
20147
20165
|
import { jsx as jsx67, jsxs as jsxs58 } from "react/jsx-runtime";
|
|
20148
20166
|
var TABLE_BASE_CLASS = "w-full caption-bottom text-sm";
|
|
20149
20167
|
var TABLE_CONTAINER_BASE_CLASS = [
|
|
@@ -20161,8 +20179,8 @@ function assignRef3(ref, value) {
|
|
|
20161
20179
|
ref.current = value;
|
|
20162
20180
|
}
|
|
20163
20181
|
}
|
|
20164
|
-
var TableContainer =
|
|
20165
|
-
const containerRef =
|
|
20182
|
+
var TableContainer = React58.forwardRef(({ className, useOverlayScrollbar = false, ...props }, ref) => {
|
|
20183
|
+
const containerRef = React58.useRef(null);
|
|
20166
20184
|
useOverlayScrollbarTarget(containerRef, { enabled: useOverlayScrollbar });
|
|
20167
20185
|
return /* @__PURE__ */ jsx67(
|
|
20168
20186
|
"div",
|
|
@@ -20177,7 +20195,7 @@ var TableContainer = React57.forwardRef(({ className, useOverlayScrollbar = fals
|
|
|
20177
20195
|
);
|
|
20178
20196
|
});
|
|
20179
20197
|
TableContainer.displayName = "TableContainer";
|
|
20180
|
-
var Table =
|
|
20198
|
+
var Table = React58.forwardRef(
|
|
20181
20199
|
({ className, containerClassName, disableContainer = false, useOverlayScrollbar = false, ...props }, ref) => {
|
|
20182
20200
|
if (disableContainer) {
|
|
20183
20201
|
return /* @__PURE__ */ jsx67("table", { ref, className: cn(TABLE_BASE_CLASS, className), ...props });
|
|
@@ -20186,16 +20204,16 @@ var Table = React57.forwardRef(
|
|
|
20186
20204
|
}
|
|
20187
20205
|
);
|
|
20188
20206
|
Table.displayName = "Table";
|
|
20189
|
-
var TableHeader =
|
|
20207
|
+
var TableHeader = React58.forwardRef(({ className, children, filterRow, ...props }, ref) => /* @__PURE__ */ jsxs58("thead", { ref, className: cn("[&_tr]:border-b [&_tr]:border-border", "bg-muted", className), ...props, children: [
|
|
20190
20208
|
children,
|
|
20191
20209
|
filterRow
|
|
20192
20210
|
] }));
|
|
20193
20211
|
TableHeader.displayName = "TableHeader";
|
|
20194
|
-
var TableBody =
|
|
20212
|
+
var TableBody = React58.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx67("tbody", { ref, className: cn("[&_tr:last-child]:border-0", className), ...props }));
|
|
20195
20213
|
TableBody.displayName = "TableBody";
|
|
20196
|
-
var TableFooter =
|
|
20214
|
+
var TableFooter = React58.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx67("tfoot", { ref, className: cn("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", className), ...props }));
|
|
20197
20215
|
TableFooter.displayName = "TableFooter";
|
|
20198
|
-
var TableRow =
|
|
20216
|
+
var TableRow = React58.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx67(
|
|
20199
20217
|
"tr",
|
|
20200
20218
|
{
|
|
20201
20219
|
ref,
|
|
@@ -20209,7 +20227,7 @@ var TableRow = React57.forwardRef(({ className, ...props }, ref) => /* @__PURE__
|
|
|
20209
20227
|
}
|
|
20210
20228
|
));
|
|
20211
20229
|
TableRow.displayName = "TableRow";
|
|
20212
|
-
var TableHead =
|
|
20230
|
+
var TableHead = React58.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx67(
|
|
20213
20231
|
"th",
|
|
20214
20232
|
{
|
|
20215
20233
|
ref,
|
|
@@ -20218,13 +20236,13 @@ var TableHead = React57.forwardRef(({ className, ...props }, ref) => /* @__PURE_
|
|
|
20218
20236
|
}
|
|
20219
20237
|
));
|
|
20220
20238
|
TableHead.displayName = "TableHead";
|
|
20221
|
-
var TableCell =
|
|
20239
|
+
var TableCell = React58.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx67("td", { ref, className: cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className), ...props }));
|
|
20222
20240
|
TableCell.displayName = "TableCell";
|
|
20223
|
-
var TableCaption =
|
|
20241
|
+
var TableCaption = React58.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx67("caption", { ref, className: cn("mt-4 text-sm text-muted-foreground", className), ...props }));
|
|
20224
20242
|
TableCaption.displayName = "TableCaption";
|
|
20225
20243
|
|
|
20226
20244
|
// src/components/DataTable/DataTable.tsx
|
|
20227
|
-
import
|
|
20245
|
+
import React67 from "react";
|
|
20228
20246
|
|
|
20229
20247
|
// src/components/DataTable/components/DataTableBody.tsx
|
|
20230
20248
|
import { jsx as jsx68, jsxs as jsxs59 } from "react/jsx-runtime";
|
|
@@ -20296,7 +20314,7 @@ function DataTableBodyRows({
|
|
|
20296
20314
|
}
|
|
20297
20315
|
|
|
20298
20316
|
// src/components/DataTable/components/DataTableHeader.tsx
|
|
20299
|
-
import
|
|
20317
|
+
import React59 from "react";
|
|
20300
20318
|
import { Filter as FilterIcon } from "lucide-react";
|
|
20301
20319
|
import { Fragment as Fragment26, jsx as jsx69, jsxs as jsxs60 } from "react/jsx-runtime";
|
|
20302
20320
|
function DataTableHeader({
|
|
@@ -20316,7 +20334,7 @@ function DataTableHeader({
|
|
|
20316
20334
|
getStickyHeaderCellStyle,
|
|
20317
20335
|
t
|
|
20318
20336
|
}) {
|
|
20319
|
-
const renderFilterControl =
|
|
20337
|
+
const renderFilterControl = React59.useCallback(
|
|
20320
20338
|
(col) => {
|
|
20321
20339
|
if (!col.filter) return null;
|
|
20322
20340
|
const key = col.key;
|
|
@@ -20369,7 +20387,7 @@ function DataTableHeader({
|
|
|
20369
20387
|
},
|
|
20370
20388
|
[filters, setCurPage, setFilters, size]
|
|
20371
20389
|
);
|
|
20372
|
-
const renderHeaderContent =
|
|
20390
|
+
const renderHeaderContent = React59.useCallback(
|
|
20373
20391
|
(col, isLeaf) => {
|
|
20374
20392
|
if (!isLeaf) {
|
|
20375
20393
|
return /* @__PURE__ */ jsx69(
|
|
@@ -20532,7 +20550,7 @@ function DataTableHeader({
|
|
|
20532
20550
|
}
|
|
20533
20551
|
|
|
20534
20552
|
// src/components/DataTable/components/Pagination.tsx
|
|
20535
|
-
import
|
|
20553
|
+
import React60 from "react";
|
|
20536
20554
|
import { jsx as jsx70, jsxs as jsxs61 } from "react/jsx-runtime";
|
|
20537
20555
|
function DataTablePagination({
|
|
20538
20556
|
totalItems,
|
|
@@ -20551,7 +20569,7 @@ function DataTablePagination({
|
|
|
20551
20569
|
const pageBtnClass = size === "sm" ? "h-6 min-w-6 px-1.5 rounded-full text-[11px] font-medium transition-colors" : size === "lg" ? "h-8 min-w-8 px-2.5 rounded-full text-sm font-medium transition-colors" : "h-7 min-w-7 px-2 rounded-full text-xs font-medium transition-colors";
|
|
20552
20570
|
const containerTextClass = size === "sm" ? "text-[11px]" : size === "lg" ? "text-sm" : "text-xs";
|
|
20553
20571
|
const pageSizeClass = size === "sm" ? "w-16" : size === "lg" ? "w-24" : "w-20";
|
|
20554
|
-
const pages =
|
|
20572
|
+
const pages = React60.useMemo(() => {
|
|
20555
20573
|
const result = [];
|
|
20556
20574
|
if (totalPages <= 5) {
|
|
20557
20575
|
for (let i = 1; i <= totalPages; i++) result.push(i);
|
|
@@ -20626,7 +20644,7 @@ function DataTablePagination({
|
|
|
20626
20644
|
}
|
|
20627
20645
|
|
|
20628
20646
|
// src/components/DataTable/components/Toolbar.tsx
|
|
20629
|
-
import
|
|
20647
|
+
import React61 from "react";
|
|
20630
20648
|
|
|
20631
20649
|
// src/components/DataTable/utils/headers.ts
|
|
20632
20650
|
function isLeafColumn(col) {
|
|
@@ -20747,7 +20765,7 @@ function DataTableToolbar({
|
|
|
20747
20765
|
const controlButtonClass = size === "sm" ? "h-7 px-2 text-xs" : size === "lg" ? "h-9 px-3 text-sm" : "h-8 px-2";
|
|
20748
20766
|
const iconClass = size === "sm" ? "w-3.5 h-3.5 mr-1" : "w-4 h-4 mr-1";
|
|
20749
20767
|
const captionClass = size === "sm" ? "text-xs" : size === "lg" ? "text-sm" : "text-sm";
|
|
20750
|
-
const leafCols =
|
|
20768
|
+
const leafCols = React61.useMemo(() => getLeafColumns(columns), [columns]);
|
|
20751
20769
|
return /* @__PURE__ */ jsxs62("div", { className: "flex items-center justify-between gap-4 mb-1", children: [
|
|
20752
20770
|
/* @__PURE__ */ jsx71("div", { className: captionClass + " text-muted-foreground", children: caption }),
|
|
20753
20771
|
/* @__PURE__ */ jsxs62("div", { className: "flex items-center gap-2", children: [
|
|
@@ -20815,10 +20833,10 @@ function DataTableToolbar({
|
|
|
20815
20833
|
}
|
|
20816
20834
|
|
|
20817
20835
|
// src/components/DataTable/hooks/useDebounced.ts
|
|
20818
|
-
import
|
|
20836
|
+
import React62 from "react";
|
|
20819
20837
|
function useDebounced(value, delay = 300) {
|
|
20820
|
-
const [debounced, setDebounced] =
|
|
20821
|
-
|
|
20838
|
+
const [debounced, setDebounced] = React62.useState(value);
|
|
20839
|
+
React62.useEffect(() => {
|
|
20822
20840
|
const id = setTimeout(() => setDebounced(value), delay);
|
|
20823
20841
|
return () => clearTimeout(id);
|
|
20824
20842
|
}, [value, delay]);
|
|
@@ -20826,7 +20844,7 @@ function useDebounced(value, delay = 300) {
|
|
|
20826
20844
|
}
|
|
20827
20845
|
|
|
20828
20846
|
// src/components/DataTable/hooks/useDataTableModel.ts
|
|
20829
|
-
import
|
|
20847
|
+
import React63 from "react";
|
|
20830
20848
|
|
|
20831
20849
|
// src/components/DataTable/utils/columns.ts
|
|
20832
20850
|
function getColumnWidth(col, fallback = 150) {
|
|
@@ -20854,22 +20872,22 @@ function useDataTableModel({
|
|
|
20854
20872
|
isServerMode,
|
|
20855
20873
|
total
|
|
20856
20874
|
}) {
|
|
20857
|
-
const visibleColsSet =
|
|
20858
|
-
const allLeafColumns =
|
|
20859
|
-
const columnMap =
|
|
20875
|
+
const visibleColsSet = React63.useMemo(() => new Set(visibleCols), [visibleCols]);
|
|
20876
|
+
const allLeafColumns = React63.useMemo(() => getLeafColumns(columns), [columns]);
|
|
20877
|
+
const columnMap = React63.useMemo(() => {
|
|
20860
20878
|
return new Map(allLeafColumns.map((column) => [column.key, column]));
|
|
20861
20879
|
}, [allLeafColumns]);
|
|
20862
|
-
const visibleColumns =
|
|
20880
|
+
const visibleColumns = React63.useMemo(() => {
|
|
20863
20881
|
return filterVisibleColumns(columns, visibleColsSet);
|
|
20864
20882
|
}, [columns, visibleColsSet]);
|
|
20865
|
-
const leafColumns =
|
|
20883
|
+
const leafColumns = React63.useMemo(() => {
|
|
20866
20884
|
return getLeafColumnsWithFixedInheritance(visibleColumns);
|
|
20867
20885
|
}, [visibleColumns]);
|
|
20868
|
-
const headerRows =
|
|
20869
|
-
const totalColumnsWidth =
|
|
20886
|
+
const headerRows = React63.useMemo(() => buildHeaderRows(visibleColumns), [visibleColumns]);
|
|
20887
|
+
const totalColumnsWidth = React63.useMemo(() => {
|
|
20870
20888
|
return leafColumns.reduce((sum, column) => sum + getColumnWidth(column), 0);
|
|
20871
20889
|
}, [leafColumns]);
|
|
20872
|
-
const processedData =
|
|
20890
|
+
const processedData = React63.useMemo(() => {
|
|
20873
20891
|
if (isServerMode) return data;
|
|
20874
20892
|
let result = [...data];
|
|
20875
20893
|
if (Object.keys(filters).length > 0) {
|
|
@@ -20901,7 +20919,7 @@ function useDataTableModel({
|
|
|
20901
20919
|
return result;
|
|
20902
20920
|
}, [columnMap, data, filters, isServerMode, sort]);
|
|
20903
20921
|
const totalItems = isServerMode ? total : processedData.length;
|
|
20904
|
-
const displayedData =
|
|
20922
|
+
const displayedData = React63.useMemo(() => {
|
|
20905
20923
|
if (isServerMode) return data;
|
|
20906
20924
|
const start = (curPage - 1) * curPageSize;
|
|
20907
20925
|
return processedData.slice(start, start + curPageSize);
|
|
@@ -20917,13 +20935,13 @@ function useDataTableModel({
|
|
|
20917
20935
|
}
|
|
20918
20936
|
|
|
20919
20937
|
// src/components/DataTable/hooks/useDataTableState.ts
|
|
20920
|
-
import
|
|
20938
|
+
import React65 from "react";
|
|
20921
20939
|
|
|
20922
20940
|
// src/components/DataTable/hooks/usePageSizeStorage.ts
|
|
20923
|
-
import
|
|
20941
|
+
import React64 from "react";
|
|
20924
20942
|
function usePageSizeStorage({ pageSize, storageKey }) {
|
|
20925
|
-
const loadedFromStorage =
|
|
20926
|
-
const [curPageSize, setCurPageSize] =
|
|
20943
|
+
const loadedFromStorage = React64.useRef(false);
|
|
20944
|
+
const [curPageSize, setCurPageSize] = React64.useState(() => {
|
|
20927
20945
|
if (typeof window === "undefined" || !storageKey) return pageSize;
|
|
20928
20946
|
try {
|
|
20929
20947
|
const saved = localStorage.getItem(`datatable_${storageKey}_pageSize`);
|
|
@@ -20938,11 +20956,11 @@ function usePageSizeStorage({ pageSize, storageKey }) {
|
|
|
20938
20956
|
}
|
|
20939
20957
|
return pageSize;
|
|
20940
20958
|
});
|
|
20941
|
-
const hasMounted =
|
|
20942
|
-
|
|
20959
|
+
const hasMounted = React64.useRef(false);
|
|
20960
|
+
React64.useEffect(() => {
|
|
20943
20961
|
hasMounted.current = true;
|
|
20944
20962
|
}, []);
|
|
20945
|
-
|
|
20963
|
+
React64.useEffect(() => {
|
|
20946
20964
|
if (typeof window === "undefined" || !storageKey) return;
|
|
20947
20965
|
if (!hasMounted.current) return;
|
|
20948
20966
|
try {
|
|
@@ -20950,7 +20968,7 @@ function usePageSizeStorage({ pageSize, storageKey }) {
|
|
|
20950
20968
|
} catch {
|
|
20951
20969
|
}
|
|
20952
20970
|
}, [curPageSize, storageKey]);
|
|
20953
|
-
|
|
20971
|
+
React64.useEffect(() => {
|
|
20954
20972
|
if (storageKey && loadedFromStorage.current) return;
|
|
20955
20973
|
setCurPageSize(pageSize);
|
|
20956
20974
|
}, [pageSize, storageKey]);
|
|
@@ -20970,17 +20988,17 @@ function useDataTableState({
|
|
|
20970
20988
|
size,
|
|
20971
20989
|
storageKey
|
|
20972
20990
|
}) {
|
|
20973
|
-
const allLeafColumns =
|
|
20974
|
-
const defaultVisibleLeafKeys =
|
|
20975
|
-
const knownLeafKeysRef =
|
|
20976
|
-
const [headerAlign, setHeaderAlign] =
|
|
20977
|
-
const [visibleCols, setVisibleCols] =
|
|
20978
|
-
const [filters, setFilters] =
|
|
20979
|
-
const [sort, setSort] =
|
|
20980
|
-
const [density, setDensity] =
|
|
20981
|
-
const [curPage, setCurPage] =
|
|
20991
|
+
const allLeafColumns = React65.useMemo(() => getLeafColumns(columns), [columns]);
|
|
20992
|
+
const defaultVisibleLeafKeys = React65.useMemo(() => allLeafColumns.filter((column) => column.visible !== false).map((column) => column.key), [allLeafColumns]);
|
|
20993
|
+
const knownLeafKeysRef = React65.useRef(new Set(defaultVisibleLeafKeys));
|
|
20994
|
+
const [headerAlign, setHeaderAlign] = React65.useState("left");
|
|
20995
|
+
const [visibleCols, setVisibleCols] = React65.useState(defaultVisibleLeafKeys);
|
|
20996
|
+
const [filters, setFilters] = React65.useState({});
|
|
20997
|
+
const [sort, setSort] = React65.useState(null);
|
|
20998
|
+
const [density, setDensity] = React65.useState(() => SIZE_TO_DENSITY[size]);
|
|
20999
|
+
const [curPage, setCurPage] = React65.useState(page);
|
|
20982
21000
|
const { curPageSize, setCurPageSize } = usePageSizeStorage({ pageSize, storageKey });
|
|
20983
|
-
|
|
21001
|
+
React65.useEffect(() => {
|
|
20984
21002
|
const knownLeafKeys = knownLeafKeysRef.current;
|
|
20985
21003
|
setVisibleCols((prev) => {
|
|
20986
21004
|
const prevSet = new Set(prev);
|
|
@@ -20988,10 +21006,10 @@ function useDataTableState({
|
|
|
20988
21006
|
});
|
|
20989
21007
|
knownLeafKeysRef.current = new Set(allLeafColumns.map((column) => column.key));
|
|
20990
21008
|
}, [allLeafColumns]);
|
|
20991
|
-
|
|
21009
|
+
React65.useEffect(() => {
|
|
20992
21010
|
setCurPage(page);
|
|
20993
21011
|
}, [page]);
|
|
20994
|
-
|
|
21012
|
+
React65.useEffect(() => {
|
|
20995
21013
|
setDensity(SIZE_TO_DENSITY[size]);
|
|
20996
21014
|
}, [size]);
|
|
20997
21015
|
return {
|
|
@@ -21013,7 +21031,7 @@ function useDataTableState({
|
|
|
21013
21031
|
}
|
|
21014
21032
|
|
|
21015
21033
|
// src/components/DataTable/hooks/useStickyColumns.ts
|
|
21016
|
-
import
|
|
21034
|
+
import React66 from "react";
|
|
21017
21035
|
|
|
21018
21036
|
// src/components/DataTable/utils/sticky.ts
|
|
21019
21037
|
function buildStickyLayout(visibleColumns) {
|
|
@@ -21060,8 +21078,8 @@ function resolveGroupStickyPosition(column, positions) {
|
|
|
21060
21078
|
|
|
21061
21079
|
// src/components/DataTable/hooks/useStickyColumns.ts
|
|
21062
21080
|
function useStickyColumns(visibleColumns) {
|
|
21063
|
-
const { positions, leftBoundaryKey, rightBoundaryKey } =
|
|
21064
|
-
const getStickyColumnStyle =
|
|
21081
|
+
const { positions, leftBoundaryKey, rightBoundaryKey } = React66.useMemo(() => buildStickyLayout(visibleColumns), [visibleColumns]);
|
|
21082
|
+
const getStickyColumnStyle = React66.useCallback(
|
|
21065
21083
|
(col) => {
|
|
21066
21084
|
const pos = resolveStickyPosition(col, positions);
|
|
21067
21085
|
if (!pos) return {};
|
|
@@ -21072,7 +21090,7 @@ function useStickyColumns(visibleColumns) {
|
|
|
21072
21090
|
},
|
|
21073
21091
|
[positions]
|
|
21074
21092
|
);
|
|
21075
|
-
const getBoundaryShadowClass =
|
|
21093
|
+
const getBoundaryShadowClass = React66.useCallback(
|
|
21076
21094
|
(col) => {
|
|
21077
21095
|
if (col.fixed === "left" && col.key === leftBoundaryKey) {
|
|
21078
21096
|
return "border-r border-border/80 shadow-[10px_0_16px_-10px_rgba(0,0,0,0.55)]";
|
|
@@ -21084,14 +21102,14 @@ function useStickyColumns(visibleColumns) {
|
|
|
21084
21102
|
},
|
|
21085
21103
|
[leftBoundaryKey, rightBoundaryKey]
|
|
21086
21104
|
);
|
|
21087
|
-
const getStickyHeaderClass =
|
|
21105
|
+
const getStickyHeaderClass = React66.useCallback(
|
|
21088
21106
|
(col) => {
|
|
21089
21107
|
if (!col.fixed) return "";
|
|
21090
21108
|
return cn("sticky", col.fixed === "left" && "left-0", col.fixed === "right" && "right-0", getBoundaryShadowClass(col), "z-50 !bg-muted");
|
|
21091
21109
|
},
|
|
21092
21110
|
[getBoundaryShadowClass]
|
|
21093
21111
|
);
|
|
21094
|
-
const getStickyCellClass =
|
|
21112
|
+
const getStickyCellClass = React66.useCallback(
|
|
21095
21113
|
(col, isStripedRow) => {
|
|
21096
21114
|
if (!col.fixed) return "";
|
|
21097
21115
|
return cn(
|
|
@@ -21104,7 +21122,7 @@ function useStickyColumns(visibleColumns) {
|
|
|
21104
21122
|
},
|
|
21105
21123
|
[getBoundaryShadowClass]
|
|
21106
21124
|
);
|
|
21107
|
-
const getStickyHeaderCellStyle =
|
|
21125
|
+
const getStickyHeaderCellStyle = React66.useCallback(
|
|
21108
21126
|
(headerCell) => {
|
|
21109
21127
|
const col = headerCell.column;
|
|
21110
21128
|
if (headerCell.isLeaf) {
|
|
@@ -21251,7 +21269,7 @@ function DataTable({
|
|
|
21251
21269
|
size,
|
|
21252
21270
|
storageKey
|
|
21253
21271
|
});
|
|
21254
|
-
|
|
21272
|
+
React67.useEffect(() => {
|
|
21255
21273
|
if (process.env.NODE_ENV === "development") {
|
|
21256
21274
|
const warnings = validateColumns(columns);
|
|
21257
21275
|
warnings.forEach((w) => console.warn(`[DataTable] ${w}`));
|
|
@@ -21259,8 +21277,8 @@ function DataTable({
|
|
|
21259
21277
|
}, [columns]);
|
|
21260
21278
|
const debouncedFilters = useDebounced(filters, 350);
|
|
21261
21279
|
const isServerMode = Boolean(onQueryChange);
|
|
21262
|
-
const hasEmittedQuery =
|
|
21263
|
-
|
|
21280
|
+
const hasEmittedQuery = React67.useRef(false);
|
|
21281
|
+
React67.useEffect(() => {
|
|
21264
21282
|
if (!onQueryChange) return;
|
|
21265
21283
|
if (!hasEmittedQuery.current) {
|
|
21266
21284
|
hasEmittedQuery.current = true;
|
|
@@ -21268,7 +21286,7 @@ function DataTable({
|
|
|
21268
21286
|
}
|
|
21269
21287
|
onQueryChange({ filters: debouncedFilters, sort, page: curPage, pageSize: curPageSize });
|
|
21270
21288
|
}, [debouncedFilters, sort, curPage, curPageSize, onQueryChange]);
|
|
21271
|
-
|
|
21289
|
+
React67.useEffect(() => {
|
|
21272
21290
|
if (process.env.NODE_ENV !== "development" || rowKey) return;
|
|
21273
21291
|
const hasQueryFeatures = columns.some((column) => column.sortable || column.filter) || Boolean(pageSizeOptions?.length) || isServerMode;
|
|
21274
21292
|
if (!hasQueryFeatures) return;
|
|
@@ -21296,7 +21314,7 @@ function DataTable({
|
|
|
21296
21314
|
if (typeof rowKey === "function") return String(rowKey(row));
|
|
21297
21315
|
return String(row[rowKey]);
|
|
21298
21316
|
};
|
|
21299
|
-
const viewportRef =
|
|
21317
|
+
const viewportRef = React67.useRef(null);
|
|
21300
21318
|
useOverlayScrollbarTarget(viewportRef, { enabled: useOverlayScrollbar });
|
|
21301
21319
|
return /* @__PURE__ */ jsxs63("div", { className: cn("space-y-2", className), children: [
|
|
21302
21320
|
/* @__PURE__ */ jsx72(
|
|
@@ -21402,10 +21420,10 @@ function DataTable({
|
|
|
21402
21420
|
var DataTable_default = DataTable;
|
|
21403
21421
|
|
|
21404
21422
|
// src/components/Form.tsx
|
|
21405
|
-
import * as
|
|
21423
|
+
import * as React68 from "react";
|
|
21406
21424
|
import { Controller, FormProvider, useFormContext, useForm } from "react-hook-form";
|
|
21407
21425
|
import { jsx as jsx73, jsxs as jsxs64 } from "react/jsx-runtime";
|
|
21408
|
-
var FormConfigContext =
|
|
21426
|
+
var FormConfigContext = React68.createContext({ size: "md" });
|
|
21409
21427
|
var FormWrapper = ({
|
|
21410
21428
|
children,
|
|
21411
21429
|
onSubmit,
|
|
@@ -21418,7 +21436,7 @@ var FormWrapper = ({
|
|
|
21418
21436
|
const methods = useForm({
|
|
21419
21437
|
defaultValues: initialValues
|
|
21420
21438
|
});
|
|
21421
|
-
|
|
21439
|
+
React68.useEffect(() => {
|
|
21422
21440
|
if (initialValues) {
|
|
21423
21441
|
methods.reset(initialValues);
|
|
21424
21442
|
}
|
|
@@ -21427,15 +21445,15 @@ var FormWrapper = ({
|
|
|
21427
21445
|
return /* @__PURE__ */ jsx73(FormProvider, { ...methods, children: /* @__PURE__ */ jsx73(FormConfigContext.Provider, { value: { size }, children: /* @__PURE__ */ jsx73("form", { onSubmit: methods.handleSubmit(onSubmit), className, ...formProps, children }) }) });
|
|
21428
21446
|
};
|
|
21429
21447
|
var Form = FormWrapper;
|
|
21430
|
-
var FormFieldContext =
|
|
21448
|
+
var FormFieldContext = React68.createContext({});
|
|
21431
21449
|
var FormField = ({
|
|
21432
21450
|
...props
|
|
21433
21451
|
}) => {
|
|
21434
21452
|
return /* @__PURE__ */ jsx73(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx73(Controller, { ...props }) });
|
|
21435
21453
|
};
|
|
21436
21454
|
var useFormField = () => {
|
|
21437
|
-
const fieldContext =
|
|
21438
|
-
const itemContext =
|
|
21455
|
+
const fieldContext = React68.useContext(FormFieldContext);
|
|
21456
|
+
const itemContext = React68.useContext(FormItemContext);
|
|
21439
21457
|
const { getFieldState, formState } = useFormContext();
|
|
21440
21458
|
if (!fieldContext) {
|
|
21441
21459
|
try {
|
|
@@ -21456,16 +21474,16 @@ var useFormField = () => {
|
|
|
21456
21474
|
...fieldState
|
|
21457
21475
|
};
|
|
21458
21476
|
};
|
|
21459
|
-
var FormItemContext =
|
|
21460
|
-
var FormItem =
|
|
21461
|
-
const id =
|
|
21477
|
+
var FormItemContext = React68.createContext({});
|
|
21478
|
+
var FormItem = React68.forwardRef(({ className, ...props }, ref) => {
|
|
21479
|
+
const id = React68.useId();
|
|
21462
21480
|
return /* @__PURE__ */ jsx73(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx73("div", { ref, className: cn("space-y-2", className), ...props }) });
|
|
21463
21481
|
});
|
|
21464
21482
|
FormItem.displayName = "FormItem";
|
|
21465
|
-
var FormLabel =
|
|
21483
|
+
var FormLabel = React68.forwardRef(
|
|
21466
21484
|
({ className, children, required, ...props }, ref) => {
|
|
21467
21485
|
const { error, formItemId } = useFormField();
|
|
21468
|
-
const config =
|
|
21486
|
+
const config = React68.useContext(FormConfigContext);
|
|
21469
21487
|
const sizeClass = config.size === "sm" ? "text-xs" : config.size === "lg" ? "text-base" : "text-sm";
|
|
21470
21488
|
return /* @__PURE__ */ jsxs64(Label, { ref, className: cn(sizeClass, error && "text-destructive", className), htmlFor: formItemId, ...props, children: [
|
|
21471
21489
|
children,
|
|
@@ -21474,7 +21492,7 @@ var FormLabel = React67.forwardRef(
|
|
|
21474
21492
|
}
|
|
21475
21493
|
);
|
|
21476
21494
|
FormLabel.displayName = "FormLabel";
|
|
21477
|
-
var FormControl =
|
|
21495
|
+
var FormControl = React68.forwardRef(({ ...props }, ref) => {
|
|
21478
21496
|
const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
|
|
21479
21497
|
return /* @__PURE__ */ jsx73(
|
|
21480
21498
|
"div",
|
|
@@ -21488,12 +21506,12 @@ var FormControl = React67.forwardRef(({ ...props }, ref) => {
|
|
|
21488
21506
|
);
|
|
21489
21507
|
});
|
|
21490
21508
|
FormControl.displayName = "FormControl";
|
|
21491
|
-
var FormDescription =
|
|
21509
|
+
var FormDescription = React68.forwardRef(({ className, ...props }, ref) => {
|
|
21492
21510
|
const { formDescriptionId } = useFormField();
|
|
21493
21511
|
return /* @__PURE__ */ jsx73("p", { ref, id: formDescriptionId, className: cn("text-sm text-muted-foreground", className), ...props });
|
|
21494
21512
|
});
|
|
21495
21513
|
FormDescription.displayName = "FormDescription";
|
|
21496
|
-
var FormMessage =
|
|
21514
|
+
var FormMessage = React68.forwardRef(({ className, children, ...props }, ref) => {
|
|
21497
21515
|
const { error, formMessageId } = useFormField();
|
|
21498
21516
|
const body = error ? String(error?.message) : children;
|
|
21499
21517
|
if (!body) {
|
|
@@ -21502,7 +21520,7 @@ var FormMessage = React67.forwardRef(({ className, children, ...props }, ref) =>
|
|
|
21502
21520
|
return /* @__PURE__ */ jsx73("p", { ref, id: formMessageId, className: cn("text-sm font-medium text-destructive", className), ...props, children: body });
|
|
21503
21521
|
});
|
|
21504
21522
|
FormMessage.displayName = "FormMessage";
|
|
21505
|
-
var FormInput =
|
|
21523
|
+
var FormInput = React68.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ jsx73(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx73(
|
|
21506
21524
|
FormField,
|
|
21507
21525
|
{
|
|
21508
21526
|
name,
|
|
@@ -21513,7 +21531,7 @@ var FormInput = React67.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */
|
|
|
21513
21531
|
}
|
|
21514
21532
|
) }));
|
|
21515
21533
|
FormInput.displayName = "FormInput";
|
|
21516
|
-
var FormCheckbox =
|
|
21534
|
+
var FormCheckbox = React68.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ jsx73(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx73(
|
|
21517
21535
|
FormField,
|
|
21518
21536
|
{
|
|
21519
21537
|
name,
|
|
@@ -21537,9 +21555,9 @@ var FormCheckbox = React67.forwardRef(({ name, ...props }, ref) => /* @__PURE__
|
|
|
21537
21555
|
}
|
|
21538
21556
|
) }));
|
|
21539
21557
|
FormCheckbox.displayName = "FormCheckbox";
|
|
21540
|
-
var FormActions =
|
|
21558
|
+
var FormActions = React68.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx73("div", { ref, className: cn("flex gap-2 justify-end", className), ...props }));
|
|
21541
21559
|
FormActions.displayName = "FormActions";
|
|
21542
|
-
var FormSubmitButton =
|
|
21560
|
+
var FormSubmitButton = React68.forwardRef(
|
|
21543
21561
|
({ children, loading: loading2, ...props }, ref) => /* @__PURE__ */ jsx73(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ jsx73(Button_default, { ref, type: "submit", size: props.size ?? size, disabled: loading2, ...props, children }) })
|
|
21544
21562
|
);
|
|
21545
21563
|
FormSubmitButton.displayName = "FormSubmitButton";
|
|
@@ -21830,7 +21848,7 @@ var VARIANT_STYLES_ALERT = {
|
|
|
21830
21848
|
};
|
|
21831
21849
|
|
|
21832
21850
|
// ../../lib/i18n/translation-adapter.tsx
|
|
21833
|
-
import * as
|
|
21851
|
+
import * as React70 from "react";
|
|
21834
21852
|
import { jsx as jsx78 } from "react/jsx-runtime";
|
|
21835
21853
|
var defaultTranslations2 = {
|
|
21836
21854
|
en: {
|
|
@@ -22178,9 +22196,9 @@ var defaultTranslations2 = {
|
|
|
22178
22196
|
}
|
|
22179
22197
|
}
|
|
22180
22198
|
};
|
|
22181
|
-
var TranslationContext2 =
|
|
22199
|
+
var TranslationContext2 = React70.createContext(null);
|
|
22182
22200
|
var UnderverseProvider = ({ children, locale = "en", translations }) => {
|
|
22183
|
-
const t =
|
|
22201
|
+
const t = React70.useCallback(
|
|
22184
22202
|
(namespace) => {
|
|
22185
22203
|
return (key) => {
|
|
22186
22204
|
const mergedTranslations = {
|
|
@@ -22246,7 +22264,7 @@ function getInternalTranslation(namespace, locale) {
|
|
|
22246
22264
|
};
|
|
22247
22265
|
}
|
|
22248
22266
|
function useTranslations(namespace) {
|
|
22249
|
-
const underverseContext =
|
|
22267
|
+
const underverseContext = React70.useContext(TranslationContext2);
|
|
22250
22268
|
if (underverseContext) {
|
|
22251
22269
|
return (key, params) => {
|
|
22252
22270
|
const result = underverseContext.t(namespace)(key);
|
|
@@ -22263,7 +22281,7 @@ function useTranslations(namespace) {
|
|
|
22263
22281
|
return getInternalTranslation(namespace, "en");
|
|
22264
22282
|
}
|
|
22265
22283
|
function useLocale() {
|
|
22266
|
-
const underverseContext =
|
|
22284
|
+
const underverseContext = React70.useContext(TranslationContext2);
|
|
22267
22285
|
if (underverseContext) {
|
|
22268
22286
|
return underverseContext.locale;
|
|
22269
22287
|
}
|
|
@@ -22282,7 +22300,7 @@ function useLocale() {
|
|
|
22282
22300
|
}
|
|
22283
22301
|
|
|
22284
22302
|
// src/components/UEditor/UEditor.tsx
|
|
22285
|
-
import
|
|
22303
|
+
import React79, { useEffect as useEffect37, useImperativeHandle as useImperativeHandle3, useMemo as useMemo29, useRef as useRef36 } from "react";
|
|
22286
22304
|
import { useEditor, EditorContent } from "@tiptap/react";
|
|
22287
22305
|
|
|
22288
22306
|
// src/components/UEditor/extensions.ts
|
|
@@ -23888,7 +23906,7 @@ function buildUEditorExtensions({
|
|
|
23888
23906
|
}
|
|
23889
23907
|
|
|
23890
23908
|
// src/components/UEditor/toolbar.tsx
|
|
23891
|
-
import
|
|
23909
|
+
import React77, { useRef as useRef34, useState as useState52 } from "react";
|
|
23892
23910
|
import {
|
|
23893
23911
|
AlignCenter,
|
|
23894
23912
|
AlignJustify,
|
|
@@ -24281,7 +24299,7 @@ function fileToDataUrl2(file) {
|
|
|
24281
24299
|
reader.readAsDataURL(file);
|
|
24282
24300
|
});
|
|
24283
24301
|
}
|
|
24284
|
-
var ToolbarButton =
|
|
24302
|
+
var ToolbarButton = React77.forwardRef(({ onClick, onMouseDown, active, disabled, children, title, className }, ref) => {
|
|
24285
24303
|
const button = /* @__PURE__ */ jsx85(
|
|
24286
24304
|
"button",
|
|
24287
24305
|
{
|
|
@@ -25486,7 +25504,7 @@ async function prepareUEditorContentForSave({
|
|
|
25486
25504
|
|
|
25487
25505
|
// src/components/UEditor/UEditor.tsx
|
|
25488
25506
|
import { jsx as jsx87, jsxs as jsxs78 } from "react/jsx-runtime";
|
|
25489
|
-
var UEditor =
|
|
25507
|
+
var UEditor = React79.forwardRef(({
|
|
25490
25508
|
content = "",
|
|
25491
25509
|
onChange,
|
|
25492
25510
|
onHtmlChange,
|