@j3m-quantum/ui 1.3.0 → 1.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +74 -20
- package/cursor-rules-for-consumers.md +171 -28
- package/dist/index.cjs +242 -122
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +18 -1
- package/dist/index.d.ts +18 -1
- package/dist/index.js +240 -121
- package/dist/index.js.map +1 -1
- package/dist/styles/index.css +235 -102
- package/package.json +3 -2
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as React15 from 'react';
|
|
2
2
|
import { useMemo } from 'react';
|
|
3
3
|
import { Slot } from '@radix-ui/react-slot';
|
|
4
4
|
import { cva } from 'class-variance-authority';
|
|
@@ -45,8 +45,8 @@ export { areIntervalsOverlapping, format, getDay, isSameDay, isSameMonth, isToda
|
|
|
45
45
|
// src/hooks/use-mobile.ts
|
|
46
46
|
var MOBILE_BREAKPOINT = 768;
|
|
47
47
|
function useIsMobile() {
|
|
48
|
-
const [isMobile, setIsMobile] =
|
|
49
|
-
|
|
48
|
+
const [isMobile, setIsMobile] = React15.useState(void 0);
|
|
49
|
+
React15.useEffect(() => {
|
|
50
50
|
const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
|
|
51
51
|
const onChange = () => {
|
|
52
52
|
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
|
|
@@ -87,7 +87,7 @@ var buttonVariants = cva(
|
|
|
87
87
|
}
|
|
88
88
|
}
|
|
89
89
|
);
|
|
90
|
-
var Button =
|
|
90
|
+
var Button = React15.forwardRef(
|
|
91
91
|
({ className, variant, size, asChild = false, ...props }, ref) => {
|
|
92
92
|
const Comp = asChild ? Slot : "button";
|
|
93
93
|
return /* @__PURE__ */ jsx(
|
|
@@ -195,7 +195,7 @@ function Input({ className, type, ...props }) {
|
|
|
195
195
|
type,
|
|
196
196
|
"data-slot": "input",
|
|
197
197
|
className: cn(
|
|
198
|
-
"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-
|
|
198
|
+
"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-4 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
|
199
199
|
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
|
|
200
200
|
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
201
201
|
className
|
|
@@ -451,7 +451,7 @@ function Slider({
|
|
|
451
451
|
max = 100,
|
|
452
452
|
...props
|
|
453
453
|
}) {
|
|
454
|
-
const _values =
|
|
454
|
+
const _values = React15.useMemo(
|
|
455
455
|
() => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max],
|
|
456
456
|
[value, defaultValue, min, max]
|
|
457
457
|
);
|
|
@@ -737,7 +737,7 @@ function Toggle({
|
|
|
737
737
|
}
|
|
738
738
|
);
|
|
739
739
|
}
|
|
740
|
-
var ToggleGroupContext =
|
|
740
|
+
var ToggleGroupContext = React15.createContext({
|
|
741
741
|
size: "default",
|
|
742
742
|
variant: "default",
|
|
743
743
|
spacing: 0
|
|
@@ -774,7 +774,7 @@ function ToggleGroupItem({
|
|
|
774
774
|
size,
|
|
775
775
|
...props
|
|
776
776
|
}) {
|
|
777
|
-
const context =
|
|
777
|
+
const context = React15.useContext(ToggleGroupContext);
|
|
778
778
|
return /* @__PURE__ */ jsx(
|
|
779
779
|
ToggleGroupPrimitive.Item,
|
|
780
780
|
{
|
|
@@ -796,6 +796,125 @@ function ToggleGroupItem({
|
|
|
796
796
|
}
|
|
797
797
|
);
|
|
798
798
|
}
|
|
799
|
+
function ThemeSwitch({
|
|
800
|
+
checked,
|
|
801
|
+
defaultChecked = false,
|
|
802
|
+
onCheckedChange,
|
|
803
|
+
disabled = false,
|
|
804
|
+
className,
|
|
805
|
+
size = "default"
|
|
806
|
+
}) {
|
|
807
|
+
const [isChecked, setIsChecked] = React15.useState(defaultChecked);
|
|
808
|
+
const isControlled = checked !== void 0;
|
|
809
|
+
const currentChecked = isControlled ? checked : isChecked;
|
|
810
|
+
const handleClick = () => {
|
|
811
|
+
if (disabled) return;
|
|
812
|
+
const newValue = !currentChecked;
|
|
813
|
+
if (!isControlled) {
|
|
814
|
+
setIsChecked(newValue);
|
|
815
|
+
}
|
|
816
|
+
onCheckedChange?.(newValue);
|
|
817
|
+
};
|
|
818
|
+
const sizeClasses = {
|
|
819
|
+
sm: {
|
|
820
|
+
track: "h-5 w-9",
|
|
821
|
+
thumb: "size-4",
|
|
822
|
+
icon: "h-2.5 w-2.5",
|
|
823
|
+
translate: "data-[state=checked]:translate-x-4"
|
|
824
|
+
},
|
|
825
|
+
default: {
|
|
826
|
+
track: "h-6 w-11",
|
|
827
|
+
thumb: "size-5",
|
|
828
|
+
icon: "h-3 w-3",
|
|
829
|
+
translate: "data-[state=checked]:translate-x-5"
|
|
830
|
+
},
|
|
831
|
+
lg: {
|
|
832
|
+
track: "h-7 w-14",
|
|
833
|
+
thumb: "size-6",
|
|
834
|
+
icon: "h-3.5 w-3.5",
|
|
835
|
+
translate: "data-[state=checked]:translate-x-7"
|
|
836
|
+
}
|
|
837
|
+
};
|
|
838
|
+
const sizes = sizeClasses[size];
|
|
839
|
+
return /* @__PURE__ */ jsx(
|
|
840
|
+
"button",
|
|
841
|
+
{
|
|
842
|
+
type: "button",
|
|
843
|
+
role: "switch",
|
|
844
|
+
"aria-checked": currentChecked,
|
|
845
|
+
"aria-label": currentChecked ? "Switch to light mode" : "Switch to dark mode",
|
|
846
|
+
"data-slot": "theme-switch",
|
|
847
|
+
"data-state": currentChecked ? "checked" : "unchecked",
|
|
848
|
+
disabled,
|
|
849
|
+
onClick: handleClick,
|
|
850
|
+
className: cn(
|
|
851
|
+
"peer inline-flex shrink-0 cursor-pointer items-center rounded-full",
|
|
852
|
+
"border border-transparent shadow-xs transition-all outline-none",
|
|
853
|
+
"focus-visible:ring-[3px] focus-visible:ring-ring/50",
|
|
854
|
+
"disabled:cursor-not-allowed disabled:opacity-50",
|
|
855
|
+
"bg-input data-[state=checked]:bg-primary",
|
|
856
|
+
sizes.track,
|
|
857
|
+
className
|
|
858
|
+
),
|
|
859
|
+
children: /* @__PURE__ */ jsx(
|
|
860
|
+
"span",
|
|
861
|
+
{
|
|
862
|
+
"data-state": currentChecked ? "checked" : "unchecked",
|
|
863
|
+
className: cn(
|
|
864
|
+
"pointer-events-none flex items-center justify-center rounded-full",
|
|
865
|
+
"bg-white shadow-lg ring-0 transition-transform",
|
|
866
|
+
"data-[state=unchecked]:translate-x-0.5",
|
|
867
|
+
sizes.thumb,
|
|
868
|
+
sizes.translate
|
|
869
|
+
),
|
|
870
|
+
children: currentChecked ? /* @__PURE__ */ jsx(MoonIcon, { className: cn(sizes.icon, "text-primary") }) : /* @__PURE__ */ jsx(SunIcon, { className: cn(sizes.icon, "text-muted-foreground") })
|
|
871
|
+
}
|
|
872
|
+
)
|
|
873
|
+
}
|
|
874
|
+
);
|
|
875
|
+
}
|
|
876
|
+
function SunIcon({ className }) {
|
|
877
|
+
return /* @__PURE__ */ jsxs(
|
|
878
|
+
"svg",
|
|
879
|
+
{
|
|
880
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
881
|
+
viewBox: "0 0 24 24",
|
|
882
|
+
fill: "none",
|
|
883
|
+
stroke: "currentColor",
|
|
884
|
+
strokeWidth: "2",
|
|
885
|
+
strokeLinecap: "round",
|
|
886
|
+
strokeLinejoin: "round",
|
|
887
|
+
className,
|
|
888
|
+
children: [
|
|
889
|
+
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "4" }),
|
|
890
|
+
/* @__PURE__ */ jsx("path", { d: "M12 2v2" }),
|
|
891
|
+
/* @__PURE__ */ jsx("path", { d: "M12 20v2" }),
|
|
892
|
+
/* @__PURE__ */ jsx("path", { d: "m4.93 4.93 1.41 1.41" }),
|
|
893
|
+
/* @__PURE__ */ jsx("path", { d: "m17.66 17.66 1.41 1.41" }),
|
|
894
|
+
/* @__PURE__ */ jsx("path", { d: "M2 12h2" }),
|
|
895
|
+
/* @__PURE__ */ jsx("path", { d: "M20 12h2" }),
|
|
896
|
+
/* @__PURE__ */ jsx("path", { d: "m6.34 17.66-1.41 1.41" }),
|
|
897
|
+
/* @__PURE__ */ jsx("path", { d: "m19.07 4.93-1.41 1.41" })
|
|
898
|
+
]
|
|
899
|
+
}
|
|
900
|
+
);
|
|
901
|
+
}
|
|
902
|
+
function MoonIcon({ className }) {
|
|
903
|
+
return /* @__PURE__ */ jsx(
|
|
904
|
+
"svg",
|
|
905
|
+
{
|
|
906
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
907
|
+
viewBox: "0 0 24 24",
|
|
908
|
+
fill: "none",
|
|
909
|
+
stroke: "currentColor",
|
|
910
|
+
strokeWidth: "2",
|
|
911
|
+
strokeLinecap: "round",
|
|
912
|
+
strokeLinejoin: "round",
|
|
913
|
+
className,
|
|
914
|
+
children: /* @__PURE__ */ jsx("path", { d: "M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z" })
|
|
915
|
+
}
|
|
916
|
+
);
|
|
917
|
+
}
|
|
799
918
|
function ToolBarCanvas({
|
|
800
919
|
className,
|
|
801
920
|
...props
|
|
@@ -1105,7 +1224,7 @@ function Label2({
|
|
|
1105
1224
|
);
|
|
1106
1225
|
}
|
|
1107
1226
|
var Form = FormProvider;
|
|
1108
|
-
var FormFieldContext =
|
|
1227
|
+
var FormFieldContext = React15.createContext(
|
|
1109
1228
|
{}
|
|
1110
1229
|
);
|
|
1111
1230
|
var FormField = ({
|
|
@@ -1114,8 +1233,8 @@ var FormField = ({
|
|
|
1114
1233
|
return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
|
|
1115
1234
|
};
|
|
1116
1235
|
var useFormField = () => {
|
|
1117
|
-
const fieldContext =
|
|
1118
|
-
const itemContext =
|
|
1236
|
+
const fieldContext = React15.useContext(FormFieldContext);
|
|
1237
|
+
const itemContext = React15.useContext(FormItemContext);
|
|
1119
1238
|
const { getFieldState } = useFormContext();
|
|
1120
1239
|
const formState = useFormState({ name: fieldContext.name });
|
|
1121
1240
|
const fieldState = getFieldState(fieldContext.name, formState);
|
|
@@ -1132,11 +1251,11 @@ var useFormField = () => {
|
|
|
1132
1251
|
...fieldState
|
|
1133
1252
|
};
|
|
1134
1253
|
};
|
|
1135
|
-
var FormItemContext =
|
|
1254
|
+
var FormItemContext = React15.createContext(
|
|
1136
1255
|
{}
|
|
1137
1256
|
);
|
|
1138
1257
|
function FormItem({ className, ...props }) {
|
|
1139
|
-
const id =
|
|
1258
|
+
const id = React15.useId();
|
|
1140
1259
|
return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx(
|
|
1141
1260
|
"div",
|
|
1142
1261
|
{
|
|
@@ -2238,8 +2357,8 @@ function CalendarDayButton({
|
|
|
2238
2357
|
modifiers,
|
|
2239
2358
|
...props
|
|
2240
2359
|
}) {
|
|
2241
|
-
const ref =
|
|
2242
|
-
|
|
2360
|
+
const ref = React15.useRef(null);
|
|
2361
|
+
React15.useEffect(() => {
|
|
2243
2362
|
if (modifiers.focused) ref.current?.focus();
|
|
2244
2363
|
}, [modifiers.focused]);
|
|
2245
2364
|
return /* @__PURE__ */ jsx(
|
|
@@ -2260,9 +2379,9 @@ function CalendarDayButton({
|
|
|
2260
2379
|
}
|
|
2261
2380
|
);
|
|
2262
2381
|
}
|
|
2263
|
-
var CarouselContext =
|
|
2382
|
+
var CarouselContext = React15.createContext(null);
|
|
2264
2383
|
function useCarousel() {
|
|
2265
|
-
const context =
|
|
2384
|
+
const context = React15.useContext(CarouselContext);
|
|
2266
2385
|
if (!context) {
|
|
2267
2386
|
throw new Error("useCarousel must be used within a <Carousel />");
|
|
2268
2387
|
}
|
|
@@ -2284,20 +2403,20 @@ function Carousel({
|
|
|
2284
2403
|
},
|
|
2285
2404
|
plugins
|
|
2286
2405
|
);
|
|
2287
|
-
const [canScrollPrev, setCanScrollPrev] =
|
|
2288
|
-
const [canScrollNext, setCanScrollNext] =
|
|
2289
|
-
const onSelect =
|
|
2406
|
+
const [canScrollPrev, setCanScrollPrev] = React15.useState(false);
|
|
2407
|
+
const [canScrollNext, setCanScrollNext] = React15.useState(false);
|
|
2408
|
+
const onSelect = React15.useCallback((api2) => {
|
|
2290
2409
|
if (!api2) return;
|
|
2291
2410
|
setCanScrollPrev(api2.canScrollPrev());
|
|
2292
2411
|
setCanScrollNext(api2.canScrollNext());
|
|
2293
2412
|
}, []);
|
|
2294
|
-
const scrollPrev =
|
|
2413
|
+
const scrollPrev = React15.useCallback(() => {
|
|
2295
2414
|
api?.scrollPrev();
|
|
2296
2415
|
}, [api]);
|
|
2297
|
-
const scrollNext =
|
|
2416
|
+
const scrollNext = React15.useCallback(() => {
|
|
2298
2417
|
api?.scrollNext();
|
|
2299
2418
|
}, [api]);
|
|
2300
|
-
const handleKeyDown =
|
|
2419
|
+
const handleKeyDown = React15.useCallback(
|
|
2301
2420
|
(event) => {
|
|
2302
2421
|
if (event.key === "ArrowLeft") {
|
|
2303
2422
|
event.preventDefault();
|
|
@@ -2309,11 +2428,11 @@ function Carousel({
|
|
|
2309
2428
|
},
|
|
2310
2429
|
[scrollPrev, scrollNext]
|
|
2311
2430
|
);
|
|
2312
|
-
|
|
2431
|
+
React15.useEffect(() => {
|
|
2313
2432
|
if (!api || !setApi) return;
|
|
2314
2433
|
setApi(api);
|
|
2315
2434
|
}, [api, setApi]);
|
|
2316
|
-
|
|
2435
|
+
React15.useEffect(() => {
|
|
2317
2436
|
if (!api) return;
|
|
2318
2437
|
onSelect(api);
|
|
2319
2438
|
api.on("reInit", onSelect);
|
|
@@ -2446,9 +2565,9 @@ function CarouselNext({
|
|
|
2446
2565
|
);
|
|
2447
2566
|
}
|
|
2448
2567
|
var THEMES = { light: "", dark: ".dark" };
|
|
2449
|
-
var ChartContext =
|
|
2568
|
+
var ChartContext = React15.createContext(null);
|
|
2450
2569
|
function useChart() {
|
|
2451
|
-
const context =
|
|
2570
|
+
const context = React15.useContext(ChartContext);
|
|
2452
2571
|
if (!context) {
|
|
2453
2572
|
throw new Error("useChart must be used within a <ChartContainer />");
|
|
2454
2573
|
}
|
|
@@ -2461,7 +2580,7 @@ function ChartContainer({
|
|
|
2461
2580
|
config,
|
|
2462
2581
|
...props
|
|
2463
2582
|
}) {
|
|
2464
|
-
const uniqueId =
|
|
2583
|
+
const uniqueId = React15.useId();
|
|
2465
2584
|
const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
|
|
2466
2585
|
return /* @__PURE__ */ jsx(ChartContext.Provider, { value: { config }, children: /* @__PURE__ */ jsxs(
|
|
2467
2586
|
"div",
|
|
@@ -2522,7 +2641,7 @@ function ChartTooltipContent({
|
|
|
2522
2641
|
labelKey
|
|
2523
2642
|
}) {
|
|
2524
2643
|
const { config } = useChart();
|
|
2525
|
-
const tooltipLabel =
|
|
2644
|
+
const tooltipLabel = React15.useMemo(() => {
|
|
2526
2645
|
if (hideLabel || !payload?.length) {
|
|
2527
2646
|
return null;
|
|
2528
2647
|
}
|
|
@@ -3225,8 +3344,8 @@ function TooltipContent({
|
|
|
3225
3344
|
) });
|
|
3226
3345
|
}
|
|
3227
3346
|
function useDetectTheme() {
|
|
3228
|
-
const [theme, setTheme] =
|
|
3229
|
-
|
|
3347
|
+
const [theme, setTheme] = React15.useState("light");
|
|
3348
|
+
React15.useEffect(() => {
|
|
3230
3349
|
const isDark = document.documentElement.classList.contains("dark");
|
|
3231
3350
|
setTheme(isDark ? "dark" : "light");
|
|
3232
3351
|
const observer = new MutationObserver((mutations) => {
|
|
@@ -3747,7 +3866,7 @@ function CommandShortcut({
|
|
|
3747
3866
|
}
|
|
3748
3867
|
);
|
|
3749
3868
|
}
|
|
3750
|
-
var SearchTrigger =
|
|
3869
|
+
var SearchTrigger = React15.forwardRef(
|
|
3751
3870
|
({
|
|
3752
3871
|
className,
|
|
3753
3872
|
placeholder = "Search...",
|
|
@@ -3783,7 +3902,7 @@ var SearchTrigger = React14.forwardRef(
|
|
|
3783
3902
|
);
|
|
3784
3903
|
SearchTrigger.displayName = "SearchTrigger";
|
|
3785
3904
|
function useSearchShortcut(onOpen, key = "k") {
|
|
3786
|
-
|
|
3905
|
+
React15.useEffect(() => {
|
|
3787
3906
|
const down = (e) => {
|
|
3788
3907
|
if (e.key.toLowerCase() === key.toLowerCase() && (e.metaKey || e.ctrlKey)) {
|
|
3789
3908
|
e.preventDefault();
|
|
@@ -4811,9 +4930,9 @@ var SIDEBAR_WIDTH = "16rem";
|
|
|
4811
4930
|
var SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
4812
4931
|
var SIDEBAR_WIDTH_ICON = "3rem";
|
|
4813
4932
|
var SIDEBAR_KEYBOARD_SHORTCUT = "b";
|
|
4814
|
-
var SidebarContext =
|
|
4933
|
+
var SidebarContext = React15.createContext(null);
|
|
4815
4934
|
function useSidebar() {
|
|
4816
|
-
const context =
|
|
4935
|
+
const context = React15.useContext(SidebarContext);
|
|
4817
4936
|
if (!context) {
|
|
4818
4937
|
throw new Error("useSidebar must be used within a SidebarProvider.");
|
|
4819
4938
|
}
|
|
@@ -4829,10 +4948,10 @@ function SidebarProvider({
|
|
|
4829
4948
|
...props
|
|
4830
4949
|
}) {
|
|
4831
4950
|
const isMobile = useIsMobile();
|
|
4832
|
-
const [openMobile, setOpenMobile] =
|
|
4833
|
-
const [_open, _setOpen] =
|
|
4951
|
+
const [openMobile, setOpenMobile] = React15.useState(false);
|
|
4952
|
+
const [_open, _setOpen] = React15.useState(defaultOpen);
|
|
4834
4953
|
const open = openProp ?? _open;
|
|
4835
|
-
const setOpen =
|
|
4954
|
+
const setOpen = React15.useCallback(
|
|
4836
4955
|
(value) => {
|
|
4837
4956
|
const openState = typeof value === "function" ? value(open) : value;
|
|
4838
4957
|
if (setOpenProp) {
|
|
@@ -4844,10 +4963,10 @@ function SidebarProvider({
|
|
|
4844
4963
|
},
|
|
4845
4964
|
[setOpenProp, open]
|
|
4846
4965
|
);
|
|
4847
|
-
const toggleSidebar =
|
|
4966
|
+
const toggleSidebar = React15.useCallback(() => {
|
|
4848
4967
|
return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
|
|
4849
4968
|
}, [isMobile, setOpen, setOpenMobile]);
|
|
4850
|
-
|
|
4969
|
+
React15.useEffect(() => {
|
|
4851
4970
|
const handleKeyDown = (event) => {
|
|
4852
4971
|
if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
|
|
4853
4972
|
event.preventDefault();
|
|
@@ -4858,7 +4977,7 @@ function SidebarProvider({
|
|
|
4858
4977
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
4859
4978
|
}, [toggleSidebar]);
|
|
4860
4979
|
const state = open ? "expanded" : "collapsed";
|
|
4861
|
-
const contextValue =
|
|
4980
|
+
const contextValue = React15.useMemo(
|
|
4862
4981
|
() => ({
|
|
4863
4982
|
state,
|
|
4864
4983
|
open,
|
|
@@ -5316,7 +5435,7 @@ function SidebarMenuSkeleton({
|
|
|
5316
5435
|
showIcon = false,
|
|
5317
5436
|
...props
|
|
5318
5437
|
}) {
|
|
5319
|
-
const width =
|
|
5438
|
+
const width = React15.useMemo(() => {
|
|
5320
5439
|
return `${Math.floor(Math.random() * 40) + 50}%`;
|
|
5321
5440
|
}, []);
|
|
5322
5441
|
return /* @__PURE__ */ jsxs(
|
|
@@ -5459,7 +5578,7 @@ var sectionVariants = cva(
|
|
|
5459
5578
|
}
|
|
5460
5579
|
);
|
|
5461
5580
|
var isGlassVariant = (variant) => variant?.startsWith("glass-") ?? false;
|
|
5462
|
-
var Section =
|
|
5581
|
+
var Section = React15.forwardRef(
|
|
5463
5582
|
({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
5464
5583
|
"section",
|
|
5465
5584
|
{
|
|
@@ -5471,7 +5590,7 @@ var Section = React14.forwardRef(
|
|
|
5471
5590
|
)
|
|
5472
5591
|
);
|
|
5473
5592
|
Section.displayName = "Section";
|
|
5474
|
-
var SectionHeader =
|
|
5593
|
+
var SectionHeader = React15.forwardRef(
|
|
5475
5594
|
({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
5476
5595
|
"div",
|
|
5477
5596
|
{
|
|
@@ -5486,7 +5605,7 @@ var SectionHeader = React14.forwardRef(
|
|
|
5486
5605
|
)
|
|
5487
5606
|
);
|
|
5488
5607
|
SectionHeader.displayName = "SectionHeader";
|
|
5489
|
-
var SectionTitle =
|
|
5608
|
+
var SectionTitle = React15.forwardRef(
|
|
5490
5609
|
({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
5491
5610
|
"h2",
|
|
5492
5611
|
{
|
|
@@ -5500,7 +5619,7 @@ var SectionTitle = React14.forwardRef(
|
|
|
5500
5619
|
)
|
|
5501
5620
|
);
|
|
5502
5621
|
SectionTitle.displayName = "SectionTitle";
|
|
5503
|
-
var SectionDescription =
|
|
5622
|
+
var SectionDescription = React15.forwardRef(
|
|
5504
5623
|
({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
5505
5624
|
"p",
|
|
5506
5625
|
{
|
|
@@ -5514,7 +5633,7 @@ var SectionDescription = React14.forwardRef(
|
|
|
5514
5633
|
)
|
|
5515
5634
|
);
|
|
5516
5635
|
SectionDescription.displayName = "SectionDescription";
|
|
5517
|
-
var SectionContent =
|
|
5636
|
+
var SectionContent = React15.forwardRef(
|
|
5518
5637
|
({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
5519
5638
|
"div",
|
|
5520
5639
|
{
|
|
@@ -5528,7 +5647,7 @@ var SectionContent = React14.forwardRef(
|
|
|
5528
5647
|
)
|
|
5529
5648
|
);
|
|
5530
5649
|
SectionContent.displayName = "SectionContent";
|
|
5531
|
-
var SectionFooter =
|
|
5650
|
+
var SectionFooter = React15.forwardRef(
|
|
5532
5651
|
({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
5533
5652
|
"div",
|
|
5534
5653
|
{
|
|
@@ -5579,7 +5698,7 @@ function SiteHeader({
|
|
|
5579
5698
|
children: /* @__PURE__ */ jsxs("div", { className: "flex h-[var(--header-height,3.5rem)] w-full items-center gap-[var(--j3m-spacing-s)] px-[var(--j3m-spacing-m)]", children: [
|
|
5580
5699
|
trigger,
|
|
5581
5700
|
trigger && /* @__PURE__ */ jsx(Separator, { orientation: "vertical", className: "mr-[var(--j3m-spacing-s)] h-4" }),
|
|
5582
|
-
/* @__PURE__ */ jsx(Breadcrumb, { className: "hidden sm:block", children: /* @__PURE__ */ jsx(BreadcrumbList, { children: breadcrumbs.map((item, index) => /* @__PURE__ */ jsxs(
|
|
5701
|
+
/* @__PURE__ */ jsx(Breadcrumb, { className: "hidden sm:block", children: /* @__PURE__ */ jsx(BreadcrumbList, { children: breadcrumbs.map((item, index) => /* @__PURE__ */ jsxs(React15.Fragment, { children: [
|
|
5583
5702
|
index > 0 && /* @__PURE__ */ jsx(BreadcrumbSeparator, {}),
|
|
5584
5703
|
/* @__PURE__ */ jsx(BreadcrumbItem, { children: item.href ? /* @__PURE__ */ jsx(BreadcrumbLink, { href: item.href, children: item.label }) : /* @__PURE__ */ jsx(BreadcrumbPage, { children: item.label }) })
|
|
5585
5704
|
] }, index)) }) }),
|
|
@@ -5791,7 +5910,7 @@ var BADGE_VARIANT_LABELS = {
|
|
|
5791
5910
|
colored: "Colored",
|
|
5792
5911
|
mixed: "Mixed"
|
|
5793
5912
|
};
|
|
5794
|
-
var CalendarContext =
|
|
5913
|
+
var CalendarContext = React15.createContext(null);
|
|
5795
5914
|
function EventCalendarProvider({
|
|
5796
5915
|
children,
|
|
5797
5916
|
events: initialEvents = [],
|
|
@@ -5806,38 +5925,38 @@ function EventCalendarProvider({
|
|
|
5806
5925
|
onEventUpdate,
|
|
5807
5926
|
onEventDelete
|
|
5808
5927
|
}) {
|
|
5809
|
-
const [selectedDate, setSelectedDate] =
|
|
5810
|
-
const [selectedUserId, setSelectedUserId] =
|
|
5811
|
-
const [events, setEventsState] =
|
|
5812
|
-
const [users] =
|
|
5813
|
-
const [badgeVariant, setBadgeVariant] =
|
|
5814
|
-
const [view, setView] =
|
|
5815
|
-
const [workingHours, setWorkingHours] =
|
|
5816
|
-
const [visibleHours, setVisibleHours] =
|
|
5817
|
-
|
|
5928
|
+
const [selectedDate, setSelectedDate] = React15.useState(defaultDate);
|
|
5929
|
+
const [selectedUserId, setSelectedUserId] = React15.useState(defaultUserId);
|
|
5930
|
+
const [events, setEventsState] = React15.useState(initialEvents);
|
|
5931
|
+
const [users] = React15.useState(initialUsers);
|
|
5932
|
+
const [badgeVariant, setBadgeVariant] = React15.useState(defaultBadgeVariant);
|
|
5933
|
+
const [view, setView] = React15.useState(defaultView);
|
|
5934
|
+
const [workingHours, setWorkingHours] = React15.useState(defaultWorkingHours);
|
|
5935
|
+
const [visibleHours, setVisibleHours] = React15.useState(defaultVisibleHours);
|
|
5936
|
+
React15.useEffect(() => {
|
|
5818
5937
|
setEventsState(initialEvents);
|
|
5819
5938
|
}, [initialEvents]);
|
|
5820
|
-
const setEvents =
|
|
5939
|
+
const setEvents = React15.useCallback((newEvents) => {
|
|
5821
5940
|
setEventsState(newEvents);
|
|
5822
5941
|
}, []);
|
|
5823
|
-
const addEvent =
|
|
5942
|
+
const addEvent = React15.useCallback((event) => {
|
|
5824
5943
|
setEventsState((prev) => [...prev, event]);
|
|
5825
5944
|
onEventAdd?.(event);
|
|
5826
5945
|
}, [onEventAdd]);
|
|
5827
|
-
const updateEvent =
|
|
5946
|
+
const updateEvent = React15.useCallback((event) => {
|
|
5828
5947
|
setEventsState(
|
|
5829
5948
|
(prev) => prev.map((e) => e.id === event.id ? event : e)
|
|
5830
5949
|
);
|
|
5831
5950
|
onEventUpdate?.(event);
|
|
5832
5951
|
}, [onEventUpdate]);
|
|
5833
|
-
const deleteEvent =
|
|
5952
|
+
const deleteEvent = React15.useCallback((eventId) => {
|
|
5834
5953
|
setEventsState((prev) => prev.filter((e) => e.id !== eventId));
|
|
5835
5954
|
onEventDelete?.(eventId);
|
|
5836
5955
|
}, [onEventDelete]);
|
|
5837
|
-
const goToToday =
|
|
5956
|
+
const goToToday = React15.useCallback(() => {
|
|
5838
5957
|
setSelectedDate(/* @__PURE__ */ new Date());
|
|
5839
5958
|
}, []);
|
|
5840
|
-
const goToPrevious =
|
|
5959
|
+
const goToPrevious = React15.useCallback(() => {
|
|
5841
5960
|
setSelectedDate((current) => {
|
|
5842
5961
|
switch (view) {
|
|
5843
5962
|
case "day":
|
|
@@ -5855,7 +5974,7 @@ function EventCalendarProvider({
|
|
|
5855
5974
|
}
|
|
5856
5975
|
});
|
|
5857
5976
|
}, [view]);
|
|
5858
|
-
const goToNext =
|
|
5977
|
+
const goToNext = React15.useCallback(() => {
|
|
5859
5978
|
setSelectedDate((current) => {
|
|
5860
5979
|
switch (view) {
|
|
5861
5980
|
case "day":
|
|
@@ -5873,7 +5992,7 @@ function EventCalendarProvider({
|
|
|
5873
5992
|
}
|
|
5874
5993
|
});
|
|
5875
5994
|
}, [view]);
|
|
5876
|
-
const contextValue =
|
|
5995
|
+
const contextValue = React15.useMemo(
|
|
5877
5996
|
() => ({
|
|
5878
5997
|
// State
|
|
5879
5998
|
selectedDate,
|
|
@@ -5920,7 +6039,7 @@ function EventCalendarProvider({
|
|
|
5920
6039
|
return /* @__PURE__ */ jsx(CalendarContext.Provider, { value: contextValue, children });
|
|
5921
6040
|
}
|
|
5922
6041
|
function useEventCalendar() {
|
|
5923
|
-
const context =
|
|
6042
|
+
const context = React15.useContext(CalendarContext);
|
|
5924
6043
|
if (!context) {
|
|
5925
6044
|
throw new Error("useEventCalendar must be used within an EventCalendarProvider");
|
|
5926
6045
|
}
|
|
@@ -5928,14 +6047,14 @@ function useEventCalendar() {
|
|
|
5928
6047
|
}
|
|
5929
6048
|
function useFilteredEvents() {
|
|
5930
6049
|
const { events, selectedUserId } = useEventCalendar();
|
|
5931
|
-
return
|
|
6050
|
+
return React15.useMemo(() => {
|
|
5932
6051
|
if (!selectedUserId) return events;
|
|
5933
6052
|
return events.filter((event) => event.user.id === selectedUserId);
|
|
5934
6053
|
}, [events, selectedUserId]);
|
|
5935
6054
|
}
|
|
5936
6055
|
function useEventsInRange(startDate, endDate) {
|
|
5937
6056
|
const filteredEvents = useFilteredEvents();
|
|
5938
|
-
return
|
|
6057
|
+
return React15.useMemo(() => {
|
|
5939
6058
|
return filteredEvents.filter((event) => {
|
|
5940
6059
|
const eventStart = new Date(event.startDate);
|
|
5941
6060
|
const eventEnd = new Date(event.endDate);
|
|
@@ -6493,8 +6612,8 @@ function MoreEvents({ count, onClick, className }) {
|
|
|
6493
6612
|
);
|
|
6494
6613
|
}
|
|
6495
6614
|
function TimeIndicator({ className }) {
|
|
6496
|
-
const [now, setNow] =
|
|
6497
|
-
|
|
6615
|
+
const [now, setNow] = React15.useState(/* @__PURE__ */ new Date());
|
|
6616
|
+
React15.useEffect(() => {
|
|
6498
6617
|
const interval = setInterval(() => setNow(/* @__PURE__ */ new Date()), 6e4);
|
|
6499
6618
|
return () => clearInterval(interval);
|
|
6500
6619
|
}, []);
|
|
@@ -6531,24 +6650,24 @@ function DateBadge({ date, className }) {
|
|
|
6531
6650
|
}
|
|
6532
6651
|
);
|
|
6533
6652
|
}
|
|
6534
|
-
var DragContext =
|
|
6653
|
+
var DragContext = React15.createContext(null);
|
|
6535
6654
|
function DragProvider({
|
|
6536
6655
|
children,
|
|
6537
6656
|
snapMinutes = 15,
|
|
6538
6657
|
onDragStart,
|
|
6539
6658
|
onDragEnd
|
|
6540
6659
|
}) {
|
|
6541
|
-
const [draggedEvent, setDraggedEventState] =
|
|
6542
|
-
const [isDragging, setIsDragging] =
|
|
6660
|
+
const [draggedEvent, setDraggedEventState] = React15.useState(null);
|
|
6661
|
+
const [isDragging, setIsDragging] = React15.useState(false);
|
|
6543
6662
|
const { updateEvent } = useEventCalendar();
|
|
6544
|
-
const setDraggedEvent =
|
|
6663
|
+
const setDraggedEvent = React15.useCallback((event) => {
|
|
6545
6664
|
setDraggedEventState(event);
|
|
6546
6665
|
setIsDragging(!!event);
|
|
6547
6666
|
if (event) {
|
|
6548
6667
|
onDragStart?.(event);
|
|
6549
6668
|
}
|
|
6550
6669
|
}, [onDragStart]);
|
|
6551
|
-
const handleDrop =
|
|
6670
|
+
const handleDrop = React15.useCallback((newStartDate) => {
|
|
6552
6671
|
if (!draggedEvent) return;
|
|
6553
6672
|
const snappedDate = snapToInterval(newStartDate, snapMinutes);
|
|
6554
6673
|
const { startDate, endDate } = calculateDropDates(draggedEvent, snappedDate);
|
|
@@ -6561,7 +6680,7 @@ function DragProvider({
|
|
|
6561
6680
|
onDragEnd?.(updatedEvent, new Date(startDate), new Date(endDate));
|
|
6562
6681
|
setDraggedEvent(null);
|
|
6563
6682
|
}, [draggedEvent, snapMinutes, updateEvent, onDragEnd, setDraggedEvent]);
|
|
6564
|
-
const contextValue =
|
|
6683
|
+
const contextValue = React15.useMemo(
|
|
6565
6684
|
() => ({
|
|
6566
6685
|
draggedEvent,
|
|
6567
6686
|
setDraggedEvent,
|
|
@@ -6572,7 +6691,7 @@ function DragProvider({
|
|
|
6572
6691
|
return /* @__PURE__ */ jsx(DragContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(DragDropHandler, { onDrop: handleDrop, children }) });
|
|
6573
6692
|
}
|
|
6574
6693
|
function useDrag() {
|
|
6575
|
-
const context =
|
|
6694
|
+
const context = React15.useContext(DragContext);
|
|
6576
6695
|
if (!context) {
|
|
6577
6696
|
throw new Error("useDrag must be used within a DragProvider");
|
|
6578
6697
|
}
|
|
@@ -6617,7 +6736,7 @@ function DroppableZone({
|
|
|
6617
6736
|
}) {
|
|
6618
6737
|
const { draggedEvent, setDraggedEvent } = useDrag();
|
|
6619
6738
|
const { updateEvent } = useEventCalendar();
|
|
6620
|
-
const [isOver, setIsOver] =
|
|
6739
|
+
const [isOver, setIsOver] = React15.useState(false);
|
|
6621
6740
|
const handleDragOver = (e) => {
|
|
6622
6741
|
e.preventDefault();
|
|
6623
6742
|
e.dataTransfer.dropEffect = "move";
|
|
@@ -6655,23 +6774,23 @@ function DroppableZone({
|
|
|
6655
6774
|
function useDroppable({ date, hour, minute = 0, onDrop }) {
|
|
6656
6775
|
const { draggedEvent, setDraggedEvent } = useDrag();
|
|
6657
6776
|
const { updateEvent } = useEventCalendar();
|
|
6658
|
-
const [isOver, setIsOver] =
|
|
6659
|
-
const dropTargetDate =
|
|
6777
|
+
const [isOver, setIsOver] = React15.useState(false);
|
|
6778
|
+
const dropTargetDate = React15.useMemo(() => {
|
|
6660
6779
|
const targetDate = new Date(date);
|
|
6661
6780
|
if (hour !== void 0) {
|
|
6662
6781
|
targetDate.setHours(hour, minute, 0, 0);
|
|
6663
6782
|
}
|
|
6664
6783
|
return targetDate;
|
|
6665
6784
|
}, [date, hour, minute]);
|
|
6666
|
-
const handleDragOver =
|
|
6785
|
+
const handleDragOver = React15.useCallback((e) => {
|
|
6667
6786
|
e.preventDefault();
|
|
6668
6787
|
e.dataTransfer.dropEffect = "move";
|
|
6669
6788
|
if (!isOver) setIsOver(true);
|
|
6670
6789
|
}, [isOver]);
|
|
6671
|
-
const handleDragLeave =
|
|
6790
|
+
const handleDragLeave = React15.useCallback(() => {
|
|
6672
6791
|
setIsOver(false);
|
|
6673
6792
|
}, []);
|
|
6674
|
-
const handleDrop =
|
|
6793
|
+
const handleDrop = React15.useCallback((e) => {
|
|
6675
6794
|
e.preventDefault();
|
|
6676
6795
|
setIsOver(false);
|
|
6677
6796
|
if (!draggedEvent) return;
|
|
@@ -6698,13 +6817,13 @@ function useDroppable({ date, hour, minute = 0, onDrop }) {
|
|
|
6698
6817
|
function useDraggable(event, disabled = false) {
|
|
6699
6818
|
const { setDraggedEvent, draggedEvent } = useDrag();
|
|
6700
6819
|
const isDragged = draggedEvent?.id === event.id;
|
|
6701
|
-
const handleDragStart =
|
|
6820
|
+
const handleDragStart = React15.useCallback((e) => {
|
|
6702
6821
|
if (disabled) return;
|
|
6703
6822
|
e.dataTransfer.effectAllowed = "move";
|
|
6704
6823
|
e.dataTransfer.setData("text/plain", event.id);
|
|
6705
6824
|
setDraggedEvent(event);
|
|
6706
6825
|
}, [disabled, event, setDraggedEvent]);
|
|
6707
|
-
const handleDragEnd =
|
|
6826
|
+
const handleDragEnd = React15.useCallback(() => {
|
|
6708
6827
|
setDraggedEvent(null);
|
|
6709
6828
|
}, [setDraggedEvent]);
|
|
6710
6829
|
return {
|
|
@@ -6745,15 +6864,15 @@ function MonthView({
|
|
|
6745
6864
|
}) {
|
|
6746
6865
|
const { selectedDate, badgeVariant, setSelectedDate, setView } = useEventCalendar();
|
|
6747
6866
|
const filteredEvents = useFilteredEvents();
|
|
6748
|
-
const { singleDayEvents, multiDayEvents } =
|
|
6867
|
+
const { singleDayEvents, multiDayEvents } = React15.useMemo(
|
|
6749
6868
|
() => splitEventsByDuration(filteredEvents),
|
|
6750
6869
|
[filteredEvents]
|
|
6751
6870
|
);
|
|
6752
|
-
const cells =
|
|
6871
|
+
const cells = React15.useMemo(
|
|
6753
6872
|
() => getCalendarCells(selectedDate),
|
|
6754
6873
|
[selectedDate]
|
|
6755
6874
|
);
|
|
6756
|
-
const eventPositions =
|
|
6875
|
+
const eventPositions = React15.useMemo(
|
|
6757
6876
|
() => calculateMonthEventPositions(multiDayEvents, singleDayEvents, selectedDate),
|
|
6758
6877
|
[multiDayEvents, singleDayEvents, selectedDate]
|
|
6759
6878
|
);
|
|
@@ -6935,7 +7054,7 @@ function WeekView({
|
|
|
6935
7054
|
visibleHours
|
|
6936
7055
|
} = useEventCalendar();
|
|
6937
7056
|
const filteredEvents = useFilteredEvents();
|
|
6938
|
-
const { singleDayEvents, multiDayEvents } =
|
|
7057
|
+
const { singleDayEvents, multiDayEvents } = React15.useMemo(
|
|
6939
7058
|
() => splitEventsByDuration(filteredEvents),
|
|
6940
7059
|
[filteredEvents]
|
|
6941
7060
|
);
|
|
@@ -7141,8 +7260,8 @@ function CalendarTimeline({
|
|
|
7141
7260
|
firstVisibleHour,
|
|
7142
7261
|
lastVisibleHour
|
|
7143
7262
|
}) {
|
|
7144
|
-
const [currentTime, setCurrentTime] =
|
|
7145
|
-
|
|
7263
|
+
const [currentTime, setCurrentTime] = React15.useState(/* @__PURE__ */ new Date());
|
|
7264
|
+
React15.useEffect(() => {
|
|
7146
7265
|
const interval = setInterval(() => {
|
|
7147
7266
|
setCurrentTime(/* @__PURE__ */ new Date());
|
|
7148
7267
|
}, 6e4);
|
|
@@ -7225,7 +7344,7 @@ function DayView({
|
|
|
7225
7344
|
visibleHours
|
|
7226
7345
|
} = useEventCalendar();
|
|
7227
7346
|
const filteredEvents = useFilteredEvents();
|
|
7228
|
-
const { singleDayEvents, multiDayEvents } =
|
|
7347
|
+
const { singleDayEvents, multiDayEvents } = React15.useMemo(
|
|
7229
7348
|
() => splitEventsByDuration(filteredEvents),
|
|
7230
7349
|
[filteredEvents]
|
|
7231
7350
|
);
|
|
@@ -7233,7 +7352,7 @@ function DayView({
|
|
|
7233
7352
|
visibleHours,
|
|
7234
7353
|
singleDayEvents
|
|
7235
7354
|
);
|
|
7236
|
-
const currentEvents =
|
|
7355
|
+
const currentEvents = React15.useMemo(() => {
|
|
7237
7356
|
if (!isToday(selectedDate)) return [];
|
|
7238
7357
|
return getCurrentEvents(singleDayEvents);
|
|
7239
7358
|
}, [singleDayEvents, selectedDate]);
|
|
@@ -7457,8 +7576,8 @@ function CalendarTimeline2({
|
|
|
7457
7576
|
firstVisibleHour,
|
|
7458
7577
|
lastVisibleHour
|
|
7459
7578
|
}) {
|
|
7460
|
-
const [currentTime, setCurrentTime] =
|
|
7461
|
-
|
|
7579
|
+
const [currentTime, setCurrentTime] = React15.useState(/* @__PURE__ */ new Date());
|
|
7580
|
+
React15.useEffect(() => {
|
|
7462
7581
|
const interval = setInterval(() => {
|
|
7463
7582
|
setCurrentTime(/* @__PURE__ */ new Date());
|
|
7464
7583
|
}, 6e4);
|
|
@@ -7492,7 +7611,7 @@ function YearView({
|
|
|
7492
7611
|
}) {
|
|
7493
7612
|
const { selectedDate, setSelectedDate, setView } = useEventCalendar();
|
|
7494
7613
|
const filteredEvents = useFilteredEvents();
|
|
7495
|
-
const months =
|
|
7614
|
+
const months = React15.useMemo(() => {
|
|
7496
7615
|
const yearStart = startOfYear(selectedDate);
|
|
7497
7616
|
return Array.from({ length: 12 }, (_, i) => addMonths(yearStart, i));
|
|
7498
7617
|
}, [selectedDate]);
|
|
@@ -7615,11 +7734,11 @@ function AgendaView({
|
|
|
7615
7734
|
}) {
|
|
7616
7735
|
const { selectedDate, setSelectedDate, setView } = useEventCalendar();
|
|
7617
7736
|
const filteredEvents = useFilteredEvents();
|
|
7618
|
-
const { singleDayEvents, multiDayEvents } =
|
|
7737
|
+
const { singleDayEvents, multiDayEvents } = React15.useMemo(
|
|
7619
7738
|
() => splitEventsByDuration(filteredEvents),
|
|
7620
7739
|
[filteredEvents]
|
|
7621
7740
|
);
|
|
7622
|
-
const eventsByDay =
|
|
7741
|
+
const eventsByDay = React15.useMemo(() => {
|
|
7623
7742
|
const allDates = /* @__PURE__ */ new Map();
|
|
7624
7743
|
singleDayEvents.forEach((event) => {
|
|
7625
7744
|
const eventDate = parseISO(event.startDate);
|
|
@@ -8056,16 +8175,16 @@ function EventDialog({
|
|
|
8056
8175
|
defaultUserId
|
|
8057
8176
|
}) {
|
|
8058
8177
|
const { addEvent, updateEvent, deleteEvent, users } = useEventCalendar();
|
|
8059
|
-
const [title, setTitle] =
|
|
8060
|
-
const [description, setDescription] =
|
|
8061
|
-
const [startDate, setStartDate] =
|
|
8062
|
-
const [startTime, setStartTime] =
|
|
8063
|
-
const [endDate, setEndDate] =
|
|
8064
|
-
const [endTime, setEndTime] =
|
|
8065
|
-
const [color, setColor] =
|
|
8066
|
-
const [userId, setUserId] =
|
|
8067
|
-
const [isSubmitting, setIsSubmitting] =
|
|
8068
|
-
|
|
8178
|
+
const [title, setTitle] = React15.useState("");
|
|
8179
|
+
const [description, setDescription] = React15.useState("");
|
|
8180
|
+
const [startDate, setStartDate] = React15.useState("");
|
|
8181
|
+
const [startTime, setStartTime] = React15.useState("");
|
|
8182
|
+
const [endDate, setEndDate] = React15.useState("");
|
|
8183
|
+
const [endTime, setEndTime] = React15.useState("");
|
|
8184
|
+
const [color, setColor] = React15.useState("blue");
|
|
8185
|
+
const [userId, setUserId] = React15.useState("");
|
|
8186
|
+
const [isSubmitting, setIsSubmitting] = React15.useState(false);
|
|
8187
|
+
React15.useEffect(() => {
|
|
8069
8188
|
if (open) {
|
|
8070
8189
|
if (mode === "edit" && event) {
|
|
8071
8190
|
const start = parseISO(event.startDate);
|
|
@@ -8288,7 +8407,7 @@ function QuickAddEvent({
|
|
|
8288
8407
|
onOpenDialog,
|
|
8289
8408
|
onClose
|
|
8290
8409
|
}) {
|
|
8291
|
-
const [title, setTitle] =
|
|
8410
|
+
const [title, setTitle] = React15.useState("");
|
|
8292
8411
|
const { users } = useEventCalendar();
|
|
8293
8412
|
const handleSubmit = (e) => {
|
|
8294
8413
|
e.preventDefault();
|
|
@@ -8355,8 +8474,8 @@ var HOUR_OPTIONS = Array.from({ length: 25 }, (_, i) => {
|
|
|
8355
8474
|
});
|
|
8356
8475
|
function ChangeVisibleHoursInput() {
|
|
8357
8476
|
const { visibleHours, setVisibleHours } = useEventCalendar();
|
|
8358
|
-
const [from, setFrom] =
|
|
8359
|
-
const [to, setTo] =
|
|
8477
|
+
const [from, setFrom] = React15.useState(visibleHours.from);
|
|
8478
|
+
const [to, setTo] = React15.useState(visibleHours.to);
|
|
8360
8479
|
const handleApply = () => {
|
|
8361
8480
|
const toHour = to === 0 ? 24 : to;
|
|
8362
8481
|
setVisibleHours({ from, to: toHour });
|
|
@@ -8402,7 +8521,7 @@ var HOUR_OPTIONS2 = Array.from({ length: 25 }, (_, i) => {
|
|
|
8402
8521
|
});
|
|
8403
8522
|
function ChangeWorkingHoursInput() {
|
|
8404
8523
|
const { workingHours, setWorkingHours } = useEventCalendar();
|
|
8405
|
-
const [localWorkingHours, setLocalWorkingHours] =
|
|
8524
|
+
const [localWorkingHours, setLocalWorkingHours] = React15.useState({
|
|
8406
8525
|
...workingHours
|
|
8407
8526
|
});
|
|
8408
8527
|
const handleToggleDay = (dayId) => {
|
|
@@ -8516,8 +8635,8 @@ function CalendarSettingsPanel({
|
|
|
8516
8635
|
] }) });
|
|
8517
8636
|
}
|
|
8518
8637
|
function useMediaQuery(query) {
|
|
8519
|
-
const [matches, setMatches] =
|
|
8520
|
-
|
|
8638
|
+
const [matches, setMatches] = React15.useState(false);
|
|
8639
|
+
React15.useEffect(() => {
|
|
8521
8640
|
const media = window.matchMedia(query);
|
|
8522
8641
|
setMatches(media.matches);
|
|
8523
8642
|
const listener = (event) => {
|
|
@@ -8569,10 +8688,10 @@ function BigCalendarInner({
|
|
|
8569
8688
|
maxEventsPerDay
|
|
8570
8689
|
}) {
|
|
8571
8690
|
const { view, setView } = useEventCalendar();
|
|
8572
|
-
const [dialogOpen, setDialogOpen] =
|
|
8573
|
-
const [selectedEvent, setSelectedEvent] =
|
|
8574
|
-
const [dialogMode, setDialogMode] =
|
|
8575
|
-
const [defaultDate, setDefaultDate] =
|
|
8691
|
+
const [dialogOpen, setDialogOpen] = React15.useState(false);
|
|
8692
|
+
const [selectedEvent, setSelectedEvent] = React15.useState(null);
|
|
8693
|
+
const [dialogMode, setDialogMode] = React15.useState("add");
|
|
8694
|
+
const [defaultDate, setDefaultDate] = React15.useState(/* @__PURE__ */ new Date());
|
|
8576
8695
|
const isMobile = useMediaQuery("(max-width: 768px)");
|
|
8577
8696
|
const isCompact = compact === "auto" ? isMobile : compact;
|
|
8578
8697
|
const handleAddClick = () => {
|
|
@@ -8720,6 +8839,6 @@ function CalendarView({
|
|
|
8720
8839
|
}
|
|
8721
8840
|
}
|
|
8722
8841
|
|
|
8723
|
-
export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AgendaView, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarFallback, AvatarImage, BADGE_VARIANT_LABELS, Badge, BigCalendar, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarContext, CalendarDayButton, CalendarHeader, CalendarHeaderCompact, CalendarSettingsPanel, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChangeBadgeVariantInput, ChangeVisibleHoursInput, ChangeWorkingHoursInput, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DEFAULT_VISIBLE_HOURS, DEFAULT_WORKING_HOURS, DateBadge, DayView, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DragContext, DragProvider, DraggableEvent, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DroppableZone, EVENT_COLORS, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, EventBadge, EventCalendarProvider, EventDialog, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Item6 as Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label2 as Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MonthView, MoreEvents, NativeSelect, NativeSelectOptGroup, NativeSelectOption, NavMain, NavProjects, NavSecondary, NavUser, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PlayerCanvas, PlayerCanvasActionButton, PlayerCanvasControls, PlayerCanvasDivider, PlayerCanvasInfo, PlayerCanvasLabel, PlayerCanvasPlayButton, PlayerCanvasProgress, PlayerCanvasSkipButton, PlayerCanvasTitle, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, QuickAddEvent, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, SearchForm, SearchTrigger, Section, SectionContent, SectionDescription, SectionFooter, SectionHeader, SectionTitle, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SiteHeader, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, TimeIndicator, Toaster, Toggle, ToggleGroup, ToggleGroupItem, ToolBarCanvas, ToolBarCanvasButton, ToolBarCanvasDivider, ToolBarCanvasGroup, Tooltip2 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, UserAvatarsDropdown, VIEW_LABELS, WeekView, YearView, badgeVariants, buttonGroupVariants, buttonVariants, calculateDropDates, calculateMonthEventPositions, cardVariants, createDefaultEvent, formatDateRange, formatTime, generateEventId, getCalendarCells, getCurrentEvents, getDayHours, getEventBlockStyle, getEventDuration, getEventDurationMinutes, getEventsCount, getEventsForDate, getEventsInRange, getHeaderLabel, getMonthCellEvents, getMonthDays, getTimeHeight, getTimePosition, getViewDateRange, getVisibleHours, getWeekDayNames, getWeekDays, getYearMonths, groupEvents, isMultiDayEvent, isWorkingHour, navigateDate, navigationMenuTriggerStyle, playerCanvasPlayButtonVariants, playerCanvasSkipButtonVariants, rangeText, sectionVariants, snapToInterval, sortEvents, splitEventsByDuration, toggleVariants, toolBarCanvasButtonVariants, useDrag, useDraggable, useDroppable, useEventCalendar, useEventsInRange, useFilteredEvents, useFormField, useIsMobile, useSearchShortcut, useSidebar };
|
|
8842
|
+
export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AgendaView, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarFallback, AvatarImage, BADGE_VARIANT_LABELS, Badge, BigCalendar, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, CalendarContext, CalendarDayButton, CalendarHeader, CalendarHeaderCompact, CalendarSettingsPanel, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChangeBadgeVariantInput, ChangeVisibleHoursInput, ChangeWorkingHoursInput, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DEFAULT_VISIBLE_HOURS, DEFAULT_WORKING_HOURS, DateBadge, DayView, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DragContext, DragProvider, DraggableEvent, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DroppableZone, EVENT_COLORS, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, EventBadge, EventCalendarProvider, EventDialog, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Item6 as Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label2 as Label, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MonthView, MoreEvents, NativeSelect, NativeSelectOptGroup, NativeSelectOption, NavMain, NavProjects, NavSecondary, NavUser, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PlayerCanvas, PlayerCanvasActionButton, PlayerCanvasControls, PlayerCanvasDivider, PlayerCanvasInfo, PlayerCanvasLabel, PlayerCanvasPlayButton, PlayerCanvasProgress, PlayerCanvasSkipButton, PlayerCanvasTitle, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, QuickAddEvent, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, SearchForm, SearchTrigger, Section, SectionContent, SectionDescription, SectionFooter, SectionHeader, SectionTitle, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SiteHeader, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeSwitch, TimeIndicator, Toaster, Toggle, ToggleGroup, ToggleGroupItem, ToolBarCanvas, ToolBarCanvasButton, ToolBarCanvasDivider, ToolBarCanvasGroup, Tooltip2 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, UserAvatarsDropdown, VIEW_LABELS, WeekView, YearView, badgeVariants, buttonGroupVariants, buttonVariants, calculateDropDates, calculateMonthEventPositions, cardVariants, createDefaultEvent, formatDateRange, formatTime, generateEventId, getCalendarCells, getCurrentEvents, getDayHours, getEventBlockStyle, getEventDuration, getEventDurationMinutes, getEventsCount, getEventsForDate, getEventsInRange, getHeaderLabel, getMonthCellEvents, getMonthDays, getTimeHeight, getTimePosition, getViewDateRange, getVisibleHours, getWeekDayNames, getWeekDays, getYearMonths, groupEvents, isMultiDayEvent, isWorkingHour, navigateDate, navigationMenuTriggerStyle, playerCanvasPlayButtonVariants, playerCanvasSkipButtonVariants, rangeText, sectionVariants, snapToInterval, sortEvents, splitEventsByDuration, toggleVariants, toolBarCanvasButtonVariants, useDrag, useDraggable, useDroppable, useEventCalendar, useEventsInRange, useFilteredEvents, useFormField, useIsMobile, useSearchShortcut, useSidebar };
|
|
8724
8843
|
//# sourceMappingURL=index.js.map
|
|
8725
8844
|
//# sourceMappingURL=index.js.map
|