calendarkit-pro 1.3.1 → 1.4.0
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 +22 -3
- package/dist/index.d.mts +7 -0
- package/dist/index.d.ts +7 -0
- package/dist/index.js +919 -415
- package/dist/index.mjs +883 -379
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -35,8 +35,8 @@ __export(index_exports, {
|
|
|
35
35
|
cn: () => cn
|
|
36
36
|
});
|
|
37
37
|
module.exports = __toCommonJS(index_exports);
|
|
38
|
-
var
|
|
39
|
-
var
|
|
38
|
+
var import_react22 = __toESM(require("react"));
|
|
39
|
+
var import_core5 = require("@dnd-kit/core");
|
|
40
40
|
var import_modifiers = require("@dnd-kit/modifiers");
|
|
41
41
|
var import_framer_motion4 = require("framer-motion");
|
|
42
42
|
|
|
@@ -420,7 +420,12 @@ var en = {
|
|
|
420
420
|
toggleSidebar: "Toggle sidebar",
|
|
421
421
|
toggleTheme: "Toggle dark mode",
|
|
422
422
|
switchLanguage: "Switch language",
|
|
423
|
-
eventColor: "Event color"
|
|
423
|
+
eventColor: "Event color",
|
|
424
|
+
showLess: "Show less",
|
|
425
|
+
continuesBefore: "Started earlier",
|
|
426
|
+
continuesAfter: "Continues later",
|
|
427
|
+
durationDay: "1 day",
|
|
428
|
+
durationDays: "{n} days"
|
|
424
429
|
};
|
|
425
430
|
var fr = {
|
|
426
431
|
today: "Aujourd'hui",
|
|
@@ -527,7 +532,12 @@ var fr = {
|
|
|
527
532
|
toggleSidebar: "Afficher ou masquer la barre lat\xE9rale",
|
|
528
533
|
toggleTheme: "Basculer le th\xE8me sombre",
|
|
529
534
|
switchLanguage: "Changer de langue",
|
|
530
|
-
eventColor: "Couleur de l'\xE9v\xE9nement"
|
|
535
|
+
eventColor: "Couleur de l'\xE9v\xE9nement",
|
|
536
|
+
showLess: "R\xE9duire",
|
|
537
|
+
continuesBefore: "A commenc\xE9 avant",
|
|
538
|
+
continuesAfter: "Continue apr\xE8s",
|
|
539
|
+
durationDay: "1 jour",
|
|
540
|
+
durationDays: "{n} jours"
|
|
531
541
|
};
|
|
532
542
|
|
|
533
543
|
// src/core/format.ts
|
|
@@ -737,10 +747,13 @@ var Sidebar = ({
|
|
|
737
747
|
};
|
|
738
748
|
|
|
739
749
|
// src/views/MonthView.tsx
|
|
740
|
-
var
|
|
741
|
-
var
|
|
750
|
+
var import_react7 = __toESM(require("react"));
|
|
751
|
+
var import_date_fns10 = require("date-fns");
|
|
742
752
|
|
|
743
753
|
// src/core/events.ts
|
|
754
|
+
var import_date_fns8 = require("date-fns");
|
|
755
|
+
|
|
756
|
+
// src/core/allDay.ts
|
|
744
757
|
var import_date_fns7 = require("date-fns");
|
|
745
758
|
|
|
746
759
|
// src/core/timezone.ts
|
|
@@ -801,6 +814,91 @@ function displayToday(tz, now = /* @__PURE__ */ new Date()) {
|
|
|
801
814
|
return (0, import_date_fns6.startOfDay)(toDisplay(now, tz));
|
|
802
815
|
}
|
|
803
816
|
|
|
817
|
+
// src/core/allDay.ts
|
|
818
|
+
var DAY_EVENT_MIN_MS = 24 * 60 * 60 * 1e3;
|
|
819
|
+
function isDayEvent(event) {
|
|
820
|
+
return event.allDay === true || event.end.getTime() - event.start.getTime() >= DAY_EVENT_MIN_MS;
|
|
821
|
+
}
|
|
822
|
+
var isMidnight = (date) => date.getHours() === 0 && date.getMinutes() === 0 && date.getSeconds() === 0 && date.getMilliseconds() === 0;
|
|
823
|
+
var isUtcMidnight = (date) => date.getUTCHours() === 0 && date.getUTCMinutes() === 0 && date.getUTCSeconds() === 0 && date.getUTCMilliseconds() === 0;
|
|
824
|
+
function toCalendarMidnight(date) {
|
|
825
|
+
return !isMidnight(date) && isUtcMidnight(date) ? new Date(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate()) : date;
|
|
826
|
+
}
|
|
827
|
+
function calendarDay(date) {
|
|
828
|
+
if (isMidnight(date)) return { day: (0, import_date_fns7.startOfDay)(date), midnight: true };
|
|
829
|
+
if (isUtcMidnight(date)) return { day: new Date(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate()), midnight: true };
|
|
830
|
+
return { day: (0, import_date_fns7.startOfDay)(date), midnight: false };
|
|
831
|
+
}
|
|
832
|
+
function dayEventSpan(event, tz) {
|
|
833
|
+
if (event.allDay) {
|
|
834
|
+
const firstDay2 = calendarDay(event.start).day;
|
|
835
|
+
if (event.end.getTime() <= event.start.getTime()) return { firstDay: firstDay2, lastDay: firstDay2 };
|
|
836
|
+
const end = calendarDay(event.end);
|
|
837
|
+
const lastDay2 = end.midnight ? (0, import_date_fns7.addDays)(end.day, -1) : end.day;
|
|
838
|
+
return { firstDay: firstDay2, lastDay: lastDay2 < firstDay2 ? firstDay2 : lastDay2 };
|
|
839
|
+
}
|
|
840
|
+
const firstDay = (0, import_date_fns7.startOfDay)(toDisplay(event.start, tz));
|
|
841
|
+
const lastDay = (0, import_date_fns7.startOfDay)(toDisplay(new Date(event.end.getTime() - 1), tz));
|
|
842
|
+
return { firstDay, lastDay: lastDay < firstDay ? firstDay : lastDay };
|
|
843
|
+
}
|
|
844
|
+
var partitionCache = /* @__PURE__ */ new WeakMap();
|
|
845
|
+
function partitionDayEvents(events, tz) {
|
|
846
|
+
let byZone = partitionCache.get(events);
|
|
847
|
+
if (!byZone) {
|
|
848
|
+
byZone = /* @__PURE__ */ new Map();
|
|
849
|
+
partitionCache.set(events, byZone);
|
|
850
|
+
}
|
|
851
|
+
const key = tz ?? "";
|
|
852
|
+
let result = byZone.get(key);
|
|
853
|
+
if (!result) {
|
|
854
|
+
const dayEvents = [];
|
|
855
|
+
const timedEvents = [];
|
|
856
|
+
for (const event of events) (isDayEvent(event) ? dayEvents : timedEvents).push(event);
|
|
857
|
+
result = { dayEvents, timedEvents };
|
|
858
|
+
byZone.set(key, result);
|
|
859
|
+
}
|
|
860
|
+
return result;
|
|
861
|
+
}
|
|
862
|
+
var rowCache = /* @__PURE__ */ new WeakMap();
|
|
863
|
+
function layoutDayRow(days, dayEvents, tz) {
|
|
864
|
+
if (days.length === 0) return { segments: [], laneCount: 0 };
|
|
865
|
+
const rowStart = (0, import_date_fns7.startOfDay)(days[0]);
|
|
866
|
+
const columns = days.length;
|
|
867
|
+
const key = `${tz ?? ""}|${rowStart.getTime()}|${columns}`;
|
|
868
|
+
let cache = rowCache.get(dayEvents);
|
|
869
|
+
if (!cache) {
|
|
870
|
+
cache = /* @__PURE__ */ new Map();
|
|
871
|
+
rowCache.set(dayEvents, cache);
|
|
872
|
+
}
|
|
873
|
+
const cached = cache.get(key);
|
|
874
|
+
if (cached) return cached;
|
|
875
|
+
const unplaced = [];
|
|
876
|
+
for (const event of dayEvents) {
|
|
877
|
+
const { firstDay, lastDay } = dayEventSpan(event, tz);
|
|
878
|
+
const first = (0, import_date_fns7.differenceInCalendarDays)(firstDay, rowStart);
|
|
879
|
+
const last = (0, import_date_fns7.differenceInCalendarDays)(lastDay, rowStart);
|
|
880
|
+
if (last < 0 || first >= columns) continue;
|
|
881
|
+
const startCol = Math.max(first, 0);
|
|
882
|
+
const endCol = Math.min(last, columns - 1);
|
|
883
|
+
unplaced.push({ event, startCol, span: endCol - startCol + 1, continuesBefore: first < 0, continuesAfter: last >= columns });
|
|
884
|
+
}
|
|
885
|
+
unplaced.sort((a, b) => a.startCol - b.startCol || b.span - a.span || (a.event.id < b.event.id ? -1 : a.event.id > b.event.id ? 1 : 0));
|
|
886
|
+
const occupied = [];
|
|
887
|
+
const segments = [];
|
|
888
|
+
for (const segment of unplaced) {
|
|
889
|
+
let lane = occupied.findIndex((row) => row.slice(segment.startCol, segment.startCol + segment.span).every((taken) => !taken));
|
|
890
|
+
if (lane === -1) {
|
|
891
|
+
lane = occupied.length;
|
|
892
|
+
occupied.push(new Array(columns).fill(false));
|
|
893
|
+
}
|
|
894
|
+
for (let c = segment.startCol; c < segment.startCol + segment.span; c++) occupied[lane][c] = true;
|
|
895
|
+
segments.push({ ...segment, lane });
|
|
896
|
+
}
|
|
897
|
+
const layout = { segments, laneCount: occupied.length };
|
|
898
|
+
cache.set(key, layout);
|
|
899
|
+
return layout;
|
|
900
|
+
}
|
|
901
|
+
|
|
804
902
|
// src/core/events.ts
|
|
805
903
|
var toDate = (value) => value === void 0 || value === null ? void 0 : value instanceof Date ? value : new Date(value);
|
|
806
904
|
var isValidDate = (date) => !!date && !Number.isNaN(date.getTime());
|
|
@@ -809,29 +907,35 @@ var normalizedList = /* @__PURE__ */ new WeakMap();
|
|
|
809
907
|
function normalizeEvent(event) {
|
|
810
908
|
const cached = normalizedEvent.get(event);
|
|
811
909
|
if (cached !== void 0) return cached;
|
|
812
|
-
const
|
|
813
|
-
const
|
|
910
|
+
const day = (value) => event.allDay && value ? toCalendarMidnight(value) : value;
|
|
911
|
+
const start = day(toDate(event.start));
|
|
912
|
+
const end = day(toDate(event.end));
|
|
814
913
|
let result = null;
|
|
815
914
|
if (!isValidDate(start) || !isValidDate(end)) {
|
|
816
915
|
warnOnce(`invalid-date:${event.id}`, `Event "${event.id}" has an invalid start or end date and was skipped.`);
|
|
817
916
|
} else if (end.getTime() < start.getTime()) {
|
|
818
917
|
warnOnce(`end-before-start:${event.id}`, `Event "${event.id}" ends before it starts and was skipped.`);
|
|
819
918
|
} else {
|
|
820
|
-
const needsCopy = start !== event.start || end !== event.end || needsRecurrenceCopy(event);
|
|
919
|
+
const needsCopy = start !== event.start || end !== event.end || needsRecurrenceCopy(event) || !!event.allDay && dateOnlyRecurrence(event);
|
|
821
920
|
result = needsCopy ? {
|
|
822
921
|
...event,
|
|
823
922
|
start,
|
|
824
923
|
end,
|
|
825
924
|
recurrence: event.recurrence && {
|
|
826
925
|
...event.recurrence,
|
|
827
|
-
until: toDate(event.recurrence.until),
|
|
828
|
-
exdates: event.recurrence.exdates?.map((d) => toDate(d))
|
|
926
|
+
until: day(toDate(event.recurrence.until)),
|
|
927
|
+
exdates: event.recurrence.exdates?.map((d) => day(toDate(d)))
|
|
829
928
|
}
|
|
830
929
|
} : event;
|
|
831
930
|
}
|
|
832
931
|
normalizedEvent.set(event, result);
|
|
833
932
|
return result;
|
|
834
933
|
}
|
|
934
|
+
function dateOnlyRecurrence(event) {
|
|
935
|
+
const r = event.recurrence;
|
|
936
|
+
const changes = (d) => d instanceof Date && toCalendarMidnight(d) !== d;
|
|
937
|
+
return !!r && (changes(r.until) || !!r.exdates?.some(changes));
|
|
938
|
+
}
|
|
835
939
|
function needsRecurrenceCopy(event) {
|
|
836
940
|
const r = event.recurrence;
|
|
837
941
|
if (!r) return false;
|
|
@@ -854,7 +958,7 @@ function normalizeEvents(events) {
|
|
|
854
958
|
normalizedList.set(events, result);
|
|
855
959
|
return result;
|
|
856
960
|
}
|
|
857
|
-
var dayKey = (wall) => (0,
|
|
961
|
+
var dayKey = (wall) => (0, import_date_fns8.format)(wall, "yyyy-MM-dd");
|
|
858
962
|
function memoByZone(cache, events, tz, compute) {
|
|
859
963
|
let byZone = cache.get(events);
|
|
860
964
|
if (!byZone) {
|
|
@@ -892,10 +996,10 @@ function segmentsByDisplayDay(events, tz, range) {
|
|
|
892
996
|
const rawEnd = toDisplay(event.end, tz);
|
|
893
997
|
const wallEnd = rawEnd < wallStart ? wallStart : rawEnd;
|
|
894
998
|
if (range && (wallEnd < range.start || wallStart >= range.end)) continue;
|
|
895
|
-
let day = (0,
|
|
999
|
+
let day = (0, import_date_fns8.startOfDay)(range && wallStart < range.start ? range.start : wallStart);
|
|
896
1000
|
const stop = range && wallEnd > range.end ? range.end : wallEnd;
|
|
897
1001
|
do {
|
|
898
|
-
const next = (0,
|
|
1002
|
+
const next = (0, import_date_fns8.addDays)(day, 1);
|
|
899
1003
|
const start = wallStart > day ? wallStart : day;
|
|
900
1004
|
const end = wallEnd < next ? wallEnd : next;
|
|
901
1005
|
if (end > start || wallStart.getTime() === wallEnd.getTime()) {
|
|
@@ -912,25 +1016,153 @@ function segmentsByDisplayDay(events, tz, range) {
|
|
|
912
1016
|
});
|
|
913
1017
|
}
|
|
914
1018
|
|
|
915
|
-
// src/components/
|
|
1019
|
+
// src/components/AllDayBar.tsx
|
|
916
1020
|
var import_react4 = __toESM(require("react"));
|
|
917
1021
|
var import_core = require("@dnd-kit/core");
|
|
918
1022
|
var import_utilities = require("@dnd-kit/utilities");
|
|
1023
|
+
var import_date_fns9 = require("date-fns");
|
|
1024
|
+
var AllDayBarImpl = ({
|
|
1025
|
+
segment,
|
|
1026
|
+
rowDays,
|
|
1027
|
+
laneHeight,
|
|
1028
|
+
timezone,
|
|
1029
|
+
locale,
|
|
1030
|
+
translations,
|
|
1031
|
+
readonly,
|
|
1032
|
+
onEventClick,
|
|
1033
|
+
onEventContextMenu,
|
|
1034
|
+
onDayEventResize
|
|
1035
|
+
}) => {
|
|
1036
|
+
const { event, startCol, span, lane, continuesBefore, continuesAfter } = segment;
|
|
1037
|
+
const columns = rowDays.length;
|
|
1038
|
+
const { firstDay, lastDay } = dayEventSpan(event, timezone);
|
|
1039
|
+
const segmentOffset = (0, import_date_fns9.differenceInCalendarDays)(rowDays[startCol], firstDay);
|
|
1040
|
+
const dragData = (0, import_react4.useRef)({ event, grabDayOffset: segmentOffset });
|
|
1041
|
+
dragData.current.event = event;
|
|
1042
|
+
const dragDisabled = readonly || isEventDragDisabled(event);
|
|
1043
|
+
const { attributes, listeners, setNodeRef, transform, isDragging } = (0, import_core.useDraggable)({
|
|
1044
|
+
id: `${event.id}@day@${(0, import_date_fns9.format)(rowDays[0], "yyyy-MM-dd")}`,
|
|
1045
|
+
data: dragData.current,
|
|
1046
|
+
disabled: dragDisabled
|
|
1047
|
+
});
|
|
1048
|
+
const [resizeCols, setResizeCols] = (0, import_react4.useState)(0);
|
|
1049
|
+
const ignoreClick = (0, import_react4.useRef)(false);
|
|
1050
|
+
const canResize = !readonly && !continuesAfter && !isEventResizeDisabled(event) && !!onDayEventResize;
|
|
1051
|
+
const shownSpan = Math.max(1, Math.min(span + resizeCols, columns - startCol));
|
|
1052
|
+
const handlePointerDownCapture = (e) => {
|
|
1053
|
+
const rect = e.currentTarget.getBoundingClientRect();
|
|
1054
|
+
const dayWithin = rect.width > 0 ? Math.floor((e.clientX - rect.left) / rect.width * span) : 0;
|
|
1055
|
+
dragData.current.grabDayOffset = segmentOffset + Math.min(Math.max(dayWithin, 0), span - 1);
|
|
1056
|
+
};
|
|
1057
|
+
const handleResizeStart = (e) => {
|
|
1058
|
+
e.stopPropagation();
|
|
1059
|
+
e.preventDefault();
|
|
1060
|
+
const bar = e.currentTarget.parentElement;
|
|
1061
|
+
const columnWidth = bar.getBoundingClientRect().width / span || 1;
|
|
1062
|
+
const startX = e.clientX;
|
|
1063
|
+
let delta = 0;
|
|
1064
|
+
const onMove = (moveEvent) => {
|
|
1065
|
+
delta = Math.round((moveEvent.clientX - startX) / columnWidth);
|
|
1066
|
+
setResizeCols(delta);
|
|
1067
|
+
};
|
|
1068
|
+
const stop = () => {
|
|
1069
|
+
document.removeEventListener("pointermove", onMove);
|
|
1070
|
+
document.removeEventListener("pointerup", onUp);
|
|
1071
|
+
document.removeEventListener("pointercancel", stop);
|
|
1072
|
+
setResizeCols(0);
|
|
1073
|
+
};
|
|
1074
|
+
const onUp = () => {
|
|
1075
|
+
stop();
|
|
1076
|
+
ignoreClick.current = true;
|
|
1077
|
+
setTimeout(() => {
|
|
1078
|
+
ignoreClick.current = false;
|
|
1079
|
+
}, 0);
|
|
1080
|
+
if (delta !== 0) onDayEventResize?.(event, (0, import_date_fns9.addDays)(rowDays[startCol + span - 1], delta));
|
|
1081
|
+
};
|
|
1082
|
+
document.addEventListener("pointermove", onMove);
|
|
1083
|
+
document.addEventListener("pointerup", onUp);
|
|
1084
|
+
document.addEventListener("pointercancel", stop);
|
|
1085
|
+
};
|
|
1086
|
+
const color = event.color || "hsl(var(--primary))";
|
|
1087
|
+
const dateFormat = "d MMM";
|
|
1088
|
+
const label = `${event.title}, ${(0, import_date_fns9.format)(firstDay, dateFormat, { locale })}${lastDay > firstDay ? ` \u2013 ${(0, import_date_fns9.format)(lastDay, dateFormat, { locale })}` : ""}`;
|
|
1089
|
+
return /* @__PURE__ */ import_react4.default.createElement(
|
|
1090
|
+
"div",
|
|
1091
|
+
{
|
|
1092
|
+
ref: setNodeRef,
|
|
1093
|
+
...listeners,
|
|
1094
|
+
...attributes,
|
|
1095
|
+
onPointerDownCapture: handlePointerDownCapture,
|
|
1096
|
+
role: "button",
|
|
1097
|
+
"aria-label": label,
|
|
1098
|
+
className: cn(
|
|
1099
|
+
"group absolute px-[2px] select-none",
|
|
1100
|
+
dragDisabled ? "cursor-pointer" : "cursor-grab active:cursor-grabbing touch-none"
|
|
1101
|
+
),
|
|
1102
|
+
style: {
|
|
1103
|
+
left: `${startCol / columns * 100}%`,
|
|
1104
|
+
width: `${shownSpan / columns * 100}%`,
|
|
1105
|
+
top: lane * laneHeight,
|
|
1106
|
+
height: laneHeight,
|
|
1107
|
+
transform: import_utilities.CSS.Translate.toString(transform),
|
|
1108
|
+
opacity: isDragging ? 0 : void 0,
|
|
1109
|
+
zIndex: isDragging ? 100 : 1
|
|
1110
|
+
},
|
|
1111
|
+
onClick: (e) => {
|
|
1112
|
+
e.stopPropagation();
|
|
1113
|
+
if (ignoreClick.current) {
|
|
1114
|
+
ignoreClick.current = false;
|
|
1115
|
+
return;
|
|
1116
|
+
}
|
|
1117
|
+
onEventClick?.(event);
|
|
1118
|
+
},
|
|
1119
|
+
onContextMenu: onEventContextMenu ? (e) => onEventContextMenu(event, e) : void 0
|
|
1120
|
+
},
|
|
1121
|
+
/* @__PURE__ */ import_react4.default.createElement(
|
|
1122
|
+
"div",
|
|
1123
|
+
{
|
|
1124
|
+
className: cn(
|
|
1125
|
+
"relative h-[calc(100%-4px)] mt-[2px] flex items-center gap-1 px-1.5 text-[11px] font-semibold text-white overflow-hidden shadow-sm",
|
|
1126
|
+
continuesBefore ? "rounded-l-none" : "rounded-l-md",
|
|
1127
|
+
continuesAfter ? "rounded-r-none" : "rounded-r-md"
|
|
1128
|
+
),
|
|
1129
|
+
style: { backgroundColor: color }
|
|
1130
|
+
},
|
|
1131
|
+
continuesBefore && /* @__PURE__ */ import_react4.default.createElement("span", { "aria-label": translations?.continuesBefore }, "\u2039"),
|
|
1132
|
+
/* @__PURE__ */ import_react4.default.createElement("span", { className: "truncate" }, event.title),
|
|
1133
|
+
continuesAfter && /* @__PURE__ */ import_react4.default.createElement("span", { className: "ml-auto", "aria-label": translations?.continuesAfter }, "\u203A"),
|
|
1134
|
+
canResize && /* @__PURE__ */ import_react4.default.createElement(
|
|
1135
|
+
"div",
|
|
1136
|
+
{
|
|
1137
|
+
"data-testid": "all-day-resize",
|
|
1138
|
+
className: "absolute right-0 top-0 bottom-0 w-1.5 cursor-ew-resize opacity-0 group-hover:opacity-100 bg-black/20",
|
|
1139
|
+
onPointerDown: handleResizeStart
|
|
1140
|
+
}
|
|
1141
|
+
)
|
|
1142
|
+
)
|
|
1143
|
+
);
|
|
1144
|
+
};
|
|
1145
|
+
var AllDayBar = import_react4.default.memo(AllDayBarImpl);
|
|
1146
|
+
|
|
1147
|
+
// src/components/dnd/DraggableEvent.tsx
|
|
1148
|
+
var import_react5 = __toESM(require("react"));
|
|
1149
|
+
var import_core2 = require("@dnd-kit/core");
|
|
1150
|
+
var import_utilities2 = require("@dnd-kit/utilities");
|
|
919
1151
|
var DraggableEventImpl = ({ event, dragId, grabOffsetMs, children, className, style: propStyle, ...props }) => {
|
|
920
1152
|
const dragDisabled = isEventDragDisabled(event);
|
|
921
|
-
const { attributes, listeners, setNodeRef, transform, isDragging } = (0,
|
|
1153
|
+
const { attributes, listeners, setNodeRef, transform, isDragging } = (0, import_core2.useDraggable)({
|
|
922
1154
|
id: dragId ?? event.id,
|
|
923
1155
|
data: { event, grabOffsetMs },
|
|
924
1156
|
disabled: dragDisabled
|
|
925
1157
|
});
|
|
926
1158
|
const style = {
|
|
927
1159
|
...propStyle,
|
|
928
|
-
transform:
|
|
1160
|
+
transform: import_utilities2.CSS.Translate.toString(transform),
|
|
929
1161
|
zIndex: isDragging ? 100 : propStyle?.zIndex,
|
|
930
1162
|
// Hide the original while dragging: the DragOverlay ghost is what the user follows.
|
|
931
1163
|
opacity: isDragging ? 0 : propStyle?.opacity
|
|
932
1164
|
};
|
|
933
|
-
return /* @__PURE__ */
|
|
1165
|
+
return /* @__PURE__ */ import_react5.default.createElement(
|
|
934
1166
|
"div",
|
|
935
1167
|
{
|
|
936
1168
|
ref: setNodeRef,
|
|
@@ -943,11 +1175,11 @@ var DraggableEventImpl = ({ event, dragId, grabOffsetMs, children, className, st
|
|
|
943
1175
|
children
|
|
944
1176
|
);
|
|
945
1177
|
};
|
|
946
|
-
var DraggableEvent =
|
|
1178
|
+
var DraggableEvent = import_react5.default.memo(DraggableEventImpl);
|
|
947
1179
|
|
|
948
1180
|
// src/components/dnd/DroppableCell.tsx
|
|
949
|
-
var
|
|
950
|
-
var
|
|
1181
|
+
var import_react6 = __toESM(require("react"));
|
|
1182
|
+
var import_core3 = require("@dnd-kit/core");
|
|
951
1183
|
var QUARTER_HOVER = [
|
|
952
1184
|
"hover:bg-blue-50/50 dark:hover:bg-blue-900/10",
|
|
953
1185
|
"hover:bg-blue-50/80 dark:hover:bg-blue-900/20",
|
|
@@ -961,13 +1193,13 @@ var QUARTER_ACTIVE = [
|
|
|
961
1193
|
"bg-blue-100/80 dark:bg-blue-900/40 ring-2 ring-primary ring-inset"
|
|
962
1194
|
];
|
|
963
1195
|
var quarterOf = (date) => Math.min(3, Math.floor(date.getMinutes() / 15));
|
|
964
|
-
var DroppableCellImpl = ({ id, date, resourceId, children, className, style, onClick, onSlotClick }) => {
|
|
965
|
-
const { isOver, setNodeRef } = (0,
|
|
1196
|
+
var DroppableCellImpl = ({ id, date, resourceId, allDayRow, children, className, style, onClick, onSlotClick }) => {
|
|
1197
|
+
const { isOver, setNodeRef } = (0, import_core3.useDroppable)({
|
|
966
1198
|
id,
|
|
967
|
-
data: { date, resourceId }
|
|
1199
|
+
data: { date, resourceId, allDayRow }
|
|
968
1200
|
});
|
|
969
1201
|
const quarter = quarterOf(date);
|
|
970
|
-
return /* @__PURE__ */
|
|
1202
|
+
return /* @__PURE__ */ import_react6.default.createElement(
|
|
971
1203
|
"div",
|
|
972
1204
|
{
|
|
973
1205
|
ref: setNodeRef,
|
|
@@ -989,13 +1221,13 @@ var shallowEqualStyle = (a, b) => {
|
|
|
989
1221
|
const keys = Object.keys(a);
|
|
990
1222
|
return keys.length === Object.keys(b).length && keys.every((key) => a[key] === b[key]);
|
|
991
1223
|
};
|
|
992
|
-
var DroppableCell =
|
|
1224
|
+
var DroppableCell = import_react6.default.memo(
|
|
993
1225
|
DroppableCellImpl,
|
|
994
|
-
(prev, next) => prev.id === next.id && prev.date.getTime() === next.date.getTime() && prev.resourceId === next.resourceId && prev.children === next.children && prev.className === next.className && prev.onClick === next.onClick && prev.onSlotClick === next.onSlotClick && shallowEqualStyle(prev.style, next.style)
|
|
1226
|
+
(prev, next) => prev.id === next.id && prev.date.getTime() === next.date.getTime() && prev.resourceId === next.resourceId && prev.allDayRow === next.allDayRow && prev.children === next.children && prev.className === next.className && prev.onClick === next.onClick && prev.onSlotClick === next.onSlotClick && shallowEqualStyle(prev.style, next.style)
|
|
995
1227
|
);
|
|
996
1228
|
|
|
997
1229
|
// src/views/MonthView.tsx
|
|
998
|
-
var EventItem =
|
|
1230
|
+
var EventItem = import_react7.default.memo(({ event, onEventClick, onEventContextMenu }) => /* @__PURE__ */ import_react7.default.createElement(DraggableEvent, { event }, /* @__PURE__ */ import_react7.default.createElement(
|
|
999
1231
|
"div",
|
|
1000
1232
|
{
|
|
1001
1233
|
className: cn(
|
|
@@ -1014,9 +1246,23 @@ var EventItem = import_react6.default.memo(({ event, onEventClick, onEventContex
|
|
|
1014
1246
|
},
|
|
1015
1247
|
onContextMenu: onEventContextMenu ? (e) => onEventContextMenu(event, e) : void 0
|
|
1016
1248
|
},
|
|
1017
|
-
/* @__PURE__ */
|
|
1249
|
+
/* @__PURE__ */ import_react7.default.createElement("span", { className: "font-medium" }, event.title)
|
|
1018
1250
|
)));
|
|
1019
1251
|
EventItem.displayName = "EventItem";
|
|
1252
|
+
var ROW_HEIGHT = 130;
|
|
1253
|
+
var LANE_HEIGHT = 20;
|
|
1254
|
+
var MAX_LANES = 3;
|
|
1255
|
+
var MAX_ITEMS = 4;
|
|
1256
|
+
var BARS_TOP = 38;
|
|
1257
|
+
var CELL_CHROME = 16 + 28 + 6;
|
|
1258
|
+
var ITEM_STEP = 29 + 4;
|
|
1259
|
+
var MORE_HEIGHT = 20;
|
|
1260
|
+
function timedSlots(visibleLanes, timedCount, hiddenBars) {
|
|
1261
|
+
if (visibleLanes === 0) return Math.min(timedCount, MAX_ITEMS);
|
|
1262
|
+
const room = ROW_HEIGHT - CELL_CHROME - visibleLanes * LANE_HEIGHT;
|
|
1263
|
+
if (hiddenBars === 0 && timedCount * ITEM_STEP - 4 <= room) return timedCount;
|
|
1264
|
+
return Math.max(0, Math.floor((room - MORE_HEIGHT) / ITEM_STEP));
|
|
1265
|
+
}
|
|
1020
1266
|
var MonthView = ({
|
|
1021
1267
|
currentDate,
|
|
1022
1268
|
events,
|
|
@@ -1025,62 +1271,155 @@ var MonthView = ({
|
|
|
1025
1271
|
timezone,
|
|
1026
1272
|
locale,
|
|
1027
1273
|
translations,
|
|
1028
|
-
onEventContextMenu
|
|
1274
|
+
onEventContextMenu,
|
|
1275
|
+
onDayEventResize,
|
|
1276
|
+
readonly
|
|
1029
1277
|
}) => {
|
|
1030
1278
|
const weekStartsOn = resolveWeekStartsOn(locale, 1);
|
|
1031
|
-
const days = (0,
|
|
1032
|
-
const weekDays = (0,
|
|
1033
|
-
const
|
|
1279
|
+
const days = (0, import_react7.useMemo)(() => getMonthGrid(currentDate, weekStartsOn), [currentDate, weekStartsOn]);
|
|
1280
|
+
const weekDays = (0, import_react7.useMemo)(() => getWeekDays(currentDate, weekStartsOn), [currentDate, weekStartsOn]);
|
|
1281
|
+
const weeks = (0, import_react7.useMemo)(
|
|
1282
|
+
() => Array.from({ length: Math.ceil(days.length / 7) }, (_, i) => days.slice(i * 7, i * 7 + 7)),
|
|
1283
|
+
[days]
|
|
1284
|
+
);
|
|
1285
|
+
const { dayEvents, timedEvents } = partitionDayEvents(events, timezone);
|
|
1286
|
+
const eventsByDay = eventsByStartDay(timedEvents, timezone);
|
|
1034
1287
|
const today = displayToday(timezone);
|
|
1035
|
-
return /* @__PURE__ */
|
|
1288
|
+
return /* @__PURE__ */ import_react7.default.createElement("div", { className: "flex flex-col h-full bg-background border-[0.5px] scrollbar-hide border-border/50 rounded-2xl overflow-hidden min-w-[800px] md:min-w-0 shadow-sm" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "overflow-y-auto flex-1 relative" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "grid grid-cols-7 border-b-[0.5px] border-border/50 bg-gradient-to-r from-muted/30 via-muted/40 to-muted/30 sticky top-0 z-20 backdrop-blur-sm" }, weekDays.map((day) => /* @__PURE__ */ import_react7.default.createElement(
|
|
1036
1289
|
"div",
|
|
1037
1290
|
{
|
|
1038
1291
|
key: day.toISOString(),
|
|
1039
1292
|
className: "py-3 text-center text-xs font-semibold text-muted-foreground border-r-[0.5px] border-border/30 last:border-r-0 uppercase tracking-wider"
|
|
1040
1293
|
},
|
|
1041
|
-
(0,
|
|
1042
|
-
))),
|
|
1043
|
-
const
|
|
1044
|
-
const
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1049
|
-
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
),
|
|
1058
|
-
onClick: () => onDateClick?.(day)
|
|
1059
|
-
},
|
|
1060
|
-
/* @__PURE__ */ import_react6.default.createElement("div", { className: "flex justify-between items-start" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: cn(
|
|
1061
|
-
"text-sm font-semibold w-7 h-7 flex items-center justify-center rounded-full transition-all duration-200",
|
|
1062
|
-
(0, import_date_fns8.isSameDay)(day, today) ? "bg-primary text-primary-foreground shadow-md shadow-primary/30" : "group-hover:bg-accent"
|
|
1063
|
-
) }, (0, import_date_fns8.format)(day, "d", { locale })), dayEvents.length > 0 && /* @__PURE__ */ import_react6.default.createElement("div", { className: "text-[10px] font-medium text-muted-foreground/60 bg-muted/50 px-1.5 py-0.5 rounded-full" }, dayEvents.length)),
|
|
1064
|
-
/* @__PURE__ */ import_react6.default.createElement("div", { className: "flex-1 flex flex-col gap-1 scrollbar-hide overflow-y-auto overflow-x-hidden" }, dayEvents.slice(0, 4).map((event) => /* @__PURE__ */ import_react6.default.createElement(EventItem, { key: `${event.id}-${dayKey2}`, event, onEventClick, onEventContextMenu })), dayEvents.length > 4 && // U7: "+N more" opens the day instead of doing nothing.
|
|
1065
|
-
/* @__PURE__ */ import_react6.default.createElement(
|
|
1066
|
-
"button",
|
|
1294
|
+
(0, import_date_fns10.format)(day, "EEE", { locale })
|
|
1295
|
+
))), weeks.map((week) => {
|
|
1296
|
+
const { segments, laneCount } = layoutDayRow(week, dayEvents, timezone);
|
|
1297
|
+
const visibleLanes = Math.min(laneCount, MAX_LANES);
|
|
1298
|
+
return /* @__PURE__ */ import_react7.default.createElement("div", { key: week[0].toISOString(), className: "relative grid grid-cols-7", style: { height: ROW_HEIGHT } }, week.map((day, column) => {
|
|
1299
|
+
const dayKey2 = (0, import_date_fns10.format)(day, "yyyy-MM-dd");
|
|
1300
|
+
const dayTimed = eventsByDay.get(dayKey2) || [];
|
|
1301
|
+
const barsOnDay = segments.filter((s) => column >= s.startCol && column < s.startCol + s.span);
|
|
1302
|
+
const hiddenBars = barsOnDay.filter((s) => s.lane >= MAX_LANES).length;
|
|
1303
|
+
const shown = timedSlots(visibleLanes, dayTimed.length, hiddenBars);
|
|
1304
|
+
const hidden = hiddenBars + dayTimed.length - shown;
|
|
1305
|
+
const total = barsOnDay.length + dayTimed.length;
|
|
1306
|
+
const isCurrentMonth = (0, import_date_fns10.isSameMonth)(day, currentDate);
|
|
1307
|
+
const cellId = day.toISOString();
|
|
1308
|
+
return /* @__PURE__ */ import_react7.default.createElement(
|
|
1309
|
+
DroppableCell,
|
|
1067
1310
|
{
|
|
1068
|
-
|
|
1069
|
-
|
|
1070
|
-
|
|
1071
|
-
|
|
1072
|
-
|
|
1073
|
-
|
|
1311
|
+
key: cellId,
|
|
1312
|
+
id: cellId,
|
|
1313
|
+
date: day,
|
|
1314
|
+
className: cn(
|
|
1315
|
+
"h-full p-2 border-b-[0.5px] border-r-[0.5px] border-border/30 last:border-r-0 relative transition-all duration-200 hover:bg-accent/5 flex flex-col gap-1.5 overflow-hidden group",
|
|
1316
|
+
!isCurrentMonth && "bg-muted/5 text-muted-foreground/60",
|
|
1317
|
+
(0, import_date_fns10.isSameDay)(day, today) && "bg-primary/5 ring-1 ring-inset ring-primary/20"
|
|
1318
|
+
),
|
|
1319
|
+
onClick: () => onDateClick?.(day)
|
|
1074
1320
|
},
|
|
1075
|
-
|
|
1076
|
-
|
|
1077
|
-
|
|
1078
|
-
|
|
1321
|
+
/* @__PURE__ */ import_react7.default.createElement("div", { className: "flex justify-between items-start" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: cn(
|
|
1322
|
+
"text-sm font-semibold w-7 h-7 flex items-center justify-center rounded-full transition-all duration-200",
|
|
1323
|
+
(0, import_date_fns10.isSameDay)(day, today) ? "bg-primary text-primary-foreground shadow-md shadow-primary/30" : "group-hover:bg-accent"
|
|
1324
|
+
) }, (0, import_date_fns10.format)(day, "d", { locale })), total > 0 && /* @__PURE__ */ import_react7.default.createElement("div", { className: "text-[10px] font-medium text-muted-foreground/60 bg-muted/50 px-1.5 py-0.5 rounded-full" }, total)),
|
|
1325
|
+
visibleLanes > 0 && /* @__PURE__ */ import_react7.default.createElement("div", { className: "shrink-0", style: { height: visibleLanes * LANE_HEIGHT - 6 } }),
|
|
1326
|
+
/* @__PURE__ */ import_react7.default.createElement("div", { className: "flex-1 flex flex-col gap-1 scrollbar-hide overflow-y-auto overflow-x-hidden" }, dayTimed.slice(0, shown).map((event) => /* @__PURE__ */ import_react7.default.createElement(EventItem, { key: `${event.id}-${dayKey2}`, event, onEventClick, onEventContextMenu })), hidden > 0 && // "+N more" counts hidden bars and hidden timed events, and opens the day.
|
|
1327
|
+
/* @__PURE__ */ import_react7.default.createElement(
|
|
1328
|
+
"button",
|
|
1329
|
+
{
|
|
1330
|
+
type: "button",
|
|
1331
|
+
className: "shrink-0 text-[10px] leading-4 text-primary font-semibold text-center py-0.5 px-2 rounded-md bg-primary/5 hover:bg-primary/10 cursor-pointer transition-colors",
|
|
1332
|
+
onClick: (e) => {
|
|
1333
|
+
e.stopPropagation();
|
|
1334
|
+
onDateClick?.(day);
|
|
1335
|
+
}
|
|
1336
|
+
},
|
|
1337
|
+
interpolate(translations?.moreEvents || "+{n} more", { n: hidden })
|
|
1338
|
+
))
|
|
1339
|
+
);
|
|
1340
|
+
}), /* @__PURE__ */ import_react7.default.createElement("div", { className: "absolute inset-x-0 pointer-events-none", style: { top: BARS_TOP, height: visibleLanes * LANE_HEIGHT } }, segments.filter((s) => s.lane < MAX_LANES).map((segment) => /* @__PURE__ */ import_react7.default.createElement("div", { key: `${segment.event.id}-${week[0].toISOString()}`, className: "pointer-events-auto" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
1341
|
+
AllDayBar,
|
|
1342
|
+
{
|
|
1343
|
+
segment,
|
|
1344
|
+
rowDays: week,
|
|
1345
|
+
laneHeight: LANE_HEIGHT,
|
|
1346
|
+
timezone,
|
|
1347
|
+
locale,
|
|
1348
|
+
translations,
|
|
1349
|
+
readonly,
|
|
1350
|
+
onEventClick,
|
|
1351
|
+
onEventContextMenu,
|
|
1352
|
+
onDayEventResize
|
|
1353
|
+
}
|
|
1354
|
+
)))));
|
|
1355
|
+
})));
|
|
1079
1356
|
};
|
|
1080
1357
|
|
|
1081
1358
|
// src/views/WeekView.tsx
|
|
1359
|
+
var import_react10 = __toESM(require("react"));
|
|
1360
|
+
var import_date_fns13 = require("date-fns");
|
|
1361
|
+
|
|
1362
|
+
// src/components/AllDayRow.tsx
|
|
1082
1363
|
var import_react8 = __toESM(require("react"));
|
|
1083
|
-
var
|
|
1364
|
+
var import_date_fns11 = require("date-fns");
|
|
1365
|
+
var LANE_HEIGHT2 = 22;
|
|
1366
|
+
var AllDayRowImpl = ({
|
|
1367
|
+
days,
|
|
1368
|
+
dayEvents,
|
|
1369
|
+
timezone,
|
|
1370
|
+
locale,
|
|
1371
|
+
translations,
|
|
1372
|
+
readonly,
|
|
1373
|
+
gutterClassName,
|
|
1374
|
+
maxLanes = 2,
|
|
1375
|
+
onEventClick,
|
|
1376
|
+
onEventContextMenu,
|
|
1377
|
+
onDayEventResize,
|
|
1378
|
+
onSlotClick
|
|
1379
|
+
}) => {
|
|
1380
|
+
const [expanded, setExpanded] = (0, import_react8.useState)(false);
|
|
1381
|
+
const rowKey = days.length ? (0, import_date_fns11.format)(days[0], "yyyy-MM-dd") : "";
|
|
1382
|
+
(0, import_react8.useEffect)(() => setExpanded(false), [rowKey]);
|
|
1383
|
+
const handleSlotClick = (0, import_react8.useCallback)((day) => onSlotClick?.(day), [onSlotClick]);
|
|
1384
|
+
const { segments, laneCount } = layoutDayRow(days, dayEvents, timezone);
|
|
1385
|
+
const visibleLanes = expanded ? laneCount : Math.min(laneCount, maxLanes);
|
|
1386
|
+
const hidden = segments.filter((segment) => segment.lane >= visibleLanes).length;
|
|
1387
|
+
const height = Math.max(visibleLanes, 1) * LANE_HEIGHT2 + 4;
|
|
1388
|
+
return /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex border-b-[0.5px] border-border/50 bg-background", "data-all-day-row": true }, /* @__PURE__ */ import_react8.default.createElement("div", { className: cn("flex-none flex flex-col items-end justify-start gap-0.5 pr-2 pt-1 text-[10px] text-muted-foreground border-r-[0.5px] border-border/30", gutterClassName) }, /* @__PURE__ */ import_react8.default.createElement("span", null, translations?.allDay || "All Day"), laneCount > maxLanes && /* @__PURE__ */ import_react8.default.createElement(
|
|
1389
|
+
"button",
|
|
1390
|
+
{
|
|
1391
|
+
type: "button",
|
|
1392
|
+
className: "text-primary font-semibold hover:underline",
|
|
1393
|
+
onClick: () => setExpanded(!expanded)
|
|
1394
|
+
},
|
|
1395
|
+
expanded ? translations?.showLess || "Show less" : interpolate(translations?.moreEvents || "+{n} more", { n: hidden })
|
|
1396
|
+
)), /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex-1 relative", style: { height } }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "absolute inset-0 grid", style: { gridTemplateColumns: `repeat(${days.length}, minmax(0, 1fr))` } }, days.map((day, index) => /* @__PURE__ */ import_react8.default.createElement(
|
|
1397
|
+
DroppableCell,
|
|
1398
|
+
{
|
|
1399
|
+
key: day.toISOString(),
|
|
1400
|
+
id: `all-day-${day.toISOString()}`,
|
|
1401
|
+
date: day,
|
|
1402
|
+
allDayRow: true,
|
|
1403
|
+
className: cn("h-full", index > 0 && "border-l-[0.5px] border-border/30"),
|
|
1404
|
+
onSlotClick: readonly || !onSlotClick ? void 0 : handleSlotClick
|
|
1405
|
+
}
|
|
1406
|
+
))), /* @__PURE__ */ import_react8.default.createElement("div", { className: "absolute inset-x-0 top-0 pointer-events-none", style: { height } }, segments.filter((segment) => segment.lane < visibleLanes).map((segment) => /* @__PURE__ */ import_react8.default.createElement("div", { key: `${segment.event.id}-${rowKey}`, className: "pointer-events-auto" }, /* @__PURE__ */ import_react8.default.createElement(
|
|
1407
|
+
AllDayBar,
|
|
1408
|
+
{
|
|
1409
|
+
segment,
|
|
1410
|
+
rowDays: days,
|
|
1411
|
+
laneHeight: LANE_HEIGHT2,
|
|
1412
|
+
timezone,
|
|
1413
|
+
locale,
|
|
1414
|
+
translations,
|
|
1415
|
+
readonly,
|
|
1416
|
+
onEventClick,
|
|
1417
|
+
onEventContextMenu,
|
|
1418
|
+
onDayEventResize
|
|
1419
|
+
}
|
|
1420
|
+
))))));
|
|
1421
|
+
};
|
|
1422
|
+
var AllDayRow = import_react8.default.memo(AllDayRowImpl);
|
|
1084
1423
|
|
|
1085
1424
|
// src/core/layout.ts
|
|
1086
1425
|
var layoutCache = /* @__PURE__ */ new WeakMap();
|
|
@@ -1121,9 +1460,10 @@ function layoutDayEvents(segments) {
|
|
|
1121
1460
|
}
|
|
1122
1461
|
|
|
1123
1462
|
// src/components/dnd/ResizableEvent.tsx
|
|
1124
|
-
var
|
|
1463
|
+
var import_react9 = __toESM(require("react"));
|
|
1125
1464
|
|
|
1126
1465
|
// src/core/dnd.ts
|
|
1466
|
+
var import_date_fns12 = require("date-fns");
|
|
1127
1467
|
function computeDrop({ event, overDate, overResourceId, grabOffsetMs = 0, view, tz }) {
|
|
1128
1468
|
let wallStart;
|
|
1129
1469
|
if (view === "month") {
|
|
@@ -1144,6 +1484,23 @@ function computeResizeEnd(event, deltaMinutes, minDuration = 15) {
|
|
|
1144
1484
|
const minEnd = event.start.getTime() + minDuration * 6e4;
|
|
1145
1485
|
return new Date(Math.max(event.end.getTime() + deltaMinutes * 6e4, minEnd));
|
|
1146
1486
|
}
|
|
1487
|
+
var DAY_MS = 24 * 60 * 60 * 1e3;
|
|
1488
|
+
var shiftDays = (date, days, event, tz) => event.allDay ? (0, import_date_fns12.addDays)(date, days) : fromDisplay((0, import_date_fns12.addDays)(toDisplay(date, tz), days), tz);
|
|
1489
|
+
function computeDayMove(event, overDay, grabDayOffset, tz) {
|
|
1490
|
+
const { firstDay } = dayEventSpan(event, tz);
|
|
1491
|
+
const days = (0, import_date_fns12.differenceInCalendarDays)((0, import_date_fns12.addDays)((0, import_date_fns12.startOfDay)(overDay), -grabDayOffset), firstDay);
|
|
1492
|
+
if (days === 0) return null;
|
|
1493
|
+
return { start: shiftDays(event.start, days, event, tz), end: shiftDays(event.end, days, event, tz) };
|
|
1494
|
+
}
|
|
1495
|
+
function computeDayResize(event, newLastDay, tz) {
|
|
1496
|
+
const { firstDay, lastDay } = dayEventSpan(event, tz);
|
|
1497
|
+
const target = (0, import_date_fns12.startOfDay)(newLastDay) < firstDay ? firstDay : (0, import_date_fns12.startOfDay)(newLastDay);
|
|
1498
|
+
const days = (0, import_date_fns12.differenceInCalendarDays)(target, lastDay);
|
|
1499
|
+
if (days === 0) return null;
|
|
1500
|
+
if (event.allDay) return (0, import_date_fns12.addDays)(target, 1);
|
|
1501
|
+
const end = new Date(Math.max(shiftDays(event.end, days, event, tz).getTime(), event.start.getTime() + DAY_MS));
|
|
1502
|
+
return end.getTime() === event.end.getTime() ? null : end;
|
|
1503
|
+
}
|
|
1147
1504
|
|
|
1148
1505
|
// src/components/dnd/ResizableEvent.tsx
|
|
1149
1506
|
var ResizableEvent = ({
|
|
@@ -1157,13 +1514,13 @@ var ResizableEvent = ({
|
|
|
1157
1514
|
readonly
|
|
1158
1515
|
}) => {
|
|
1159
1516
|
const resizeLocked = readonly || isEventResizeDisabled(event);
|
|
1160
|
-
const [isResizing, setIsResizing] = (0,
|
|
1161
|
-
const [resizeHeight, setResizeHeight] = (0,
|
|
1162
|
-
const containerRef = (0,
|
|
1163
|
-
const startYRef = (0,
|
|
1164
|
-
const startHeightRef = (0,
|
|
1165
|
-
const resizeHeightRef = (0,
|
|
1166
|
-
const handleResizeStart = (0,
|
|
1517
|
+
const [isResizing, setIsResizing] = (0, import_react9.useState)(false);
|
|
1518
|
+
const [resizeHeight, setResizeHeight] = (0, import_react9.useState)(null);
|
|
1519
|
+
const containerRef = (0, import_react9.useRef)(null);
|
|
1520
|
+
const startYRef = (0, import_react9.useRef)(0);
|
|
1521
|
+
const startHeightRef = (0, import_react9.useRef)(0);
|
|
1522
|
+
const resizeHeightRef = (0, import_react9.useRef)(null);
|
|
1523
|
+
const handleResizeStart = (0, import_react9.useCallback)((e) => {
|
|
1167
1524
|
e.preventDefault();
|
|
1168
1525
|
e.stopPropagation();
|
|
1169
1526
|
const clientY = "touches" in e ? e.touches[0].clientY : e.clientY;
|
|
@@ -1202,10 +1559,10 @@ var ResizableEvent = ({
|
|
|
1202
1559
|
document.addEventListener("touchmove", handleMove, { passive: false });
|
|
1203
1560
|
document.addEventListener("touchend", handleEnd);
|
|
1204
1561
|
}, [event, hourHeight, minDuration, onResize]);
|
|
1205
|
-
const handlePointerDown = (0,
|
|
1562
|
+
const handlePointerDown = (0, import_react9.useCallback)((e) => {
|
|
1206
1563
|
e.stopPropagation();
|
|
1207
1564
|
}, []);
|
|
1208
|
-
return /* @__PURE__ */
|
|
1565
|
+
return /* @__PURE__ */ import_react9.default.createElement(
|
|
1209
1566
|
"div",
|
|
1210
1567
|
{
|
|
1211
1568
|
ref: containerRef,
|
|
@@ -1216,7 +1573,7 @@ var ResizableEvent = ({
|
|
|
1216
1573
|
}
|
|
1217
1574
|
},
|
|
1218
1575
|
children,
|
|
1219
|
-
/* @__PURE__ */
|
|
1576
|
+
/* @__PURE__ */ import_react9.default.createElement(
|
|
1220
1577
|
"div",
|
|
1221
1578
|
{
|
|
1222
1579
|
className: cn(
|
|
@@ -1229,12 +1586,12 @@ var ResizableEvent = ({
|
|
|
1229
1586
|
onMouseDown: resizeLocked ? void 0 : handleResizeStart,
|
|
1230
1587
|
onTouchStart: resizeLocked ? void 0 : handleResizeStart
|
|
1231
1588
|
},
|
|
1232
|
-
/* @__PURE__ */
|
|
1589
|
+
/* @__PURE__ */ import_react9.default.createElement("div", { className: cn(
|
|
1233
1590
|
"w-8 h-1 rounded-full transition-all",
|
|
1234
1591
|
isResizing ? "bg-primary" : "bg-muted-foreground/30 group-hover:bg-primary/50"
|
|
1235
1592
|
) })
|
|
1236
1593
|
),
|
|
1237
|
-
isResizing && /* @__PURE__ */
|
|
1594
|
+
isResizing && /* @__PURE__ */ import_react9.default.createElement("div", { className: "absolute inset-0 border-2 border-primary border-dashed rounded-md pointer-events-none bg-primary/5" })
|
|
1238
1595
|
);
|
|
1239
1596
|
};
|
|
1240
1597
|
|
|
@@ -1257,72 +1614,91 @@ var WeekViewImpl = ({
|
|
|
1257
1614
|
timezone,
|
|
1258
1615
|
locale,
|
|
1259
1616
|
readonly,
|
|
1260
|
-
onEventContextMenu
|
|
1617
|
+
onEventContextMenu,
|
|
1618
|
+
onDayEventResize,
|
|
1619
|
+
onAllDaySlotClick,
|
|
1620
|
+
translations
|
|
1261
1621
|
}) => {
|
|
1262
|
-
const weekDays =
|
|
1622
|
+
const weekDays = import_react10.default.useMemo(
|
|
1263
1623
|
() => getWeekDays(currentDate, resolveWeekStartsOn(locale, 1)),
|
|
1264
1624
|
[currentDate, locale]
|
|
1265
1625
|
);
|
|
1266
|
-
const visibleRange =
|
|
1267
|
-
() => ({ start: weekDays[0], end: (0,
|
|
1626
|
+
const visibleRange = import_react10.default.useMemo(
|
|
1627
|
+
() => ({ start: weekDays[0], end: (0, import_date_fns13.addDays)(weekDays[weekDays.length - 1], 1) }),
|
|
1268
1628
|
[weekDays]
|
|
1269
1629
|
);
|
|
1270
|
-
const scrollContainerRef =
|
|
1271
|
-
const [now, setNow] =
|
|
1272
|
-
|
|
1630
|
+
const scrollContainerRef = import_react10.default.useRef(null);
|
|
1631
|
+
const [now, setNow] = import_react10.default.useState(() => /* @__PURE__ */ new Date());
|
|
1632
|
+
import_react10.default.useEffect(() => {
|
|
1273
1633
|
const interval = setInterval(() => setNow(/* @__PURE__ */ new Date()), 6e4);
|
|
1274
1634
|
return () => clearInterval(interval);
|
|
1275
1635
|
}, []);
|
|
1276
|
-
|
|
1636
|
+
import_react10.default.useEffect(() => {
|
|
1277
1637
|
if (scrollContainerRef.current) {
|
|
1278
1638
|
const offsetHour = 4;
|
|
1279
1639
|
scrollContainerRef.current.scrollTop = (toDisplay(/* @__PURE__ */ new Date(), timezone).getHours() - offsetHour) * HOUR_HEIGHT;
|
|
1280
1640
|
}
|
|
1281
1641
|
}, [timezone]);
|
|
1282
|
-
const
|
|
1642
|
+
const { dayEvents, timedEvents } = partitionDayEvents(events, timezone);
|
|
1643
|
+
const segmentsByDay = segmentsByDisplayDay(timedEvents, timezone, visibleRange);
|
|
1283
1644
|
const today = displayToday(timezone, now);
|
|
1284
1645
|
const zonedNow = toDisplay(now, timezone);
|
|
1285
1646
|
const nowTop = minutesSinceDisplayMidnight(now, timezone) / 60 * HOUR_HEIGHT;
|
|
1286
|
-
const showsToday = weekDays.some((day) => (0,
|
|
1647
|
+
const showsToday = weekDays.some((day) => (0, import_date_fns13.isSameDay)(day, today));
|
|
1287
1648
|
const zone = resolveTimeZone(timezone);
|
|
1288
1649
|
const zoneLabel = timeZoneAbbreviation(now, zone) || zone || "LOC";
|
|
1289
1650
|
const formats = timeFormats(locale);
|
|
1290
|
-
return /* @__PURE__ */
|
|
1651
|
+
return /* @__PURE__ */ import_react10.default.createElement("div", { className: "flex flex-col h-full bg-background border-[0.5px] border-border/50 rounded-2xl overflow-hidden min-w-[800px] md:min-w-0 shadow-sm" }, /* @__PURE__ */ import_react10.default.createElement(
|
|
1291
1652
|
"div",
|
|
1292
1653
|
{
|
|
1293
1654
|
ref: scrollContainerRef,
|
|
1294
1655
|
className: "flex-1 overflow-y-auto scrollbar-hide relative bg-background scroll-smooth"
|
|
1295
1656
|
},
|
|
1296
|
-
/* @__PURE__ */
|
|
1657
|
+
/* @__PURE__ */ import_react10.default.createElement("div", { className: "sticky top-0 z-20" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "flex border-b-[0.5px] border-border/50 bg-gradient-to-r from-muted/20 via-background to-muted/20 backdrop-blur-sm" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "flex-none p-3 text-center text-xs font-semibold text-muted-foreground w-16 flex items-center justify-center border-r-[0.5px] border-border/30 bg-muted/10" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "flex flex-col items-center justify-center leading-tight" }, /* @__PURE__ */ import_react10.default.createElement("span", null, (0, import_date_fns13.format)(zonedNow, "HH:mm")), /* @__PURE__ */ import_react10.default.createElement("span", { className: "text-[10px] opacity-75" }, "(", zoneLabel, ")"))), /* @__PURE__ */ import_react10.default.createElement("div", { className: "flex-1 grid grid-cols-7" }, weekDays.map((day, index) => /* @__PURE__ */ import_react10.default.createElement("div", { key: day.toISOString(), className: cn("py-3 px-2 text-center", index > 0 && "border-l-[0.5px] border-border/30") }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider mb-1.5" }, (0, import_date_fns13.format)(day, "EEE", { locale })), /* @__PURE__ */ import_react10.default.createElement("div", { className: cn(
|
|
1297
1658
|
"w-9 h-9 flex items-center justify-center rounded-xl mx-auto text-sm font-semibold transition-all duration-200",
|
|
1298
|
-
(0,
|
|
1299
|
-
) }, (0,
|
|
1300
|
-
|
|
1659
|
+
(0, import_date_fns13.isSameDay)(day, today) ? "bg-primary text-primary-foreground shadow-lg shadow-primary/30 scale-110" : "text-foreground hover:bg-accent/80"
|
|
1660
|
+
) }, (0, import_date_fns13.format)(day, "d", { locale })))))), /* @__PURE__ */ import_react10.default.createElement(
|
|
1661
|
+
AllDayRow,
|
|
1662
|
+
{
|
|
1663
|
+
days: weekDays,
|
|
1664
|
+
dayEvents,
|
|
1665
|
+
timezone,
|
|
1666
|
+
locale,
|
|
1667
|
+
translations,
|
|
1668
|
+
readonly,
|
|
1669
|
+
gutterClassName: "w-16",
|
|
1670
|
+
onEventClick,
|
|
1671
|
+
onEventContextMenu,
|
|
1672
|
+
onDayEventResize,
|
|
1673
|
+
onSlotClick: onAllDaySlotClick
|
|
1674
|
+
}
|
|
1675
|
+
)),
|
|
1676
|
+
/* @__PURE__ */ import_react10.default.createElement(
|
|
1301
1677
|
"div",
|
|
1302
1678
|
{
|
|
1303
1679
|
className: "flex min-w-full relative",
|
|
1304
1680
|
style: { height: HOURS.length * HOUR_HEIGHT }
|
|
1305
1681
|
},
|
|
1306
|
-
/* @__PURE__ */
|
|
1682
|
+
/* @__PURE__ */ import_react10.default.createElement("div", { className: "flex-none w-16 border-r-[0.5px] border-border/30 relative bg-muted/5" }, HOURS.map((hour) => /* @__PURE__ */ import_react10.default.createElement(
|
|
1307
1683
|
"div",
|
|
1308
1684
|
{
|
|
1309
1685
|
key: hour,
|
|
1310
1686
|
className: "relative w-full text-[11px] text-muted-foreground/80 text-right pr-3 font-medium tabular-nums box-border",
|
|
1311
1687
|
style: { height: HOUR_HEIGHT }
|
|
1312
1688
|
},
|
|
1313
|
-
/* @__PURE__ */
|
|
1314
|
-
)), showsToday && /* @__PURE__ */
|
|
1689
|
+
/* @__PURE__ */ import_react10.default.createElement("span", { className: "block -translate-y-1/2" }, hour !== 0 && (0, import_date_fns13.format)(slotDate(currentDate, hour, 0), formats.hour, { locale }))
|
|
1690
|
+
)), showsToday && /* @__PURE__ */ import_react10.default.createElement(
|
|
1315
1691
|
"div",
|
|
1316
1692
|
{
|
|
1317
1693
|
className: "absolute left-0 w-full pointer-events-none z-30 flex justify-end pr-2",
|
|
1318
1694
|
style: { top: `${nowTop}px` }
|
|
1319
1695
|
},
|
|
1320
|
-
/* @__PURE__ */
|
|
1696
|
+
/* @__PURE__ */ import_react10.default.createElement("span", { className: "text-[10px] font-bold text-primary-foreground bg-primary px-1.5 py-0.5 rounded-md shadow-md -translate-y-1/2 backdrop-blur-none" }, (0, import_date_fns13.format)(zonedNow, formats.compact, { locale }))
|
|
1321
1697
|
)),
|
|
1322
|
-
/* @__PURE__ */
|
|
1323
|
-
const dayKey2 = (0,
|
|
1698
|
+
/* @__PURE__ */ import_react10.default.createElement("div", { className: "flex-1 grid grid-cols-7 relative" }, weekDays.map((day, dayIndex) => {
|
|
1699
|
+
const dayKey2 = (0, import_date_fns13.format)(day, "yyyy-MM-dd");
|
|
1324
1700
|
const positioned = layoutDayEvents(segmentsByDay.get(dayKey2) ?? NO_SEGMENTS);
|
|
1325
|
-
return /* @__PURE__ */
|
|
1701
|
+
return /* @__PURE__ */ import_react10.default.createElement("div", { key: dayKey2, className: cn("relative h-full", dayIndex > 0 && "border-l-[0.5px] border-border/30") }, HOURS.map((hour) => /* @__PURE__ */ import_react10.default.createElement(
|
|
1326
1702
|
"div",
|
|
1327
1703
|
{
|
|
1328
1704
|
key: hour,
|
|
@@ -1331,7 +1707,7 @@ var WeekViewImpl = ({
|
|
|
1331
1707
|
},
|
|
1332
1708
|
QUARTERS.map((minute) => {
|
|
1333
1709
|
const cellDate = slotDate(day, hour, minute);
|
|
1334
|
-
return /* @__PURE__ */
|
|
1710
|
+
return /* @__PURE__ */ import_react10.default.createElement(
|
|
1335
1711
|
DroppableCell,
|
|
1336
1712
|
{
|
|
1337
1713
|
key: minute,
|
|
@@ -1352,12 +1728,12 @@ var WeekViewImpl = ({
|
|
|
1352
1728
|
const zonedEventStart = toDisplay(event.start, timezone);
|
|
1353
1729
|
const zonedEventEnd = toDisplay(event.end, timezone);
|
|
1354
1730
|
const startMinutes = start.getHours() * 60 + start.getMinutes();
|
|
1355
|
-
const durationMinutes = (0,
|
|
1731
|
+
const durationMinutes = (0, import_date_fns13.differenceInMinutes)(end, start);
|
|
1356
1732
|
const top = startMinutes / 60 * HOUR_HEIGHT;
|
|
1357
1733
|
const height = durationMinutes / 60 * HOUR_HEIGHT;
|
|
1358
1734
|
const isShortEvent = durationMinutes < 60;
|
|
1359
1735
|
const isLastSegment = end.getTime() === zonedEventEnd.getTime();
|
|
1360
|
-
return /* @__PURE__ */
|
|
1736
|
+
return /* @__PURE__ */ import_react10.default.createElement(
|
|
1361
1737
|
DraggableEvent,
|
|
1362
1738
|
{
|
|
1363
1739
|
key: `${event.id}-${dayKey2}`,
|
|
@@ -1374,7 +1750,7 @@ var WeekViewImpl = ({
|
|
|
1374
1750
|
paddingRight: columns > 1 ? "2px" : "0"
|
|
1375
1751
|
}
|
|
1376
1752
|
},
|
|
1377
|
-
/* @__PURE__ */
|
|
1753
|
+
/* @__PURE__ */ import_react10.default.createElement(
|
|
1378
1754
|
ResizableEvent,
|
|
1379
1755
|
{
|
|
1380
1756
|
readonly: readonly || !isLastSegment,
|
|
@@ -1384,7 +1760,7 @@ var WeekViewImpl = ({
|
|
|
1384
1760
|
className: "h-full",
|
|
1385
1761
|
style: { height: "100%" }
|
|
1386
1762
|
},
|
|
1387
|
-
/* @__PURE__ */
|
|
1763
|
+
/* @__PURE__ */ import_react10.default.createElement(
|
|
1388
1764
|
"div",
|
|
1389
1765
|
{
|
|
1390
1766
|
className: cn(
|
|
@@ -1410,31 +1786,31 @@ var WeekViewImpl = ({
|
|
|
1410
1786
|
onContextMenu: onEventContextMenu ? (e) => onEventContextMenu(event, e) : void 0,
|
|
1411
1787
|
title: columns > 1 ? `${event.title} (${column + 1}/${columns})` : void 0
|
|
1412
1788
|
},
|
|
1413
|
-
/* @__PURE__ */
|
|
1789
|
+
/* @__PURE__ */ import_react10.default.createElement("div", { className: "flex flex-col h-full overflow-hidden w-full" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: cn(
|
|
1414
1790
|
"font-semibold truncate text-foreground/90 leading-tight",
|
|
1415
1791
|
isShortEvent ? "text-xs text-center" : "text-xs"
|
|
1416
|
-
) }, event.title), !isShortEvent && /* @__PURE__ */
|
|
1792
|
+
) }, event.title), !isShortEvent && /* @__PURE__ */ import_react10.default.createElement(import_react10.default.Fragment, null, /* @__PURE__ */ import_react10.default.createElement("div", { className: "text-[10px] text-muted-foreground truncate mt-0.5 font-medium leading-tight" }, (0, import_date_fns13.format)(zonedEventStart, formats.time, { locale }), " - ", (0, import_date_fns13.format)(zonedEventEnd, formats.time, { locale })), event.description && height > 50 && /* @__PURE__ */ import_react10.default.createElement("div", { className: "text-[10px] text-muted-foreground/80 truncate mt-1 leading-tight opacity-80" }, event.description)), columns > 1 && !isShortEvent && /* @__PURE__ */ import_react10.default.createElement("div", { className: "absolute top-1 right-1 bg-background/80 backdrop-blur-sm rounded-full w-4 h-4 flex items-center justify-center text-[9px] font-bold text-muted-foreground border border-border shadow-sm" }, columns))
|
|
1417
1793
|
)
|
|
1418
1794
|
)
|
|
1419
1795
|
);
|
|
1420
|
-
}), (0,
|
|
1796
|
+
}), (0, import_date_fns13.isSameDay)(day, today) && /* @__PURE__ */ import_react10.default.createElement(
|
|
1421
1797
|
"div",
|
|
1422
1798
|
{
|
|
1423
1799
|
className: "absolute left-0 right-0 z-20 pointer-events-none flex items-center",
|
|
1424
1800
|
style: { top: `${nowTop}px` }
|
|
1425
1801
|
},
|
|
1426
|
-
/* @__PURE__ */
|
|
1427
|
-
/* @__PURE__ */
|
|
1802
|
+
/* @__PURE__ */ import_react10.default.createElement("div", { className: "h-[2px] w-full bg-gradient-to-r from-primary via-primary to-primary/50" }),
|
|
1803
|
+
/* @__PURE__ */ import_react10.default.createElement("div", { className: "absolute -left-1.5 w-3 h-3 bg-primary rounded-full shadow-lg shadow-primary/40 ring-2 ring-background animate-pulse" })
|
|
1428
1804
|
));
|
|
1429
1805
|
}))
|
|
1430
1806
|
)
|
|
1431
1807
|
));
|
|
1432
1808
|
};
|
|
1433
|
-
var WeekView =
|
|
1809
|
+
var WeekView = import_react10.default.memo(WeekViewImpl);
|
|
1434
1810
|
|
|
1435
1811
|
// src/views/DayView.tsx
|
|
1436
|
-
var
|
|
1437
|
-
var
|
|
1812
|
+
var import_react11 = __toESM(require("react"));
|
|
1813
|
+
var import_date_fns14 = require("date-fns");
|
|
1438
1814
|
var HOUR_HEIGHT2 = 80;
|
|
1439
1815
|
var HOURS2 = Array.from({ length: 24 }, (_, i) => i);
|
|
1440
1816
|
var QUARTERS2 = [0, 15, 30, 45];
|
|
@@ -1454,46 +1830,65 @@ var DayViewImpl = ({
|
|
|
1454
1830
|
locale,
|
|
1455
1831
|
readonly,
|
|
1456
1832
|
onEventContextMenu,
|
|
1457
|
-
translations
|
|
1833
|
+
translations,
|
|
1834
|
+
onDayEventResize,
|
|
1835
|
+
onAllDaySlotClick
|
|
1458
1836
|
}) => {
|
|
1459
|
-
const visibleRange =
|
|
1460
|
-
const start = (0,
|
|
1461
|
-
return { start, end: (0,
|
|
1837
|
+
const visibleRange = import_react11.default.useMemo(() => {
|
|
1838
|
+
const start = (0, import_date_fns14.startOfDay)(currentDate);
|
|
1839
|
+
return { start, end: (0, import_date_fns14.addDays)(start, 1) };
|
|
1462
1840
|
}, [currentDate]);
|
|
1463
|
-
const scrollContainerRef =
|
|
1464
|
-
const [now, setNow] =
|
|
1465
|
-
|
|
1841
|
+
const scrollContainerRef = import_react11.default.useRef(null);
|
|
1842
|
+
const [now, setNow] = import_react11.default.useState(() => /* @__PURE__ */ new Date());
|
|
1843
|
+
import_react11.default.useEffect(() => {
|
|
1466
1844
|
const interval = setInterval(() => setNow(/* @__PURE__ */ new Date()), 6e4);
|
|
1467
1845
|
return () => clearInterval(interval);
|
|
1468
1846
|
}, []);
|
|
1469
|
-
|
|
1847
|
+
import_react11.default.useEffect(() => {
|
|
1470
1848
|
if (scrollContainerRef.current) {
|
|
1471
1849
|
const offsetHour = 3;
|
|
1472
1850
|
scrollContainerRef.current.scrollTop = (toDisplay(/* @__PURE__ */ new Date(), timezone).getHours() - offsetHour) * HOUR_HEIGHT2;
|
|
1473
1851
|
}
|
|
1474
1852
|
}, [timezone]);
|
|
1475
|
-
const dayKey2 = (0,
|
|
1476
|
-
const
|
|
1477
|
-
const
|
|
1853
|
+
const dayKey2 = (0, import_date_fns14.format)(currentDate, "yyyy-MM-dd");
|
|
1854
|
+
const { dayEvents, timedEvents } = partitionDayEvents(events, timezone);
|
|
1855
|
+
const rowDays = import_react11.default.useMemo(() => [visibleRange.start], [visibleRange]);
|
|
1856
|
+
const positioned = layoutDayEvents(segmentsByDisplayDay(timedEvents, timezone, visibleRange).get(dayKey2) ?? NO_SEGMENTS2);
|
|
1857
|
+
const isToday2 = (0, import_date_fns14.isSameDay)(currentDate, displayToday(timezone, now));
|
|
1478
1858
|
const zonedNow = toDisplay(now, timezone);
|
|
1479
1859
|
const nowTop = minutesSinceDisplayMidnight(now, timezone) / 60 * HOUR_HEIGHT2;
|
|
1480
1860
|
const formats = timeFormats(locale);
|
|
1481
|
-
return /* @__PURE__ */
|
|
1861
|
+
return /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex flex-col h-full bg-background border-[0.5px] border-border/50 rounded-2xl overflow-hidden shadow-sm" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "px-6 py-4 border-b-[0.5px] border-border/50 bg-gradient-to-r from-muted/20 via-background to-muted/20 text-center shrink-0" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex items-center justify-center gap-3" }, /* @__PURE__ */ import_react11.default.createElement("h2", { className: "text-xl font-semibold capitalize text-foreground" }, (0, import_date_fns14.format)(currentDate, "EEEE, MMMM d, yyyy", { locale })), isToday2 && /* @__PURE__ */ import_react11.default.createElement("span", { className: "text-xs font-semibold bg-primary text-primary-foreground px-3 py-1 rounded-full shadow-md shadow-primary/20" }, translations?.today || "Today"))), /* @__PURE__ */ import_react11.default.createElement(
|
|
1862
|
+
AllDayRow,
|
|
1863
|
+
{
|
|
1864
|
+
days: rowDays,
|
|
1865
|
+
dayEvents,
|
|
1866
|
+
timezone,
|
|
1867
|
+
locale,
|
|
1868
|
+
translations,
|
|
1869
|
+
readonly,
|
|
1870
|
+
gutterClassName: "w-20",
|
|
1871
|
+
onEventClick,
|
|
1872
|
+
onEventContextMenu,
|
|
1873
|
+
onDayEventResize,
|
|
1874
|
+
onSlotClick: onAllDaySlotClick
|
|
1875
|
+
}
|
|
1876
|
+
), /* @__PURE__ */ import_react11.default.createElement("div", { ref: scrollContainerRef, className: "flex-1 overflow-y-auto relative" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex relative", style: { height: HOURS2.length * HOUR_HEIGHT2 } }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "w-20 bg-muted/5 border-r-[0.5px] border-border/30 relative" }, HOURS2.map((hour) => /* @__PURE__ */ import_react11.default.createElement(
|
|
1482
1877
|
"div",
|
|
1483
1878
|
{
|
|
1484
1879
|
key: hour,
|
|
1485
1880
|
className: "relative w-full",
|
|
1486
1881
|
style: { height: HOUR_HEIGHT2 }
|
|
1487
1882
|
},
|
|
1488
|
-
hour !== 0 && /* @__PURE__ */
|
|
1489
|
-
)), isToday2 && /* @__PURE__ */
|
|
1883
|
+
hour !== 0 && /* @__PURE__ */ import_react11.default.createElement("span", { className: "absolute w-full text-center -top-3 left-1/2 -translate-x-1/2 text-[11px] text-muted-foreground/80 font-medium tabular-nums bg-background px-1.5 py-0.5 rounded-md" }, (0, import_date_fns14.format)(slotDate2(currentDate, hour, 0), formats.hour, { locale }))
|
|
1884
|
+
)), isToday2 && /* @__PURE__ */ import_react11.default.createElement(
|
|
1490
1885
|
"div",
|
|
1491
1886
|
{
|
|
1492
1887
|
className: "absolute left-0 w-full pointer-events-none z-30 flex justify-end pr-2",
|
|
1493
1888
|
style: { top: `${nowTop}px` }
|
|
1494
1889
|
},
|
|
1495
|
-
/* @__PURE__ */
|
|
1496
|
-
)), /* @__PURE__ */
|
|
1890
|
+
/* @__PURE__ */ import_react11.default.createElement("span", { className: "text-[10px] font-bold text-white bg-primary px-2 py-1 rounded-lg shadow-md shadow-primary/30 -translate-y-1/2" }, (0, import_date_fns14.format)(zonedNow, formats.time, { locale }))
|
|
1891
|
+
)), /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex-1 relative" }, HOURS2.map((hour) => /* @__PURE__ */ import_react11.default.createElement(
|
|
1497
1892
|
"div",
|
|
1498
1893
|
{
|
|
1499
1894
|
key: hour,
|
|
@@ -1502,7 +1897,7 @@ var DayViewImpl = ({
|
|
|
1502
1897
|
},
|
|
1503
1898
|
QUARTERS2.map((minute) => {
|
|
1504
1899
|
const cellDate = slotDate2(currentDate, hour, minute);
|
|
1505
|
-
return /* @__PURE__ */
|
|
1900
|
+
return /* @__PURE__ */ import_react11.default.createElement(
|
|
1506
1901
|
DroppableCell,
|
|
1507
1902
|
{
|
|
1508
1903
|
key: minute,
|
|
@@ -1523,12 +1918,12 @@ var DayViewImpl = ({
|
|
|
1523
1918
|
const zonedStart = toDisplay(event.start, timezone);
|
|
1524
1919
|
const zonedEnd = toDisplay(event.end, timezone);
|
|
1525
1920
|
const startMinutes = start.getHours() * 60 + start.getMinutes();
|
|
1526
|
-
const durationMinutes = (0,
|
|
1921
|
+
const durationMinutes = (0, import_date_fns14.differenceInMinutes)(end, start);
|
|
1527
1922
|
const top = startMinutes / 60 * HOUR_HEIGHT2;
|
|
1528
1923
|
const height = durationMinutes / 60 * HOUR_HEIGHT2;
|
|
1529
1924
|
const isShortEvent = durationMinutes < 45;
|
|
1530
1925
|
const isLastSegment = end.getTime() === zonedEnd.getTime();
|
|
1531
|
-
return /* @__PURE__ */
|
|
1926
|
+
return /* @__PURE__ */ import_react11.default.createElement(
|
|
1532
1927
|
DraggableEvent,
|
|
1533
1928
|
{
|
|
1534
1929
|
key: `${event.id}-${dayKey2}`,
|
|
@@ -1544,7 +1939,7 @@ var DayViewImpl = ({
|
|
|
1544
1939
|
paddingRight: columns > 1 ? "2px" : "0"
|
|
1545
1940
|
}
|
|
1546
1941
|
},
|
|
1547
|
-
/* @__PURE__ */
|
|
1942
|
+
/* @__PURE__ */ import_react11.default.createElement(
|
|
1548
1943
|
ResizableEvent,
|
|
1549
1944
|
{
|
|
1550
1945
|
readonly: readonly || !isLastSegment,
|
|
@@ -1554,7 +1949,7 @@ var DayViewImpl = ({
|
|
|
1554
1949
|
className: "h-full",
|
|
1555
1950
|
style: { height: "100%" }
|
|
1556
1951
|
},
|
|
1557
|
-
/* @__PURE__ */
|
|
1952
|
+
/* @__PURE__ */ import_react11.default.createElement(
|
|
1558
1953
|
"div",
|
|
1559
1954
|
{
|
|
1560
1955
|
className: cn(
|
|
@@ -1578,40 +1973,40 @@ var DayViewImpl = ({
|
|
|
1578
1973
|
onContextMenu: onEventContextMenu ? (e) => onEventContextMenu(event, e) : void 0,
|
|
1579
1974
|
title: columns > 1 ? `${event.title} (${column + 1}/${columns})` : void 0
|
|
1580
1975
|
},
|
|
1581
|
-
/* @__PURE__ */
|
|
1976
|
+
/* @__PURE__ */ import_react11.default.createElement("div", { className: "flex flex-col h-full overflow-hidden w-full" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: cn(
|
|
1582
1977
|
"font-semibold truncate leading-tight",
|
|
1583
1978
|
isShortEvent ? "text-xs" : "text-sm",
|
|
1584
1979
|
event.color ? "text-foreground" : "text-foreground/90"
|
|
1585
|
-
) }, event.title), !isShortEvent && /* @__PURE__ */
|
|
1980
|
+
) }, event.title), !isShortEvent && /* @__PURE__ */ import_react11.default.createElement(import_react11.default.Fragment, null, /* @__PURE__ */ import_react11.default.createElement("div", { className: "text-xs text-muted-foreground mt-0.5 font-medium" }, (0, import_date_fns14.format)(zonedStart, formats.time, { locale }), " - ", (0, import_date_fns14.format)(zonedEnd, formats.time, { locale })), event.description && height > 60 && /* @__PURE__ */ import_react11.default.createElement("div", { className: "text-xs text-muted-foreground/80 mt-1 line-clamp-2" }, event.description)), columns > 1 && !isShortEvent && /* @__PURE__ */ import_react11.default.createElement("div", { className: "absolute top-1.5 right-1.5 bg-background/90 backdrop-blur-sm rounded-full w-5 h-5 flex items-center justify-center text-[10px] font-bold text-muted-foreground border border-border shadow-sm" }, columns))
|
|
1586
1981
|
)
|
|
1587
1982
|
)
|
|
1588
1983
|
);
|
|
1589
|
-
}), isToday2 && /* @__PURE__ */
|
|
1984
|
+
}), isToday2 && /* @__PURE__ */ import_react11.default.createElement(
|
|
1590
1985
|
"div",
|
|
1591
1986
|
{
|
|
1592
1987
|
className: "absolute left-0 right-0 z-20 pointer-events-none flex items-center",
|
|
1593
1988
|
style: { top: `${nowTop}px` }
|
|
1594
1989
|
},
|
|
1595
|
-
/* @__PURE__ */
|
|
1596
|
-
/* @__PURE__ */
|
|
1990
|
+
/* @__PURE__ */ import_react11.default.createElement("div", { className: "h-[2px] w-full bg-gradient-to-r from-primary via-primary to-primary/50" }),
|
|
1991
|
+
/* @__PURE__ */ import_react11.default.createElement("div", { className: "absolute -left-1.5 w-3 h-3 bg-primary rounded-full shadow-lg shadow-primary/40 ring-2 ring-background animate-pulse" })
|
|
1597
1992
|
)))));
|
|
1598
1993
|
};
|
|
1599
|
-
var DayView =
|
|
1994
|
+
var DayView = import_react11.default.memo(DayViewImpl);
|
|
1600
1995
|
|
|
1601
1996
|
// src/views/AgendaView.tsx
|
|
1602
|
-
var
|
|
1603
|
-
var
|
|
1997
|
+
var import_react13 = __toESM(require("react"));
|
|
1998
|
+
var import_date_fns15 = require("date-fns");
|
|
1604
1999
|
|
|
1605
2000
|
// src/components/EmptyState.tsx
|
|
1606
|
-
var
|
|
2001
|
+
var import_react12 = __toESM(require("react"));
|
|
1607
2002
|
var import_lucide_react4 = require("lucide-react");
|
|
1608
|
-
var AgendaEmptyState = ({ onCreateEvent, translations }) => /* @__PURE__ */
|
|
2003
|
+
var AgendaEmptyState = ({ onCreateEvent, translations }) => /* @__PURE__ */ import_react12.default.createElement("div", { className: "flex flex-col items-center justify-center h-full min-h-[400px] py-12" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "relative mb-8" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "p-8 bg-gradient-to-br from-green-50 to-blue-50 dark:from-green-900/10 dark:to-blue-900/10 rounded-3xl border border-border/30" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "w-12 h-12 rounded-2xl bg-green-100 dark:bg-green-900/30 flex items-center justify-center" }, /* @__PURE__ */ import_react12.default.createElement("svg", { className: "w-6 h-6 text-green-600 dark:text-green-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2 }, /* @__PURE__ */ import_react12.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M5 13l4 4L19 7" }))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "text-left" }, /* @__PURE__ */ import_react12.default.createElement("div", { className: "font-medium text-foreground" }, translations?.allCaughtUp || "All caught up!"), /* @__PURE__ */ import_react12.default.createElement("div", { className: "text-sm text-muted-foreground" }, translations?.noEventsScheduled || "No events scheduled"))))), /* @__PURE__ */ import_react12.default.createElement("div", { className: "text-center max-w-sm" }, /* @__PURE__ */ import_react12.default.createElement("h3", { className: "text-lg font-semibold text-foreground mb-2" }, translations?.noUpcoming || "Your schedule is clear"), /* @__PURE__ */ import_react12.default.createElement("p", { className: "text-sm text-muted-foreground mb-6" }, translations?.noUpcomingHint || "No upcoming events to show. Create a new event to start planning."), onCreateEvent && /* @__PURE__ */ import_react12.default.createElement(
|
|
1609
2004
|
"button",
|
|
1610
2005
|
{
|
|
1611
2006
|
onClick: onCreateEvent,
|
|
1612
2007
|
className: "inline-flex items-center gap-2 px-5 py-2.5 bg-primary text-primary-foreground rounded-xl font-medium text-sm shadow-lg shadow-primary/20 hover:shadow-xl hover:shadow-primary/30 hover:scale-105 active:scale-95 transition-all duration-200"
|
|
1613
2008
|
},
|
|
1614
|
-
/* @__PURE__ */
|
|
2009
|
+
/* @__PURE__ */ import_react12.default.createElement(import_lucide_react4.Plus, { className: "w-4 h-4" }),
|
|
1615
2010
|
translations?.createEvent || "Create Event"
|
|
1616
2011
|
)));
|
|
1617
2012
|
|
|
@@ -1619,7 +2014,7 @@ var AgendaEmptyState = ({ onCreateEvent, translations }) => /* @__PURE__ */ impo
|
|
|
1619
2014
|
var import_framer_motion = require("framer-motion");
|
|
1620
2015
|
var import_lucide_react5 = require("lucide-react");
|
|
1621
2016
|
var formatDuration = (start, end) => {
|
|
1622
|
-
const minutes = (0,
|
|
2017
|
+
const minutes = (0, import_date_fns15.differenceInMinutes)(end, start);
|
|
1623
2018
|
if (minutes < 60) return `${minutes}m`;
|
|
1624
2019
|
const hours = Math.floor(minutes / 60);
|
|
1625
2020
|
const remainingMinutes = minutes % 60;
|
|
@@ -1627,9 +2022,9 @@ var formatDuration = (start, end) => {
|
|
|
1627
2022
|
return `${hours}h ${remainingMinutes}m`;
|
|
1628
2023
|
};
|
|
1629
2024
|
var getDateLabel = (date, today, locale, translations) => {
|
|
1630
|
-
if ((0,
|
|
1631
|
-
if ((0,
|
|
1632
|
-
return (0,
|
|
2025
|
+
if ((0, import_date_fns15.isSameDay)(date, today)) return translations?.today || "Today";
|
|
2026
|
+
if ((0, import_date_fns15.isSameDay)(date, (0, import_date_fns15.addDays)(today, 1))) return translations?.tomorrow || "Tomorrow";
|
|
2027
|
+
return (0, import_date_fns15.format)(date, "EEEE", { locale });
|
|
1633
2028
|
};
|
|
1634
2029
|
var AgendaView = ({
|
|
1635
2030
|
currentDate,
|
|
@@ -1644,12 +2039,12 @@ var AgendaView = ({
|
|
|
1644
2039
|
const is24h = uses24HourClock(locale);
|
|
1645
2040
|
const { time: timePattern, compact: compactTimePattern } = timeFormats(locale);
|
|
1646
2041
|
const today = displayToday(timezone);
|
|
1647
|
-
const groupedEvents = (0,
|
|
2042
|
+
const groupedEvents = (0, import_react13.useMemo)(() => {
|
|
1648
2043
|
const byDay = eventsByStartDay(events, timezone);
|
|
1649
2044
|
const groups = [];
|
|
1650
2045
|
for (let i = 0; i < 30; i++) {
|
|
1651
|
-
const day = (0,
|
|
1652
|
-
const dayEvents = byDay.get((0,
|
|
2046
|
+
const day = (0, import_date_fns15.addDays)((0, import_date_fns15.startOfDay)(currentDate), i);
|
|
2047
|
+
const dayEvents = byDay.get((0, import_date_fns15.format)(day, "yyyy-MM-dd"));
|
|
1653
2048
|
if (dayEvents?.length) {
|
|
1654
2049
|
groups.push({ date: day, events: [...dayEvents].sort((a, b) => a.start.getTime() - b.start.getTime()) });
|
|
1655
2050
|
}
|
|
@@ -1669,7 +2064,7 @@ var AgendaView = ({
|
|
|
1669
2064
|
hidden: { opacity: 0, x: -20 },
|
|
1670
2065
|
show: { opacity: 1, x: 0 }
|
|
1671
2066
|
};
|
|
1672
|
-
return /* @__PURE__ */
|
|
2067
|
+
return /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex flex-col h-full bg-background overflow-y-auto" }, groupedEvents.length === 0 ? /* @__PURE__ */ import_react13.default.createElement(AgendaEmptyState, { onCreateEvent, translations }) : /* @__PURE__ */ import_react13.default.createElement(
|
|
1673
2068
|
import_framer_motion.motion.div,
|
|
1674
2069
|
{
|
|
1675
2070
|
className: "max-w-3xl mx-auto w-full pb-10 px-4 md:px-6",
|
|
@@ -1677,21 +2072,21 @@ var AgendaView = ({
|
|
|
1677
2072
|
initial: "hidden",
|
|
1678
2073
|
animate: "show"
|
|
1679
2074
|
},
|
|
1680
|
-
groupedEvents.map((group) => /* @__PURE__ */
|
|
2075
|
+
groupedEvents.map((group) => /* @__PURE__ */ import_react13.default.createElement(
|
|
1681
2076
|
import_framer_motion.motion.div,
|
|
1682
2077
|
{
|
|
1683
2078
|
key: group.date.toISOString(),
|
|
1684
2079
|
className: "relative",
|
|
1685
2080
|
variants: item
|
|
1686
2081
|
},
|
|
1687
|
-
/* @__PURE__ */
|
|
2082
|
+
/* @__PURE__ */ import_react13.default.createElement("div", { className: "sticky top-0 bg-background/95 backdrop-blur-md py-4 z-10 border-b border-border/50" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: cn(
|
|
1688
2083
|
"flex flex-col items-center justify-center w-16 h-16 rounded-2xl transition-all",
|
|
1689
|
-
(0,
|
|
1690
|
-
) }, /* @__PURE__ */
|
|
2084
|
+
(0, import_date_fns15.isSameDay)(group.date, today) ? "bg-primary text-primary-foreground shadow-lg shadow-primary/30" : "bg-muted/50 text-foreground"
|
|
2085
|
+
) }, /* @__PURE__ */ import_react13.default.createElement("span", { className: "text-2xl font-bold leading-none" }, (0, import_date_fns15.format)(group.date, "d")), /* @__PURE__ */ import_react13.default.createElement("span", { className: "text-xs font-medium uppercase tracking-wide opacity-80" }, (0, import_date_fns15.format)(group.date, "MMM", { locale }))), /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react13.default.createElement("span", { className: cn(
|
|
1691
2086
|
"text-lg font-semibold",
|
|
1692
|
-
(0,
|
|
1693
|
-
) }, getDateLabel(group.date, today, locale, translations)), /* @__PURE__ */
|
|
1694
|
-
/* @__PURE__ */
|
|
2087
|
+
(0, import_date_fns15.isSameDay)(group.date, today) && "text-primary"
|
|
2088
|
+
) }, getDateLabel(group.date, today, locale, translations)), /* @__PURE__ */ import_react13.default.createElement("span", { className: "text-sm text-muted-foreground" }, group.events.length, " ", group.events.length !== 1 ? translations?.eventPlural || "events" : translations?.eventSingular || "event")))),
|
|
2089
|
+
/* @__PURE__ */ import_react13.default.createElement("div", { className: "py-4 space-y-3" }, group.events.map((event) => /* @__PURE__ */ import_react13.default.createElement(
|
|
1695
2090
|
import_framer_motion.motion.div,
|
|
1696
2091
|
{
|
|
1697
2092
|
key: event.id,
|
|
@@ -1706,30 +2101,30 @@ var AgendaView = ({
|
|
|
1706
2101
|
whileHover: { scale: 1.01, y: -2 },
|
|
1707
2102
|
transition: { duration: 0.2 }
|
|
1708
2103
|
},
|
|
1709
|
-
/* @__PURE__ */
|
|
2104
|
+
/* @__PURE__ */ import_react13.default.createElement(
|
|
1710
2105
|
"div",
|
|
1711
2106
|
{
|
|
1712
2107
|
className: "absolute left-0 top-3 bottom-3 w-1 rounded-full",
|
|
1713
2108
|
style: { backgroundColor: event.color || "var(--primary)" }
|
|
1714
2109
|
}
|
|
1715
2110
|
),
|
|
1716
|
-
/* @__PURE__ */
|
|
1717
|
-
/* @__PURE__ */
|
|
2111
|
+
/* @__PURE__ */ import_react13.default.createElement("div", { className: "flex flex-col items-center min-w-[70px] pl-2" }, event.allDay ? /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex flex-col items-center" }, /* @__PURE__ */ import_react13.default.createElement("span", { className: "text-xs font-semibold text-muted-foreground bg-muted/80 px-2.5 py-1 rounded-full" }, translations?.allDay || "All Day")) : /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex flex-col items-center" }, /* @__PURE__ */ import_react13.default.createElement("span", { className: "text-base font-semibold text-foreground" }, (0, import_date_fns15.format)(toDisplay(event.start, timezone), compactTimePattern, { locale })), !is24h && /* @__PURE__ */ import_react13.default.createElement("span", { className: "text-xs text-muted-foreground uppercase" }, (0, import_date_fns15.format)(toDisplay(event.start, timezone), "a")), /* @__PURE__ */ import_react13.default.createElement("div", { className: "w-px h-3 bg-border my-1" }), /* @__PURE__ */ import_react13.default.createElement("span", { className: "text-xs text-muted-foreground/70 font-medium" }, formatDuration(event.start, event.end)))),
|
|
2112
|
+
/* @__PURE__ */ import_react13.default.createElement("div", { className: "flex-1 min-w-0 space-y-2" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex items-start justify-between gap-2" }, /* @__PURE__ */ import_react13.default.createElement("h4", { className: "text-base font-semibold text-foreground group-hover:text-primary transition-colors line-clamp-1" }, event.title), /* @__PURE__ */ import_react13.default.createElement(
|
|
1718
2113
|
"div",
|
|
1719
2114
|
{
|
|
1720
2115
|
className: "w-3 h-3 rounded-full shrink-0 mt-1.5",
|
|
1721
2116
|
style: { backgroundColor: event.color || "var(--primary)" }
|
|
1722
2117
|
}
|
|
1723
|
-
)), event.description && /* @__PURE__ */
|
|
1724
|
-
/* @__PURE__ */
|
|
2118
|
+
)), event.description && /* @__PURE__ */ import_react13.default.createElement("p", { className: "text-sm text-muted-foreground line-clamp-2 leading-relaxed" }, event.description), /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex flex-wrap items-center gap-3 pt-1" }, !event.allDay && /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex items-center gap-1.5 text-xs text-muted-foreground" }, /* @__PURE__ */ import_react13.default.createElement(import_lucide_react5.Clock, { className: "w-3.5 h-3.5" }), /* @__PURE__ */ import_react13.default.createElement("span", null, (0, import_date_fns15.format)(toDisplay(event.start, timezone), timePattern, { locale }), " - ", (0, import_date_fns15.format)(toDisplay(event.end, timezone), timePattern, { locale }))), event.guests && event.guests.length > 0 && /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex items-center gap-1.5 text-xs text-muted-foreground" }, /* @__PURE__ */ import_react13.default.createElement(import_lucide_react5.Users, { className: "w-3.5 h-3.5" }), /* @__PURE__ */ import_react13.default.createElement("span", null, event.guests.length, " ", event.guests.length !== 1 ? translations?.guestsCount || "guests" : translations?.guestCount || "guest")), event.attachments && event.attachments.length > 0 && /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex items-center gap-1.5 text-xs text-muted-foreground" }, /* @__PURE__ */ import_react13.default.createElement(import_lucide_react5.Paperclip, { className: "w-3.5 h-3.5" }), /* @__PURE__ */ import_react13.default.createElement("span", null, event.attachments.length)), event.reminders && event.reminders.length > 0 && /* @__PURE__ */ import_react13.default.createElement("div", { className: "flex items-center gap-1.5 text-xs text-muted-foreground" }, /* @__PURE__ */ import_react13.default.createElement(import_lucide_react5.Bell, { className: "w-3.5 h-3.5" }), /* @__PURE__ */ import_react13.default.createElement("span", null, event.reminders.length)))),
|
|
2119
|
+
/* @__PURE__ */ import_react13.default.createElement("div", { className: "absolute right-4 top-1/2 -translate-y-1/2 opacity-0 group-hover:opacity-100 transition-opacity" }, /* @__PURE__ */ import_react13.default.createElement("svg", { className: "w-5 h-5 text-muted-foreground", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ import_react13.default.createElement("path", { d: "M9 18l6-6-6-6" })))
|
|
1725
2120
|
)))
|
|
1726
2121
|
))
|
|
1727
2122
|
));
|
|
1728
2123
|
};
|
|
1729
2124
|
|
|
1730
2125
|
// src/views/ResourceView.tsx
|
|
1731
|
-
var
|
|
1732
|
-
var
|
|
2126
|
+
var import_react14 = __toESM(require("react"));
|
|
2127
|
+
var import_date_fns16 = require("date-fns");
|
|
1733
2128
|
var ResourceView = ({
|
|
1734
2129
|
currentDate,
|
|
1735
2130
|
events,
|
|
@@ -1741,16 +2136,16 @@ var ResourceView = ({
|
|
|
1741
2136
|
translations,
|
|
1742
2137
|
onEventContextMenu
|
|
1743
2138
|
}) => {
|
|
1744
|
-
const containerRef = (0,
|
|
2139
|
+
const containerRef = (0, import_react14.useRef)(null);
|
|
1745
2140
|
const hours = Array.from({ length: 24 }, (_, i) => i);
|
|
1746
2141
|
const hourWidth = 100;
|
|
1747
2142
|
const timeFormat = timeFormats(locale).hour;
|
|
1748
2143
|
const getEventStyle = (event) => {
|
|
1749
2144
|
const start = toDisplay(event.start, timezone);
|
|
1750
2145
|
const end = toDisplay(event.end, timezone);
|
|
1751
|
-
const dayStart = (0,
|
|
1752
|
-
const startMinutes = (0,
|
|
1753
|
-
const durationMinutes = (0,
|
|
2146
|
+
const dayStart = (0, import_date_fns16.startOfDay)(currentDate);
|
|
2147
|
+
const startMinutes = (0, import_date_fns16.differenceInMinutes)(start, dayStart);
|
|
2148
|
+
const durationMinutes = (0, import_date_fns16.differenceInMinutes)(end, start);
|
|
1754
2149
|
const left = startMinutes / 60 * hourWidth;
|
|
1755
2150
|
const width = durationMinutes / 60 * hourWidth;
|
|
1756
2151
|
return {
|
|
@@ -1759,19 +2154,19 @@ var ResourceView = ({
|
|
|
1759
2154
|
// Min width for visibility
|
|
1760
2155
|
};
|
|
1761
2156
|
};
|
|
1762
|
-
return /* @__PURE__ */
|
|
2157
|
+
return /* @__PURE__ */ import_react14.default.createElement("div", { className: "flex flex-col h-full bg-background overflow-hidden" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "flex border-b border-border bg-muted/20" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "w-48 shrink-0 border-r border-border p-4 font-semibold text-sm bg-background sticky left-0 z-20" }, translations?.resource || "Resources"), /* @__PURE__ */ import_react14.default.createElement("div", { className: "flex overflow-hidden" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "flex relative", style: { width: hours.length * hourWidth } }, hours.map((hour) => /* @__PURE__ */ import_react14.default.createElement(
|
|
1763
2158
|
"div",
|
|
1764
2159
|
{
|
|
1765
2160
|
key: hour,
|
|
1766
2161
|
className: "border-r border-border/50 text-xs text-muted-foreground p-2 font-medium shrink-0",
|
|
1767
2162
|
style: { width: hourWidth }
|
|
1768
2163
|
},
|
|
1769
|
-
(0,
|
|
1770
|
-
))))), /* @__PURE__ */
|
|
2164
|
+
(0, import_date_fns16.format)((/* @__PURE__ */ new Date()).setHours(hour, 0, 0, 0), timeFormat, { locale })
|
|
2165
|
+
))))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "flex-1 overflow-auto relative", ref: containerRef }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "min-w-fit" }, resources.map((resource) => {
|
|
1771
2166
|
const resourceEvents = events.filter(
|
|
1772
2167
|
(e) => e.resourceId === resource.id && isSameDisplayDay(e.start, currentDate, timezone)
|
|
1773
2168
|
);
|
|
1774
|
-
return /* @__PURE__ */
|
|
2169
|
+
return /* @__PURE__ */ import_react14.default.createElement("div", { key: resource.id, className: "flex border-b border-border min-h-[100px]" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "w-48 shrink-0 border-r border-border p-4 bg-background sticky left-0 z-10 flex items-center gap-3" }, resource.avatar ? /* @__PURE__ */ import_react14.default.createElement("img", { src: resource.avatar, alt: resource.label, className: "w-8 h-8 rounded-full object-cover" }) : /* @__PURE__ */ import_react14.default.createElement("div", { className: "w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center text-xs font-bold text-primary" }, resource.label.substring(0, 2).toUpperCase()), /* @__PURE__ */ import_react14.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react14.default.createElement("span", { className: "text-sm font-medium" }, resource.label), /* @__PURE__ */ import_react14.default.createElement("span", { className: "text-xs text-muted-foreground" }, interpolate(translations?.idLabel || "ID: {id}", { id: resource.id })))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "relative flex", style: { width: hours.length * hourWidth } }, hours.map((hour) => /* @__PURE__ */ import_react14.default.createElement(
|
|
1775
2170
|
"div",
|
|
1776
2171
|
{
|
|
1777
2172
|
key: hour,
|
|
@@ -1782,7 +2177,7 @@ var ResourceView = ({
|
|
|
1782
2177
|
const slotDate3 = new Date(currentDate);
|
|
1783
2178
|
slotDate3.setHours(hour, minute, 0, 0);
|
|
1784
2179
|
const slotId = `${resource.id}-${slotDate3.toISOString()}`;
|
|
1785
|
-
return /* @__PURE__ */
|
|
2180
|
+
return /* @__PURE__ */ import_react14.default.createElement(
|
|
1786
2181
|
DroppableCell,
|
|
1787
2182
|
{
|
|
1788
2183
|
key: minute,
|
|
@@ -1794,7 +2189,7 @@ var ResourceView = ({
|
|
|
1794
2189
|
}
|
|
1795
2190
|
);
|
|
1796
2191
|
})
|
|
1797
|
-
)), resourceEvents.map((event) => /* @__PURE__ */
|
|
2192
|
+
)), resourceEvents.map((event) => /* @__PURE__ */ import_react14.default.createElement(
|
|
1798
2193
|
DraggableEvent,
|
|
1799
2194
|
{
|
|
1800
2195
|
key: event.id,
|
|
@@ -1812,16 +2207,16 @@ var ResourceView = ({
|
|
|
1812
2207
|
color: "#fff"
|
|
1813
2208
|
}
|
|
1814
2209
|
},
|
|
1815
|
-
/* @__PURE__ */
|
|
2210
|
+
/* @__PURE__ */ import_react14.default.createElement("div", { className: "truncate" }, event.title)
|
|
1816
2211
|
))));
|
|
1817
2212
|
}))));
|
|
1818
2213
|
};
|
|
1819
2214
|
|
|
1820
2215
|
// src/components/EventModal.tsx
|
|
1821
|
-
var
|
|
2216
|
+
var import_react16 = __toESM(require("react"));
|
|
1822
2217
|
|
|
1823
2218
|
// src/components/ui/Modal.tsx
|
|
1824
|
-
var
|
|
2219
|
+
var import_react15 = __toESM(require("react"));
|
|
1825
2220
|
var import_lucide_react6 = require("lucide-react");
|
|
1826
2221
|
var Modal = ({
|
|
1827
2222
|
isOpen,
|
|
@@ -1832,8 +2227,8 @@ var Modal = ({
|
|
|
1832
2227
|
hideHeader = false,
|
|
1833
2228
|
closeLabel = "Close"
|
|
1834
2229
|
}) => {
|
|
1835
|
-
const overlayRef = (0,
|
|
1836
|
-
(0,
|
|
2230
|
+
const overlayRef = (0, import_react15.useRef)(null);
|
|
2231
|
+
(0, import_react15.useEffect)(() => {
|
|
1837
2232
|
const handleEscape = (e) => {
|
|
1838
2233
|
if (e.key === "Escape") {
|
|
1839
2234
|
onClose();
|
|
@@ -1847,14 +2242,14 @@ var Modal = ({
|
|
|
1847
2242
|
};
|
|
1848
2243
|
}, [isOpen, onClose]);
|
|
1849
2244
|
if (!isOpen) return null;
|
|
1850
|
-
return /* @__PURE__ */
|
|
2245
|
+
return /* @__PURE__ */ import_react15.default.createElement("div", { className: "absolute inset-0 z-50 flex items-center justify-center p-4 bg-black/40 backdrop-blur-md animate-in fade-in duration-300" }, /* @__PURE__ */ import_react15.default.createElement(
|
|
1851
2246
|
"div",
|
|
1852
2247
|
{
|
|
1853
2248
|
ref: overlayRef,
|
|
1854
2249
|
className: "absolute inset-0",
|
|
1855
2250
|
onClick: onClose
|
|
1856
2251
|
}
|
|
1857
|
-
), /* @__PURE__ */
|
|
2252
|
+
), /* @__PURE__ */ import_react15.default.createElement(
|
|
1858
2253
|
"div",
|
|
1859
2254
|
{
|
|
1860
2255
|
className: cn(
|
|
@@ -1862,7 +2257,7 @@ var Modal = ({
|
|
|
1862
2257
|
className
|
|
1863
2258
|
)
|
|
1864
2259
|
},
|
|
1865
|
-
!hideHeader && /* @__PURE__ */
|
|
2260
|
+
!hideHeader && /* @__PURE__ */ import_react15.default.createElement("div", { className: "flex items-center justify-between px-6 py-4 border-b border-border/50 shrink-0 bg-gradient-to-r from-muted/20 to-background" }, /* @__PURE__ */ import_react15.default.createElement("h3", { className: "text-lg font-semibold text-foreground" }, title), /* @__PURE__ */ import_react15.default.createElement(
|
|
1866
2261
|
Button,
|
|
1867
2262
|
{
|
|
1868
2263
|
variant: "ghost",
|
|
@@ -1870,15 +2265,15 @@ var Modal = ({
|
|
|
1870
2265
|
onClick: onClose,
|
|
1871
2266
|
className: "h-9 w-9 p-0 rounded-xl hover:bg-accent/80 transition-all duration-200"
|
|
1872
2267
|
},
|
|
1873
|
-
/* @__PURE__ */
|
|
1874
|
-
/* @__PURE__ */
|
|
2268
|
+
/* @__PURE__ */ import_react15.default.createElement(import_lucide_react6.X, { className: "h-4 w-4" }),
|
|
2269
|
+
/* @__PURE__ */ import_react15.default.createElement("span", { className: "sr-only" }, closeLabel)
|
|
1875
2270
|
)),
|
|
1876
|
-
/* @__PURE__ */
|
|
2271
|
+
/* @__PURE__ */ import_react15.default.createElement("div", { className: cn("overflow-y-auto flex-1", !hideHeader && "p-6") }, children)
|
|
1877
2272
|
));
|
|
1878
2273
|
};
|
|
1879
2274
|
|
|
1880
2275
|
// src/components/EventModal.tsx
|
|
1881
|
-
var
|
|
2276
|
+
var import_date_fns17 = require("date-fns");
|
|
1882
2277
|
var import_framer_motion2 = require("framer-motion");
|
|
1883
2278
|
var import_lucide_react7 = require("lucide-react");
|
|
1884
2279
|
var REMINDER_OPTIONS = [0, 5, 10, 15, 30, 60, 120, 1440, 2880, 10080];
|
|
@@ -1937,14 +2332,15 @@ var EventModal = ({
|
|
|
1937
2332
|
onDelete,
|
|
1938
2333
|
calendars,
|
|
1939
2334
|
translations: t,
|
|
1940
|
-
locale
|
|
2335
|
+
locale,
|
|
2336
|
+
initialAllDay
|
|
1941
2337
|
}) => {
|
|
1942
|
-
const [mode, setMode] = (0,
|
|
1943
|
-
const translationsRef = (0,
|
|
1944
|
-
(0,
|
|
2338
|
+
const [mode, setMode] = (0, import_react16.useState)("create");
|
|
2339
|
+
const translationsRef = (0, import_react16.useRef)(t);
|
|
2340
|
+
(0, import_react16.useInsertionEffect)(() => {
|
|
1945
2341
|
translationsRef.current = t;
|
|
1946
2342
|
});
|
|
1947
|
-
const [formData, setFormData] = (0,
|
|
2343
|
+
const [formData, setFormData] = (0, import_react16.useState)({
|
|
1948
2344
|
title: "",
|
|
1949
2345
|
description: "",
|
|
1950
2346
|
location: "",
|
|
@@ -1958,12 +2354,12 @@ var EventModal = ({
|
|
|
1958
2354
|
attachments: [],
|
|
1959
2355
|
reminders: []
|
|
1960
2356
|
});
|
|
1961
|
-
const [isCalendarDropdownOpen, setIsCalendarDropdownOpen] = (0,
|
|
1962
|
-
const [isColorPickerOpen, setIsColorPickerOpen] = (0,
|
|
1963
|
-
const [isReminderDropdownOpen, setIsReminderDropdownOpen] = (0,
|
|
1964
|
-
const [guestInput, setGuestInput] = (0,
|
|
1965
|
-
const [guestError, setGuestError] = (0,
|
|
1966
|
-
(0,
|
|
2357
|
+
const [isCalendarDropdownOpen, setIsCalendarDropdownOpen] = (0, import_react16.useState)(false);
|
|
2358
|
+
const [isColorPickerOpen, setIsColorPickerOpen] = (0, import_react16.useState)(false);
|
|
2359
|
+
const [isReminderDropdownOpen, setIsReminderDropdownOpen] = (0, import_react16.useState)(false);
|
|
2360
|
+
const [guestInput, setGuestInput] = (0, import_react16.useState)("");
|
|
2361
|
+
const [guestError, setGuestError] = (0, import_react16.useState)(false);
|
|
2362
|
+
(0, import_react16.useEffect)(() => {
|
|
1967
2363
|
const defaultReminders = () => [{ id: "1", type: "notification", time: 30, label: reminderLabel(30, translationsRef.current) }];
|
|
1968
2364
|
if (isOpen) {
|
|
1969
2365
|
setGuestInput("");
|
|
@@ -1980,16 +2376,16 @@ var EventModal = ({
|
|
|
1980
2376
|
});
|
|
1981
2377
|
} else {
|
|
1982
2378
|
setMode("create");
|
|
1983
|
-
const
|
|
1984
|
-
const
|
|
1985
|
-
end.
|
|
2379
|
+
const base = initialDate || /* @__PURE__ */ new Date();
|
|
2380
|
+
const start = initialAllDay ? (0, import_date_fns17.startOfDay)(base) : base;
|
|
2381
|
+
const end = initialAllDay ? (0, import_date_fns17.addDays)(start, 1) : new Date(base.getTime() + 60 * 60 * 1e3);
|
|
1986
2382
|
setFormData({
|
|
1987
2383
|
title: "",
|
|
1988
2384
|
description: "",
|
|
1989
2385
|
location: "",
|
|
1990
2386
|
start,
|
|
1991
2387
|
end,
|
|
1992
|
-
allDay:
|
|
2388
|
+
allDay: !!initialAllDay,
|
|
1993
2389
|
color: "#3b82f6",
|
|
1994
2390
|
calendarId: calendars?.[0]?.id,
|
|
1995
2391
|
attachments: [],
|
|
@@ -1998,7 +2394,7 @@ var EventModal = ({
|
|
|
1998
2394
|
});
|
|
1999
2395
|
}
|
|
2000
2396
|
}
|
|
2001
|
-
}, [isOpen, event, initialDate, calendars]);
|
|
2397
|
+
}, [isOpen, event, initialDate, calendars, initialAllDay]);
|
|
2002
2398
|
const guests = formData.guests || [];
|
|
2003
2399
|
const addGuests = (raw) => {
|
|
2004
2400
|
const entries = raw.split(/[\s,;]+/).filter(Boolean);
|
|
@@ -2045,9 +2441,38 @@ var EventModal = ({
|
|
|
2045
2441
|
};
|
|
2046
2442
|
const formatDateForInput = (date) => {
|
|
2047
2443
|
if (!date) return "";
|
|
2048
|
-
return (0,
|
|
2444
|
+
return (0, import_date_fns17.format)(date, "yyyy-MM-dd'T'HH:mm");
|
|
2445
|
+
};
|
|
2446
|
+
const allDaySpan = formData.allDay && formData.start && formData.end ? dayEventSpan({ ...formData, allDay: true }) : null;
|
|
2447
|
+
const handleAllDayToggle = () => {
|
|
2448
|
+
if (!formData.start || !formData.end) return;
|
|
2449
|
+
if (!formData.allDay) {
|
|
2450
|
+
const firstDay = (0, import_date_fns17.startOfDay)(formData.start);
|
|
2451
|
+
const lastDay = (0, import_date_fns17.startOfDay)(new Date(Math.max(formData.end.getTime() - 1, formData.start.getTime())));
|
|
2452
|
+
setFormData((prev) => ({ ...prev, allDay: true, start: firstDay, end: (0, import_date_fns17.addDays)(lastDay, 1) }));
|
|
2453
|
+
} else {
|
|
2454
|
+
const start = new Date(formData.start);
|
|
2455
|
+
start.setHours(9, 0, 0, 0);
|
|
2456
|
+
setFormData((prev) => ({ ...prev, allDay: false, start, end: new Date(start.getTime() + 60 * 60 * 1e3) }));
|
|
2457
|
+
}
|
|
2458
|
+
};
|
|
2459
|
+
const handleAllDayDateChange = (field, value) => {
|
|
2460
|
+
const [y, m, d] = value.split("-").map(Number);
|
|
2461
|
+
if (!y || !m || !d || !allDaySpan) return;
|
|
2462
|
+
const day = new Date(y, m - 1, d);
|
|
2463
|
+
if (field === "start") {
|
|
2464
|
+
const days = (0, import_date_fns17.differenceInCalendarDays)(allDaySpan.lastDay, allDaySpan.firstDay);
|
|
2465
|
+
setFormData((prev) => ({ ...prev, start: day, end: (0, import_date_fns17.addDays)(day, days + 1) }));
|
|
2466
|
+
} else {
|
|
2467
|
+
const firstDay = day < allDaySpan.firstDay ? day : allDaySpan.firstDay;
|
|
2468
|
+
setFormData((prev) => ({ ...prev, start: firstDay, end: (0, import_date_fns17.addDays)(day, 1) }));
|
|
2469
|
+
}
|
|
2049
2470
|
};
|
|
2050
2471
|
const handleDateChange = (field, value) => {
|
|
2472
|
+
if (formData.allDay) {
|
|
2473
|
+
handleAllDayDateChange(field, value);
|
|
2474
|
+
return;
|
|
2475
|
+
}
|
|
2051
2476
|
const date = new Date(value);
|
|
2052
2477
|
if (isNaN(date.getTime())) return;
|
|
2053
2478
|
if (field === "start") {
|
|
@@ -2086,7 +2511,11 @@ var EventModal = ({
|
|
|
2086
2511
|
};
|
|
2087
2512
|
const getDurationText = () => {
|
|
2088
2513
|
if (!formData.start || !formData.end) return "";
|
|
2089
|
-
|
|
2514
|
+
if (allDaySpan) {
|
|
2515
|
+
const days = (0, import_date_fns17.differenceInCalendarDays)(allDaySpan.lastDay, allDaySpan.firstDay) + 1;
|
|
2516
|
+
return days === 1 ? t.durationDay : interpolate(t.durationDays, { n: days });
|
|
2517
|
+
}
|
|
2518
|
+
const mins = (0, import_date_fns17.differenceInMinutes)(formData.end, formData.start);
|
|
2090
2519
|
if (mins < 60) return interpolate(t.durationMinutes, { n: mins });
|
|
2091
2520
|
const hours = Math.floor(mins / 60);
|
|
2092
2521
|
const remainingMins = mins % 60;
|
|
@@ -2094,12 +2523,14 @@ var EventModal = ({
|
|
|
2094
2523
|
return interpolate(t.durationHoursMinutes, { h: hours, m: remainingMins });
|
|
2095
2524
|
};
|
|
2096
2525
|
const { time: timeFormat } = timeFormats(locale);
|
|
2526
|
+
const viewEvent = event && { ...event, start: new Date(event.start), end: new Date(event.end) };
|
|
2527
|
+
const viewSpan = viewEvent && isDayEvent(viewEvent) ? dayEventSpan(viewEvent) : null;
|
|
2097
2528
|
const renderAttachment = (att) => {
|
|
2098
|
-
const content = /* @__PURE__ */
|
|
2529
|
+
const content = /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement("div", { className: "p-2 bg-primary/10 rounded-lg" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.File, { className: "w-4 h-4 text-primary" })), /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react16.default.createElement("p", { className: "text-sm font-medium text-foreground truncate" }, att.name), /* @__PURE__ */ import_react16.default.createElement("p", { className: "text-xs text-muted-foreground" }, att.size)), att.url && /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Download, { className: "w-4 h-4 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity" }));
|
|
2099
2530
|
const className = "flex items-center gap-3 p-3 rounded-xl border border-border/30 bg-muted/20 transition-all group";
|
|
2100
|
-
return att.url && isSafeUrl(att.url) ? /* @__PURE__ */
|
|
2531
|
+
return att.url && isSafeUrl(att.url) ? /* @__PURE__ */ import_react16.default.createElement("a", { key: att.id, href: att.url, target: "_blank", rel: "noopener noreferrer", download: att.name, className: cn(className, "hover:bg-muted/40 cursor-pointer") }, content) : /* @__PURE__ */ import_react16.default.createElement("div", { key: att.id, className }, content);
|
|
2101
2532
|
};
|
|
2102
|
-
const renderViewMode = () => /* @__PURE__ */
|
|
2533
|
+
const renderViewMode = () => /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex flex-col bg-background overflow-hidden w-full max-h-[90vh]" }, /* @__PURE__ */ import_react16.default.createElement(
|
|
2103
2534
|
"div",
|
|
2104
2535
|
{
|
|
2105
2536
|
className: "relative px-6 pt-6 pb-8",
|
|
@@ -2107,13 +2538,13 @@ var EventModal = ({
|
|
|
2107
2538
|
background: `linear-gradient(135deg, ${event?.color || "#3b82f6"}15 0%, transparent 100%)`
|
|
2108
2539
|
}
|
|
2109
2540
|
},
|
|
2110
|
-
/* @__PURE__ */
|
|
2541
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center justify-between mb-6" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react16.default.createElement(
|
|
2111
2542
|
"div",
|
|
2112
2543
|
{
|
|
2113
2544
|
className: "w-3 h-3 rounded-full",
|
|
2114
2545
|
style: { backgroundColor: event?.color || "#3b82f6" }
|
|
2115
2546
|
}
|
|
2116
|
-
), /* @__PURE__ */
|
|
2547
|
+
), /* @__PURE__ */ import_react16.default.createElement("span", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wider" }, calendars?.find((c) => c.id === event?.calendarId)?.label || t.event)), /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-1" }, /* @__PURE__ */ import_react16.default.createElement(
|
|
2117
2548
|
"button",
|
|
2118
2549
|
{
|
|
2119
2550
|
onClick: () => setMode("edit"),
|
|
@@ -2121,8 +2552,8 @@ var EventModal = ({
|
|
|
2121
2552
|
title: t.edit,
|
|
2122
2553
|
"aria-label": t.edit
|
|
2123
2554
|
},
|
|
2124
|
-
/* @__PURE__ */
|
|
2125
|
-
), /* @__PURE__ */
|
|
2555
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Edit2, { className: "w-4 h-4" })
|
|
2556
|
+
), /* @__PURE__ */ import_react16.default.createElement(
|
|
2126
2557
|
"button",
|
|
2127
2558
|
{
|
|
2128
2559
|
onClick: handleDelete,
|
|
@@ -2130,8 +2561,8 @@ var EventModal = ({
|
|
|
2130
2561
|
title: t.delete,
|
|
2131
2562
|
"aria-label": t.delete
|
|
2132
2563
|
},
|
|
2133
|
-
/* @__PURE__ */
|
|
2134
|
-
), /* @__PURE__ */
|
|
2564
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Trash2, { className: "w-4 h-4" })
|
|
2565
|
+
), /* @__PURE__ */ import_react16.default.createElement(
|
|
2135
2566
|
"button",
|
|
2136
2567
|
{
|
|
2137
2568
|
onClick: onClose,
|
|
@@ -2139,11 +2570,11 @@ var EventModal = ({
|
|
|
2139
2570
|
title: t.close,
|
|
2140
2571
|
"aria-label": t.close
|
|
2141
2572
|
},
|
|
2142
|
-
/* @__PURE__ */
|
|
2573
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.X, { className: "w-4 h-4" })
|
|
2143
2574
|
))),
|
|
2144
|
-
/* @__PURE__ */
|
|
2145
|
-
/* @__PURE__ */
|
|
2146
|
-
), /* @__PURE__ */
|
|
2575
|
+
/* @__PURE__ */ import_react16.default.createElement("h1", { className: "text-2xl font-bold text-foreground mb-3 leading-tight" }, event?.title || t.noTitle),
|
|
2576
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-3 text-sm" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-background/60 backdrop-blur-sm rounded-lg border border-border/30" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Calendar, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ import_react16.default.createElement("span", { className: "font-medium" }, viewSpan && viewSpan.lastDay > viewSpan.firstDay ? `${(0, import_date_fns17.format)(viewSpan.firstDay, "EEE d MMM", { locale })} \u2013 ${(0, import_date_fns17.format)(viewSpan.lastDay, "EEE d MMM", { locale })}` : event?.start && (0, import_date_fns17.format)(new Date(event.start), "EEE, MMM d", { locale }))), event?.allDay ? /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-primary/10 rounded-lg border border-primary/20" }, /* @__PURE__ */ import_react16.default.createElement("span", { className: "font-medium text-primary" }, t.allDay)) : /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2 px-3 py-1.5 bg-background/60 backdrop-blur-sm rounded-lg border border-border/30" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Clock, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ import_react16.default.createElement("span", { className: "font-medium" }, event?.start && (0, import_date_fns17.format)(new Date(event.start), timeFormat, { locale }), " \u2013 ", event?.end && (0, import_date_fns17.format)(new Date(event.end), timeFormat, { locale }))))
|
|
2577
|
+
), /* @__PURE__ */ import_react16.default.createElement("div", { className: "px-6 pb-6 space-y-4 overflow-y-auto flex-1" }, event?.location && /* @__PURE__ */ import_react16.default.createElement(
|
|
2147
2578
|
import_framer_motion2.motion.a,
|
|
2148
2579
|
{
|
|
2149
2580
|
href: mapsUrl(event.location),
|
|
@@ -2153,10 +2584,10 @@ var EventModal = ({
|
|
|
2153
2584
|
animate: { opacity: 1, y: 0 },
|
|
2154
2585
|
className: "flex items-start gap-3 p-4 rounded-2xl bg-muted/30 border border-border/30 group hover:bg-muted/50 transition-all cursor-pointer"
|
|
2155
2586
|
},
|
|
2156
|
-
/* @__PURE__ */
|
|
2157
|
-
/* @__PURE__ */
|
|
2158
|
-
/* @__PURE__ */
|
|
2159
|
-
), event?.guests && event.guests.length > 0 && /* @__PURE__ */
|
|
2587
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "p-2 bg-primary/10 rounded-xl" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.MapPin, { className: "w-5 h-5 text-primary" })),
|
|
2588
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "flex-1" }, /* @__PURE__ */ import_react16.default.createElement("p", { className: "text-sm font-medium text-foreground" }, event.location), /* @__PURE__ */ import_react16.default.createElement("p", { className: "text-xs text-muted-foreground mt-0.5" }, t.openInMaps)),
|
|
2589
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.ExternalLink, { className: "w-4 h-4 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity" })
|
|
2590
|
+
), event?.guests && event.guests.length > 0 && /* @__PURE__ */ import_react16.default.createElement(
|
|
2160
2591
|
import_framer_motion2.motion.div,
|
|
2161
2592
|
{
|
|
2162
2593
|
initial: { opacity: 0, y: 10 },
|
|
@@ -2164,14 +2595,14 @@ var EventModal = ({
|
|
|
2164
2595
|
transition: { delay: 0.05 },
|
|
2165
2596
|
className: "space-y-3"
|
|
2166
2597
|
},
|
|
2167
|
-
/* @__PURE__ */
|
|
2168
|
-
/* @__PURE__ */
|
|
2598
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Users, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ import_react16.default.createElement("span", { className: "text-sm font-medium text-foreground" }, event.guests.length, " ", event.guests.length > 1 ? t.guests : t.guestSingular))),
|
|
2599
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "flex flex-wrap gap-2" }, event.guests.map((email) => /* @__PURE__ */ import_react16.default.createElement(
|
|
2169
2600
|
"div",
|
|
2170
2601
|
{
|
|
2171
2602
|
key: email,
|
|
2172
2603
|
className: "flex items-center gap-2 px-3 py-2 rounded-xl bg-muted/30 border border-border/30"
|
|
2173
2604
|
},
|
|
2174
|
-
/* @__PURE__ */
|
|
2605
|
+
/* @__PURE__ */ import_react16.default.createElement(
|
|
2175
2606
|
"div",
|
|
2176
2607
|
{
|
|
2177
2608
|
className: "w-8 h-8 rounded-full flex items-center justify-center text-sm font-semibold text-white",
|
|
@@ -2179,9 +2610,9 @@ var EventModal = ({
|
|
|
2179
2610
|
},
|
|
2180
2611
|
email[0].toUpperCase()
|
|
2181
2612
|
),
|
|
2182
|
-
/* @__PURE__ */
|
|
2613
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react16.default.createElement("p", { className: "text-sm font-medium text-foreground" }, email.split("@")[0]), /* @__PURE__ */ import_react16.default.createElement("p", { className: "text-xs text-muted-foreground truncate" }, email))
|
|
2183
2614
|
)))
|
|
2184
|
-
), event?.reminders && event.reminders.length > 0 && /* @__PURE__ */
|
|
2615
|
+
), event?.reminders && event.reminders.length > 0 && /* @__PURE__ */ import_react16.default.createElement(
|
|
2185
2616
|
import_framer_motion2.motion.div,
|
|
2186
2617
|
{
|
|
2187
2618
|
initial: { opacity: 0, y: 10 },
|
|
@@ -2189,8 +2620,8 @@ var EventModal = ({
|
|
|
2189
2620
|
transition: { delay: 0.1 },
|
|
2190
2621
|
className: "flex items-center gap-3"
|
|
2191
2622
|
},
|
|
2192
|
-
/* @__PURE__ */
|
|
2193
|
-
/* @__PURE__ */
|
|
2623
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "p-2 bg-amber-500/10 rounded-xl" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Bell, { className: "w-4 h-4 text-amber-500" })),
|
|
2624
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "flex flex-wrap gap-2" }, event.reminders.map((reminder) => /* @__PURE__ */ import_react16.default.createElement(
|
|
2194
2625
|
"span",
|
|
2195
2626
|
{
|
|
2196
2627
|
key: reminder.id,
|
|
@@ -2198,7 +2629,7 @@ var EventModal = ({
|
|
|
2198
2629
|
},
|
|
2199
2630
|
reminder.label || reminderLabel(reminder.time, t)
|
|
2200
2631
|
)))
|
|
2201
|
-
), event?.description && /* @__PURE__ */
|
|
2632
|
+
), event?.description && /* @__PURE__ */ import_react16.default.createElement(
|
|
2202
2633
|
import_framer_motion2.motion.div,
|
|
2203
2634
|
{
|
|
2204
2635
|
initial: { opacity: 0, y: 10 },
|
|
@@ -2206,9 +2637,9 @@ var EventModal = ({
|
|
|
2206
2637
|
transition: { delay: 0.15 },
|
|
2207
2638
|
className: "space-y-2"
|
|
2208
2639
|
},
|
|
2209
|
-
/* @__PURE__ */
|
|
2210
|
-
/* @__PURE__ */
|
|
2211
|
-
), event?.attachments && event.attachments.length > 0 && /* @__PURE__ */
|
|
2640
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.AlignLeft, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ import_react16.default.createElement("span", { className: "text-sm font-medium text-foreground" }, t.notesLabel)),
|
|
2641
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "text-sm text-foreground/80 whitespace-pre-wrap leading-relaxed pl-6 p-3 rounded-xl bg-muted/20 border border-border/30" }, event.description)
|
|
2642
|
+
), event?.attachments && event.attachments.length > 0 && /* @__PURE__ */ import_react16.default.createElement(
|
|
2212
2643
|
import_framer_motion2.motion.div,
|
|
2213
2644
|
{
|
|
2214
2645
|
initial: { opacity: 0, y: 10 },
|
|
@@ -2216,10 +2647,10 @@ var EventModal = ({
|
|
|
2216
2647
|
transition: { delay: 0.2 },
|
|
2217
2648
|
className: "space-y-2"
|
|
2218
2649
|
},
|
|
2219
|
-
/* @__PURE__ */
|
|
2220
|
-
/* @__PURE__ */
|
|
2650
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Paperclip, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ import_react16.default.createElement("span", { className: "text-sm font-medium text-foreground" }, t.attachments)),
|
|
2651
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "grid gap-2" }, event.attachments.map(renderAttachment))
|
|
2221
2652
|
)));
|
|
2222
|
-
const renderEditMode = () => /* @__PURE__ */
|
|
2653
|
+
const renderEditMode = () => /* @__PURE__ */ import_react16.default.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col bg-background overflow-hidden w-full max-h-[85vh]" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center justify-between px-5 py-4 border-b border-border/50 shrink-0" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ import_react16.default.createElement(
|
|
2223
2654
|
"button",
|
|
2224
2655
|
{
|
|
2225
2656
|
type: "button",
|
|
@@ -2227,7 +2658,7 @@ var EventModal = ({
|
|
|
2227
2658
|
className: "relative p-1",
|
|
2228
2659
|
"aria-label": t.eventColor
|
|
2229
2660
|
},
|
|
2230
|
-
/* @__PURE__ */
|
|
2661
|
+
/* @__PURE__ */ import_react16.default.createElement(
|
|
2231
2662
|
"div",
|
|
2232
2663
|
{
|
|
2233
2664
|
className: "w-5 h-5 rounded-full cursor-pointer hover:scale-110 transition-transform",
|
|
@@ -2237,7 +2668,7 @@ var EventModal = ({
|
|
|
2237
2668
|
}
|
|
2238
2669
|
}
|
|
2239
2670
|
),
|
|
2240
|
-
isColorPickerOpen && /* @__PURE__ */
|
|
2671
|
+
isColorPickerOpen && /* @__PURE__ */ import_react16.default.createElement("div", { className: "absolute top-full left-0 mt-2 p-2 bg-background border border-border rounded-xl shadow-xl z-50 flex flex-wrap gap-1.5 w-[180px]" }, COLOR_PALETTE.map((color) => /* @__PURE__ */ import_react16.default.createElement(
|
|
2241
2672
|
"button",
|
|
2242
2673
|
{
|
|
2243
2674
|
key: color,
|
|
@@ -2254,7 +2685,7 @@ var EventModal = ({
|
|
|
2254
2685
|
style: { backgroundColor: color, color }
|
|
2255
2686
|
}
|
|
2256
2687
|
)))
|
|
2257
|
-
), /* @__PURE__ */
|
|
2688
|
+
), /* @__PURE__ */ import_react16.default.createElement("h2", { className: "text-lg font-semibold text-foreground" }, mode === "edit" ? t.editEvent : t.newEvent)), /* @__PURE__ */ import_react16.default.createElement(
|
|
2258
2689
|
"button",
|
|
2259
2690
|
{
|
|
2260
2691
|
type: "button",
|
|
@@ -2262,8 +2693,8 @@ var EventModal = ({
|
|
|
2262
2693
|
className: "p-2 hover:bg-accent rounded-xl transition-all text-muted-foreground hover:text-foreground",
|
|
2263
2694
|
"aria-label": t.close
|
|
2264
2695
|
},
|
|
2265
|
-
/* @__PURE__ */
|
|
2266
|
-
)), /* @__PURE__ */
|
|
2696
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.X, { className: "w-4 h-4" })
|
|
2697
|
+
)), /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex-1 overflow-y-auto" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "px-5 py-4 space-y-5" }, /* @__PURE__ */ import_react16.default.createElement("div", null, /* @__PURE__ */ import_react16.default.createElement(
|
|
2267
2698
|
"input",
|
|
2268
2699
|
{
|
|
2269
2700
|
type: "text",
|
|
@@ -2275,34 +2706,56 @@ var EventModal = ({
|
|
|
2275
2706
|
placeholder: t.title,
|
|
2276
2707
|
"aria-label": t.title
|
|
2277
2708
|
}
|
|
2278
|
-
)), /* @__PURE__ */
|
|
2709
|
+
)), /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center justify-between px-1" }, /* @__PURE__ */ import_react16.default.createElement("span", { id: "calendarkit-all-day-label", className: "text-sm font-medium text-foreground" }, t.allDay), /* @__PURE__ */ import_react16.default.createElement(
|
|
2710
|
+
"button",
|
|
2711
|
+
{
|
|
2712
|
+
type: "button",
|
|
2713
|
+
role: "switch",
|
|
2714
|
+
"aria-checked": !!formData.allDay,
|
|
2715
|
+
"aria-labelledby": "calendarkit-all-day-label",
|
|
2716
|
+
onClick: handleAllDayToggle,
|
|
2717
|
+
className: cn(
|
|
2718
|
+
"relative inline-flex h-6 w-11 shrink-0 rounded-full border-2 border-transparent transition-colors cursor-pointer",
|
|
2719
|
+
formData.allDay ? "bg-primary" : "bg-muted"
|
|
2720
|
+
)
|
|
2721
|
+
},
|
|
2722
|
+
/* @__PURE__ */ import_react16.default.createElement(
|
|
2723
|
+
"span",
|
|
2724
|
+
{
|
|
2725
|
+
className: cn(
|
|
2726
|
+
"pointer-events-none inline-block h-5 w-5 rounded-full bg-background shadow transition-transform",
|
|
2727
|
+
formData.allDay ? "translate-x-5" : "translate-x-0"
|
|
2728
|
+
)
|
|
2729
|
+
}
|
|
2730
|
+
)
|
|
2731
|
+
)), /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-3 p-4 rounded-2xl bg-muted/20 border border-border/30" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "p-2 bg-primary/10 rounded-xl shrink-0" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Clock, { className: "w-5 h-5 text-primary" })), /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex-1 grid grid-cols-2 gap-3" }, /* @__PURE__ */ import_react16.default.createElement("div", null, /* @__PURE__ */ import_react16.default.createElement("label", { htmlFor: "calendarkit-event-start", className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider mb-1 block" }, t.start), /* @__PURE__ */ import_react16.default.createElement(
|
|
2279
2732
|
"input",
|
|
2280
2733
|
{
|
|
2281
2734
|
id: "calendarkit-event-start",
|
|
2282
|
-
type: "datetime-local",
|
|
2735
|
+
type: allDaySpan ? "date" : "datetime-local",
|
|
2283
2736
|
className: "w-full bg-background border border-border/50 rounded-xl px-3 py-2 text-sm font-medium text-foreground focus:border-primary focus:ring-2 focus:ring-primary/20 transition-all",
|
|
2284
|
-
value: formatDateForInput(formData.start),
|
|
2737
|
+
value: allDaySpan ? (0, import_date_fns17.format)(allDaySpan.firstDay, "yyyy-MM-dd") : formatDateForInput(formData.start),
|
|
2285
2738
|
onChange: (e) => handleDateChange("start", e.target.value)
|
|
2286
2739
|
}
|
|
2287
|
-
)), /* @__PURE__ */
|
|
2740
|
+
)), /* @__PURE__ */ import_react16.default.createElement("div", null, /* @__PURE__ */ import_react16.default.createElement("label", { htmlFor: "calendarkit-event-end", className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider mb-1 block" }, t.end), /* @__PURE__ */ import_react16.default.createElement(
|
|
2288
2741
|
"input",
|
|
2289
2742
|
{
|
|
2290
2743
|
id: "calendarkit-event-end",
|
|
2291
|
-
type: "datetime-local",
|
|
2744
|
+
type: allDaySpan ? "date" : "datetime-local",
|
|
2292
2745
|
className: "w-full bg-background border border-border/50 rounded-xl px-3 py-2 text-sm font-medium text-foreground focus:border-primary focus:ring-2 focus:ring-primary/20 transition-all",
|
|
2293
|
-
value: formatDateForInput(formData.end),
|
|
2746
|
+
value: allDaySpan ? (0, import_date_fns17.format)(allDaySpan.lastDay, "yyyy-MM-dd") : formatDateForInput(formData.end),
|
|
2294
2747
|
onChange: (e) => handleDateChange("end", e.target.value)
|
|
2295
2748
|
}
|
|
2296
|
-
)))), getDurationText() && /* @__PURE__ */
|
|
2749
|
+
)))), getDurationText() && /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ import_react16.default.createElement("span", { className: "text-xs font-medium px-3 py-1 rounded-full bg-primary/10 text-primary" }, getDurationText())), /* @__PURE__ */ import_react16.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Bell, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ import_react16.default.createElement("span", { className: "text-sm font-medium text-foreground" }, t.reminders)), /* @__PURE__ */ import_react16.default.createElement("div", { className: "relative" }, /* @__PURE__ */ import_react16.default.createElement(
|
|
2297
2750
|
"button",
|
|
2298
2751
|
{
|
|
2299
2752
|
type: "button",
|
|
2300
2753
|
onClick: () => setIsReminderDropdownOpen(!isReminderDropdownOpen),
|
|
2301
2754
|
className: "flex items-center gap-1 text-xs font-medium text-primary hover:text-primary/80 transition-colors"
|
|
2302
2755
|
},
|
|
2303
|
-
/* @__PURE__ */
|
|
2756
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Plus, { className: "w-3.5 h-3.5" }),
|
|
2304
2757
|
t.add
|
|
2305
|
-
), isReminderDropdownOpen && /* @__PURE__ */
|
|
2758
|
+
), isReminderDropdownOpen && /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement("div", { className: "fixed inset-0 z-40", onClick: () => setIsReminderDropdownOpen(false) }), /* @__PURE__ */ import_react16.default.createElement("div", { className: "absolute right-0 top-full mt-1 w-48 bg-background border border-border rounded-xl shadow-xl z-50 py-1 max-h-60 overflow-y-auto" }, REMINDER_OPTIONS.map((minutes) => /* @__PURE__ */ import_react16.default.createElement(
|
|
2306
2759
|
"button",
|
|
2307
2760
|
{
|
|
2308
2761
|
key: minutes,
|
|
@@ -2311,15 +2764,15 @@ var EventModal = ({
|
|
|
2311
2764
|
className: "w-full px-3 py-2 text-left text-sm hover:bg-accent transition-colors"
|
|
2312
2765
|
},
|
|
2313
2766
|
reminderLabel(minutes, t)
|
|
2314
|
-
)))))), formData.reminders && formData.reminders.length > 0 && /* @__PURE__ */
|
|
2767
|
+
)))))), formData.reminders && formData.reminders.length > 0 && /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex flex-wrap gap-2" }, formData.reminders.map((reminder) => /* @__PURE__ */ import_react16.default.createElement(
|
|
2315
2768
|
"div",
|
|
2316
2769
|
{
|
|
2317
2770
|
key: reminder.id,
|
|
2318
2771
|
className: "flex items-center gap-2 px-3 py-1.5 rounded-full bg-amber-500/10 border border-amber-500/20"
|
|
2319
2772
|
},
|
|
2320
|
-
/* @__PURE__ */
|
|
2321
|
-
/* @__PURE__ */
|
|
2322
|
-
/* @__PURE__ */
|
|
2773
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.BellRing, { className: "w-3.5 h-3.5 text-amber-500" }),
|
|
2774
|
+
/* @__PURE__ */ import_react16.default.createElement("span", { className: "text-xs font-medium text-amber-600 dark:text-amber-400" }, reminder.label || reminderLabel(reminder.time, t)),
|
|
2775
|
+
/* @__PURE__ */ import_react16.default.createElement(
|
|
2323
2776
|
"button",
|
|
2324
2777
|
{
|
|
2325
2778
|
type: "button",
|
|
@@ -2327,9 +2780,9 @@ var EventModal = ({
|
|
|
2327
2780
|
className: "p-0.5 hover:bg-amber-500/20 rounded-full transition-colors",
|
|
2328
2781
|
"aria-label": t.removeReminder
|
|
2329
2782
|
},
|
|
2330
|
-
/* @__PURE__ */
|
|
2783
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.X, { className: "w-3 h-3 text-amber-500" })
|
|
2331
2784
|
)
|
|
2332
|
-
)))), /* @__PURE__ */
|
|
2785
|
+
)))), /* @__PURE__ */ import_react16.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Users, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ import_react16.default.createElement("label", { htmlFor: "calendarkit-event-guest", className: "text-sm font-medium text-foreground" }, t.guests)), /* @__PURE__ */ import_react16.default.createElement(
|
|
2333
2786
|
"input",
|
|
2334
2787
|
{
|
|
2335
2788
|
id: "calendarkit-event-guest",
|
|
@@ -2355,13 +2808,13 @@ var EventModal = ({
|
|
|
2355
2808
|
guestError ? "border-destructive" : "border-border/30"
|
|
2356
2809
|
)
|
|
2357
2810
|
}
|
|
2358
|
-
), guestError && /* @__PURE__ */
|
|
2811
|
+
), guestError && /* @__PURE__ */ import_react16.default.createElement("p", { role: "alert", className: "text-xs text-destructive" }, t.invalidEmail), guests.length > 0 && /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex flex-wrap gap-2 mt-2" }, guests.map((email) => /* @__PURE__ */ import_react16.default.createElement(
|
|
2359
2812
|
"div",
|
|
2360
2813
|
{
|
|
2361
2814
|
key: email,
|
|
2362
2815
|
className: "flex items-center gap-2 pl-1 pr-2 py-1 bg-muted/30 border border-border/30 rounded-full"
|
|
2363
2816
|
},
|
|
2364
|
-
/* @__PURE__ */
|
|
2817
|
+
/* @__PURE__ */ import_react16.default.createElement(
|
|
2365
2818
|
"div",
|
|
2366
2819
|
{
|
|
2367
2820
|
className: "w-6 h-6 rounded-full flex items-center justify-center text-xs font-semibold text-white",
|
|
@@ -2369,8 +2822,8 @@ var EventModal = ({
|
|
|
2369
2822
|
},
|
|
2370
2823
|
email[0].toUpperCase()
|
|
2371
2824
|
),
|
|
2372
|
-
/* @__PURE__ */
|
|
2373
|
-
/* @__PURE__ */
|
|
2825
|
+
/* @__PURE__ */ import_react16.default.createElement("span", { className: "text-xs font-medium text-foreground" }, email),
|
|
2826
|
+
/* @__PURE__ */ import_react16.default.createElement(
|
|
2374
2827
|
"button",
|
|
2375
2828
|
{
|
|
2376
2829
|
type: "button",
|
|
@@ -2378,9 +2831,9 @@ var EventModal = ({
|
|
|
2378
2831
|
className: "p-0.5 hover:bg-destructive/10 rounded-full transition-colors",
|
|
2379
2832
|
"aria-label": interpolate(t.removeGuest, { email })
|
|
2380
2833
|
},
|
|
2381
|
-
/* @__PURE__ */
|
|
2834
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.X, { className: "w-3 h-3 text-muted-foreground" })
|
|
2382
2835
|
)
|
|
2383
|
-
)))), /* @__PURE__ */
|
|
2836
|
+
)))), /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-3 p-3 rounded-xl bg-muted/20 border border-border/30" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.MapPin, { className: "w-5 h-5 text-muted-foreground shrink-0" }), /* @__PURE__ */ import_react16.default.createElement(
|
|
2384
2837
|
"input",
|
|
2385
2838
|
{
|
|
2386
2839
|
type: "text",
|
|
@@ -2390,7 +2843,7 @@ var EventModal = ({
|
|
|
2390
2843
|
value: formData.location || "",
|
|
2391
2844
|
onChange: (e) => setFormData({ ...formData, location: e.target.value })
|
|
2392
2845
|
}
|
|
2393
|
-
)), /* @__PURE__ */
|
|
2846
|
+
)), /* @__PURE__ */ import_react16.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.AlignLeft, { className: "w-4 h-4 text-muted-foreground" }), /* @__PURE__ */ import_react16.default.createElement("span", { className: "text-sm font-medium text-foreground" }, t.notesLabel)), /* @__PURE__ */ import_react16.default.createElement(
|
|
2394
2847
|
"textarea",
|
|
2395
2848
|
{
|
|
2396
2849
|
className: "w-full bg-muted/20 border border-border/30 rounded-xl px-4 py-3 text-sm min-h-[100px] resize-none text-foreground placeholder-muted-foreground focus:border-primary focus:ring-2 focus:ring-primary/20 transition-all",
|
|
@@ -2399,7 +2852,7 @@ var EventModal = ({
|
|
|
2399
2852
|
value: formData.description || "",
|
|
2400
2853
|
onChange: (e) => setFormData({ ...formData, description: e.target.value })
|
|
2401
2854
|
}
|
|
2402
|
-
)), /* @__PURE__ */
|
|
2855
|
+
)), /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-3 p-3 rounded-xl bg-muted/20 border border-border/30" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Repeat, { className: "w-5 h-5 text-muted-foreground shrink-0" }), /* @__PURE__ */ import_react16.default.createElement(
|
|
2403
2856
|
"select",
|
|
2404
2857
|
{
|
|
2405
2858
|
className: "flex-1 bg-transparent text-sm text-foreground focus:outline-none cursor-pointer",
|
|
@@ -2419,28 +2872,28 @@ var EventModal = ({
|
|
|
2419
2872
|
}
|
|
2420
2873
|
}
|
|
2421
2874
|
},
|
|
2422
|
-
/* @__PURE__ */
|
|
2423
|
-
/* @__PURE__ */
|
|
2424
|
-
/* @__PURE__ */
|
|
2425
|
-
/* @__PURE__ */
|
|
2426
|
-
/* @__PURE__ */
|
|
2427
|
-
)), calendars && calendars.length > 0 && /* @__PURE__ */
|
|
2875
|
+
/* @__PURE__ */ import_react16.default.createElement("option", { value: "" }, t.doesNotRepeat),
|
|
2876
|
+
/* @__PURE__ */ import_react16.default.createElement("option", { value: "DAILY" }, t.daily),
|
|
2877
|
+
/* @__PURE__ */ import_react16.default.createElement("option", { value: "WEEKLY" }, t.weekly),
|
|
2878
|
+
/* @__PURE__ */ import_react16.default.createElement("option", { value: "MONTHLY" }, t.monthly),
|
|
2879
|
+
/* @__PURE__ */ import_react16.default.createElement("option", { value: "YEARLY" }, t.yearly)
|
|
2880
|
+
)), calendars && calendars.length > 0 && /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center justify-between p-3 rounded-xl bg-muted/20 border border-border/30" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Tag, { className: "w-5 h-5 text-muted-foreground" }), /* @__PURE__ */ import_react16.default.createElement("span", { className: "text-sm text-foreground" }, t.calendar)), /* @__PURE__ */ import_react16.default.createElement("div", { className: "relative" }, /* @__PURE__ */ import_react16.default.createElement(
|
|
2428
2881
|
"button",
|
|
2429
2882
|
{
|
|
2430
2883
|
type: "button",
|
|
2431
2884
|
onClick: () => setIsCalendarDropdownOpen(!isCalendarDropdownOpen),
|
|
2432
2885
|
className: "flex items-center gap-2 px-3 py-1.5 bg-background border border-border/50 rounded-lg text-sm hover:bg-accent/50 transition-all"
|
|
2433
2886
|
},
|
|
2434
|
-
/* @__PURE__ */
|
|
2887
|
+
/* @__PURE__ */ import_react16.default.createElement(
|
|
2435
2888
|
"div",
|
|
2436
2889
|
{
|
|
2437
2890
|
className: "w-3 h-3 rounded-full",
|
|
2438
2891
|
style: { backgroundColor: calendars.find((c) => c.id === formData.calendarId)?.color || "#3b82f6" }
|
|
2439
2892
|
}
|
|
2440
2893
|
),
|
|
2441
|
-
/* @__PURE__ */
|
|
2442
|
-
/* @__PURE__ */
|
|
2443
|
-
), isCalendarDropdownOpen && /* @__PURE__ */
|
|
2894
|
+
/* @__PURE__ */ import_react16.default.createElement("span", { className: "font-medium" }, calendars.find((c) => c.id === formData.calendarId)?.label || t.select),
|
|
2895
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.ChevronDown, { className: "w-3.5 h-3.5 text-muted-foreground" })
|
|
2896
|
+
), isCalendarDropdownOpen && /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement("div", { className: "fixed inset-0 z-40", onClick: () => setIsCalendarDropdownOpen(false) }), /* @__PURE__ */ import_react16.default.createElement("div", { className: "absolute right-0 bottom-full mb-2 w-48 bg-background border border-border rounded-xl shadow-xl z-50 py-1" }, calendars.map((cal) => /* @__PURE__ */ import_react16.default.createElement(
|
|
2444
2897
|
"button",
|
|
2445
2898
|
{
|
|
2446
2899
|
key: cal.id,
|
|
@@ -2455,19 +2908,19 @@ var EventModal = ({
|
|
|
2455
2908
|
setIsCalendarDropdownOpen(false);
|
|
2456
2909
|
}
|
|
2457
2910
|
},
|
|
2458
|
-
/* @__PURE__ */
|
|
2459
|
-
/* @__PURE__ */
|
|
2460
|
-
formData.calendarId === cal.id && /* @__PURE__ */
|
|
2461
|
-
)))))))), /* @__PURE__ */
|
|
2911
|
+
/* @__PURE__ */ import_react16.default.createElement("div", { className: "w-3 h-3 rounded-full", style: { backgroundColor: cal.color } }),
|
|
2912
|
+
/* @__PURE__ */ import_react16.default.createElement("span", { className: "flex-1 text-sm" }, cal.label),
|
|
2913
|
+
formData.calendarId === cal.id && /* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Check, { className: "w-4 h-4 text-primary" })
|
|
2914
|
+
)))))))), /* @__PURE__ */ import_react16.default.createElement("div", { className: "px-5 py-4 border-t border-border/50 flex items-center justify-between bg-muted/10 shrink-0" }, mode === "edit" && /* @__PURE__ */ import_react16.default.createElement(
|
|
2462
2915
|
"button",
|
|
2463
2916
|
{
|
|
2464
2917
|
type: "button",
|
|
2465
2918
|
onClick: handleDelete,
|
|
2466
2919
|
className: "flex items-center gap-2 px-4 py-2 text-destructive hover:bg-destructive/10 rounded-xl transition-all text-sm font-medium"
|
|
2467
2920
|
},
|
|
2468
|
-
/* @__PURE__ */
|
|
2921
|
+
/* @__PURE__ */ import_react16.default.createElement(import_lucide_react7.Trash2, { className: "w-4 h-4" }),
|
|
2469
2922
|
t.delete
|
|
2470
|
-
), mode === "create" && /* @__PURE__ */
|
|
2923
|
+
), mode === "create" && /* @__PURE__ */ import_react16.default.createElement("div", null), /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react16.default.createElement(
|
|
2471
2924
|
"button",
|
|
2472
2925
|
{
|
|
2473
2926
|
type: "button",
|
|
@@ -2475,7 +2928,7 @@ var EventModal = ({
|
|
|
2475
2928
|
className: "px-4 py-2.5 text-muted-foreground hover:text-foreground font-medium text-sm rounded-xl transition-all hover:bg-accent"
|
|
2476
2929
|
},
|
|
2477
2930
|
t.cancel
|
|
2478
|
-
), /* @__PURE__ */
|
|
2931
|
+
), /* @__PURE__ */ import_react16.default.createElement(
|
|
2479
2932
|
"button",
|
|
2480
2933
|
{
|
|
2481
2934
|
type: "submit",
|
|
@@ -2483,7 +2936,7 @@ var EventModal = ({
|
|
|
2483
2936
|
},
|
|
2484
2937
|
mode === "edit" ? t.saveChanges : t.createEvent
|
|
2485
2938
|
))));
|
|
2486
|
-
return /* @__PURE__ */
|
|
2939
|
+
return /* @__PURE__ */ import_react16.default.createElement(Modal, { isOpen, onClose, hideHeader: true, className: "p-0 overflow-hidden max-w-lg rounded-2xl shadow-2xl" }, /* @__PURE__ */ import_react16.default.createElement(import_framer_motion2.AnimatePresence, { mode: "wait" }, mode === "view" && event ? /* @__PURE__ */ import_react16.default.createElement(
|
|
2487
2940
|
import_framer_motion2.motion.div,
|
|
2488
2941
|
{
|
|
2489
2942
|
key: "view",
|
|
@@ -2493,7 +2946,7 @@ var EventModal = ({
|
|
|
2493
2946
|
transition: { duration: 0.15 }
|
|
2494
2947
|
},
|
|
2495
2948
|
renderViewMode()
|
|
2496
|
-
) : /* @__PURE__ */
|
|
2949
|
+
) : /* @__PURE__ */ import_react16.default.createElement(
|
|
2497
2950
|
import_framer_motion2.motion.div,
|
|
2498
2951
|
{
|
|
2499
2952
|
key: "edit",
|
|
@@ -2507,10 +2960,10 @@ var EventModal = ({
|
|
|
2507
2960
|
};
|
|
2508
2961
|
|
|
2509
2962
|
// src/components/Skeleton.tsx
|
|
2510
|
-
var
|
|
2511
|
-
var Skeleton = ({ className, style }) => /* @__PURE__ */
|
|
2512
|
-
var MonthViewSkeleton = () => /* @__PURE__ */
|
|
2513
|
-
var WeekViewSkeleton = () => /* @__PURE__ */
|
|
2963
|
+
var import_react17 = __toESM(require("react"));
|
|
2964
|
+
var Skeleton = ({ className, style }) => /* @__PURE__ */ import_react17.default.createElement("div", { className: cn("animate-pulse bg-muted/40 rounded", className), style });
|
|
2965
|
+
var MonthViewSkeleton = () => /* @__PURE__ */ import_react17.default.createElement("div", { className: "h-full bg-background border border-border/50 rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "grid grid-cols-7 border-b border-border/50 bg-muted/10" }, Array.from({ length: 7 }).map((_, i) => /* @__PURE__ */ import_react17.default.createElement("div", { key: i, className: "py-3 px-2 text-center border-r border-border/30 last:border-r-0" }, /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-4 w-8 mx-auto" })))), /* @__PURE__ */ import_react17.default.createElement("div", { className: "grid grid-cols-7 flex-1" }, Array.from({ length: 35 }).map((_, i) => /* @__PURE__ */ import_react17.default.createElement("div", { key: i, className: "min-h-[120px] border-r border-b border-border/30 p-2" }, /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-4 w-6 mb-2" }), /* @__PURE__ */ import_react17.default.createElement("div", { className: "space-y-1" }, i * 7 % 10 > 4 && /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-5 w-full rounded-md" }), i * 3 % 10 > 6 && /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-5 w-3/4 rounded-md" }))))));
|
|
2966
|
+
var WeekViewSkeleton = () => /* @__PURE__ */ import_react17.default.createElement("div", { className: "h-full bg-background border border-border/50 rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex border-b border-border/50 bg-muted/10" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "w-16 p-3 border-r border-border/30" }, /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-8 w-10 mx-auto" })), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex-1 grid grid-cols-7" }, Array.from({ length: 7 }).map((_, i) => /* @__PURE__ */ import_react17.default.createElement("div", { key: i, className: "py-3 px-2 text-center border-r border-border/30 last:border-r-0" }, /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-3 w-8 mx-auto mb-1" }), /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-8 w-8 mx-auto rounded-xl" }))))), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex flex-1", style: { height: "600px" } }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "w-16 border-r border-border/30" }, Array.from({ length: 10 }).map((_, i) => /* @__PURE__ */ import_react17.default.createElement("div", { key: i, className: "h-[60px] relative" }, /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-4 w-10 absolute right-2 -translate-y-1/2" })))), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex-1 grid grid-cols-7 relative" }, Array.from({ length: 7 }).map((_, colIdx) => /* @__PURE__ */ import_react17.default.createElement("div", { key: colIdx, className: "relative border-r border-border/30 last:border-r-0" }, Array.from({ length: 10 }).map((_2, rowIdx) => /* @__PURE__ */ import_react17.default.createElement("div", { key: rowIdx, className: "h-[60px] border-b border-dashed border-border/20" })), Math.random() > 0.3 && /* @__PURE__ */ import_react17.default.createElement(
|
|
2514
2967
|
Skeleton,
|
|
2515
2968
|
{
|
|
2516
2969
|
className: "absolute rounded-md",
|
|
@@ -2522,23 +2975,23 @@ var WeekViewSkeleton = () => /* @__PURE__ */ import_react15.default.createElemen
|
|
|
2522
2975
|
}
|
|
2523
2976
|
}
|
|
2524
2977
|
))))));
|
|
2525
|
-
var DayViewSkeleton = () => /* @__PURE__ */
|
|
2978
|
+
var DayViewSkeleton = () => /* @__PURE__ */ import_react17.default.createElement("div", { className: "h-full bg-background border border-border/50 rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "px-6 py-4 border-b border-border/50 bg-muted/10 text-center" }, /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-7 w-64 mx-auto" })), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex flex-1", style: { height: "600px" } }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "w-20 border-r border-border/30 bg-muted/5" }, Array.from({ length: 10 }).map((_, i) => /* @__PURE__ */ import_react17.default.createElement("div", { key: i, className: "h-[80px] relative" }, /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-4 w-12 absolute left-1/2 -translate-x-1/2 -translate-y-1/2" })))), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex-1 relative" }, Array.from({ length: 10 }).map((_, i) => /* @__PURE__ */ import_react17.default.createElement("div", { key: i, className: "h-[80px] border-b border-dashed border-border/20" })), /* @__PURE__ */ import_react17.default.createElement(
|
|
2526
2979
|
Skeleton,
|
|
2527
2980
|
{
|
|
2528
2981
|
className: "absolute rounded-lg left-4 right-4",
|
|
2529
2982
|
style: { top: "160px", height: "120px" }
|
|
2530
2983
|
}
|
|
2531
|
-
), /* @__PURE__ */
|
|
2984
|
+
), /* @__PURE__ */ import_react17.default.createElement(
|
|
2532
2985
|
Skeleton,
|
|
2533
2986
|
{
|
|
2534
2987
|
className: "absolute rounded-lg left-4 right-4",
|
|
2535
2988
|
style: { top: "400px", height: "80px" }
|
|
2536
2989
|
}
|
|
2537
2990
|
))));
|
|
2538
|
-
var AgendaViewSkeleton = () => /* @__PURE__ */
|
|
2991
|
+
var AgendaViewSkeleton = () => /* @__PURE__ */ import_react17.default.createElement("div", { className: "h-full bg-background border border-border/50 rounded-2xl overflow-hidden p-6" }, /* @__PURE__ */ import_react17.default.createElement("div", { className: "space-y-6" }, Array.from({ length: 4 }).map((_, dayIdx) => /* @__PURE__ */ import_react17.default.createElement("div", { key: dayIdx }, /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-5 w-40 mb-4" }), /* @__PURE__ */ import_react17.default.createElement("div", { className: "space-y-3" }, Array.from({ length: 2 + Math.floor(Math.random() * 3) }).map((_2, eventIdx) => /* @__PURE__ */ import_react17.default.createElement("div", { key: eventIdx, className: "flex items-center gap-4 p-3 rounded-xl bg-muted/10" }, /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-10 w-10 rounded-lg" }), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex-1 space-y-2" }, /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-4 w-3/4" }), /* @__PURE__ */ import_react17.default.createElement(Skeleton, { className: "h-3 w-1/2" })))))))));
|
|
2539
2992
|
|
|
2540
2993
|
// src/components/ContextMenu.tsx
|
|
2541
|
-
var
|
|
2994
|
+
var import_react18 = __toESM(require("react"));
|
|
2542
2995
|
var import_lucide_react8 = require("lucide-react");
|
|
2543
2996
|
var import_framer_motion3 = require("framer-motion");
|
|
2544
2997
|
var EventContextMenu = ({
|
|
@@ -2551,8 +3004,8 @@ var EventContextMenu = ({
|
|
|
2551
3004
|
customActions = [],
|
|
2552
3005
|
translations
|
|
2553
3006
|
}) => {
|
|
2554
|
-
const menuRef = (0,
|
|
2555
|
-
(0,
|
|
3007
|
+
const menuRef = (0, import_react18.useRef)(null);
|
|
3008
|
+
(0, import_react18.useEffect)(() => {
|
|
2556
3009
|
const handleKeyDown = (e) => {
|
|
2557
3010
|
if (e.key === "Escape") {
|
|
2558
3011
|
onClose();
|
|
@@ -2563,7 +3016,7 @@ var EventContextMenu = ({
|
|
|
2563
3016
|
return () => document.removeEventListener("keydown", handleKeyDown);
|
|
2564
3017
|
}
|
|
2565
3018
|
}, [position, onClose]);
|
|
2566
|
-
(0,
|
|
3019
|
+
(0, import_react18.useEffect)(() => {
|
|
2567
3020
|
const handleClickOutside = (e) => {
|
|
2568
3021
|
if (menuRef.current && !menuRef.current.contains(e.target)) {
|
|
2569
3022
|
onClose();
|
|
@@ -2581,7 +3034,7 @@ var EventContextMenu = ({
|
|
|
2581
3034
|
...onEdit ? [{
|
|
2582
3035
|
id: "edit",
|
|
2583
3036
|
label: translations?.edit || "Edit",
|
|
2584
|
-
icon: /* @__PURE__ */
|
|
3037
|
+
icon: /* @__PURE__ */ import_react18.default.createElement(import_lucide_react8.Edit3, { className: "w-4 h-4" }),
|
|
2585
3038
|
onClick: () => {
|
|
2586
3039
|
onEdit(event);
|
|
2587
3040
|
onClose();
|
|
@@ -2590,7 +3043,7 @@ var EventContextMenu = ({
|
|
|
2590
3043
|
...onDuplicate ? [{
|
|
2591
3044
|
id: "duplicate",
|
|
2592
3045
|
label: translations?.duplicate || "Duplicate",
|
|
2593
|
-
icon: /* @__PURE__ */
|
|
3046
|
+
icon: /* @__PURE__ */ import_react18.default.createElement(import_lucide_react8.Copy, { className: "w-4 h-4" }),
|
|
2594
3047
|
onClick: () => {
|
|
2595
3048
|
onDuplicate(event);
|
|
2596
3049
|
onClose();
|
|
@@ -2600,7 +3053,7 @@ var EventContextMenu = ({
|
|
|
2600
3053
|
...onDelete ? [{
|
|
2601
3054
|
id: "delete",
|
|
2602
3055
|
label: translations?.delete || "Delete",
|
|
2603
|
-
icon: /* @__PURE__ */
|
|
3056
|
+
icon: /* @__PURE__ */ import_react18.default.createElement(import_lucide_react8.Trash2, { className: "w-4 h-4" }),
|
|
2604
3057
|
onClick: () => {
|
|
2605
3058
|
onDelete(event.id);
|
|
2606
3059
|
onClose();
|
|
@@ -2612,7 +3065,7 @@ var EventContextMenu = ({
|
|
|
2612
3065
|
x: Math.min(position.x, window.innerWidth - 200),
|
|
2613
3066
|
y: Math.min(position.y, window.innerHeight - (actions.length * 44 + 80))
|
|
2614
3067
|
};
|
|
2615
|
-
return /* @__PURE__ */
|
|
3068
|
+
return /* @__PURE__ */ import_react18.default.createElement(import_framer_motion3.AnimatePresence, null, /* @__PURE__ */ import_react18.default.createElement(
|
|
2616
3069
|
import_framer_motion3.motion.div,
|
|
2617
3070
|
{
|
|
2618
3071
|
ref: menuRef,
|
|
@@ -2626,14 +3079,14 @@ var EventContextMenu = ({
|
|
|
2626
3079
|
top: adjustedPosition.y
|
|
2627
3080
|
}
|
|
2628
3081
|
},
|
|
2629
|
-
/* @__PURE__ */
|
|
3082
|
+
/* @__PURE__ */ import_react18.default.createElement("div", { className: "px-3 py-2 border-b-[0.5px] border-border bg-muted/30" }, /* @__PURE__ */ import_react18.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react18.default.createElement(
|
|
2630
3083
|
"div",
|
|
2631
3084
|
{
|
|
2632
3085
|
className: "w-2.5 h-2.5 rounded-full shrink-0",
|
|
2633
3086
|
style: { backgroundColor: event.color || "var(--primary)" }
|
|
2634
3087
|
}
|
|
2635
|
-
), /* @__PURE__ */
|
|
2636
|
-
/* @__PURE__ */
|
|
3088
|
+
), /* @__PURE__ */ import_react18.default.createElement("span", { className: "text-sm font-medium truncate text-foreground" }, event.title))),
|
|
3089
|
+
/* @__PURE__ */ import_react18.default.createElement("div", { className: "py-1" }, actions.map((action, index) => /* @__PURE__ */ import_react18.default.createElement(import_react18.default.Fragment, { key: action.id }, index > 0 && action.variant === "danger" && /* @__PURE__ */ import_react18.default.createElement("div", { className: "h-px bg-border my-1" }), /* @__PURE__ */ import_react18.default.createElement(
|
|
2637
3090
|
"button",
|
|
2638
3091
|
{
|
|
2639
3092
|
onClick: action.onClick,
|
|
@@ -2645,13 +3098,13 @@ var EventContextMenu = ({
|
|
|
2645
3098
|
)
|
|
2646
3099
|
},
|
|
2647
3100
|
action.icon,
|
|
2648
|
-
/* @__PURE__ */
|
|
3101
|
+
/* @__PURE__ */ import_react18.default.createElement("span", null, action.label)
|
|
2649
3102
|
))))
|
|
2650
3103
|
));
|
|
2651
3104
|
};
|
|
2652
3105
|
var useEventContextMenu = () => {
|
|
2653
|
-
const [contextMenu, setContextMenu] = (0,
|
|
2654
|
-
const openContextMenu = (0,
|
|
3106
|
+
const [contextMenu, setContextMenu] = (0, import_react18.useState)({ event: null, position: null });
|
|
3107
|
+
const openContextMenu = (0, import_react18.useCallback)((event, e) => {
|
|
2655
3108
|
e.preventDefault();
|
|
2656
3109
|
e.stopPropagation();
|
|
2657
3110
|
setContextMenu({
|
|
@@ -2659,7 +3112,7 @@ var useEventContextMenu = () => {
|
|
|
2659
3112
|
position: { x: e.clientX, y: e.clientY }
|
|
2660
3113
|
});
|
|
2661
3114
|
}, []);
|
|
2662
|
-
const closeContextMenu = (0,
|
|
3115
|
+
const closeContextMenu = (0, import_react18.useCallback)(() => {
|
|
2663
3116
|
setContextMenu({ event: null, position: null });
|
|
2664
3117
|
}, []);
|
|
2665
3118
|
return {
|
|
@@ -2750,11 +3203,11 @@ function getThemeStyles(theme) {
|
|
|
2750
3203
|
}
|
|
2751
3204
|
|
|
2752
3205
|
// src/hooks/useCalendarLogic.ts
|
|
2753
|
-
var
|
|
2754
|
-
var
|
|
3206
|
+
var import_react20 = require("react");
|
|
3207
|
+
var import_date_fns19 = require("date-fns");
|
|
2755
3208
|
|
|
2756
3209
|
// src/core/recurrence.ts
|
|
2757
|
-
var
|
|
3210
|
+
var import_date_fns18 = require("date-fns");
|
|
2758
3211
|
var import_rrule = require("rrule");
|
|
2759
3212
|
var WEEKDAYS = [import_rrule.RRule.MO, import_rrule.RRule.TU, import_rrule.RRule.WE, import_rrule.RRule.TH, import_rrule.RRule.FR, import_rrule.RRule.SA, import_rrule.RRule.SU];
|
|
2760
3213
|
var toFloating = (instant, tz) => {
|
|
@@ -2793,7 +3246,7 @@ function occurrencesInMonth(event, monthStart, tz) {
|
|
|
2793
3246
|
const excluded = new Set((event.recurrence.exdates ?? []).map(minuteKey));
|
|
2794
3247
|
const duration = event.end.getTime() - event.start.getTime();
|
|
2795
3248
|
const from = toFloating(monthStart, tz);
|
|
2796
|
-
const to = toFloating((0,
|
|
3249
|
+
const to = toFloating((0, import_date_fns18.addMonths)(monthStart, 1), tz);
|
|
2797
3250
|
const result = [];
|
|
2798
3251
|
for (const floating of rule.between(from, to, true)) {
|
|
2799
3252
|
if (floating.getTime() === to.getTime()) continue;
|
|
@@ -2831,17 +3284,18 @@ function cachedMonth(event, monthStart, tz) {
|
|
|
2831
3284
|
}
|
|
2832
3285
|
function expandRecurrences(events, range, anchorTz) {
|
|
2833
3286
|
const result = [];
|
|
2834
|
-
const lastMonth = (0, import_date_fns14.startOfMonth)(toDisplay(range.end, anchorTz));
|
|
2835
3287
|
for (const event of events) {
|
|
2836
3288
|
if (!event.recurrence) {
|
|
2837
3289
|
result.push(event);
|
|
2838
3290
|
continue;
|
|
2839
3291
|
}
|
|
3292
|
+
const tz = event.allDay ? void 0 : anchorTz;
|
|
3293
|
+
const lastMonth = (0, import_date_fns18.startOfMonth)(toDisplay(range.end, tz));
|
|
2840
3294
|
const duration = event.end.getTime() - event.start.getTime();
|
|
2841
|
-
const firstMonth = (0,
|
|
3295
|
+
const firstMonth = (0, import_date_fns18.startOfMonth)(toDisplay(new Date(range.start.getTime() - duration), tz));
|
|
2842
3296
|
try {
|
|
2843
|
-
for (let month = firstMonth; month <= lastMonth; month = (0,
|
|
2844
|
-
for (const occurrence of cachedMonth(event, fromDisplay(month,
|
|
3297
|
+
for (let month = firstMonth; month <= lastMonth; month = (0, import_date_fns18.addMonths)(month, 1)) {
|
|
3298
|
+
for (const occurrence of cachedMonth(event, fromDisplay(month, tz), tz)) {
|
|
2845
3299
|
if (occurrence.end >= range.start && occurrence.start <= range.end) result.push(occurrence);
|
|
2846
3300
|
}
|
|
2847
3301
|
}
|
|
@@ -2857,8 +3311,8 @@ function stripOccurrenceFields(event) {
|
|
|
2857
3311
|
return rest;
|
|
2858
3312
|
}
|
|
2859
3313
|
var shiftFloating = (instant, deltaMs, tz) => fromFloating(new Date(toFloating(instant, tz).getTime() + deltaMs), tz);
|
|
2860
|
-
var
|
|
2861
|
-
var floatingDay = (floating) => Math.floor(floating.getTime() /
|
|
3314
|
+
var DAY_MS2 = 24 * 60 * 60 * 1e3;
|
|
3315
|
+
var floatingDay = (floating) => Math.floor(floating.getTime() / DAY_MS2);
|
|
2862
3316
|
function shiftSeries(master, occurrence, newStart, newEnd, anchorTz) {
|
|
2863
3317
|
const fromFloat = toFloating(occurrence.start, anchorTz);
|
|
2864
3318
|
const toFloat = toFloating(newStart, anchorTz);
|
|
@@ -2880,23 +3334,23 @@ function excludeOccurrence(master, occurrenceStart) {
|
|
|
2880
3334
|
}
|
|
2881
3335
|
|
|
2882
3336
|
// src/hooks/useStableCallback.ts
|
|
2883
|
-
var
|
|
3337
|
+
var import_react19 = require("react");
|
|
2884
3338
|
function useStableCallback(fn) {
|
|
2885
|
-
const ref = (0,
|
|
2886
|
-
(0,
|
|
3339
|
+
const ref = (0, import_react19.useRef)(fn);
|
|
3340
|
+
(0, import_react19.useInsertionEffect)(() => {
|
|
2887
3341
|
ref.current = fn;
|
|
2888
3342
|
});
|
|
2889
|
-
return (0,
|
|
3343
|
+
return (0, import_react19.useCallback)((...args) => ref.current(...args), []);
|
|
2890
3344
|
}
|
|
2891
3345
|
|
|
2892
3346
|
// src/hooks/useCalendarLogic.ts
|
|
2893
3347
|
function expansionRange(monthStart) {
|
|
2894
3348
|
return {
|
|
2895
|
-
start: (0,
|
|
2896
|
-
end: (0,
|
|
3349
|
+
start: (0, import_date_fns19.startOfWeek)((0, import_date_fns19.startOfMonth)((0, import_date_fns19.subMonths)(monthStart, 1))),
|
|
3350
|
+
end: (0, import_date_fns19.addDays)((0, import_date_fns19.endOfMonth)((0, import_date_fns19.addMonths)(monthStart, 1)), 37)
|
|
2897
3351
|
};
|
|
2898
3352
|
}
|
|
2899
|
-
var
|
|
3353
|
+
var DAY_MS3 = 24 * 60 * 60 * 1e3;
|
|
2900
3354
|
var useCalendarLogic = ({
|
|
2901
3355
|
events,
|
|
2902
3356
|
view: controlledView,
|
|
@@ -2913,19 +3367,20 @@ var useCalendarLogic = ({
|
|
|
2913
3367
|
readOnly,
|
|
2914
3368
|
timezone
|
|
2915
3369
|
}) => {
|
|
2916
|
-
const [internalView, setInternalView] = (0,
|
|
2917
|
-
const [internalDate, setInternalDate] = (0,
|
|
2918
|
-
const [isSidebarOpen, setIsSidebarOpen] = (0,
|
|
2919
|
-
const [isModalOpen, setIsModalOpen] = (0,
|
|
2920
|
-
const [selectedEvent, setSelectedEvent] = (0,
|
|
2921
|
-
const [modalInitialDate, setModalInitialDate] = (0,
|
|
2922
|
-
const [modalInitialResourceId, setModalInitialResourceId] = (0,
|
|
3370
|
+
const [internalView, setInternalView] = (0, import_react20.useState)("week");
|
|
3371
|
+
const [internalDate, setInternalDate] = (0, import_react20.useState)(() => /* @__PURE__ */ new Date());
|
|
3372
|
+
const [isSidebarOpen, setIsSidebarOpen] = (0, import_react20.useState)(true);
|
|
3373
|
+
const [isModalOpen, setIsModalOpen] = (0, import_react20.useState)(false);
|
|
3374
|
+
const [selectedEvent, setSelectedEvent] = (0, import_react20.useState)(null);
|
|
3375
|
+
const [modalInitialDate, setModalInitialDate] = (0, import_react20.useState)(void 0);
|
|
3376
|
+
const [modalInitialResourceId, setModalInitialResourceId] = (0, import_react20.useState)(void 0);
|
|
3377
|
+
const [modalInitialAllDay, setModalInitialAllDay] = (0, import_react20.useState)(false);
|
|
2923
3378
|
const view = controlledView ?? internalView;
|
|
2924
3379
|
const currentDate = controlledDate ?? internalDate;
|
|
2925
|
-
const normalizedEvents = (0,
|
|
2926
|
-
const monthKey = (0,
|
|
2927
|
-
const range = (0,
|
|
2928
|
-
const expandedEvents = (0,
|
|
3380
|
+
const normalizedEvents = (0, import_react20.useMemo)(() => normalizeEvents(events), [events]);
|
|
3381
|
+
const monthKey = (0, import_date_fns19.format)(currentDate, "yyyy-MM");
|
|
3382
|
+
const range = (0, import_react20.useMemo)(() => expansionRange(/* @__PURE__ */ new Date(`${monthKey}-01T00:00:00`)), [monthKey]);
|
|
3383
|
+
const expandedEvents = (0, import_react20.useMemo)(
|
|
2929
3384
|
() => expandRecurrences(normalizedEvents, range, timezone),
|
|
2930
3385
|
[normalizedEvents, range, timezone]
|
|
2931
3386
|
);
|
|
@@ -2947,34 +3402,34 @@ var useCalendarLogic = ({
|
|
|
2947
3402
|
const handlePrev = useStableCallback(() => {
|
|
2948
3403
|
switch (view) {
|
|
2949
3404
|
case "month":
|
|
2950
|
-
handleDateChange((0,
|
|
3405
|
+
handleDateChange((0, import_date_fns19.subMonths)(currentDate, 1));
|
|
2951
3406
|
break;
|
|
2952
3407
|
case "week":
|
|
2953
|
-
handleDateChange((0,
|
|
3408
|
+
handleDateChange((0, import_date_fns19.subWeeks)(currentDate, 1));
|
|
2954
3409
|
break;
|
|
2955
3410
|
case "day":
|
|
2956
3411
|
case "resource":
|
|
2957
|
-
handleDateChange((0,
|
|
3412
|
+
handleDateChange((0, import_date_fns19.subDays)(currentDate, 1));
|
|
2958
3413
|
break;
|
|
2959
3414
|
case "agenda":
|
|
2960
|
-
handleDateChange((0,
|
|
3415
|
+
handleDateChange((0, import_date_fns19.subDays)(currentDate, 7));
|
|
2961
3416
|
break;
|
|
2962
3417
|
}
|
|
2963
3418
|
});
|
|
2964
3419
|
const handleNext = useStableCallback(() => {
|
|
2965
3420
|
switch (view) {
|
|
2966
3421
|
case "month":
|
|
2967
|
-
handleDateChange((0,
|
|
3422
|
+
handleDateChange((0, import_date_fns19.addMonths)(currentDate, 1));
|
|
2968
3423
|
break;
|
|
2969
3424
|
case "week":
|
|
2970
|
-
handleDateChange((0,
|
|
3425
|
+
handleDateChange((0, import_date_fns19.addWeeks)(currentDate, 1));
|
|
2971
3426
|
break;
|
|
2972
3427
|
case "day":
|
|
2973
3428
|
case "resource":
|
|
2974
|
-
handleDateChange((0,
|
|
3429
|
+
handleDateChange((0, import_date_fns19.addDays)(currentDate, 1));
|
|
2975
3430
|
break;
|
|
2976
3431
|
case "agenda":
|
|
2977
|
-
handleDateChange((0,
|
|
3432
|
+
handleDateChange((0, import_date_fns19.addDays)(currentDate, 7));
|
|
2978
3433
|
break;
|
|
2979
3434
|
}
|
|
2980
3435
|
});
|
|
@@ -2990,6 +3445,15 @@ var useCalendarLogic = ({
|
|
|
2990
3445
|
setSelectedEvent(null);
|
|
2991
3446
|
setModalInitialDate(date);
|
|
2992
3447
|
setModalInitialResourceId(resourceId);
|
|
3448
|
+
setModalInitialAllDay(false);
|
|
3449
|
+
setIsModalOpen(true);
|
|
3450
|
+
});
|
|
3451
|
+
const handleAllDaySlotClick = useStableCallback((day) => {
|
|
3452
|
+
if (readOnly) return;
|
|
3453
|
+
setSelectedEvent(null);
|
|
3454
|
+
setModalInitialDate(day);
|
|
3455
|
+
setModalInitialResourceId(void 0);
|
|
3456
|
+
setModalInitialAllDay(true);
|
|
2993
3457
|
setIsModalOpen(true);
|
|
2994
3458
|
});
|
|
2995
3459
|
const handleEventClickInternal = useStableCallback((event) => {
|
|
@@ -2998,6 +3462,7 @@ var useCalendarLogic = ({
|
|
|
2998
3462
|
setSelectedEvent(event);
|
|
2999
3463
|
setModalInitialDate(void 0);
|
|
3000
3464
|
setModalInitialResourceId(void 0);
|
|
3465
|
+
setModalInitialAllDay(false);
|
|
3001
3466
|
setIsModalOpen(true);
|
|
3002
3467
|
}
|
|
3003
3468
|
});
|
|
@@ -3006,6 +3471,7 @@ var useCalendarLogic = ({
|
|
|
3006
3471
|
setSelectedEvent(null);
|
|
3007
3472
|
setModalInitialDate(/* @__PURE__ */ new Date());
|
|
3008
3473
|
setModalInitialResourceId(void 0);
|
|
3474
|
+
setModalInitialAllDay(false);
|
|
3009
3475
|
setIsModalOpen(true);
|
|
3010
3476
|
});
|
|
3011
3477
|
const handleModalSave = useStableCallback((eventData) => {
|
|
@@ -3020,7 +3486,7 @@ var useCalendarLogic = ({
|
|
|
3020
3486
|
end: master.end
|
|
3021
3487
|
};
|
|
3022
3488
|
onEventUpdate?.(
|
|
3023
|
-
shiftSeries(edited, selectedEvent, eventData.start ?? selectedEvent.start, eventData.end ?? selectedEvent.end, timezone)
|
|
3489
|
+
shiftSeries(edited, selectedEvent, eventData.start ?? selectedEvent.start, eventData.end ?? selectedEvent.end, edited.allDay ? void 0 : timezone)
|
|
3024
3490
|
);
|
|
3025
3491
|
} else if (selectedEvent) {
|
|
3026
3492
|
onEventUpdate?.({ ...eventData, id: selectedEvent.id });
|
|
@@ -3055,15 +3521,15 @@ var useCalendarLogic = ({
|
|
|
3055
3521
|
...copy,
|
|
3056
3522
|
id: `${event.originalEventId ?? event.id}-copy-${Date.now()}`,
|
|
3057
3523
|
title: `${event.title} (Copy)`,
|
|
3058
|
-
start: new Date(event.start.getTime() +
|
|
3059
|
-
end: new Date(event.end.getTime() +
|
|
3524
|
+
start: new Date(event.start.getTime() + DAY_MS3),
|
|
3525
|
+
end: new Date(event.end.getTime() + DAY_MS3)
|
|
3060
3526
|
});
|
|
3061
3527
|
});
|
|
3062
3528
|
const applyChange = (event, start, end) => {
|
|
3063
3529
|
if (!event.originalEventId) return { original: event, updated: { ...event, start, end } };
|
|
3064
3530
|
const master = masterOf(event);
|
|
3065
3531
|
if (!master) return null;
|
|
3066
|
-
return { original: master, updated: shiftSeries(master, event, start, end, timezone) };
|
|
3532
|
+
return { original: master, updated: shiftSeries(master, event, start, end, event.allDay ? void 0 : timezone) };
|
|
3067
3533
|
};
|
|
3068
3534
|
const handleDragEnd = useStableCallback((dragEvent) => {
|
|
3069
3535
|
if (readOnly) return;
|
|
@@ -3072,12 +3538,22 @@ var useCalendarLogic = ({
|
|
|
3072
3538
|
const dragged = active.data.current?.event;
|
|
3073
3539
|
const overDate = over.data.current?.date;
|
|
3074
3540
|
if (!dragged || !overDate) return;
|
|
3541
|
+
const grabDayOffset = active.data.current?.grabDayOffset;
|
|
3542
|
+
if (grabDayOffset !== void 0) {
|
|
3543
|
+
const move = computeDayMove(dragged, overDate, grabDayOffset, timezone);
|
|
3544
|
+
const dayChange = move && applyChange(dragged, move.start, move.end);
|
|
3545
|
+
if (!dayChange) return;
|
|
3546
|
+
onEventDrop?.(dayChange.original, dayChange.updated.start, dayChange.updated.end);
|
|
3547
|
+
onEventUpdate?.(dayChange.updated);
|
|
3548
|
+
return;
|
|
3549
|
+
}
|
|
3075
3550
|
const drop = computeDrop({
|
|
3076
3551
|
event: dragged,
|
|
3077
3552
|
overDate,
|
|
3078
3553
|
overResourceId: over.data.current?.resourceId,
|
|
3079
3554
|
grabOffsetMs: active.data.current?.grabOffsetMs,
|
|
3080
|
-
view
|
|
3555
|
+
// A timed event dropped in the all-day row only changes day (keeps its time), like in month view.
|
|
3556
|
+
view: over.data.current?.allDayRow ? "month" : view,
|
|
3081
3557
|
tz: timezone
|
|
3082
3558
|
});
|
|
3083
3559
|
if (!drop) return;
|
|
@@ -3087,6 +3563,14 @@ var useCalendarLogic = ({
|
|
|
3087
3563
|
onEventDrop?.(change.original, updated.start, updated.end);
|
|
3088
3564
|
onEventUpdate?.(updated);
|
|
3089
3565
|
});
|
|
3566
|
+
const handleDayEventResize = useStableCallback((event, newLastDay) => {
|
|
3567
|
+
if (readOnly) return;
|
|
3568
|
+
const end = computeDayResize(event, newLastDay, timezone);
|
|
3569
|
+
const change = end && applyChange(event, event.start, end);
|
|
3570
|
+
if (!change) return;
|
|
3571
|
+
onEventResize?.(change.original, change.updated.start, change.updated.end);
|
|
3572
|
+
onEventUpdate?.(change.updated);
|
|
3573
|
+
});
|
|
3090
3574
|
const handleEventResize = useStableCallback((event, newEnd) => {
|
|
3091
3575
|
if (readOnly) return;
|
|
3092
3576
|
const change = applyChange(event, event.start, newEnd);
|
|
@@ -3103,6 +3587,7 @@ var useCalendarLogic = ({
|
|
|
3103
3587
|
setIsModalOpen,
|
|
3104
3588
|
selectedEvent,
|
|
3105
3589
|
modalInitialDate,
|
|
3590
|
+
modalInitialAllDay,
|
|
3106
3591
|
expandedEvents,
|
|
3107
3592
|
handleViewChange,
|
|
3108
3593
|
handleDateChange,
|
|
@@ -3111,6 +3596,7 @@ var useCalendarLogic = ({
|
|
|
3111
3596
|
handleToday,
|
|
3112
3597
|
handleDateClick,
|
|
3113
3598
|
handleTimeSlotClick,
|
|
3599
|
+
handleAllDaySlotClick,
|
|
3114
3600
|
handleEventClickInternal,
|
|
3115
3601
|
handleCreateEvent,
|
|
3116
3602
|
handleModalSave,
|
|
@@ -3118,15 +3604,16 @@ var useCalendarLogic = ({
|
|
|
3118
3604
|
handleEventDelete,
|
|
3119
3605
|
handleEventDuplicate,
|
|
3120
3606
|
handleEventResize,
|
|
3607
|
+
handleDayEventResize,
|
|
3121
3608
|
handleDragEnd
|
|
3122
3609
|
};
|
|
3123
3610
|
};
|
|
3124
3611
|
|
|
3125
3612
|
// src/index.tsx
|
|
3126
|
-
var
|
|
3613
|
+
var import_date_fns21 = require("date-fns");
|
|
3127
3614
|
|
|
3128
3615
|
// src/hooks/useSwipeGesture.ts
|
|
3129
|
-
var
|
|
3616
|
+
var import_react21 = require("react");
|
|
3130
3617
|
var useSwipeGesture = (options) => {
|
|
3131
3618
|
const {
|
|
3132
3619
|
onSwipeLeft,
|
|
@@ -3138,9 +3625,9 @@ var useSwipeGesture = (options) => {
|
|
|
3138
3625
|
allowedTime = 500,
|
|
3139
3626
|
enabled = true
|
|
3140
3627
|
} = options;
|
|
3141
|
-
const touchInfoRef = (0,
|
|
3142
|
-
const elementRef = (0,
|
|
3143
|
-
const handleTouchStart = (0,
|
|
3628
|
+
const touchInfoRef = (0, import_react21.useRef)(null);
|
|
3629
|
+
const elementRef = (0, import_react21.useRef)(null);
|
|
3630
|
+
const handleTouchStart = (0, import_react21.useCallback)((e) => {
|
|
3144
3631
|
if (!enabled) return;
|
|
3145
3632
|
const touch = e.touches[0];
|
|
3146
3633
|
touchInfoRef.current = {
|
|
@@ -3149,7 +3636,7 @@ var useSwipeGesture = (options) => {
|
|
|
3149
3636
|
startTime: Date.now()
|
|
3150
3637
|
};
|
|
3151
3638
|
}, [enabled]);
|
|
3152
|
-
const handleTouchEnd = (0,
|
|
3639
|
+
const handleTouchEnd = (0, import_react21.useCallback)((e) => {
|
|
3153
3640
|
if (!enabled || !touchInfoRef.current) return;
|
|
3154
3641
|
const touch = e.changedTouches[0];
|
|
3155
3642
|
const { startX, startY, startTime } = touchInfoRef.current;
|
|
@@ -3173,7 +3660,7 @@ var useSwipeGesture = (options) => {
|
|
|
3173
3660
|
}
|
|
3174
3661
|
touchInfoRef.current = null;
|
|
3175
3662
|
}, [enabled, threshold, restraint, allowedTime, onSwipeLeft, onSwipeRight, onSwipeUp, onSwipeDown]);
|
|
3176
|
-
(0,
|
|
3663
|
+
(0, import_react21.useEffect)(() => {
|
|
3177
3664
|
const element = elementRef.current;
|
|
3178
3665
|
if (!element) return;
|
|
3179
3666
|
element.addEventListener("touchstart", handleTouchStart, { passive: true });
|
|
@@ -3196,6 +3683,25 @@ var useViewSwipe = (onPrev, onNext, enabled = true) => {
|
|
|
3196
3683
|
});
|
|
3197
3684
|
};
|
|
3198
3685
|
|
|
3686
|
+
// src/components/dnd/dragOverlay.ts
|
|
3687
|
+
var import_core4 = require("@dnd-kit/core");
|
|
3688
|
+
var import_date_fns20 = require("date-fns");
|
|
3689
|
+
var dayAwareCollision = (args) => {
|
|
3690
|
+
if (args.active.data.current?.grabDayOffset !== void 0) {
|
|
3691
|
+
const underPointer = (0, import_core4.pointerWithin)(args);
|
|
3692
|
+
if (underPointer.length > 0) return underPointer;
|
|
3693
|
+
}
|
|
3694
|
+
return (0, import_core4.rectIntersection)(args);
|
|
3695
|
+
};
|
|
3696
|
+
function dragOverlaySize(view, event, isDayDrag) {
|
|
3697
|
+
if (isDayDrag) return {};
|
|
3698
|
+
const minutes = (0, import_date_fns20.differenceInMinutes)(event.end, event.start);
|
|
3699
|
+
if (view === "month") return { width: "100%" };
|
|
3700
|
+
if (view === "resource") return { width: `${Math.max(minutes / 60 * 100, 4)}px`, height: 80 };
|
|
3701
|
+
if (view === "week" || view === "day") return { width: "150px", height: minutes / 60 * (view === "day" ? 80 : 60) };
|
|
3702
|
+
return { width: "150px" };
|
|
3703
|
+
}
|
|
3704
|
+
|
|
3199
3705
|
// src/index.tsx
|
|
3200
3706
|
var Scheduler = ({
|
|
3201
3707
|
events = [],
|
|
@@ -3231,7 +3737,8 @@ var Scheduler = ({
|
|
|
3231
3737
|
locale
|
|
3232
3738
|
// Date-fns locale
|
|
3233
3739
|
}) => {
|
|
3234
|
-
const [activeDragEvent, setActiveDragEvent] = (0,
|
|
3740
|
+
const [activeDragEvent, setActiveDragEvent] = (0, import_react22.useState)(null);
|
|
3741
|
+
const [activeDayDrag, setActiveDayDrag] = (0, import_react22.useState)(false);
|
|
3235
3742
|
const {
|
|
3236
3743
|
contextMenuEvent,
|
|
3237
3744
|
contextMenuPosition,
|
|
@@ -3247,6 +3754,7 @@ var Scheduler = ({
|
|
|
3247
3754
|
setIsModalOpen,
|
|
3248
3755
|
selectedEvent,
|
|
3249
3756
|
modalInitialDate,
|
|
3757
|
+
modalInitialAllDay,
|
|
3250
3758
|
handleViewChange,
|
|
3251
3759
|
handleDateChange,
|
|
3252
3760
|
handlePrev,
|
|
@@ -3254,6 +3762,7 @@ var Scheduler = ({
|
|
|
3254
3762
|
handleToday,
|
|
3255
3763
|
handleDateClick,
|
|
3256
3764
|
handleTimeSlotClick,
|
|
3765
|
+
handleAllDaySlotClick,
|
|
3257
3766
|
handleEventClickInternal,
|
|
3258
3767
|
handleCreateEvent,
|
|
3259
3768
|
handleModalSave,
|
|
@@ -3261,6 +3770,7 @@ var Scheduler = ({
|
|
|
3261
3770
|
handleEventDelete,
|
|
3262
3771
|
handleEventDuplicate,
|
|
3263
3772
|
handleEventResize,
|
|
3773
|
+
handleDayEventResize,
|
|
3264
3774
|
handleDragEnd,
|
|
3265
3775
|
expandedEvents
|
|
3266
3776
|
} = useCalendarLogic({
|
|
@@ -3279,8 +3789,8 @@ var Scheduler = ({
|
|
|
3279
3789
|
readOnly,
|
|
3280
3790
|
timezone
|
|
3281
3791
|
});
|
|
3282
|
-
const sensors = (0,
|
|
3283
|
-
(0,
|
|
3792
|
+
const sensors = (0, import_core5.useSensors)(
|
|
3793
|
+
(0, import_core5.useSensor)(import_core5.PointerSensor, {
|
|
3284
3794
|
activationConstraint: {
|
|
3285
3795
|
distance: 8
|
|
3286
3796
|
}
|
|
@@ -3290,64 +3800,49 @@ var Scheduler = ({
|
|
|
3290
3800
|
const snapToGrid = (0, import_modifiers.createSnapModifier)(gridSize);
|
|
3291
3801
|
const modifiers = [snapToGrid, import_modifiers.restrictToWindowEdges];
|
|
3292
3802
|
const dndSensors = readOnly ? [] : sensors;
|
|
3293
|
-
const id = (0,
|
|
3803
|
+
const id = (0, import_react22.useId)();
|
|
3294
3804
|
const swipeRef = useViewSwipe(handlePrev, handleNext, true);
|
|
3295
|
-
const t = (0,
|
|
3805
|
+
const t = (0, import_react22.useMemo)(() => resolveTranslations(language, translations), [language, translations]);
|
|
3296
3806
|
const overlayTimeFormat = timeFormats(locale).time;
|
|
3297
|
-
const handleDragStart = (0,
|
|
3807
|
+
const handleDragStart = (0, import_react22.useCallback)((event) => {
|
|
3298
3808
|
const draggedEvent = event.active.data.current?.event;
|
|
3299
3809
|
if (draggedEvent) {
|
|
3300
3810
|
setActiveDragEvent(draggedEvent);
|
|
3811
|
+
setActiveDayDrag(event.active.data.current?.grabDayOffset !== void 0);
|
|
3301
3812
|
}
|
|
3302
3813
|
}, []);
|
|
3303
|
-
const onDragEndWrapper = (0,
|
|
3814
|
+
const onDragEndWrapper = (0, import_react22.useCallback)((event) => {
|
|
3304
3815
|
setActiveDragEvent(null);
|
|
3305
3816
|
handleDragEnd(event);
|
|
3306
3817
|
}, [handleDragEnd]);
|
|
3307
|
-
const
|
|
3308
|
-
if (!activeDragEvent) return void 0;
|
|
3309
|
-
if (view === "resource") {
|
|
3310
|
-
return 80;
|
|
3311
|
-
}
|
|
3312
|
-
if (view !== "week" && view !== "day") return void 0;
|
|
3313
|
-
const duration = (0, import_date_fns16.differenceInMinutes)(activeDragEvent.end, activeDragEvent.start);
|
|
3314
|
-
const hourHeight = view === "day" ? 80 : 60;
|
|
3315
|
-
return duration / 60 * hourHeight;
|
|
3316
|
-
};
|
|
3317
|
-
const getDragWidth = () => {
|
|
3318
|
-
if (view === "month") return "100%";
|
|
3319
|
-
if (view === "resource" && activeDragEvent) {
|
|
3320
|
-
const duration = (0, import_date_fns16.differenceInMinutes)(activeDragEvent.end, activeDragEvent.start);
|
|
3321
|
-
const width = duration / 60 * 100;
|
|
3322
|
-
return `${Math.max(width, 4)}px`;
|
|
3323
|
-
}
|
|
3324
|
-
return "150px";
|
|
3325
|
-
};
|
|
3818
|
+
const dragSize = activeDragEvent ? dragOverlaySize(view, activeDragEvent, activeDayDrag) : {};
|
|
3326
3819
|
const activeCalendarKey = calendars ? calendars.filter((c) => c.active !== false).map((c) => c.id).join("\0") : null;
|
|
3327
|
-
const filteredEvents = (0,
|
|
3820
|
+
const filteredEvents = (0, import_react22.useMemo)(() => {
|
|
3328
3821
|
if (activeCalendarKey === null) return expandedEvents;
|
|
3329
3822
|
const activeCalendarIds = new Set(activeCalendarKey.split("\0"));
|
|
3330
3823
|
return expandedEvents.filter((e) => !e.calendarId || activeCalendarIds.has(String(e.calendarId)));
|
|
3331
3824
|
}, [expandedEvents, activeCalendarKey]);
|
|
3332
|
-
const periodKey = view === "month" ? (0,
|
|
3825
|
+
const periodKey = view === "month" ? (0, import_date_fns21.format)(currentDate, "yyyy-MM") : view === "week" ? (0, import_date_fns21.format)((0, import_date_fns21.startOfWeek)(currentDate, { weekStartsOn: resolveWeekStartsOn(locale, 1) }), "yyyy-MM-dd") : (0, import_date_fns21.format)(currentDate, "yyyy-MM-dd");
|
|
3333
3826
|
const slotClickHandler = readOnly ? void 0 : handleTimeSlotClick;
|
|
3827
|
+
const allDaySlotClickHandler = readOnly ? void 0 : handleAllDaySlotClick;
|
|
3334
3828
|
const contextMenuHandler = readOnly ? void 0 : openContextMenu;
|
|
3335
|
-
return /* @__PURE__ */
|
|
3336
|
-
|
|
3829
|
+
return /* @__PURE__ */ import_react22.default.createElement(
|
|
3830
|
+
import_core5.DndContext,
|
|
3337
3831
|
{
|
|
3338
3832
|
id,
|
|
3339
3833
|
sensors: dndSensors,
|
|
3340
3834
|
onDragStart: handleDragStart,
|
|
3341
3835
|
onDragEnd: onDragEndWrapper,
|
|
3342
|
-
modifiers
|
|
3836
|
+
modifiers,
|
|
3837
|
+
collisionDetection: dayAwareCollision
|
|
3343
3838
|
},
|
|
3344
|
-
/* @__PURE__ */
|
|
3839
|
+
/* @__PURE__ */ import_react22.default.createElement(
|
|
3345
3840
|
"div",
|
|
3346
3841
|
{
|
|
3347
3842
|
className: cn("flex flex-col h-full bg-background text-foreground relative", className),
|
|
3348
3843
|
style: getThemeStyles(theme)
|
|
3349
3844
|
},
|
|
3350
|
-
/* @__PURE__ */
|
|
3845
|
+
/* @__PURE__ */ import_react22.default.createElement(
|
|
3351
3846
|
CalendarHeader,
|
|
3352
3847
|
{
|
|
3353
3848
|
currentDate,
|
|
@@ -3366,7 +3861,7 @@ var Scheduler = ({
|
|
|
3366
3861
|
locale
|
|
3367
3862
|
}
|
|
3368
3863
|
),
|
|
3369
|
-
/* @__PURE__ */
|
|
3864
|
+
/* @__PURE__ */ import_react22.default.createElement("div", { className: "flex flex-1 overflow-hidden" }, /* @__PURE__ */ import_react22.default.createElement(
|
|
3370
3865
|
import_framer_motion4.motion.div,
|
|
3371
3866
|
{
|
|
3372
3867
|
className: cn(
|
|
@@ -3382,7 +3877,7 @@ var Scheduler = ({
|
|
|
3382
3877
|
ease: [0.4, 0, 0.2, 1]
|
|
3383
3878
|
}
|
|
3384
3879
|
},
|
|
3385
|
-
/* @__PURE__ */
|
|
3880
|
+
/* @__PURE__ */ import_react22.default.createElement(
|
|
3386
3881
|
Sidebar,
|
|
3387
3882
|
{
|
|
3388
3883
|
currentDate,
|
|
@@ -3399,7 +3894,7 @@ var Scheduler = ({
|
|
|
3399
3894
|
locale
|
|
3400
3895
|
}
|
|
3401
3896
|
)
|
|
3402
|
-
), /* @__PURE__ */
|
|
3897
|
+
), /* @__PURE__ */ import_react22.default.createElement("div", { className: "flex-1 flex flex-col overflow-hidden relative" }, isLoading ? /* @__PURE__ */ import_react22.default.createElement("div", { className: "flex-1 overflow-auto p-0 md:p-4" }, /* @__PURE__ */ import_react22.default.createElement("div", { className: "h-full min-w-full" }, view === "month" && /* @__PURE__ */ import_react22.default.createElement(MonthViewSkeleton, null), view === "week" && /* @__PURE__ */ import_react22.default.createElement(WeekViewSkeleton, null), view === "day" && /* @__PURE__ */ import_react22.default.createElement(DayViewSkeleton, null), view === "agenda" && /* @__PURE__ */ import_react22.default.createElement(AgendaViewSkeleton, null), view === "resource" && /* @__PURE__ */ import_react22.default.createElement(WeekViewSkeleton, null))) : /* @__PURE__ */ import_react22.default.createElement("div", { ref: swipeRef, className: "flex-1 overflow-auto p-0 md:p-4 touch-pan-y" }, /* @__PURE__ */ import_react22.default.createElement("div", { className: "h-full min-w-full" }, /* @__PURE__ */ import_react22.default.createElement(import_framer_motion4.AnimatePresence, { mode: "wait", initial: false }, /* @__PURE__ */ import_react22.default.createElement(
|
|
3403
3898
|
import_framer_motion4.motion.div,
|
|
3404
3899
|
{
|
|
3405
3900
|
key: `${view}-${periodKey}-${timezone || "local"}`,
|
|
@@ -3424,7 +3919,7 @@ var Scheduler = ({
|
|
|
3424
3919
|
},
|
|
3425
3920
|
className: "h-full"
|
|
3426
3921
|
},
|
|
3427
|
-
view === "month" && /* @__PURE__ */
|
|
3922
|
+
view === "month" && /* @__PURE__ */ import_react22.default.createElement(
|
|
3428
3923
|
MonthView,
|
|
3429
3924
|
{
|
|
3430
3925
|
currentDate,
|
|
@@ -3434,10 +3929,12 @@ var Scheduler = ({
|
|
|
3434
3929
|
timezone,
|
|
3435
3930
|
locale,
|
|
3436
3931
|
translations: t,
|
|
3437
|
-
onEventContextMenu: contextMenuHandler
|
|
3932
|
+
onEventContextMenu: contextMenuHandler,
|
|
3933
|
+
onDayEventResize: handleDayEventResize,
|
|
3934
|
+
readonly: readOnly
|
|
3438
3935
|
}
|
|
3439
3936
|
),
|
|
3440
|
-
view === "week" && /* @__PURE__ */
|
|
3937
|
+
view === "week" && /* @__PURE__ */ import_react22.default.createElement(
|
|
3441
3938
|
WeekView,
|
|
3442
3939
|
{
|
|
3443
3940
|
currentDate,
|
|
@@ -3448,10 +3945,13 @@ var Scheduler = ({
|
|
|
3448
3945
|
timezone,
|
|
3449
3946
|
locale,
|
|
3450
3947
|
readonly: readOnly,
|
|
3451
|
-
onEventContextMenu: contextMenuHandler
|
|
3948
|
+
onEventContextMenu: contextMenuHandler,
|
|
3949
|
+
onDayEventResize: handleDayEventResize,
|
|
3950
|
+
onAllDaySlotClick: allDaySlotClickHandler,
|
|
3951
|
+
translations: t
|
|
3452
3952
|
}
|
|
3453
3953
|
),
|
|
3454
|
-
view === "day" && /* @__PURE__ */
|
|
3954
|
+
view === "day" && /* @__PURE__ */ import_react22.default.createElement(
|
|
3455
3955
|
DayView,
|
|
3456
3956
|
{
|
|
3457
3957
|
currentDate,
|
|
@@ -3463,10 +3963,12 @@ var Scheduler = ({
|
|
|
3463
3963
|
locale,
|
|
3464
3964
|
readonly: readOnly,
|
|
3465
3965
|
translations: t,
|
|
3466
|
-
onEventContextMenu: contextMenuHandler
|
|
3966
|
+
onEventContextMenu: contextMenuHandler,
|
|
3967
|
+
onDayEventResize: handleDayEventResize,
|
|
3968
|
+
onAllDaySlotClick: allDaySlotClickHandler
|
|
3467
3969
|
}
|
|
3468
3970
|
),
|
|
3469
|
-
view === "agenda" && /* @__PURE__ */
|
|
3971
|
+
view === "agenda" && /* @__PURE__ */ import_react22.default.createElement(
|
|
3470
3972
|
AgendaView,
|
|
3471
3973
|
{
|
|
3472
3974
|
currentDate,
|
|
@@ -3479,7 +3981,7 @@ var Scheduler = ({
|
|
|
3479
3981
|
onEventContextMenu: contextMenuHandler
|
|
3480
3982
|
}
|
|
3481
3983
|
),
|
|
3482
|
-
view === "resource" && resources && /* @__PURE__ */
|
|
3984
|
+
view === "resource" && resources && /* @__PURE__ */ import_react22.default.createElement(
|
|
3483
3985
|
ResourceView,
|
|
3484
3986
|
{
|
|
3485
3987
|
currentDate,
|
|
@@ -3493,23 +3995,24 @@ var Scheduler = ({
|
|
|
3493
3995
|
onEventContextMenu: contextMenuHandler
|
|
3494
3996
|
}
|
|
3495
3997
|
)
|
|
3496
|
-
)))), !readOnly && /* @__PURE__ */
|
|
3998
|
+
)))), !readOnly && /* @__PURE__ */ import_react22.default.createElement("div", { className: "md:hidden absolute bottom-6 right-6 z-50" }, /* @__PURE__ */ import_react22.default.createElement(
|
|
3497
3999
|
"button",
|
|
3498
4000
|
{
|
|
3499
4001
|
onClick: handleCreateEvent,
|
|
3500
4002
|
"aria-label": t.createEvent,
|
|
3501
4003
|
className: "w-14 h-14 bg-blue-600 rounded-full shadow-lg flex items-center justify-center text-white active:scale-90 transition-transform"
|
|
3502
4004
|
},
|
|
3503
|
-
/* @__PURE__ */
|
|
4005
|
+
/* @__PURE__ */ import_react22.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ import_react22.default.createElement("path", { d: "M5 12h14" }), /* @__PURE__ */ import_react22.default.createElement("path", { d: "M12 5v14" }))
|
|
3504
4006
|
)))),
|
|
3505
4007
|
renderEventForm ? renderEventForm({
|
|
3506
4008
|
isOpen: isModalOpen,
|
|
3507
4009
|
onClose: () => setIsModalOpen(false),
|
|
3508
4010
|
event: selectedEvent,
|
|
3509
4011
|
initialDate: modalInitialDate,
|
|
4012
|
+
initialAllDay: modalInitialAllDay,
|
|
3510
4013
|
onSave: handleModalSave,
|
|
3511
4014
|
onDelete: handleModalDelete
|
|
3512
|
-
}) : /* @__PURE__ */
|
|
4015
|
+
}) : /* @__PURE__ */ import_react22.default.createElement(
|
|
3513
4016
|
EventModal,
|
|
3514
4017
|
{
|
|
3515
4018
|
isOpen: isModalOpen,
|
|
@@ -3521,10 +4024,11 @@ var Scheduler = ({
|
|
|
3521
4024
|
calendars,
|
|
3522
4025
|
eventTypes,
|
|
3523
4026
|
translations: t,
|
|
3524
|
-
locale
|
|
4027
|
+
locale,
|
|
4028
|
+
initialAllDay: modalInitialAllDay
|
|
3525
4029
|
}
|
|
3526
4030
|
),
|
|
3527
|
-
/* @__PURE__ */
|
|
4031
|
+
/* @__PURE__ */ import_react22.default.createElement(
|
|
3528
4032
|
EventContextMenu,
|
|
3529
4033
|
{
|
|
3530
4034
|
event: contextMenuEvent,
|
|
@@ -3549,7 +4053,7 @@ var Scheduler = ({
|
|
|
3549
4053
|
}
|
|
3550
4054
|
}
|
|
3551
4055
|
),
|
|
3552
|
-
/* @__PURE__ */
|
|
4056
|
+
/* @__PURE__ */ import_react22.default.createElement(import_core5.DragOverlay, { dropAnimation: null }, activeDragEvent ? /* @__PURE__ */ import_react22.default.createElement(
|
|
3553
4057
|
"div",
|
|
3554
4058
|
{
|
|
3555
4059
|
className: cn(
|
|
@@ -3561,19 +4065,19 @@ var Scheduler = ({
|
|
|
3561
4065
|
backgroundColor: activeDragEvent.color ? `${activeDragEvent.color}e0` : void 0,
|
|
3562
4066
|
borderColor: activeDragEvent.color ? `${activeDragEvent.color}80` : void 0,
|
|
3563
4067
|
color: activeDragEvent.color ? "#fff" : void 0,
|
|
3564
|
-
width:
|
|
3565
|
-
height:
|
|
4068
|
+
width: dragSize.width,
|
|
4069
|
+
height: dragSize.height ? `${dragSize.height}px` : void 0,
|
|
3566
4070
|
boxShadow: `0 20px 40px -15px ${activeDragEvent.color || "var(--primary)"}40, 0 10px 20px -10px rgba(0,0,0,0.2)`,
|
|
3567
4071
|
transform: "rotate(-2deg) scale(1.02)"
|
|
3568
4072
|
}
|
|
3569
4073
|
},
|
|
3570
|
-
/* @__PURE__ */
|
|
4074
|
+
/* @__PURE__ */ import_react22.default.createElement("div", { className: "p-2.5 h-full flex flex-col" }, /* @__PURE__ */ import_react22.default.createElement(
|
|
3571
4075
|
"div",
|
|
3572
4076
|
{
|
|
3573
4077
|
className: "absolute left-0 top-0 bottom-0 w-1 rounded-l-lg",
|
|
3574
4078
|
style: { backgroundColor: activeDragEvent.color || "var(--primary)" }
|
|
3575
4079
|
}
|
|
3576
|
-
), /* @__PURE__ */
|
|
4080
|
+
), /* @__PURE__ */ import_react22.default.createElement("div", { className: "pl-2" }, /* @__PURE__ */ import_react22.default.createElement("div", { className: "font-semibold truncate text-sm" }, activeDragEvent.title), (view === "week" || view === "day") && dragSize.height !== void 0 && dragSize.height > 40 && /* @__PURE__ */ import_react22.default.createElement("div", { className: "text-xs opacity-80 mt-0.5 flex items-center gap-1" }, /* @__PURE__ */ import_react22.default.createElement("svg", { className: "w-3 h-3", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ import_react22.default.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ import_react22.default.createElement("path", { d: "M12 6v6l4 2" })), (0, import_date_fns21.format)(toDisplay(activeDragEvent.start, timezone), overlayTimeFormat, { locale }), " - ", (0, import_date_fns21.format)(toDisplay(activeDragEvent.end, timezone), overlayTimeFormat, { locale }))), /* @__PURE__ */ import_react22.default.createElement("div", { className: "absolute bottom-1.5 right-1.5 opacity-60" }, /* @__PURE__ */ import_react22.default.createElement("svg", { className: "w-4 h-4", viewBox: "0 0 24 24", fill: "currentColor" }, /* @__PURE__ */ import_react22.default.createElement("circle", { cx: "9", cy: "5", r: "1.5" }), /* @__PURE__ */ import_react22.default.createElement("circle", { cx: "15", cy: "5", r: "1.5" }), /* @__PURE__ */ import_react22.default.createElement("circle", { cx: "9", cy: "12", r: "1.5" }), /* @__PURE__ */ import_react22.default.createElement("circle", { cx: "15", cy: "12", r: "1.5" }), /* @__PURE__ */ import_react22.default.createElement("circle", { cx: "9", cy: "19", r: "1.5" }), /* @__PURE__ */ import_react22.default.createElement("circle", { cx: "15", cy: "19", r: "1.5" }))))
|
|
3577
4081
|
) : null)
|
|
3578
4082
|
)
|
|
3579
4083
|
);
|