@mlw-packages/react-components 1.7.18 → 1.7.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.css +0 -6
- package/dist/index.d.mts +202 -22
- package/dist/index.d.ts +202 -22
- package/dist/index.js +2035 -15
- package/dist/index.mjs +2083 -9
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -12163,7 +12163,7 @@ function AgendaView({
|
|
|
12163
12163
|
onEventSelect,
|
|
12164
12164
|
showUndatedEvents = false
|
|
12165
12165
|
}) {
|
|
12166
|
-
const
|
|
12166
|
+
const isValidDate6 = (d) => {
|
|
12167
12167
|
try {
|
|
12168
12168
|
const t = d instanceof Date ? d.getTime() : new Date(String(d)).getTime();
|
|
12169
12169
|
return !isNaN(t);
|
|
@@ -12172,11 +12172,11 @@ function AgendaView({
|
|
|
12172
12172
|
}
|
|
12173
12173
|
};
|
|
12174
12174
|
const datedEvents = useMemo9(
|
|
12175
|
-
() => events.filter((e) =>
|
|
12175
|
+
() => events.filter((e) => isValidDate6(e.start) || isValidDate6(e.end)),
|
|
12176
12176
|
[events]
|
|
12177
12177
|
);
|
|
12178
12178
|
const undatedEvents = useMemo9(
|
|
12179
|
-
() => events.filter((e) => !(
|
|
12179
|
+
() => events.filter((e) => !(isValidDate6(e.start) || isValidDate6(e.end))),
|
|
12180
12180
|
[events]
|
|
12181
12181
|
);
|
|
12182
12182
|
const days = useMemo9(() => {
|
|
@@ -15410,13 +15410,2057 @@ function debounce(func, wait) {
|
|
|
15410
15410
|
};
|
|
15411
15411
|
}
|
|
15412
15412
|
|
|
15413
|
+
// src/components/event-calendar-view/Agenda.tsx
|
|
15414
|
+
import { addDays as addDays4, format as format11, isToday as isToday4 } from "date-fns";
|
|
15415
|
+
import { ptBR as ptBR10 } from "date-fns/locale";
|
|
15416
|
+
import { useMemo as useMemo19 } from "react";
|
|
15417
|
+
import { CalendarIcon as CalendarIcon5 } from "@phosphor-icons/react";
|
|
15418
|
+
import { twMerge as twMerge2 } from "tailwind-merge";
|
|
15419
|
+
import { Fragment as Fragment14, jsx as jsx86, jsxs as jsxs66 } from "react/jsx-runtime";
|
|
15420
|
+
function Agenda({
|
|
15421
|
+
currentDate,
|
|
15422
|
+
events,
|
|
15423
|
+
onEventSelect,
|
|
15424
|
+
showUndatedEvents = true
|
|
15425
|
+
}) {
|
|
15426
|
+
const isValidDate6 = (d) => {
|
|
15427
|
+
try {
|
|
15428
|
+
const t = d instanceof Date ? d.getTime() : new Date(String(d)).getTime();
|
|
15429
|
+
return !isNaN(t);
|
|
15430
|
+
} catch {
|
|
15431
|
+
return false;
|
|
15432
|
+
}
|
|
15433
|
+
};
|
|
15434
|
+
const datedEvents = useMemo19(
|
|
15435
|
+
() => events.filter((e) => isValidDate6(e.start) || isValidDate6(e.end)),
|
|
15436
|
+
[events]
|
|
15437
|
+
);
|
|
15438
|
+
const undatedEvents = useMemo19(
|
|
15439
|
+
() => events.filter((e) => !(isValidDate6(e.start) || isValidDate6(e.end))),
|
|
15440
|
+
[events]
|
|
15441
|
+
);
|
|
15442
|
+
const days = useMemo19(() => {
|
|
15443
|
+
console.log("Agenda view updating with date:", currentDate.toISOString());
|
|
15444
|
+
return Array.from(
|
|
15445
|
+
{ length: AgendaDaysToShowAgenda },
|
|
15446
|
+
(_, i) => addDays4(new Date(currentDate), i)
|
|
15447
|
+
);
|
|
15448
|
+
}, [currentDate]);
|
|
15449
|
+
const handleEventClick = (event, e) => {
|
|
15450
|
+
e.stopPropagation();
|
|
15451
|
+
console.log("Agenda view event clicked:", event);
|
|
15452
|
+
if (onEventSelect) onEventSelect(event);
|
|
15453
|
+
};
|
|
15454
|
+
const hasEvents = days.some(
|
|
15455
|
+
(day) => getAgendaEventsForDayAgenda(datedEvents, day).length > 0
|
|
15456
|
+
);
|
|
15457
|
+
return /* @__PURE__ */ jsx86("div", { className: "border-border/70 border-t px-4", children: !hasEvents && !(showUndatedEvents && undatedEvents.length > 0) ? /* @__PURE__ */ jsxs66("div", { className: "flex min-h-[70svh] flex-col items-center justify-center py-16 text-center", children: [
|
|
15458
|
+
/* @__PURE__ */ jsx86(CalendarIcon5, { className: "mb-2 text-muted-foreground/50", size: 32 }),
|
|
15459
|
+
/* @__PURE__ */ jsx86("h3", { className: "font-medium text-lg", children: "Nenhum evento encontrado" }),
|
|
15460
|
+
/* @__PURE__ */ jsx86("p", { className: "text-muted-foreground", children: "N\xE3o h\xE1 eventos agendados para este per\xEDodo." })
|
|
15461
|
+
] }) : /* @__PURE__ */ jsxs66(Fragment14, { children: [
|
|
15462
|
+
days.map((day) => {
|
|
15463
|
+
const dayEvents = getAgendaEventsForDayAgenda(datedEvents, day);
|
|
15464
|
+
if (dayEvents.length === 0) return null;
|
|
15465
|
+
return /* @__PURE__ */ jsxs66(
|
|
15466
|
+
"div",
|
|
15467
|
+
{
|
|
15468
|
+
className: twMerge2(
|
|
15469
|
+
"relative my-12 border-border/70 border-t",
|
|
15470
|
+
isToday4(day) ? "border-blue-200" : ""
|
|
15471
|
+
),
|
|
15472
|
+
children: [
|
|
15473
|
+
/* @__PURE__ */ jsx86(
|
|
15474
|
+
"span",
|
|
15475
|
+
{
|
|
15476
|
+
className: twMerge2(
|
|
15477
|
+
"-top-3 absolute left-0 flex h-6 items-center bg-background pe-4 uppercase data-today:font-extrabold sm:pe-4 text-lg font-bold",
|
|
15478
|
+
isToday4(day) ? "text-blue-500" : ""
|
|
15479
|
+
),
|
|
15480
|
+
"data-today": isToday4(day) || void 0,
|
|
15481
|
+
children: (() => {
|
|
15482
|
+
const s = format11(day, "d MMM, EEEE", { locale: ptBR10 });
|
|
15483
|
+
return s.split(" ").map((w) => w ? w[0].toUpperCase() + w.slice(1) : w).join(" ");
|
|
15484
|
+
})()
|
|
15485
|
+
}
|
|
15486
|
+
),
|
|
15487
|
+
/* @__PURE__ */ jsx86("div", { className: "mt-6 space-y-2", children: dayEvents.map((event) => /* @__PURE__ */ jsx86(
|
|
15488
|
+
EventItemAgenda,
|
|
15489
|
+
{
|
|
15490
|
+
event,
|
|
15491
|
+
onClick: onEventSelect ? (e) => handleEventClick(event, e) : void 0,
|
|
15492
|
+
view: "agenda",
|
|
15493
|
+
className: onEventSelect ? void 0 : "cursor-default hover:shadow-none hover:scale-100"
|
|
15494
|
+
},
|
|
15495
|
+
event.id
|
|
15496
|
+
)) })
|
|
15497
|
+
]
|
|
15498
|
+
},
|
|
15499
|
+
day.toString()
|
|
15500
|
+
);
|
|
15501
|
+
}),
|
|
15502
|
+
/* @__PURE__ */ jsx86(
|
|
15503
|
+
UndatedEvents,
|
|
15504
|
+
{
|
|
15505
|
+
events,
|
|
15506
|
+
onEventSelect,
|
|
15507
|
+
show: showUndatedEvents,
|
|
15508
|
+
className: "my-12"
|
|
15509
|
+
}
|
|
15510
|
+
)
|
|
15511
|
+
] }) });
|
|
15512
|
+
}
|
|
15513
|
+
|
|
15514
|
+
// src/components/event-calendar-view/CalendarDND.tsx
|
|
15515
|
+
import {
|
|
15516
|
+
DndContext as DndContext2,
|
|
15517
|
+
DragOverlay as DragOverlay2,
|
|
15518
|
+
MouseSensor as MouseSensor2,
|
|
15519
|
+
PointerSensor as PointerSensor2,
|
|
15520
|
+
TouchSensor as TouchSensor2,
|
|
15521
|
+
useSensor as useSensor2,
|
|
15522
|
+
useSensors as useSensors2
|
|
15523
|
+
} from "@dnd-kit/core";
|
|
15524
|
+
import { addMinutes as addMinutes2, differenceInMinutes as differenceInMinutes5 } from "date-fns";
|
|
15525
|
+
import { useId as useId3, useRef as useRef15, useState as useState31 } from "react";
|
|
15526
|
+
|
|
15527
|
+
// src/components/event-calendar-view/hooks.ts
|
|
15528
|
+
import { createContext as createContext7, useContext as useContext8 } from "react";
|
|
15529
|
+
var CalendarDndContext2 = createContext7({
|
|
15530
|
+
activeEvent: null,
|
|
15531
|
+
activeId: null,
|
|
15532
|
+
activeView: null,
|
|
15533
|
+
currentTime: null,
|
|
15534
|
+
dragHandlePosition: null,
|
|
15535
|
+
eventHeight: null,
|
|
15536
|
+
isMultiDay: false,
|
|
15537
|
+
multiDayWidth: null
|
|
15538
|
+
});
|
|
15539
|
+
var useCalendarDndAgenda = () => useContext8(CalendarDndContext2);
|
|
15540
|
+
|
|
15541
|
+
// src/components/event-calendar-view/CalendarDND.tsx
|
|
15542
|
+
import { jsx as jsx87, jsxs as jsxs67 } from "react/jsx-runtime";
|
|
15543
|
+
function CalendarDndProviderAgenda({
|
|
15544
|
+
children,
|
|
15545
|
+
onEventUpdate
|
|
15546
|
+
}) {
|
|
15547
|
+
const [activeEvent, setActiveEvent] = useState31(null);
|
|
15548
|
+
const [activeId, setActiveId] = useState31(null);
|
|
15549
|
+
const [activeView, setActiveView] = useState31(
|
|
15550
|
+
null
|
|
15551
|
+
);
|
|
15552
|
+
const [currentTime, setCurrentTime] = useState31(null);
|
|
15553
|
+
const [eventHeight, setEventHeight] = useState31(null);
|
|
15554
|
+
const [isMultiDay, setIsMultiDay] = useState31(false);
|
|
15555
|
+
const [multiDayWidth, setMultiDayWidth] = useState31(null);
|
|
15556
|
+
const [dragHandlePosition, setDragHandlePosition] = useState31(null);
|
|
15557
|
+
const eventDimensions = useRef15({ height: 0 });
|
|
15558
|
+
const sensors = useSensors2(
|
|
15559
|
+
useSensor2(MouseSensor2, {
|
|
15560
|
+
// Require the mouse to move by 5px before activating
|
|
15561
|
+
activationConstraint: {
|
|
15562
|
+
distance: 5
|
|
15563
|
+
}
|
|
15564
|
+
}),
|
|
15565
|
+
useSensor2(TouchSensor2, {
|
|
15566
|
+
// Press delay of 250ms, with tolerance of 5px of movement
|
|
15567
|
+
activationConstraint: {
|
|
15568
|
+
delay: 250,
|
|
15569
|
+
tolerance: 5
|
|
15570
|
+
}
|
|
15571
|
+
}),
|
|
15572
|
+
useSensor2(PointerSensor2, {
|
|
15573
|
+
// Require the pointer to move by 5px before activating
|
|
15574
|
+
activationConstraint: {
|
|
15575
|
+
distance: 5
|
|
15576
|
+
}
|
|
15577
|
+
})
|
|
15578
|
+
);
|
|
15579
|
+
const dndContextId = useId3();
|
|
15580
|
+
const handleDragStart = (event) => {
|
|
15581
|
+
const { active } = event;
|
|
15582
|
+
if (!active.data.current) {
|
|
15583
|
+
console.error("Missing data in drag start event", event);
|
|
15584
|
+
return;
|
|
15585
|
+
}
|
|
15586
|
+
const {
|
|
15587
|
+
event: calendarEvent,
|
|
15588
|
+
view,
|
|
15589
|
+
height,
|
|
15590
|
+
isMultiDay: eventIsMultiDay,
|
|
15591
|
+
multiDayWidth: eventMultiDayWidth,
|
|
15592
|
+
dragHandlePosition: eventDragHandlePosition
|
|
15593
|
+
} = active.data.current;
|
|
15594
|
+
setActiveEvent(calendarEvent);
|
|
15595
|
+
setActiveId(active.id);
|
|
15596
|
+
setActiveView(view);
|
|
15597
|
+
setCurrentTime(calendarEvent.start ? new Date(calendarEvent.start) : null);
|
|
15598
|
+
setIsMultiDay(eventIsMultiDay || false);
|
|
15599
|
+
setMultiDayWidth(eventMultiDayWidth || null);
|
|
15600
|
+
setDragHandlePosition(eventDragHandlePosition || null);
|
|
15601
|
+
if (height) {
|
|
15602
|
+
eventDimensions.current.height = height;
|
|
15603
|
+
setEventHeight(height);
|
|
15604
|
+
}
|
|
15605
|
+
};
|
|
15606
|
+
const handleDragOver = (event) => {
|
|
15607
|
+
const { over } = event;
|
|
15608
|
+
if (over && activeEvent && over.data.current) {
|
|
15609
|
+
const { date, time } = over.data.current;
|
|
15610
|
+
if (time !== void 0 && activeView !== "month") {
|
|
15611
|
+
const newTime = new Date(date);
|
|
15612
|
+
const hours = Math.floor(time);
|
|
15613
|
+
const fractionalHour = time - hours;
|
|
15614
|
+
let minutes = 0;
|
|
15615
|
+
if (fractionalHour < 0.125) minutes = 0;
|
|
15616
|
+
else if (fractionalHour < 0.375) minutes = 15;
|
|
15617
|
+
else if (fractionalHour < 0.625) minutes = 30;
|
|
15618
|
+
else minutes = 45;
|
|
15619
|
+
newTime.setHours(hours, minutes, 0, 0);
|
|
15620
|
+
if (!currentTime || newTime.getHours() !== currentTime.getHours() || newTime.getMinutes() !== currentTime.getMinutes() || newTime.getDate() !== currentTime.getDate() || newTime.getMonth() !== currentTime.getMonth() || newTime.getFullYear() !== currentTime.getFullYear()) {
|
|
15621
|
+
setCurrentTime(newTime);
|
|
15622
|
+
}
|
|
15623
|
+
} else if (activeView === "month") {
|
|
15624
|
+
const newTime = new Date(date);
|
|
15625
|
+
if (currentTime) {
|
|
15626
|
+
newTime.setHours(
|
|
15627
|
+
currentTime.getHours(),
|
|
15628
|
+
currentTime.getMinutes(),
|
|
15629
|
+
currentTime.getSeconds(),
|
|
15630
|
+
currentTime.getMilliseconds()
|
|
15631
|
+
);
|
|
15632
|
+
}
|
|
15633
|
+
if (!currentTime || newTime.getDate() !== currentTime.getDate() || newTime.getMonth() !== currentTime.getMonth() || newTime.getFullYear() !== currentTime.getFullYear()) {
|
|
15634
|
+
setCurrentTime(newTime);
|
|
15635
|
+
}
|
|
15636
|
+
}
|
|
15637
|
+
}
|
|
15638
|
+
};
|
|
15639
|
+
const handleDragEnd = (event) => {
|
|
15640
|
+
const { active, over } = event;
|
|
15641
|
+
if (!over || !activeEvent || !currentTime) {
|
|
15642
|
+
setActiveEvent(null);
|
|
15643
|
+
setActiveId(null);
|
|
15644
|
+
setActiveView(null);
|
|
15645
|
+
setCurrentTime(null);
|
|
15646
|
+
setEventHeight(null);
|
|
15647
|
+
setIsMultiDay(false);
|
|
15648
|
+
setMultiDayWidth(null);
|
|
15649
|
+
setDragHandlePosition(null);
|
|
15650
|
+
return;
|
|
15651
|
+
}
|
|
15652
|
+
try {
|
|
15653
|
+
if (!active.data.current || !over.data.current) {
|
|
15654
|
+
throw new Error("Missing data in drag event");
|
|
15655
|
+
}
|
|
15656
|
+
const activeData = active.data.current;
|
|
15657
|
+
const overData = over.data.current;
|
|
15658
|
+
if (!activeData.event || !overData.date) {
|
|
15659
|
+
throw new Error("Missing required event data");
|
|
15660
|
+
}
|
|
15661
|
+
const calendarEvent = activeData.event;
|
|
15662
|
+
const date = overData.date;
|
|
15663
|
+
const time = overData.time;
|
|
15664
|
+
const newStart = new Date(date);
|
|
15665
|
+
if (time !== void 0) {
|
|
15666
|
+
const hours = Math.floor(time);
|
|
15667
|
+
const fractionalHour = time - hours;
|
|
15668
|
+
let minutes = 0;
|
|
15669
|
+
if (fractionalHour < 0.125) minutes = 0;
|
|
15670
|
+
else if (fractionalHour < 0.375) minutes = 15;
|
|
15671
|
+
else if (fractionalHour < 0.625) minutes = 30;
|
|
15672
|
+
else minutes = 45;
|
|
15673
|
+
newStart.setHours(hours, minutes, 0, 0);
|
|
15674
|
+
} else {
|
|
15675
|
+
newStart.setHours(
|
|
15676
|
+
currentTime.getHours(),
|
|
15677
|
+
currentTime.getMinutes(),
|
|
15678
|
+
currentTime.getSeconds(),
|
|
15679
|
+
currentTime.getMilliseconds()
|
|
15680
|
+
);
|
|
15681
|
+
}
|
|
15682
|
+
if (!calendarEvent.start || !calendarEvent.end) {
|
|
15683
|
+
console.error("Cannot compute duration: event start or end is null", calendarEvent);
|
|
15684
|
+
return;
|
|
15685
|
+
}
|
|
15686
|
+
const originalStart = new Date(calendarEvent.start);
|
|
15687
|
+
const originalEnd = new Date(calendarEvent.end);
|
|
15688
|
+
const durationMinutes = differenceInMinutes5(originalEnd, originalStart);
|
|
15689
|
+
const newEnd = addMinutes2(newStart, durationMinutes);
|
|
15690
|
+
const hasStartTimeChanged = originalStart.getFullYear() !== newStart.getFullYear() || originalStart.getMonth() !== newStart.getMonth() || originalStart.getDate() !== newStart.getDate() || originalStart.getHours() !== newStart.getHours() || originalStart.getMinutes() !== newStart.getMinutes();
|
|
15691
|
+
if (hasStartTimeChanged) {
|
|
15692
|
+
onEventUpdate({
|
|
15693
|
+
...calendarEvent,
|
|
15694
|
+
end: newEnd,
|
|
15695
|
+
start: newStart
|
|
15696
|
+
});
|
|
15697
|
+
}
|
|
15698
|
+
} catch (error) {
|
|
15699
|
+
console.error("Error in drag end handler:", error);
|
|
15700
|
+
} finally {
|
|
15701
|
+
setActiveEvent(null);
|
|
15702
|
+
setActiveId(null);
|
|
15703
|
+
setActiveView(null);
|
|
15704
|
+
setCurrentTime(null);
|
|
15705
|
+
setEventHeight(null);
|
|
15706
|
+
setIsMultiDay(false);
|
|
15707
|
+
setMultiDayWidth(null);
|
|
15708
|
+
setDragHandlePosition(null);
|
|
15709
|
+
}
|
|
15710
|
+
};
|
|
15711
|
+
return /* @__PURE__ */ jsx87(
|
|
15712
|
+
DndContext2,
|
|
15713
|
+
{
|
|
15714
|
+
id: dndContextId,
|
|
15715
|
+
onDragEnd: handleDragEnd,
|
|
15716
|
+
onDragOver: handleDragOver,
|
|
15717
|
+
onDragStart: handleDragStart,
|
|
15718
|
+
sensors,
|
|
15719
|
+
children: /* @__PURE__ */ jsxs67(
|
|
15720
|
+
CalendarDndContext2.Provider,
|
|
15721
|
+
{
|
|
15722
|
+
value: {
|
|
15723
|
+
activeEvent,
|
|
15724
|
+
activeId,
|
|
15725
|
+
activeView,
|
|
15726
|
+
currentTime,
|
|
15727
|
+
dragHandlePosition,
|
|
15728
|
+
eventHeight,
|
|
15729
|
+
isMultiDay,
|
|
15730
|
+
multiDayWidth
|
|
15731
|
+
},
|
|
15732
|
+
children: [
|
|
15733
|
+
children,
|
|
15734
|
+
/* @__PURE__ */ jsx87(DragOverlay2, { adjustScale: false, dropAnimation: null, children: activeEvent && activeView && /* @__PURE__ */ jsx87(
|
|
15735
|
+
"div",
|
|
15736
|
+
{
|
|
15737
|
+
style: {
|
|
15738
|
+
height: eventHeight ? `${eventHeight}px` : "auto",
|
|
15739
|
+
width: isMultiDay && multiDayWidth ? `${multiDayWidth}%` : "100%"
|
|
15740
|
+
},
|
|
15741
|
+
children: /* @__PURE__ */ jsx87(
|
|
15742
|
+
EventItemAgenda,
|
|
15743
|
+
{
|
|
15744
|
+
currentTime: currentTime || void 0,
|
|
15745
|
+
event: activeEvent,
|
|
15746
|
+
isDragging: true,
|
|
15747
|
+
isFirstDay: dragHandlePosition?.data?.isFirstDay !== false,
|
|
15748
|
+
isLastDay: dragHandlePosition?.data?.isLastDay !== false,
|
|
15749
|
+
showTime: activeView !== "month",
|
|
15750
|
+
view: activeView
|
|
15751
|
+
}
|
|
15752
|
+
)
|
|
15753
|
+
}
|
|
15754
|
+
) })
|
|
15755
|
+
]
|
|
15756
|
+
}
|
|
15757
|
+
)
|
|
15758
|
+
}
|
|
15759
|
+
);
|
|
15760
|
+
}
|
|
15761
|
+
|
|
15762
|
+
// src/components/event-calendar-view/constants.ts
|
|
15763
|
+
var EventHeightAgenda = 24;
|
|
15764
|
+
var EventGapAgenda = 4;
|
|
15765
|
+
var WeekCellsHeightAgenda = 64;
|
|
15766
|
+
var AgendaDaysToShowAgenda = 30;
|
|
15767
|
+
var StartHourAgenda = 0;
|
|
15768
|
+
var EndHourAgenda = 24;
|
|
15769
|
+
var DefaultStartHourAgenda = 9;
|
|
15770
|
+
var DefaultEndHourAgenda = 10;
|
|
15771
|
+
|
|
15772
|
+
// src/components/event-calendar-view/DayView.tsx
|
|
15773
|
+
import {
|
|
15774
|
+
addHours as addHours4,
|
|
15775
|
+
areIntervalsOverlapping as areIntervalsOverlapping3,
|
|
15776
|
+
differenceInMinutes as differenceInMinutes7,
|
|
15777
|
+
eachHourOfInterval as eachHourOfInterval3,
|
|
15778
|
+
format as format13,
|
|
15779
|
+
getHours as getHours3,
|
|
15780
|
+
getMinutes as getMinutes3,
|
|
15781
|
+
isSameDay as isSameDay9,
|
|
15782
|
+
startOfDay as startOfDay3
|
|
15783
|
+
} from "date-fns";
|
|
15784
|
+
import { useMemo as useMemo21 } from "react";
|
|
15785
|
+
|
|
15786
|
+
// src/components/event-calendar-view/utils.ts
|
|
15787
|
+
import { isSameDay as isSameDay7 } from "date-fns";
|
|
15788
|
+
function getEventColorClassesAgenda(color) {
|
|
15789
|
+
const eventColor = color || "sky";
|
|
15790
|
+
switch (eventColor) {
|
|
15791
|
+
case "sky":
|
|
15792
|
+
return "bg-sky-200/50 hover:bg-sky-200/40 text-sky-950/80 dark:bg-sky-400/25 dark:hover:bg-sky-400/20 dark:text-sky-200 shadow-sky-700/8";
|
|
15793
|
+
case "amber":
|
|
15794
|
+
return "bg-amber-200/50 hover:bg-amber-200/40 text-amber-950/80 dark:bg-amber-400/25 dark:hover:bg-amber-400/20 dark:text-amber-200 shadow-amber-700/8";
|
|
15795
|
+
case "violet":
|
|
15796
|
+
return "bg-violet-200/50 hover:bg-violet-200/40 text-violet-950/80 dark:bg-violet-400/25 dark:hover:bg-violet-400/20 dark:text-violet-200 shadow-violet-700/8";
|
|
15797
|
+
case "rose":
|
|
15798
|
+
return "bg-rose-200/50 hover:bg-rose-200/40 text-rose-950/80 dark:bg-rose-400/25 dark:hover:bg-rose-400/20 dark:text-rose-200 shadow-rose-700/8";
|
|
15799
|
+
case "emerald":
|
|
15800
|
+
return "bg-emerald-200/50 hover:bg-emerald-200/40 text-emerald-950/80 dark:bg-emerald-400/25 dark:hover:bg-emerald-400/20 dark:text-emerald-200 shadow-emerald-700/8";
|
|
15801
|
+
case "orange":
|
|
15802
|
+
return "bg-orange-200/50 hover:bg-orange-200/40 text-orange-950/80 dark:bg-orange-400/25 dark:hover:bg-orange-400/20 dark:text-orange-200 shadow-orange-700/8";
|
|
15803
|
+
default:
|
|
15804
|
+
return "bg-sky-200/50 hover:bg-sky-200/40 text-sky-950/80 dark:bg-sky-400/25 dark:hover:bg-sky-400/20 dark:text-sky-200 shadow-sky-700/8";
|
|
15805
|
+
}
|
|
15806
|
+
}
|
|
15807
|
+
function getBorderRadiusClassesAgenda(isFirstDay, isLastDay) {
|
|
15808
|
+
if (isFirstDay && isLastDay) {
|
|
15809
|
+
return "rounded";
|
|
15810
|
+
}
|
|
15811
|
+
if (isFirstDay) {
|
|
15812
|
+
return "rounded-l rounded-r-none";
|
|
15813
|
+
}
|
|
15814
|
+
if (isLastDay) {
|
|
15815
|
+
return "rounded-r rounded-l-none";
|
|
15816
|
+
}
|
|
15817
|
+
return "rounded-none";
|
|
15818
|
+
}
|
|
15819
|
+
function isMultiDayEventAgenda(event) {
|
|
15820
|
+
const eventStart = isValidDate3(event.start) ? new Date(event.start) : void 0;
|
|
15821
|
+
const eventEnd = isValidDate3(event.end) ? new Date(event.end) : void 0;
|
|
15822
|
+
if (!eventStart || !eventEnd) return !!event.allDay;
|
|
15823
|
+
return event.allDay || eventStart.getDate() !== eventEnd.getDate();
|
|
15824
|
+
}
|
|
15825
|
+
function getEventsForDayAgenda(events, day) {
|
|
15826
|
+
return events.filter((event) => {
|
|
15827
|
+
const eventStart = isValidDate3(event.start) ? new Date(event.start) : void 0;
|
|
15828
|
+
return eventStart ? isSameDay7(day, eventStart) : false;
|
|
15829
|
+
}).sort((a, b) => getEventStartTimestamp2(a) - getEventStartTimestamp2(b));
|
|
15830
|
+
}
|
|
15831
|
+
function sortEventsAgenda(events) {
|
|
15832
|
+
return [...events].sort((a, b) => {
|
|
15833
|
+
const aIsMultiDay = isMultiDayEventAgenda(a);
|
|
15834
|
+
const bIsMultiDay = isMultiDayEventAgenda(b);
|
|
15835
|
+
if (aIsMultiDay && !bIsMultiDay) return -1;
|
|
15836
|
+
if (!aIsMultiDay && bIsMultiDay) return 1;
|
|
15837
|
+
return getEventStartTimestamp2(a) - getEventStartTimestamp2(b);
|
|
15838
|
+
});
|
|
15839
|
+
}
|
|
15840
|
+
function getSpanningEventsForDayAgenda(events, day) {
|
|
15841
|
+
return events.filter((event) => {
|
|
15842
|
+
if (!isMultiDayEventAgenda(event)) return false;
|
|
15843
|
+
const eventStart = isValidDate3(event.start) ? new Date(event.start) : void 0;
|
|
15844
|
+
const eventEnd = isValidDate3(event.end) ? new Date(event.end) : void 0;
|
|
15845
|
+
if (!eventStart || !eventEnd) return false;
|
|
15846
|
+
return !isSameDay7(day, eventStart) && (isSameDay7(day, eventEnd) || day > eventStart && day < eventEnd);
|
|
15847
|
+
});
|
|
15848
|
+
}
|
|
15849
|
+
function getAllEventsForDayAgenda(events, day) {
|
|
15850
|
+
return events.filter((event) => {
|
|
15851
|
+
const eventStart = isValidDate3(event.start) ? new Date(event.start) : void 0;
|
|
15852
|
+
const eventEnd = isValidDate3(event.end) ? new Date(event.end) : void 0;
|
|
15853
|
+
if (!eventStart) return false;
|
|
15854
|
+
return isSameDay7(day, eventStart) || (eventEnd ? isSameDay7(day, eventEnd) : false) || (eventEnd ? day > eventStart && day < eventEnd : false);
|
|
15855
|
+
});
|
|
15856
|
+
}
|
|
15857
|
+
function getAgendaEventsForDayAgenda(events, day) {
|
|
15858
|
+
return events.filter((event) => {
|
|
15859
|
+
const eventStart = isValidDate3(event.start) ? new Date(event.start) : void 0;
|
|
15860
|
+
const eventEnd = isValidDate3(event.end) ? new Date(event.end) : void 0;
|
|
15861
|
+
if (!eventStart) return false;
|
|
15862
|
+
return isSameDay7(day, eventStart) || (eventEnd ? isSameDay7(day, eventEnd) : false) || (eventEnd ? day > eventStart && day < eventEnd : false);
|
|
15863
|
+
}).sort((a, b) => getEventStartTimestamp2(a) - getEventStartTimestamp2(b));
|
|
15864
|
+
}
|
|
15865
|
+
function isValidDate3(d) {
|
|
15866
|
+
try {
|
|
15867
|
+
const t = d instanceof Date ? d.getTime() : new Date(String(d)).getTime();
|
|
15868
|
+
return !isNaN(t);
|
|
15869
|
+
} catch {
|
|
15870
|
+
return false;
|
|
15871
|
+
}
|
|
15872
|
+
}
|
|
15873
|
+
function getEventStartTimestamp2(e) {
|
|
15874
|
+
if (isValidDate3(e.start)) return new Date(e.start).getTime();
|
|
15875
|
+
return Number.MAX_SAFE_INTEGER;
|
|
15876
|
+
}
|
|
15877
|
+
function normalizeAttendDate(d) {
|
|
15878
|
+
if (d === void 0 || d === null) return void 0;
|
|
15879
|
+
try {
|
|
15880
|
+
const dt = d instanceof Date ? d : new Date(String(d));
|
|
15881
|
+
if (isNaN(dt.getTime())) return void 0;
|
|
15882
|
+
if (dt.getHours() !== 0 || dt.getMinutes() !== 0 || dt.getSeconds() !== 0 || dt.getMilliseconds() !== 0) {
|
|
15883
|
+
return dt;
|
|
15884
|
+
}
|
|
15885
|
+
return new Date(dt.getFullYear(), dt.getMonth(), dt.getDate());
|
|
15886
|
+
} catch {
|
|
15887
|
+
return void 0;
|
|
15888
|
+
}
|
|
15889
|
+
}
|
|
15890
|
+
function addHoursToDateAgenda(date, hours) {
|
|
15891
|
+
const result = new Date(date);
|
|
15892
|
+
result.setHours(result.getHours() + hours);
|
|
15893
|
+
return result;
|
|
15894
|
+
}
|
|
15895
|
+
|
|
15896
|
+
// src/components/event-calendar-view/hooks/use-current-time-indicator.ts
|
|
15897
|
+
import { endOfWeek as endOfWeek5, isSameDay as isSameDay8, isWithinInterval as isWithinInterval2, startOfWeek as startOfWeek5 } from "date-fns";
|
|
15898
|
+
import { ptBR as ptBR11 } from "date-fns/locale";
|
|
15899
|
+
import { useEffect as useEffect26, useState as useState32 } from "react";
|
|
15900
|
+
function useCurrentTimeIndicatorAgenda(currentDate, view) {
|
|
15901
|
+
const [currentTimePosition, setCurrentTimePosition] = useState32(0);
|
|
15902
|
+
const [currentTimeVisible, setCurrentTimeVisible] = useState32(false);
|
|
15903
|
+
useEffect26(() => {
|
|
15904
|
+
const calculateTimePosition = () => {
|
|
15905
|
+
const now = /* @__PURE__ */ new Date();
|
|
15906
|
+
const hours = now.getHours();
|
|
15907
|
+
const minutes = now.getMinutes();
|
|
15908
|
+
const totalMinutes = (hours - StartHourAgenda) * 60 + minutes;
|
|
15909
|
+
const dayStartMinutes = 0;
|
|
15910
|
+
const dayEndMinutes = (EndHourAgenda - StartHourAgenda) * 60;
|
|
15911
|
+
const position = (totalMinutes - dayStartMinutes) / (dayEndMinutes - dayStartMinutes) * 100;
|
|
15912
|
+
let isCurrentTimeVisible = false;
|
|
15913
|
+
if (view === "day") {
|
|
15914
|
+
isCurrentTimeVisible = isSameDay8(now, currentDate);
|
|
15915
|
+
} else if (view === "week") {
|
|
15916
|
+
const startOfWeekDate = startOfWeek5(currentDate, { locale: ptBR11 });
|
|
15917
|
+
const endOfWeekDate = endOfWeek5(currentDate, { locale: ptBR11 });
|
|
15918
|
+
isCurrentTimeVisible = isWithinInterval2(now, {
|
|
15919
|
+
end: endOfWeekDate,
|
|
15920
|
+
start: startOfWeekDate
|
|
15921
|
+
});
|
|
15922
|
+
}
|
|
15923
|
+
setCurrentTimePosition(position);
|
|
15924
|
+
setCurrentTimeVisible(isCurrentTimeVisible);
|
|
15925
|
+
};
|
|
15926
|
+
calculateTimePosition();
|
|
15927
|
+
const interval = setInterval(calculateTimePosition, 6e4);
|
|
15928
|
+
return () => clearInterval(interval);
|
|
15929
|
+
}, [currentDate, view]);
|
|
15930
|
+
return { currentTimePosition, currentTimeVisible };
|
|
15931
|
+
}
|
|
15932
|
+
|
|
15933
|
+
// src/components/event-calendar-view/EventItemAgenda.tsx
|
|
15934
|
+
import { differenceInMinutes as differenceInMinutes6, format as format12, isPast as isPast2 } from "date-fns";
|
|
15935
|
+
import { useMemo as useMemo20 } from "react";
|
|
15936
|
+
import { ClockUserIcon as ClockUserIcon2 } from "@phosphor-icons/react";
|
|
15937
|
+
import { Fragment as Fragment15, jsx as jsx88, jsxs as jsxs68 } from "react/jsx-runtime";
|
|
15938
|
+
var formatTimeWithOptionalMinutes2 = (date) => {
|
|
15939
|
+
return format12(date, "HH:mm");
|
|
15940
|
+
};
|
|
15941
|
+
var isValidDate4 = (d) => {
|
|
15942
|
+
try {
|
|
15943
|
+
const dt = d instanceof Date ? d : new Date(String(d));
|
|
15944
|
+
return !isNaN(dt.getTime());
|
|
15945
|
+
} catch {
|
|
15946
|
+
return false;
|
|
15947
|
+
}
|
|
15948
|
+
};
|
|
15949
|
+
function EventWrapper2({
|
|
15950
|
+
event,
|
|
15951
|
+
isFirstDay = true,
|
|
15952
|
+
isLastDay = true,
|
|
15953
|
+
isDragging,
|
|
15954
|
+
onClick,
|
|
15955
|
+
className,
|
|
15956
|
+
children,
|
|
15957
|
+
currentTime,
|
|
15958
|
+
dndListeners,
|
|
15959
|
+
dndAttributes,
|
|
15960
|
+
onMouseDown,
|
|
15961
|
+
onTouchStart,
|
|
15962
|
+
ariaLabel
|
|
15963
|
+
}) {
|
|
15964
|
+
const hasValidTimeForWrapper = isValidDate4(event.start) || isValidDate4(event.end);
|
|
15965
|
+
const displayEnd = (() => {
|
|
15966
|
+
if (isValidDate4(event.start) && isValidDate4(event.end)) {
|
|
15967
|
+
return currentTime ? new Date(
|
|
15968
|
+
new Date(currentTime).getTime() + (new Date(event.end).getTime() - new Date(event.start).getTime())
|
|
15969
|
+
) : new Date(event.end);
|
|
15970
|
+
}
|
|
15971
|
+
if (isValidDate4(event.start) && !isValidDate4(event.end)) {
|
|
15972
|
+
return currentTime ? new Date(currentTime) : new Date(event.start);
|
|
15973
|
+
}
|
|
15974
|
+
if (!isValidDate4(event.start) && isValidDate4(event.end)) {
|
|
15975
|
+
return currentTime ? new Date(currentTime) : new Date(event.end);
|
|
15976
|
+
}
|
|
15977
|
+
return void 0;
|
|
15978
|
+
})();
|
|
15979
|
+
const isEventInPast = displayEnd ? isPast2(displayEnd) : false;
|
|
15980
|
+
const colorClasses = hasValidTimeForWrapper ? getEventColorClassesAgenda(event.color) : "bg-gray-200/50 hover:bg-gray-200/40 text-gray-900/80 dark:bg-gray-700/25 dark:text-gray-200/90 shadow-none";
|
|
15981
|
+
return /* @__PURE__ */ jsx88(
|
|
15982
|
+
"button",
|
|
15983
|
+
{
|
|
15984
|
+
className: cn(
|
|
15985
|
+
"flex w-full select-none overflow-hidden px-3 py-1 text-left font-medium outline-none transition-transform duration-150 ease-out backdrop-blur-sm focus-visible:ring-2 focus-visible:ring-ring/50 focus-visible:border-ring data-dragging:cursor-grabbing data-past-event:line-through data-dragging:shadow-lg sm:px-3 rounded-lg shadow-sm hover:shadow-md border",
|
|
15986
|
+
colorClasses,
|
|
15987
|
+
getBorderRadiusClassesAgenda(isFirstDay, isLastDay),
|
|
15988
|
+
className
|
|
15989
|
+
),
|
|
15990
|
+
"data-dragging": isDragging || void 0,
|
|
15991
|
+
"data-past-event": isEventInPast || void 0,
|
|
15992
|
+
onClick,
|
|
15993
|
+
onMouseDown,
|
|
15994
|
+
onTouchStart,
|
|
15995
|
+
"aria-label": ariaLabel,
|
|
15996
|
+
type: "button",
|
|
15997
|
+
...dndListeners,
|
|
15998
|
+
...dndAttributes,
|
|
15999
|
+
children
|
|
16000
|
+
}
|
|
16001
|
+
);
|
|
16002
|
+
}
|
|
16003
|
+
function EventItemAgenda({
|
|
16004
|
+
event,
|
|
16005
|
+
view,
|
|
16006
|
+
onClick,
|
|
16007
|
+
showTime,
|
|
16008
|
+
currentTime,
|
|
16009
|
+
isFirstDay = true,
|
|
16010
|
+
isLastDay = true,
|
|
16011
|
+
children,
|
|
16012
|
+
className,
|
|
16013
|
+
dndListeners,
|
|
16014
|
+
dndAttributes,
|
|
16015
|
+
onMouseDown,
|
|
16016
|
+
onTouchStart,
|
|
16017
|
+
agendaOnly = false
|
|
16018
|
+
}) {
|
|
16019
|
+
const eventColor = event.color;
|
|
16020
|
+
const hasValidTime = isValidDate4(event.start) || isValidDate4(event.end);
|
|
16021
|
+
const colorClasses = hasValidTime ? getEventColorClassesAgenda(eventColor) : "bg-gray-200/50 hover:bg-gray-200/40 text-gray-900/80 dark:bg-gray-700/25 dark:text-gray-200/90 shadow-none";
|
|
16022
|
+
const displayStart = useMemo20(() => {
|
|
16023
|
+
if (!hasValidTime) return void 0;
|
|
16024
|
+
if (isValidDate4(event.start))
|
|
16025
|
+
return currentTime || new Date(event.start);
|
|
16026
|
+
if (isValidDate4(event.end))
|
|
16027
|
+
return currentTime || new Date(event.end);
|
|
16028
|
+
return void 0;
|
|
16029
|
+
}, [currentTime, event.start, event.end, hasValidTime]);
|
|
16030
|
+
const displayEnd = useMemo20(() => {
|
|
16031
|
+
if (!hasValidTime) return void 0;
|
|
16032
|
+
if (isValidDate4(event.end)) {
|
|
16033
|
+
return currentTime ? new Date(
|
|
16034
|
+
new Date(currentTime).getTime() + (isValidDate4(event.start) ? new Date(event.end).getTime() - new Date(event.start).getTime() : 0)
|
|
16035
|
+
) : new Date(event.end);
|
|
16036
|
+
}
|
|
16037
|
+
if (isValidDate4(event.start)) {
|
|
16038
|
+
return currentTime ? new Date(currentTime) : new Date(event.start);
|
|
16039
|
+
}
|
|
16040
|
+
return void 0;
|
|
16041
|
+
}, [currentTime, event.start, event.end, hasValidTime]);
|
|
16042
|
+
const durationMinutes = useMemo20(() => {
|
|
16043
|
+
if (!hasValidTime || !displayStart || !displayEnd) return 0;
|
|
16044
|
+
return differenceInMinutes6(displayEnd, displayStart);
|
|
16045
|
+
}, [displayStart, displayEnd, hasValidTime]);
|
|
16046
|
+
const getEventTime = () => {
|
|
16047
|
+
if (!hasValidTime) return "";
|
|
16048
|
+
if (event.allDay) return "All day";
|
|
16049
|
+
if (durationMinutes < 45) {
|
|
16050
|
+
return formatTimeWithOptionalMinutes2(displayStart);
|
|
16051
|
+
}
|
|
16052
|
+
return `${formatTimeWithOptionalMinutes2(
|
|
16053
|
+
displayStart
|
|
16054
|
+
)} - ${formatTimeWithOptionalMinutes2(displayEnd)}`;
|
|
16055
|
+
};
|
|
16056
|
+
let ariaLabel;
|
|
16057
|
+
if (!hasValidTime) {
|
|
16058
|
+
ariaLabel = event.title;
|
|
16059
|
+
} else if (event.allDay) {
|
|
16060
|
+
ariaLabel = `${event.title}, All day`;
|
|
16061
|
+
} else if (durationMinutes < 45) {
|
|
16062
|
+
ariaLabel = `${event.title}, ${formatTimeWithOptionalMinutes2(
|
|
16063
|
+
displayStart
|
|
16064
|
+
)}`;
|
|
16065
|
+
} else {
|
|
16066
|
+
ariaLabel = `${event.title}, ${formatTimeWithOptionalMinutes2(
|
|
16067
|
+
displayStart
|
|
16068
|
+
)} - ${formatTimeWithOptionalMinutes2(displayEnd)}`;
|
|
16069
|
+
}
|
|
16070
|
+
if (view === "month") {
|
|
16071
|
+
return /* @__PURE__ */ jsx88(
|
|
16072
|
+
EventWrapper2,
|
|
16073
|
+
{
|
|
16074
|
+
className: cn(
|
|
16075
|
+
"mt-[var(--event-gap)] h-[var(--event-height)] items-center sm:text-xs",
|
|
16076
|
+
className
|
|
16077
|
+
),
|
|
16078
|
+
currentTime,
|
|
16079
|
+
dndAttributes,
|
|
16080
|
+
dndListeners,
|
|
16081
|
+
event,
|
|
16082
|
+
ariaLabel,
|
|
16083
|
+
isFirstDay,
|
|
16084
|
+
isLastDay,
|
|
16085
|
+
onClick,
|
|
16086
|
+
children: children || /* @__PURE__ */ jsxs68("span", { className: "flex items-center gap-2 truncate", children: [
|
|
16087
|
+
!event.allDay && hasValidTime && displayStart && /* @__PURE__ */ jsx88("span", { className: "truncate text-2xl opacity-80 bg-white/10 px-2 rounded-full", children: formatTimeWithOptionalMinutes2(displayStart) }),
|
|
16088
|
+
/* @__PURE__ */ jsx88(
|
|
16089
|
+
"span",
|
|
16090
|
+
{
|
|
16091
|
+
className: cn(
|
|
16092
|
+
"truncate",
|
|
16093
|
+
agendaOnly ? "font-bold text-lg" : "font-medium"
|
|
16094
|
+
),
|
|
16095
|
+
children: event.title
|
|
16096
|
+
}
|
|
16097
|
+
)
|
|
16098
|
+
] })
|
|
16099
|
+
}
|
|
16100
|
+
);
|
|
16101
|
+
}
|
|
16102
|
+
if (view === "week" || view === "day") {
|
|
16103
|
+
return /* @__PURE__ */ jsx88(
|
|
16104
|
+
EventWrapper2,
|
|
16105
|
+
{
|
|
16106
|
+
className: cn(
|
|
16107
|
+
"py-1",
|
|
16108
|
+
durationMinutes < 45 ? "items-center" : "flex-col",
|
|
16109
|
+
view === "week" ? "text-[10px] sm:text-xs" : "text-xs",
|
|
16110
|
+
className
|
|
16111
|
+
),
|
|
16112
|
+
currentTime,
|
|
16113
|
+
dndAttributes,
|
|
16114
|
+
dndListeners,
|
|
16115
|
+
event,
|
|
16116
|
+
ariaLabel,
|
|
16117
|
+
isFirstDay,
|
|
16118
|
+
isLastDay,
|
|
16119
|
+
children: durationMinutes < 45 ? /* @__PURE__ */ jsxs68("div", { className: "flex items-center justify-between w-full", children: [
|
|
16120
|
+
/* @__PURE__ */ jsx88("div", { className: cn("truncate text-lg"), children: event.title }),
|
|
16121
|
+
showTime && hasValidTime && displayStart && /* @__PURE__ */ jsxs68("span", { className: "ml-2 flex items-center gap-3 bg-white/10 py-0.5 rounded-full opacity-90 text-lg ", children: [
|
|
16122
|
+
formatTimeWithOptionalMinutes2(displayStart),
|
|
16123
|
+
/* @__PURE__ */ jsx88(ClockUserIcon2, {})
|
|
16124
|
+
] })
|
|
16125
|
+
] }) : /* @__PURE__ */ jsxs68(Fragment15, { children: [
|
|
16126
|
+
/* @__PURE__ */ jsx88("div", { className: cn("truncate font-medium text-lg"), children: event.title }),
|
|
16127
|
+
showTime && hasValidTime && /* @__PURE__ */ jsx88("div", { className: "truncate font-normal opacity-70", children: /* @__PURE__ */ jsx88("span", { className: "inline-block bg-white/5 px-0.5 py-0.5 rounded-full", children: getEventTime() }) })
|
|
16128
|
+
] })
|
|
16129
|
+
}
|
|
16130
|
+
);
|
|
16131
|
+
}
|
|
16132
|
+
if (!hasValidTime) {
|
|
16133
|
+
return /* @__PURE__ */ jsxs68(
|
|
16134
|
+
"button",
|
|
16135
|
+
{
|
|
16136
|
+
className: cn(
|
|
16137
|
+
"flex w-full flex-col gap-2 rounded-lg p-3 text-left outline-none transition-shadow duration-150 ease-out hover:bg-white/3 focus-visible:ring-2 focus-visible:ring-ring/50 focus-visible:border-ring",
|
|
16138
|
+
getEventColorClassesAgenda(eventColor),
|
|
16139
|
+
className
|
|
16140
|
+
),
|
|
16141
|
+
"aria-label": ariaLabel,
|
|
16142
|
+
onClick,
|
|
16143
|
+
onMouseDown,
|
|
16144
|
+
onTouchStart,
|
|
16145
|
+
type: "button",
|
|
16146
|
+
...dndListeners,
|
|
16147
|
+
...dndAttributes,
|
|
16148
|
+
children: [
|
|
16149
|
+
/* @__PURE__ */ jsx88("div", { className: cn("font-medium", agendaOnly ? "text-lg" : "text-sm"), children: event.title }),
|
|
16150
|
+
/* @__PURE__ */ jsx88(
|
|
16151
|
+
"div",
|
|
16152
|
+
{
|
|
16153
|
+
className: cn(
|
|
16154
|
+
"opacity-70 flex items-center gap-2",
|
|
16155
|
+
agendaOnly ? "text-sm" : "text-xs"
|
|
16156
|
+
),
|
|
16157
|
+
children: event.location && /* @__PURE__ */ jsxs68("span", { className: "opacity-80 flex items-center gap-1", children: [
|
|
16158
|
+
"-",
|
|
16159
|
+
/* @__PURE__ */ jsx88("span", { className: "truncate", children: event.location })
|
|
16160
|
+
] })
|
|
16161
|
+
}
|
|
16162
|
+
),
|
|
16163
|
+
event.description && /* @__PURE__ */ jsx88(
|
|
16164
|
+
"div",
|
|
16165
|
+
{
|
|
16166
|
+
className: cn(
|
|
16167
|
+
"my-1 opacity-90",
|
|
16168
|
+
agendaOnly ? "text-md" : "text-xs"
|
|
16169
|
+
),
|
|
16170
|
+
style: {
|
|
16171
|
+
display: "-webkit-box",
|
|
16172
|
+
WebkitLineClamp: 2,
|
|
16173
|
+
WebkitBoxOrient: "vertical",
|
|
16174
|
+
overflow: "hidden"
|
|
16175
|
+
},
|
|
16176
|
+
children: event.description
|
|
16177
|
+
}
|
|
16178
|
+
)
|
|
16179
|
+
]
|
|
16180
|
+
}
|
|
16181
|
+
);
|
|
16182
|
+
}
|
|
16183
|
+
return /* @__PURE__ */ jsxs68(
|
|
16184
|
+
"button",
|
|
16185
|
+
{
|
|
16186
|
+
className: cn(
|
|
16187
|
+
"flex w-full flex-col gap-2 rounded-lg p-3 text-left outline-none transition-shadow duration-150 ease-out hover:bg-white/3 focus-visible:ring-2 focus-visible:ring-ring/50 focus-visible:border-ring data-past-event:line-through data-past-event:opacity-90 border-2 border-border",
|
|
16188
|
+
colorClasses,
|
|
16189
|
+
className
|
|
16190
|
+
),
|
|
16191
|
+
"data-past-event": isPast2(displayEnd) || void 0,
|
|
16192
|
+
"aria-label": ariaLabel,
|
|
16193
|
+
onClick,
|
|
16194
|
+
onMouseDown,
|
|
16195
|
+
onTouchStart,
|
|
16196
|
+
type: "button",
|
|
16197
|
+
...dndListeners,
|
|
16198
|
+
...dndAttributes,
|
|
16199
|
+
children: [
|
|
16200
|
+
/* @__PURE__ */ jsxs68("div", { className: "flex w-full justify-between ", children: [
|
|
16201
|
+
/* @__PURE__ */ jsx88("div", { className: cn("font-bold text-lg"), children: event.title }),
|
|
16202
|
+
/* @__PURE__ */ jsx88("div", { className: cn("opacity-90 flex items-center gap-2 text-lg"), children: event.allDay ? /* @__PURE__ */ jsx88("span", { children: "Dia todo" }) : /* @__PURE__ */ jsxs68("span", { className: "uppercase font-semibold flex items-center gap-2 ", children: [
|
|
16203
|
+
formatTimeWithOptionalMinutes2(displayStart),
|
|
16204
|
+
/* @__PURE__ */ jsx88(ClockUserIcon2, {})
|
|
16205
|
+
] }) })
|
|
16206
|
+
] }),
|
|
16207
|
+
event.description && /* @__PURE__ */ jsx88(
|
|
16208
|
+
"div",
|
|
16209
|
+
{
|
|
16210
|
+
className: cn("my-1 opacity-90 flex text-md"),
|
|
16211
|
+
style: {
|
|
16212
|
+
display: "-webkit-box",
|
|
16213
|
+
WebkitLineClamp: 2,
|
|
16214
|
+
WebkitBoxOrient: "vertical",
|
|
16215
|
+
overflow: "hidden"
|
|
16216
|
+
},
|
|
16217
|
+
children: event.description
|
|
16218
|
+
}
|
|
16219
|
+
)
|
|
16220
|
+
]
|
|
16221
|
+
}
|
|
16222
|
+
);
|
|
16223
|
+
}
|
|
16224
|
+
|
|
16225
|
+
// src/components/event-calendar-view/DroppableCell.tsx
|
|
16226
|
+
import { useDroppable as useDroppable2 } from "@dnd-kit/core";
|
|
16227
|
+
import { jsx as jsx89 } from "react/jsx-runtime";
|
|
16228
|
+
function DroppableCellAgenda({
|
|
16229
|
+
id,
|
|
16230
|
+
date,
|
|
16231
|
+
time,
|
|
16232
|
+
children,
|
|
16233
|
+
className,
|
|
16234
|
+
onClick
|
|
16235
|
+
}) {
|
|
16236
|
+
const { activeEvent } = useCalendarDndAgenda();
|
|
16237
|
+
const { setNodeRef, isOver } = useDroppable2({
|
|
16238
|
+
data: {
|
|
16239
|
+
date,
|
|
16240
|
+
time
|
|
16241
|
+
},
|
|
16242
|
+
id
|
|
16243
|
+
});
|
|
16244
|
+
const formattedTime = time !== void 0 ? `${Math.floor(time)}:${Math.round((time - Math.floor(time)) * 60).toString().padStart(2, "0")}` : null;
|
|
16245
|
+
return /* @__PURE__ */ jsx89(
|
|
16246
|
+
"div",
|
|
16247
|
+
{
|
|
16248
|
+
className: cn(
|
|
16249
|
+
"flex h-full flex-col overflow-hidden px-0.5 py-1 data-dragging:bg-accent sm:px-1",
|
|
16250
|
+
className
|
|
16251
|
+
),
|
|
16252
|
+
"data-dragging": isOver && activeEvent ? true : void 0,
|
|
16253
|
+
onClick,
|
|
16254
|
+
ref: setNodeRef,
|
|
16255
|
+
title: formattedTime ? `${formattedTime}` : void 0,
|
|
16256
|
+
children
|
|
16257
|
+
}
|
|
16258
|
+
);
|
|
16259
|
+
}
|
|
16260
|
+
|
|
16261
|
+
// src/components/event-calendar-view/DayView.tsx
|
|
16262
|
+
import { jsx as jsx90, jsxs as jsxs69 } from "react/jsx-runtime";
|
|
16263
|
+
function DayViewAgenda({
|
|
16264
|
+
currentDate,
|
|
16265
|
+
events,
|
|
16266
|
+
onEventSelect,
|
|
16267
|
+
showUndatedEvents
|
|
16268
|
+
}) {
|
|
16269
|
+
const hours = useMemo21(() => {
|
|
16270
|
+
const dayStart = startOfDay3(currentDate);
|
|
16271
|
+
return eachHourOfInterval3({
|
|
16272
|
+
end: addHours4(dayStart, EndHourAgenda - 1),
|
|
16273
|
+
start: addHours4(dayStart, StartHourAgenda)
|
|
16274
|
+
});
|
|
16275
|
+
}, [currentDate]);
|
|
16276
|
+
const dayEvents = useMemo21(() => {
|
|
16277
|
+
return events.filter((event) => {
|
|
16278
|
+
const eventStart = new Date(event.start ?? event.end ?? Date.now());
|
|
16279
|
+
const eventEnd = new Date(event.end ?? event.start ?? Date.now());
|
|
16280
|
+
return isSameDay9(currentDate, eventStart) || isSameDay9(currentDate, eventEnd) || currentDate > eventStart && currentDate < eventEnd;
|
|
16281
|
+
}).sort(
|
|
16282
|
+
(a, b) => new Date(a.start ?? a.end ?? Date.now()).getTime() - new Date(b.start ?? b.end ?? Date.now()).getTime()
|
|
16283
|
+
);
|
|
16284
|
+
}, [currentDate, events]);
|
|
16285
|
+
const allDayEvents = useMemo21(() => {
|
|
16286
|
+
return dayEvents.filter((event) => {
|
|
16287
|
+
return event.allDay || isMultiDayEventAgenda(event);
|
|
16288
|
+
});
|
|
16289
|
+
}, [dayEvents]);
|
|
16290
|
+
const timeEvents = useMemo21(() => {
|
|
16291
|
+
return dayEvents.filter((event) => {
|
|
16292
|
+
return !event.allDay && !isMultiDayEventAgenda(event);
|
|
16293
|
+
});
|
|
16294
|
+
}, [dayEvents]);
|
|
16295
|
+
const positionedEvents = useMemo21(() => {
|
|
16296
|
+
const result = [];
|
|
16297
|
+
const dayStart = startOfDay3(currentDate);
|
|
16298
|
+
const sortedEvents = [...timeEvents].sort((a, b) => {
|
|
16299
|
+
const aStart = new Date(a.start ?? a.end ?? Date.now());
|
|
16300
|
+
const bStart = new Date(b.start ?? b.end ?? Date.now());
|
|
16301
|
+
const aEnd = new Date(a.end ?? a.start ?? Date.now());
|
|
16302
|
+
const bEnd = new Date(b.end ?? b.start ?? Date.now());
|
|
16303
|
+
if (aStart < bStart) return -1;
|
|
16304
|
+
if (aStart > bStart) return 1;
|
|
16305
|
+
const aDuration = differenceInMinutes7(aEnd, aStart);
|
|
16306
|
+
const bDuration = differenceInMinutes7(bEnd, bStart);
|
|
16307
|
+
return bDuration - aDuration;
|
|
16308
|
+
});
|
|
16309
|
+
const columns = [];
|
|
16310
|
+
for (const event of sortedEvents) {
|
|
16311
|
+
const eventStart = new Date(event.start ?? event.end ?? Date.now());
|
|
16312
|
+
const eventEnd = new Date(event.end ?? event.start ?? Date.now());
|
|
16313
|
+
const adjustedStart = isSameDay9(currentDate, eventStart) ? eventStart : dayStart;
|
|
16314
|
+
const adjustedEnd = isSameDay9(currentDate, eventEnd) ? eventEnd : addHours4(dayStart, 24);
|
|
16315
|
+
const startHour = getHours3(adjustedStart) + getMinutes3(adjustedStart) / 60;
|
|
16316
|
+
const endHour = getHours3(adjustedEnd) + getMinutes3(adjustedEnd) / 60;
|
|
16317
|
+
const top = (startHour - StartHourAgenda) * WeekCellsHeightAgenda;
|
|
16318
|
+
const height = (endHour - startHour) * WeekCellsHeightAgenda;
|
|
16319
|
+
let columnIndex = 0;
|
|
16320
|
+
let placed = false;
|
|
16321
|
+
while (!placed) {
|
|
16322
|
+
const col = columns[columnIndex] || [];
|
|
16323
|
+
if (col.length === 0) {
|
|
16324
|
+
columns[columnIndex] = col;
|
|
16325
|
+
placed = true;
|
|
16326
|
+
} else {
|
|
16327
|
+
const overlaps = col.some(
|
|
16328
|
+
(c) => areIntervalsOverlapping3(
|
|
16329
|
+
{ end: adjustedEnd, start: adjustedStart },
|
|
16330
|
+
{
|
|
16331
|
+
end: new Date(c.event.end ?? c.event.start ?? Date.now()),
|
|
16332
|
+
start: new Date(c.event.start ?? c.event.end ?? Date.now())
|
|
16333
|
+
}
|
|
16334
|
+
)
|
|
16335
|
+
);
|
|
16336
|
+
if (!overlaps) {
|
|
16337
|
+
placed = true;
|
|
16338
|
+
} else {
|
|
16339
|
+
columnIndex++;
|
|
16340
|
+
}
|
|
16341
|
+
}
|
|
16342
|
+
}
|
|
16343
|
+
const currentColumn = columns[columnIndex] || [];
|
|
16344
|
+
columns[columnIndex] = currentColumn;
|
|
16345
|
+
currentColumn.push({
|
|
16346
|
+
end: adjustedEnd,
|
|
16347
|
+
event,
|
|
16348
|
+
start: adjustedStart
|
|
16349
|
+
});
|
|
16350
|
+
const width = columnIndex === 0 ? 1 : 0.9;
|
|
16351
|
+
const left = columnIndex === 0 ? 0 : columnIndex * 0.1;
|
|
16352
|
+
result.push({
|
|
16353
|
+
event,
|
|
16354
|
+
height,
|
|
16355
|
+
left,
|
|
16356
|
+
top,
|
|
16357
|
+
width,
|
|
16358
|
+
zIndex: 10 + columnIndex
|
|
16359
|
+
});
|
|
16360
|
+
}
|
|
16361
|
+
return result;
|
|
16362
|
+
}, [currentDate, timeEvents]);
|
|
16363
|
+
const handleEventClick = (event, e) => {
|
|
16364
|
+
e.stopPropagation();
|
|
16365
|
+
onEventSelect(event);
|
|
16366
|
+
};
|
|
16367
|
+
const showAllDaySection = allDayEvents.length > 0;
|
|
16368
|
+
const { currentTimePosition, currentTimeVisible } = useCurrentTimeIndicatorAgenda(currentDate, "day");
|
|
16369
|
+
return /* @__PURE__ */ jsxs69("div", { className: "contents", "data-slot": "day-view", children: [
|
|
16370
|
+
showAllDaySection && /* @__PURE__ */ jsx90("div", { className: "border-border/70 border-t bg-muted/50", children: /* @__PURE__ */ jsxs69("div", { className: "grid grid-cols-[3rem_1fr] sm:grid-cols-[4rem_1fr]", children: [
|
|
16371
|
+
/* @__PURE__ */ jsx90("div", { className: "relative", children: /* @__PURE__ */ jsx90("span", { className: "absolute bottom-0 left-0 h-6 w-16 max-w-full pe-2 text-right text-[10px] text-muted-foreground/70 sm:pe-4 sm:text-xs", children: "All day" }) }),
|
|
16372
|
+
/* @__PURE__ */ jsx90("div", { className: "relative border-border/70 border-r p-1 last:border-r-0", children: allDayEvents.map((event) => {
|
|
16373
|
+
const eventStart = new Date(
|
|
16374
|
+
event.start ?? event.end ?? Date.now()
|
|
16375
|
+
);
|
|
16376
|
+
const eventEnd = new Date(
|
|
16377
|
+
event.end ?? event.start ?? Date.now()
|
|
16378
|
+
);
|
|
16379
|
+
const isFirstDay = isSameDay9(currentDate, eventStart);
|
|
16380
|
+
const isLastDay = isSameDay9(currentDate, eventEnd);
|
|
16381
|
+
return /* @__PURE__ */ jsx90(
|
|
16382
|
+
EventItemAgenda,
|
|
16383
|
+
{
|
|
16384
|
+
event,
|
|
16385
|
+
isFirstDay,
|
|
16386
|
+
isLastDay,
|
|
16387
|
+
onClick: (e) => handleEventClick(event, e),
|
|
16388
|
+
view: "month",
|
|
16389
|
+
children: /* @__PURE__ */ jsx90("div", { children: event.title })
|
|
16390
|
+
},
|
|
16391
|
+
`spanning-${event.id}`
|
|
16392
|
+
);
|
|
16393
|
+
}) })
|
|
16394
|
+
] }) }),
|
|
16395
|
+
/* @__PURE__ */ jsxs69("div", { className: "grid flex-1 grid-cols-[3rem_1fr] overflow-hidden border-border/70 border-t sm:grid-cols-[4rem_1fr]", children: [
|
|
16396
|
+
/* @__PURE__ */ jsx90("div", { children: hours.map((hour, index) => /* @__PURE__ */ jsx90(
|
|
16397
|
+
"div",
|
|
16398
|
+
{
|
|
16399
|
+
className: "relative h-[var(--week-cells-height)] border-border/70 border-b last:border-b-0",
|
|
16400
|
+
children: index > 0 && /* @__PURE__ */ jsx90("span", { className: "-top-3 absolute left-0 flex h-6 w-16 max-w-full items-center justify-end bg-background pe-2 text-[10px] text-muted-foreground/70 sm:pe-4 sm:text-xs", children: format13(hour, "HH:mm") })
|
|
16401
|
+
},
|
|
16402
|
+
hour.toString()
|
|
16403
|
+
)) }),
|
|
16404
|
+
/* @__PURE__ */ jsxs69("div", { className: "relative", children: [
|
|
16405
|
+
positionedEvents.map((positionedEvent) => {
|
|
16406
|
+
const evt = positionedEvent.event;
|
|
16407
|
+
const eventStart = new Date(evt.start ?? evt.end ?? Date.now());
|
|
16408
|
+
const eventEnd = new Date(evt.end ?? evt.start ?? Date.now());
|
|
16409
|
+
const isFirstDay = isSameDay9(currentDate, eventStart);
|
|
16410
|
+
const isLastDay = isSameDay9(currentDate, eventEnd);
|
|
16411
|
+
return /* @__PURE__ */ jsx90(
|
|
16412
|
+
"div",
|
|
16413
|
+
{
|
|
16414
|
+
className: "absolute z-10 px-0.5",
|
|
16415
|
+
style: {
|
|
16416
|
+
height: `${positionedEvent.height}px`,
|
|
16417
|
+
left: `${positionedEvent.left * 100}%`,
|
|
16418
|
+
top: `${positionedEvent.top}px`,
|
|
16419
|
+
width: `${positionedEvent.width * 100}%`,
|
|
16420
|
+
zIndex: positionedEvent.zIndex
|
|
16421
|
+
},
|
|
16422
|
+
children: /* @__PURE__ */ jsx90(
|
|
16423
|
+
EventItemAgenda,
|
|
16424
|
+
{
|
|
16425
|
+
event: evt,
|
|
16426
|
+
view: "day",
|
|
16427
|
+
isFirstDay,
|
|
16428
|
+
isLastDay,
|
|
16429
|
+
onClick: (e) => handleEventClick(evt, e),
|
|
16430
|
+
showTime: true
|
|
16431
|
+
}
|
|
16432
|
+
)
|
|
16433
|
+
},
|
|
16434
|
+
positionedEvent.event.id
|
|
16435
|
+
);
|
|
16436
|
+
}),
|
|
16437
|
+
currentTimeVisible && /* @__PURE__ */ jsx90(
|
|
16438
|
+
"div",
|
|
16439
|
+
{
|
|
16440
|
+
className: "pointer-events-none absolute right-0 left-0 z-20",
|
|
16441
|
+
style: { top: `${currentTimePosition}%` },
|
|
16442
|
+
children: /* @__PURE__ */ jsxs69("div", { className: "relative flex items-center", children: [
|
|
16443
|
+
/* @__PURE__ */ jsx90("div", { className: "-left-1 absolute h-2 w-2 rounded-full bg-primary" }),
|
|
16444
|
+
/* @__PURE__ */ jsx90("div", { className: "h-[2px] w-full bg-primary" })
|
|
16445
|
+
] })
|
|
16446
|
+
}
|
|
16447
|
+
),
|
|
16448
|
+
hours.map((hour) => {
|
|
16449
|
+
const hourValue = getHours3(hour);
|
|
16450
|
+
return /* @__PURE__ */ jsx90(
|
|
16451
|
+
"div",
|
|
16452
|
+
{
|
|
16453
|
+
className: "relative h-[var(--week-cells-height)] border-border/70 border-b last:border-b-0",
|
|
16454
|
+
children: [0, 1, 2, 3].map((quarter) => {
|
|
16455
|
+
const quarterHourTime = hourValue + quarter * 0.25;
|
|
16456
|
+
return /* @__PURE__ */ jsx90(
|
|
16457
|
+
DroppableCellAgenda,
|
|
16458
|
+
{
|
|
16459
|
+
className: cn(
|
|
16460
|
+
"absolute h-[calc(var(--week-cells-height)/4)] w-full",
|
|
16461
|
+
quarter === 0 && "top-0",
|
|
16462
|
+
quarter === 1 && "top-[calc(var(--week-cells-height)/4)]",
|
|
16463
|
+
quarter === 2 && "top-[calc(var(--week-cells-height)/4*2)]",
|
|
16464
|
+
quarter === 3 && "top-[calc(var(--week-cells-height)/4*3)]"
|
|
16465
|
+
),
|
|
16466
|
+
date: currentDate,
|
|
16467
|
+
id: `day-cell-${currentDate.toISOString()}-${quarterHourTime}`,
|
|
16468
|
+
onClick: () => {
|
|
16469
|
+
const startTime = new Date(currentDate);
|
|
16470
|
+
startTime.setHours(hourValue);
|
|
16471
|
+
startTime.setMinutes(quarter * 15);
|
|
16472
|
+
},
|
|
16473
|
+
time: quarterHourTime
|
|
16474
|
+
},
|
|
16475
|
+
`${hour.toString()}-${quarter}`
|
|
16476
|
+
);
|
|
16477
|
+
})
|
|
16478
|
+
},
|
|
16479
|
+
hour.toString()
|
|
16480
|
+
);
|
|
16481
|
+
})
|
|
16482
|
+
] })
|
|
16483
|
+
] }),
|
|
16484
|
+
/* @__PURE__ */ jsx90(
|
|
16485
|
+
UndatedEvents,
|
|
16486
|
+
{
|
|
16487
|
+
events,
|
|
16488
|
+
onEventSelect,
|
|
16489
|
+
show: showUndatedEvents
|
|
16490
|
+
}
|
|
16491
|
+
)
|
|
16492
|
+
] });
|
|
16493
|
+
}
|
|
16494
|
+
|
|
16495
|
+
// src/components/event-calendar-view/EventAgenda.tsx
|
|
16496
|
+
import {
|
|
16497
|
+
addDays as addDays5,
|
|
16498
|
+
addMonths as addMonths2,
|
|
16499
|
+
addWeeks as addWeeks2,
|
|
16500
|
+
endOfWeek as endOfWeek6,
|
|
16501
|
+
format as format14,
|
|
16502
|
+
isSameMonth as isSameMonth3,
|
|
16503
|
+
startOfWeek as startOfWeek6,
|
|
16504
|
+
subMonths as subMonths2,
|
|
16505
|
+
subWeeks as subWeeks2
|
|
16506
|
+
} from "date-fns";
|
|
16507
|
+
import { ptBR as ptBR12 } from "date-fns/locale";
|
|
16508
|
+
import { useMemo as useMemo22, useState as useState33 } from "react";
|
|
16509
|
+
import { toast as toast4 } from "sonner";
|
|
16510
|
+
import { CaretLeftIcon as CaretLeftIcon4, CaretRightIcon as CaretRightIcon7 } from "@phosphor-icons/react";
|
|
16511
|
+
import { jsx as jsx91, jsxs as jsxs70 } from "react/jsx-runtime";
|
|
16512
|
+
function EventAgenda({
|
|
16513
|
+
events = [],
|
|
16514
|
+
onEventUpdate,
|
|
16515
|
+
className,
|
|
16516
|
+
initialView = "month",
|
|
16517
|
+
initialDate
|
|
16518
|
+
}) {
|
|
16519
|
+
const [currentDate, setCurrentDate] = useState33(
|
|
16520
|
+
initialDate && new Date(initialDate) || /* @__PURE__ */ new Date()
|
|
16521
|
+
);
|
|
16522
|
+
const [view, setView] = useState33(initialView);
|
|
16523
|
+
const goPrevious = () => {
|
|
16524
|
+
if (view === "month") setCurrentDate((d) => subMonths2(d, 1));
|
|
16525
|
+
else if (view === "week") setCurrentDate((d) => subWeeks2(d, 1));
|
|
16526
|
+
else if (view === "day") setCurrentDate((d) => addDays5(d, -1));
|
|
16527
|
+
else if (view === "agenda")
|
|
16528
|
+
setCurrentDate((d) => addDays5(d, -AgendaDaysToShowAgenda));
|
|
16529
|
+
};
|
|
16530
|
+
const goNext = () => {
|
|
16531
|
+
if (view === "month") setCurrentDate((d) => addMonths2(d, 1));
|
|
16532
|
+
else if (view === "week") setCurrentDate((d) => addWeeks2(d, 1));
|
|
16533
|
+
else if (view === "day") setCurrentDate((d) => addDays5(d, 1));
|
|
16534
|
+
else if (view === "agenda")
|
|
16535
|
+
setCurrentDate((d) => addDays5(d, AgendaDaysToShowAgenda));
|
|
16536
|
+
};
|
|
16537
|
+
const handleEventSelect = (event) => {
|
|
16538
|
+
console.log("Event selected:", event);
|
|
16539
|
+
};
|
|
16540
|
+
const handleEventUpdate = (updatedEvent) => {
|
|
16541
|
+
onEventUpdate?.(updatedEvent);
|
|
16542
|
+
const startDate = updatedEvent.start ?? /* @__PURE__ */ new Date();
|
|
16543
|
+
toast4(`Evento "${updatedEvent.title}" movido`, {
|
|
16544
|
+
description: format14(startDate, "d 'de' MMMM 'de' yyyy", { locale: ptBR12 }),
|
|
16545
|
+
position: "bottom-left"
|
|
16546
|
+
});
|
|
16547
|
+
};
|
|
16548
|
+
const viewLabel = (v, condensed = false) => {
|
|
16549
|
+
const labels = {
|
|
16550
|
+
month: { full: "M\xEAs", short: "M" },
|
|
16551
|
+
week: { full: "Semana", short: "S" },
|
|
16552
|
+
day: { full: "Dia", short: "D" },
|
|
16553
|
+
agenda: { full: "Agenda", short: "A" }
|
|
16554
|
+
};
|
|
16555
|
+
const entry = labels[v] || { full: v, short: v };
|
|
16556
|
+
return condensed ? entry.short : entry.full;
|
|
16557
|
+
};
|
|
16558
|
+
const viewTitle = useMemo22(() => {
|
|
16559
|
+
const capitalize = (s) => s ? s.charAt(0).toUpperCase() + s.slice(1) : s;
|
|
16560
|
+
if (view === "month")
|
|
16561
|
+
return capitalize(format14(currentDate, "MMMM yyyy", { locale: ptBR12 }));
|
|
16562
|
+
if (view === "week") {
|
|
16563
|
+
const start = startOfWeek6(currentDate, { weekStartsOn: 1 });
|
|
16564
|
+
const end = endOfWeek6(currentDate, { weekStartsOn: 1 });
|
|
16565
|
+
if (isSameMonth3(start, end))
|
|
16566
|
+
return capitalize(format14(start, "MMMM yyyy", { locale: ptBR12 }));
|
|
16567
|
+
const s1 = capitalize(format14(start, "MMM", { locale: ptBR12 }));
|
|
16568
|
+
const s2 = capitalize(format14(end, "MMM yyyy", { locale: ptBR12 }));
|
|
16569
|
+
return `${s1} - ${s2}`;
|
|
16570
|
+
}
|
|
16571
|
+
if (view === "day")
|
|
16572
|
+
return format14(currentDate, "d 'de' MMMM 'de' yyyy", { locale: ptBR12 });
|
|
16573
|
+
if (view === "agenda") {
|
|
16574
|
+
const start = currentDate;
|
|
16575
|
+
const end = addDays5(currentDate, AgendaDaysToShowAgenda - 1);
|
|
16576
|
+
if (isSameMonth3(start, end))
|
|
16577
|
+
return capitalize(format14(start, "MMMM yyyy", { locale: ptBR12 }));
|
|
16578
|
+
const s1 = capitalize(format14(start, "MMMM", { locale: ptBR12 }));
|
|
16579
|
+
const s2 = capitalize(format14(end, "MMMM yyyy", { locale: ptBR12 }));
|
|
16580
|
+
return `${s1} - ${s2}`;
|
|
16581
|
+
}
|
|
16582
|
+
return capitalize(format14(currentDate, "MMMM yyyy", { locale: ptBR12 }));
|
|
16583
|
+
}, [currentDate, view]);
|
|
16584
|
+
return /* @__PURE__ */ jsx91(
|
|
16585
|
+
"div",
|
|
16586
|
+
{
|
|
16587
|
+
className: cn(
|
|
16588
|
+
"flex flex-col rounded-lg border has-data-[slot=month-view]:flex-1 px-6 py-2",
|
|
16589
|
+
className
|
|
16590
|
+
),
|
|
16591
|
+
style: {
|
|
16592
|
+
"--event-gap": `${EventGapAgenda}px`,
|
|
16593
|
+
"--event-height": `${EventHeightAgenda}px`,
|
|
16594
|
+
"--week-cells-height": `${WeekCellsHeightAgenda}px`
|
|
16595
|
+
},
|
|
16596
|
+
children: /* @__PURE__ */ jsxs70(CalendarDndProviderAgenda, { onEventUpdate: handleEventUpdate, children: [
|
|
16597
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center justify-between p-2 sm:p-4", children: [
|
|
16598
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1 sm:gap-4", children: [
|
|
16599
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center sm:gap-2", children: [
|
|
16600
|
+
/* @__PURE__ */ jsx91(
|
|
16601
|
+
ButtonBase,
|
|
16602
|
+
{
|
|
16603
|
+
"aria-label": "Anterior",
|
|
16604
|
+
onClick: goPrevious,
|
|
16605
|
+
size: "icon",
|
|
16606
|
+
variant: "ghost",
|
|
16607
|
+
children: /* @__PURE__ */ jsx91(CaretLeftIcon4, { "aria-hidden": true, size: 16 })
|
|
16608
|
+
}
|
|
16609
|
+
),
|
|
16610
|
+
/* @__PURE__ */ jsx91(
|
|
16611
|
+
ButtonBase,
|
|
16612
|
+
{
|
|
16613
|
+
"aria-label": "Pr\xF3ximo",
|
|
16614
|
+
onClick: goNext,
|
|
16615
|
+
size: "icon",
|
|
16616
|
+
variant: "ghost",
|
|
16617
|
+
children: /* @__PURE__ */ jsx91(CaretRightIcon7, { "aria-hidden": true, size: 16 })
|
|
16618
|
+
}
|
|
16619
|
+
)
|
|
16620
|
+
] }),
|
|
16621
|
+
/* @__PURE__ */ jsx91("h2", { className: "font-semibold text-md sm:text-xl", children: viewTitle })
|
|
16622
|
+
] }),
|
|
16623
|
+
/* @__PURE__ */ jsx91("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsx91(
|
|
16624
|
+
Select,
|
|
16625
|
+
{
|
|
16626
|
+
selected: view,
|
|
16627
|
+
onChange: (v) => {
|
|
16628
|
+
setView(v);
|
|
16629
|
+
},
|
|
16630
|
+
items: ["month", "week", "day", "agenda"].map((v) => ({
|
|
16631
|
+
label: viewLabel(v),
|
|
16632
|
+
value: v
|
|
16633
|
+
})),
|
|
16634
|
+
className: "gap-2 px-3 py-1.5 max-[479px]:h-8",
|
|
16635
|
+
placeholder: viewLabel(view)
|
|
16636
|
+
}
|
|
16637
|
+
) })
|
|
16638
|
+
] }),
|
|
16639
|
+
/* @__PURE__ */ jsxs70(
|
|
16640
|
+
"div",
|
|
16641
|
+
{
|
|
16642
|
+
className: "flex flex-1 flex-col transition-all duration-200 ease-in-out",
|
|
16643
|
+
"aria-live": "polite",
|
|
16644
|
+
children: [
|
|
16645
|
+
view === "month" && /* @__PURE__ */ jsx91(
|
|
16646
|
+
MonthViewAgenda,
|
|
16647
|
+
{
|
|
16648
|
+
currentDate,
|
|
16649
|
+
events,
|
|
16650
|
+
onEventSelect: handleEventSelect
|
|
16651
|
+
}
|
|
16652
|
+
),
|
|
16653
|
+
view === "week" && /* @__PURE__ */ jsx91(
|
|
16654
|
+
WeekViewAgenda,
|
|
16655
|
+
{
|
|
16656
|
+
currentDate,
|
|
16657
|
+
events,
|
|
16658
|
+
onEventSelect: handleEventSelect
|
|
16659
|
+
}
|
|
16660
|
+
),
|
|
16661
|
+
view === "day" && /* @__PURE__ */ jsx91(
|
|
16662
|
+
DayViewAgenda,
|
|
16663
|
+
{
|
|
16664
|
+
currentDate,
|
|
16665
|
+
events,
|
|
16666
|
+
onEventSelect: handleEventSelect
|
|
16667
|
+
}
|
|
16668
|
+
),
|
|
16669
|
+
view === "agenda" && /* @__PURE__ */ jsx91(
|
|
16670
|
+
Agenda,
|
|
16671
|
+
{
|
|
16672
|
+
currentDate,
|
|
16673
|
+
events,
|
|
16674
|
+
onEventSelect: handleEventSelect
|
|
16675
|
+
}
|
|
16676
|
+
)
|
|
16677
|
+
]
|
|
16678
|
+
}
|
|
16679
|
+
)
|
|
16680
|
+
] })
|
|
16681
|
+
}
|
|
16682
|
+
);
|
|
16683
|
+
}
|
|
16684
|
+
|
|
16685
|
+
// src/components/event-calendar-view/UndatedEvents.tsx
|
|
16686
|
+
import { useMemo as useMemo23 } from "react";
|
|
16687
|
+
import { jsx as jsx92, jsxs as jsxs71 } from "react/jsx-runtime";
|
|
16688
|
+
var isValidDate5 = (d) => {
|
|
16689
|
+
try {
|
|
16690
|
+
const t = d instanceof Date ? d.getTime() : new Date(String(d)).getTime();
|
|
16691
|
+
return !isNaN(t);
|
|
16692
|
+
} catch {
|
|
16693
|
+
return false;
|
|
16694
|
+
}
|
|
16695
|
+
};
|
|
16696
|
+
function UndatedEvents({
|
|
16697
|
+
events,
|
|
16698
|
+
onEventSelect,
|
|
16699
|
+
className,
|
|
16700
|
+
title = "Data de Atendimento n\xE3o Prevista",
|
|
16701
|
+
show = true
|
|
16702
|
+
}) {
|
|
16703
|
+
const undatedEvents = useMemo23(
|
|
16704
|
+
() => events.filter((e) => !(isValidDate5(e.start) || isValidDate5(e.end))),
|
|
16705
|
+
[events]
|
|
16706
|
+
);
|
|
16707
|
+
if (!show || undatedEvents.length === 0) return null;
|
|
16708
|
+
return /* @__PURE__ */ jsx92("div", { className, children: /* @__PURE__ */ jsxs71("div", { className: "relative border-border/70 border-t", children: [
|
|
16709
|
+
/* @__PURE__ */ jsx92("span", { className: "-top-3 absolute left-0 flex h-6 items-center bg-background pe-4 uppercase sm:pe-4 text-md sm:text-lg", children: title }),
|
|
16710
|
+
/* @__PURE__ */ jsx92("div", { className: "mt-6 space-y-2", children: undatedEvents.map((event) => /* @__PURE__ */ jsx92(
|
|
16711
|
+
EventItemAgenda,
|
|
16712
|
+
{
|
|
16713
|
+
event,
|
|
16714
|
+
onClick: onEventSelect ? () => onEventSelect(event) : void 0,
|
|
16715
|
+
view: "agenda",
|
|
16716
|
+
agendaOnly: true,
|
|
16717
|
+
className: "cursor-default hover:shadow-none hover:scale-100 bg-gray-200/50 hover:bg-gray-200/40 text-gray-900/80 dark:bg-gray-700/25 dark:text-gray-200/90 shadow-none "
|
|
16718
|
+
},
|
|
16719
|
+
event.id
|
|
16720
|
+
)) })
|
|
16721
|
+
] }) });
|
|
16722
|
+
}
|
|
16723
|
+
|
|
16724
|
+
// src/components/event-calendar-view/hooks/use-event-visibility.ts
|
|
16725
|
+
import { useLayoutEffect as useLayoutEffect3, useMemo as useMemo24, useRef as useRef16, useState as useState34 } from "react";
|
|
16726
|
+
function useEventVisibilityAgenda({
|
|
16727
|
+
eventHeight,
|
|
16728
|
+
eventGap
|
|
16729
|
+
}) {
|
|
16730
|
+
const contentRef = useRef16(null);
|
|
16731
|
+
const observerRef = useRef16(null);
|
|
16732
|
+
const [contentHeight, setContentHeight] = useState34(null);
|
|
16733
|
+
useLayoutEffect3(() => {
|
|
16734
|
+
if (!contentRef.current) return;
|
|
16735
|
+
const updateHeight = () => {
|
|
16736
|
+
if (contentRef.current) {
|
|
16737
|
+
setContentHeight(contentRef.current.clientHeight);
|
|
16738
|
+
}
|
|
16739
|
+
};
|
|
16740
|
+
updateHeight();
|
|
16741
|
+
if (!observerRef.current) {
|
|
16742
|
+
observerRef.current = new ResizeObserver(() => {
|
|
16743
|
+
updateHeight();
|
|
16744
|
+
});
|
|
16745
|
+
}
|
|
16746
|
+
observerRef.current.observe(contentRef.current);
|
|
16747
|
+
return () => {
|
|
16748
|
+
if (observerRef.current) {
|
|
16749
|
+
observerRef.current.disconnect();
|
|
16750
|
+
}
|
|
16751
|
+
};
|
|
16752
|
+
}, []);
|
|
16753
|
+
const getVisibleEventCount = useMemo24(() => {
|
|
16754
|
+
return (totalEvents) => {
|
|
16755
|
+
if (!contentHeight) return totalEvents;
|
|
16756
|
+
const maxEvents = Math.floor(contentHeight / (eventHeight + eventGap));
|
|
16757
|
+
if (totalEvents <= maxEvents) {
|
|
16758
|
+
return totalEvents;
|
|
16759
|
+
}
|
|
16760
|
+
return maxEvents > 0 ? maxEvents - 1 : 0;
|
|
16761
|
+
};
|
|
16762
|
+
}, [contentHeight, eventHeight, eventGap]);
|
|
16763
|
+
return {
|
|
16764
|
+
contentHeight,
|
|
16765
|
+
contentRef,
|
|
16766
|
+
getVisibleEventCount
|
|
16767
|
+
};
|
|
16768
|
+
}
|
|
16769
|
+
|
|
16770
|
+
// src/components/event-calendar-view/MonthView.tsx
|
|
16771
|
+
import {
|
|
16772
|
+
addDays as addDays6,
|
|
16773
|
+
eachDayOfInterval as eachDayOfInterval3,
|
|
16774
|
+
endOfMonth as endOfMonth2,
|
|
16775
|
+
endOfWeek as endOfWeek7,
|
|
16776
|
+
format as format15,
|
|
16777
|
+
isSameDay as isSameDay10,
|
|
16778
|
+
isSameMonth as isSameMonth4,
|
|
16779
|
+
isToday as isToday5,
|
|
16780
|
+
startOfMonth as startOfMonth2,
|
|
16781
|
+
startOfWeek as startOfWeek7
|
|
16782
|
+
} from "date-fns";
|
|
16783
|
+
import { ptBR as ptBR13 } from "date-fns/locale";
|
|
16784
|
+
import { useEffect as useEffect27, useMemo as useMemo25, useState as useState35 } from "react";
|
|
16785
|
+
import { twMerge as twMerge3 } from "tailwind-merge";
|
|
16786
|
+
import { jsx as jsx93, jsxs as jsxs72 } from "react/jsx-runtime";
|
|
16787
|
+
function MonthViewAgenda({
|
|
16788
|
+
currentDate,
|
|
16789
|
+
events,
|
|
16790
|
+
onEventSelect,
|
|
16791
|
+
showUndatedEvents
|
|
16792
|
+
}) {
|
|
16793
|
+
const days = useMemo25(() => {
|
|
16794
|
+
const monthStart = startOfMonth2(currentDate);
|
|
16795
|
+
const monthEnd = endOfMonth2(monthStart);
|
|
16796
|
+
const calendarStart = startOfWeek7(monthStart, { weekStartsOn: 0 });
|
|
16797
|
+
const calendarEnd = endOfWeek7(monthEnd, { weekStartsOn: 0 });
|
|
16798
|
+
return eachDayOfInterval3({ end: calendarEnd, start: calendarStart });
|
|
16799
|
+
}, [currentDate]);
|
|
16800
|
+
const weekdays = useMemo25(() => {
|
|
16801
|
+
return Array.from({ length: 7 }).map((_, i) => {
|
|
16802
|
+
const date = addDays6(startOfWeek7(/* @__PURE__ */ new Date(), { weekStartsOn: 0 }), i);
|
|
16803
|
+
const short = format15(date, "EEE", { locale: ptBR13 });
|
|
16804
|
+
return short.charAt(0).toUpperCase() + short.slice(1);
|
|
16805
|
+
});
|
|
16806
|
+
}, []);
|
|
16807
|
+
const weeks = useMemo25(() => {
|
|
16808
|
+
const result = [];
|
|
16809
|
+
let week = [];
|
|
16810
|
+
for (let i = 0; i < days.length; i++) {
|
|
16811
|
+
week.push(days[i]);
|
|
16812
|
+
if (week.length === 7 || i === days.length - 1) {
|
|
16813
|
+
result.push(week);
|
|
16814
|
+
week = [];
|
|
16815
|
+
}
|
|
16816
|
+
}
|
|
16817
|
+
return result;
|
|
16818
|
+
}, [days]);
|
|
16819
|
+
const handleEventClick = (event, e) => {
|
|
16820
|
+
e.stopPropagation();
|
|
16821
|
+
onEventSelect(event);
|
|
16822
|
+
};
|
|
16823
|
+
const [isMounted, setIsMounted] = useState35(false);
|
|
16824
|
+
const { contentRef, getVisibleEventCount } = useEventVisibilityAgenda({
|
|
16825
|
+
eventGap: EventGapAgenda,
|
|
16826
|
+
eventHeight: EventHeightAgenda
|
|
16827
|
+
});
|
|
16828
|
+
useEffect27(() => {
|
|
16829
|
+
setIsMounted(true);
|
|
16830
|
+
}, []);
|
|
16831
|
+
return /* @__PURE__ */ jsxs72("div", { className: "contents", "data-slot": "month-view", children: [
|
|
16832
|
+
/* @__PURE__ */ jsx93("div", { className: "grid grid-cols-7 border-border/70 border-b", children: weekdays.map((day) => /* @__PURE__ */ jsx93(
|
|
16833
|
+
"div",
|
|
16834
|
+
{
|
|
16835
|
+
className: "py-2 text-center text-muted-foreground/70 text-sm uppercase tracking-wide bg-muted/5",
|
|
16836
|
+
children: day
|
|
16837
|
+
},
|
|
16838
|
+
day
|
|
16839
|
+
)) }),
|
|
16840
|
+
/* @__PURE__ */ jsx93("div", { className: "grid flex-1 auto-rows-fr", children: weeks.map((week, weekIndex) => /* @__PURE__ */ jsx93(
|
|
16841
|
+
"div",
|
|
16842
|
+
{
|
|
16843
|
+
className: "grid grid-cols-7 [&:last-child>*]:border-b-0",
|
|
16844
|
+
children: week.map((day, dayIndex) => {
|
|
16845
|
+
if (!day) return null;
|
|
16846
|
+
const dayEvents = getEventsForDayAgenda(events, day);
|
|
16847
|
+
const spanningEvents = getSpanningEventsForDayAgenda(events, day);
|
|
16848
|
+
const isCurrentMonth = isSameMonth4(day, currentDate);
|
|
16849
|
+
const cellId = `month-cell-${day.toISOString()}`;
|
|
16850
|
+
const allDayEvents = [...spanningEvents, ...dayEvents];
|
|
16851
|
+
const allEvents = getAllEventsForDayAgenda(events, day);
|
|
16852
|
+
const isReferenceCell = weekIndex === 0 && dayIndex === 0;
|
|
16853
|
+
const visibleCount = isMounted ? getVisibleEventCount(allDayEvents.length) : void 0;
|
|
16854
|
+
const hasMore = visibleCount !== void 0 && allDayEvents.length > visibleCount;
|
|
16855
|
+
const remainingCount = hasMore ? allDayEvents.length - visibleCount : 0;
|
|
16856
|
+
return /* @__PURE__ */ jsx93(
|
|
16857
|
+
"div",
|
|
16858
|
+
{
|
|
16859
|
+
className: "group border-border/70 border-r border-b last:border-r-0 data-outside-cell:bg-muted/25 data-outside-cell:text-muted-foreground/70 hover:bg-muted/5 transition-colors p-2 ",
|
|
16860
|
+
"data-outside-cell": !isCurrentMonth || void 0,
|
|
16861
|
+
"data-today": isToday5(day) || void 0,
|
|
16862
|
+
children: /* @__PURE__ */ jsxs72(
|
|
16863
|
+
DroppableCellAgenda,
|
|
16864
|
+
{
|
|
16865
|
+
date: day,
|
|
16866
|
+
id: cellId,
|
|
16867
|
+
onClick: () => {
|
|
16868
|
+
const startTime = new Date(day);
|
|
16869
|
+
startTime.setHours(DefaultStartHourAgenda, 0, 0);
|
|
16870
|
+
},
|
|
16871
|
+
children: [
|
|
16872
|
+
/* @__PURE__ */ jsx93(
|
|
16873
|
+
"div",
|
|
16874
|
+
{
|
|
16875
|
+
className: twMerge3(
|
|
16876
|
+
`mt-1 inline-flex w-7 h-7 items-center justify-center rounded-full text-sm font-semibold text-muted-foreground`,
|
|
16877
|
+
isToday5(day) ? "bg-blue-500 text-white" : ""
|
|
16878
|
+
),
|
|
16879
|
+
children: format15(day, "d")
|
|
16880
|
+
}
|
|
16881
|
+
),
|
|
16882
|
+
/* @__PURE__ */ jsxs72(
|
|
16883
|
+
"div",
|
|
16884
|
+
{
|
|
16885
|
+
className: "min-h-[calc((var(--event-height)+var(--event-gap))*2)] sm:min-h-[calc((var(--event-height)+var(--event-gap))*3)] lg:min-h-[calc((var(--event-height)+var(--event-gap))*4)] px-1 py-1",
|
|
16886
|
+
ref: isReferenceCell ? contentRef : null,
|
|
16887
|
+
children: [
|
|
16888
|
+
sortEventsAgenda(allDayEvents).map((event, index) => {
|
|
16889
|
+
const eventStart = new Date(
|
|
16890
|
+
event.start ?? event.end ?? Date.now()
|
|
16891
|
+
);
|
|
16892
|
+
const eventEnd = new Date(
|
|
16893
|
+
event.end ?? event.start ?? Date.now()
|
|
16894
|
+
);
|
|
16895
|
+
const isFirstDay = isSameDay10(day, eventStart);
|
|
16896
|
+
const isLastDay = isSameDay10(day, eventEnd);
|
|
16897
|
+
const isHidden = isMounted && visibleCount && index >= visibleCount;
|
|
16898
|
+
if (!visibleCount) return null;
|
|
16899
|
+
if (!isFirstDay) {
|
|
16900
|
+
return /* @__PURE__ */ jsx93(
|
|
16901
|
+
"div",
|
|
16902
|
+
{
|
|
16903
|
+
"aria-hidden": isHidden ? "true" : void 0,
|
|
16904
|
+
className: "aria-hidden:hidden",
|
|
16905
|
+
children: /* @__PURE__ */ jsx93(
|
|
16906
|
+
EventItemAgenda,
|
|
16907
|
+
{
|
|
16908
|
+
event,
|
|
16909
|
+
isFirstDay,
|
|
16910
|
+
isLastDay,
|
|
16911
|
+
onClick: (e) => handleEventClick(event, e),
|
|
16912
|
+
view: "month",
|
|
16913
|
+
children: /* @__PURE__ */ jsxs72("div", { "aria-hidden": true, className: "invisible", children: [
|
|
16914
|
+
!event.allDay && /* @__PURE__ */ jsxs72("span", { children: [
|
|
16915
|
+
format15(eventStart, "HH:mm"),
|
|
16916
|
+
" "
|
|
16917
|
+
] }),
|
|
16918
|
+
event.title
|
|
16919
|
+
] })
|
|
16920
|
+
}
|
|
16921
|
+
)
|
|
16922
|
+
},
|
|
16923
|
+
`spanning-${event.id}-${day.toISOString().slice(0, 10)}`
|
|
16924
|
+
);
|
|
16925
|
+
}
|
|
16926
|
+
return /* @__PURE__ */ jsx93(
|
|
16927
|
+
"div",
|
|
16928
|
+
{
|
|
16929
|
+
"aria-hidden": isHidden ? "true" : void 0,
|
|
16930
|
+
className: "aria-hidden:hidden",
|
|
16931
|
+
children: /* @__PURE__ */ jsx93(
|
|
16932
|
+
EventItemAgenda,
|
|
16933
|
+
{
|
|
16934
|
+
className: "cursor-default",
|
|
16935
|
+
event,
|
|
16936
|
+
isFirstDay,
|
|
16937
|
+
isLastDay,
|
|
16938
|
+
onClick: (e) => handleEventClick(event, e),
|
|
16939
|
+
view: "month",
|
|
16940
|
+
children: /* @__PURE__ */ jsxs72("span", { className: "flex items-center gap-2 truncate", children: [
|
|
16941
|
+
!event.allDay && /* @__PURE__ */ jsx93("span", { className: "truncate font-normal opacity-80 sm:text-[11px] bg-white/10 px-2 py-0.5 rounded-full text-[11px]", children: format15(eventStart, "HH:mm") }),
|
|
16942
|
+
/* @__PURE__ */ jsx93("span", { className: "truncate font-medium", children: event.title })
|
|
16943
|
+
] })
|
|
16944
|
+
}
|
|
16945
|
+
)
|
|
16946
|
+
},
|
|
16947
|
+
event.id
|
|
16948
|
+
);
|
|
16949
|
+
}),
|
|
16950
|
+
hasMore && /* @__PURE__ */ jsxs72(PopoverBase, { modal: true, children: [
|
|
16951
|
+
/* @__PURE__ */ jsx93(PopoverTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxs72(
|
|
16952
|
+
"button",
|
|
16953
|
+
{
|
|
16954
|
+
className: "mt-[var(--event-gap)] flex h-[var(--event-height)] w-full select-none items-center overflow-hidden px-2 text-left text-[10px] text-muted-foreground outline-none backdrop-blur-md rounded-md transition hover:bg-muted/60 hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 sm:text-xs",
|
|
16955
|
+
onClick: (e) => e.stopPropagation(),
|
|
16956
|
+
type: "button",
|
|
16957
|
+
"aria-label": `Show ${remainingCount} more events on ${format15(
|
|
16958
|
+
day,
|
|
16959
|
+
"PPP",
|
|
16960
|
+
{ locale: ptBR13 }
|
|
16961
|
+
)}`,
|
|
16962
|
+
children: [
|
|
16963
|
+
/* @__PURE__ */ jsxs72("span", { className: "font-medium", children: [
|
|
16964
|
+
"+ ",
|
|
16965
|
+
remainingCount
|
|
16966
|
+
] }),
|
|
16967
|
+
/* @__PURE__ */ jsx93("span", { className: "sr-only", children: " more" })
|
|
16968
|
+
]
|
|
16969
|
+
}
|
|
16970
|
+
) }),
|
|
16971
|
+
/* @__PURE__ */ jsx93(
|
|
16972
|
+
PopoverContentBase,
|
|
16973
|
+
{
|
|
16974
|
+
align: "center",
|
|
16975
|
+
className: "max-w-52 p-3",
|
|
16976
|
+
style: {
|
|
16977
|
+
"--event-height": `${EventHeightAgenda}px`
|
|
16978
|
+
},
|
|
16979
|
+
children: /* @__PURE__ */ jsxs72("div", { className: "space-y-2", children: [
|
|
16980
|
+
/* @__PURE__ */ jsx93("div", { className: "font-medium text-sm", children: format15(day, "EEE d", { locale: ptBR13 }) }),
|
|
16981
|
+
/* @__PURE__ */ jsx93("div", { className: "space-y-1", children: sortEventsAgenda(allEvents).map((event) => {
|
|
16982
|
+
const eventStart = new Date(
|
|
16983
|
+
event.start ?? event.end ?? Date.now()
|
|
16984
|
+
);
|
|
16985
|
+
const eventEnd = new Date(
|
|
16986
|
+
event.end ?? event.start ?? Date.now()
|
|
16987
|
+
);
|
|
16988
|
+
const isFirstDay = isSameDay10(day, eventStart);
|
|
16989
|
+
const isLastDay = isSameDay10(day, eventEnd);
|
|
16990
|
+
return /* @__PURE__ */ jsx93(
|
|
16991
|
+
EventItemAgenda,
|
|
16992
|
+
{
|
|
16993
|
+
event,
|
|
16994
|
+
isFirstDay,
|
|
16995
|
+
isLastDay,
|
|
16996
|
+
onClick: (e) => handleEventClick(event, e),
|
|
16997
|
+
view: "month"
|
|
16998
|
+
},
|
|
16999
|
+
event.id
|
|
17000
|
+
);
|
|
17001
|
+
}) })
|
|
17002
|
+
] })
|
|
17003
|
+
}
|
|
17004
|
+
)
|
|
17005
|
+
] })
|
|
17006
|
+
]
|
|
17007
|
+
}
|
|
17008
|
+
)
|
|
17009
|
+
]
|
|
17010
|
+
}
|
|
17011
|
+
)
|
|
17012
|
+
},
|
|
17013
|
+
day.toString()
|
|
17014
|
+
);
|
|
17015
|
+
})
|
|
17016
|
+
},
|
|
17017
|
+
`week-${week}`
|
|
17018
|
+
)) }),
|
|
17019
|
+
/* @__PURE__ */ jsx93(
|
|
17020
|
+
UndatedEvents,
|
|
17021
|
+
{
|
|
17022
|
+
events,
|
|
17023
|
+
onEventSelect,
|
|
17024
|
+
className: "my-12",
|
|
17025
|
+
show: showUndatedEvents
|
|
17026
|
+
}
|
|
17027
|
+
)
|
|
17028
|
+
] });
|
|
17029
|
+
}
|
|
17030
|
+
|
|
17031
|
+
// src/components/event-calendar-view/WeekView.tsx
|
|
17032
|
+
import {
|
|
17033
|
+
addHours as addHours5,
|
|
17034
|
+
areIntervalsOverlapping as areIntervalsOverlapping4,
|
|
17035
|
+
differenceInMinutes as differenceInMinutes8,
|
|
17036
|
+
eachDayOfInterval as eachDayOfInterval4,
|
|
17037
|
+
eachHourOfInterval as eachHourOfInterval4,
|
|
17038
|
+
endOfWeek as endOfWeek8,
|
|
17039
|
+
format as format16,
|
|
17040
|
+
getHours as getHours4,
|
|
17041
|
+
getMinutes as getMinutes4,
|
|
17042
|
+
isBefore as isBefore3,
|
|
17043
|
+
isSameDay as isSameDay11,
|
|
17044
|
+
isToday as isToday6,
|
|
17045
|
+
startOfDay as startOfDay4,
|
|
17046
|
+
startOfWeek as startOfWeek8
|
|
17047
|
+
} from "date-fns";
|
|
17048
|
+
import { ptBR as ptBR14 } from "date-fns/locale";
|
|
17049
|
+
import { useMemo as useMemo26 } from "react";
|
|
17050
|
+
|
|
17051
|
+
// src/components/event-calendar-view/DraggablaEvent.tsx
|
|
17052
|
+
import { useDraggable as useDraggable2 } from "@dnd-kit/core";
|
|
17053
|
+
import { CSS as CSS2 } from "@dnd-kit/utilities";
|
|
17054
|
+
import { differenceInDays as differenceInDays2 } from "date-fns";
|
|
17055
|
+
import { useRef as useRef17, useState as useState36 } from "react";
|
|
17056
|
+
import { jsx as jsx94 } from "react/jsx-runtime";
|
|
17057
|
+
function DraggableEvent2({
|
|
17058
|
+
event,
|
|
17059
|
+
view,
|
|
17060
|
+
showTime,
|
|
17061
|
+
onClick,
|
|
17062
|
+
height,
|
|
17063
|
+
isMultiDay,
|
|
17064
|
+
multiDayWidth,
|
|
17065
|
+
isFirstDay = true,
|
|
17066
|
+
isLastDay = true,
|
|
17067
|
+
"aria-hidden": ariaHidden,
|
|
17068
|
+
draggable = true
|
|
17069
|
+
}) {
|
|
17070
|
+
const { activeId } = useCalendarDndAgenda();
|
|
17071
|
+
const elementRef = useRef17(null);
|
|
17072
|
+
const [dragHandlePosition, setDragHandlePosition] = useState36(null);
|
|
17073
|
+
const eventStart = new Date(event.start ?? Date.now());
|
|
17074
|
+
const eventEnd = new Date(event.end ?? Date.now());
|
|
17075
|
+
const isMultiDayEvent2 = isMultiDay || event.allDay || differenceInDays2(eventEnd, eventStart) >= 1;
|
|
17076
|
+
const { attributes, listeners, setNodeRef, transform, isDragging } = useDraggable2({
|
|
17077
|
+
data: {
|
|
17078
|
+
dragHandlePosition,
|
|
17079
|
+
event,
|
|
17080
|
+
height: height || elementRef.current?.offsetHeight || null,
|
|
17081
|
+
isFirstDay,
|
|
17082
|
+
isLastDay,
|
|
17083
|
+
isMultiDay: isMultiDayEvent2,
|
|
17084
|
+
multiDayWidth,
|
|
17085
|
+
view
|
|
17086
|
+
},
|
|
17087
|
+
// allow callers to disable dragging
|
|
17088
|
+
disabled: !draggable,
|
|
17089
|
+
id: `${event.id}-${view}`
|
|
17090
|
+
});
|
|
17091
|
+
const handleMouseDown = (e) => {
|
|
17092
|
+
if (elementRef.current) {
|
|
17093
|
+
const rect = elementRef.current.getBoundingClientRect();
|
|
17094
|
+
setDragHandlePosition({
|
|
17095
|
+
x: e.clientX - rect.left,
|
|
17096
|
+
y: e.clientY - rect.top
|
|
17097
|
+
});
|
|
17098
|
+
}
|
|
17099
|
+
};
|
|
17100
|
+
if (isDragging || activeId === `${event.id}-${view}`) {
|
|
17101
|
+
return /* @__PURE__ */ jsx94(
|
|
17102
|
+
"div",
|
|
17103
|
+
{
|
|
17104
|
+
className: "opacity-0",
|
|
17105
|
+
ref: setNodeRef,
|
|
17106
|
+
style: { height: height || "auto" }
|
|
17107
|
+
}
|
|
17108
|
+
);
|
|
17109
|
+
}
|
|
17110
|
+
const style = transform ? {
|
|
17111
|
+
height: height || "auto",
|
|
17112
|
+
transform: CSS2.Translate.toString(transform),
|
|
17113
|
+
width: isMultiDayEvent2 && multiDayWidth ? `${multiDayWidth}%` : void 0
|
|
17114
|
+
} : {
|
|
17115
|
+
height: height || "auto",
|
|
17116
|
+
width: isMultiDayEvent2 && multiDayWidth ? `${multiDayWidth}%` : void 0
|
|
17117
|
+
};
|
|
17118
|
+
const handleTouchStart = (e) => {
|
|
17119
|
+
if (elementRef.current) {
|
|
17120
|
+
const rect = elementRef.current.getBoundingClientRect();
|
|
17121
|
+
const touch = e.touches[0];
|
|
17122
|
+
if (touch) {
|
|
17123
|
+
setDragHandlePosition({
|
|
17124
|
+
x: touch.clientX - rect.left,
|
|
17125
|
+
y: touch.clientY - rect.top
|
|
17126
|
+
});
|
|
17127
|
+
}
|
|
17128
|
+
}
|
|
17129
|
+
};
|
|
17130
|
+
return /* @__PURE__ */ jsx94(
|
|
17131
|
+
"div",
|
|
17132
|
+
{
|
|
17133
|
+
className: "touch-none",
|
|
17134
|
+
ref: (node) => {
|
|
17135
|
+
setNodeRef(node);
|
|
17136
|
+
if (elementRef) elementRef.current = node;
|
|
17137
|
+
},
|
|
17138
|
+
style,
|
|
17139
|
+
children: /* @__PURE__ */ jsx94(
|
|
17140
|
+
EventItemAgenda,
|
|
17141
|
+
{
|
|
17142
|
+
"aria-hidden": ariaHidden,
|
|
17143
|
+
dndAttributes: attributes,
|
|
17144
|
+
dndListeners: listeners,
|
|
17145
|
+
event,
|
|
17146
|
+
isDragging,
|
|
17147
|
+
isFirstDay,
|
|
17148
|
+
isLastDay,
|
|
17149
|
+
onClick,
|
|
17150
|
+
onMouseDown: handleMouseDown,
|
|
17151
|
+
onTouchStart: handleTouchStart,
|
|
17152
|
+
showTime,
|
|
17153
|
+
view
|
|
17154
|
+
}
|
|
17155
|
+
)
|
|
17156
|
+
}
|
|
17157
|
+
);
|
|
17158
|
+
}
|
|
17159
|
+
|
|
17160
|
+
// src/components/event-calendar-view/WeekView.tsx
|
|
17161
|
+
import { jsx as jsx95, jsxs as jsxs73 } from "react/jsx-runtime";
|
|
17162
|
+
function WeekViewAgenda({
|
|
17163
|
+
currentDate,
|
|
17164
|
+
events,
|
|
17165
|
+
onEventSelect,
|
|
17166
|
+
onEventCreate,
|
|
17167
|
+
showUndatedEvents
|
|
17168
|
+
}) {
|
|
17169
|
+
const days = useMemo26(() => {
|
|
17170
|
+
const weekStart2 = startOfWeek8(currentDate, { weekStartsOn: 0 });
|
|
17171
|
+
const weekEnd = endOfWeek8(currentDate, { weekStartsOn: 0 });
|
|
17172
|
+
return eachDayOfInterval4({ end: weekEnd, start: weekStart2 });
|
|
17173
|
+
}, [currentDate]);
|
|
17174
|
+
const weekStart = useMemo26(
|
|
17175
|
+
() => startOfWeek8(currentDate, { weekStartsOn: 0 }),
|
|
17176
|
+
[currentDate]
|
|
17177
|
+
);
|
|
17178
|
+
const hours = useMemo26(() => {
|
|
17179
|
+
const dayStart = startOfDay4(currentDate);
|
|
17180
|
+
return eachHourOfInterval4({
|
|
17181
|
+
end: addHours5(dayStart, EndHour - 1),
|
|
17182
|
+
start: addHours5(dayStart, StartHour)
|
|
17183
|
+
});
|
|
17184
|
+
}, [currentDate]);
|
|
17185
|
+
const allDayEvents = useMemo26(() => {
|
|
17186
|
+
return events.filter((event) => {
|
|
17187
|
+
return event.allDay || isMultiDayEventAgenda(event);
|
|
17188
|
+
}).filter((event) => {
|
|
17189
|
+
const eventStart = event.start ? new Date(event.start) : event.end ? new Date(event.end) : void 0;
|
|
17190
|
+
const eventEnd = event.end ? new Date(event.end) : event.start ? new Date(event.start) : void 0;
|
|
17191
|
+
return days.some((day) => {
|
|
17192
|
+
if (eventStart && isSameDay11(day, eventStart)) return true;
|
|
17193
|
+
if (eventEnd && isSameDay11(day, eventEnd)) return true;
|
|
17194
|
+
if (eventStart && eventEnd && day > eventStart && day < eventEnd)
|
|
17195
|
+
return true;
|
|
17196
|
+
return false;
|
|
17197
|
+
});
|
|
17198
|
+
});
|
|
17199
|
+
}, [events, days]);
|
|
17200
|
+
const processedDayEvents = useMemo26(() => {
|
|
17201
|
+
const result = days.map((day) => {
|
|
17202
|
+
const dayEvents = events.filter((event) => {
|
|
17203
|
+
if (event.allDay || isMultiDayEventAgenda(event)) return false;
|
|
17204
|
+
const eventStart = new Date(event.start ?? event.end ?? Date.now());
|
|
17205
|
+
const eventEnd = new Date(event.end ?? event.start ?? Date.now());
|
|
17206
|
+
return isSameDay11(day, eventStart) || isSameDay11(day, eventEnd) || eventStart < day && eventEnd > day;
|
|
17207
|
+
});
|
|
17208
|
+
const sortedEvents = [...dayEvents].sort((a, b) => {
|
|
17209
|
+
const aStart = new Date(a.start ?? a.end ?? Date.now());
|
|
17210
|
+
const bStart = new Date(b.start ?? b.end ?? Date.now());
|
|
17211
|
+
const aEnd = new Date(a.end ?? a.start ?? Date.now());
|
|
17212
|
+
const bEnd = new Date(b.end ?? b.start ?? Date.now());
|
|
17213
|
+
if (aStart < bStart) return -1;
|
|
17214
|
+
if (aStart > bStart) return 1;
|
|
17215
|
+
const aDuration = differenceInMinutes8(aEnd, aStart);
|
|
17216
|
+
const bDuration = differenceInMinutes8(bEnd, bStart);
|
|
17217
|
+
return bDuration - aDuration;
|
|
17218
|
+
});
|
|
17219
|
+
const positionedEvents = [];
|
|
17220
|
+
const dayStart = startOfDay4(day);
|
|
17221
|
+
const columns = [];
|
|
17222
|
+
for (const event of sortedEvents) {
|
|
17223
|
+
const eventStart = new Date(event.start ?? event.end ?? Date.now());
|
|
17224
|
+
const eventEnd = new Date(event.end ?? event.start ?? Date.now());
|
|
17225
|
+
const adjustedStart = isSameDay11(day, eventStart) ? eventStart : dayStart;
|
|
17226
|
+
const adjustedEnd = isSameDay11(day, eventEnd) ? eventEnd : addHours5(dayStart, 24);
|
|
17227
|
+
const startHour = getHours4(adjustedStart) + getMinutes4(adjustedStart) / 60;
|
|
17228
|
+
const endHour = getHours4(adjustedEnd) + getMinutes4(adjustedEnd) / 60;
|
|
17229
|
+
const top = (startHour - StartHour) * WeekCellsHeightAgenda;
|
|
17230
|
+
const height = (endHour - startHour) * WeekCellsHeightAgenda;
|
|
17231
|
+
let columnIndex = 0;
|
|
17232
|
+
let placed = false;
|
|
17233
|
+
while (!placed) {
|
|
17234
|
+
const col = columns[columnIndex] || [];
|
|
17235
|
+
if (col.length === 0) {
|
|
17236
|
+
columns[columnIndex] = col;
|
|
17237
|
+
placed = true;
|
|
17238
|
+
} else {
|
|
17239
|
+
const overlaps = col.some(
|
|
17240
|
+
(c) => areIntervalsOverlapping4(
|
|
17241
|
+
{ end: adjustedEnd, start: adjustedStart },
|
|
17242
|
+
{
|
|
17243
|
+
end: new Date(c.event.end ?? c.event.start ?? Date.now()),
|
|
17244
|
+
start: new Date(c.event.start ?? c.event.end ?? Date.now())
|
|
17245
|
+
}
|
|
17246
|
+
)
|
|
17247
|
+
);
|
|
17248
|
+
if (!overlaps) {
|
|
17249
|
+
placed = true;
|
|
17250
|
+
} else {
|
|
17251
|
+
columnIndex++;
|
|
17252
|
+
}
|
|
17253
|
+
}
|
|
17254
|
+
}
|
|
17255
|
+
const currentColumn = columns[columnIndex] || [];
|
|
17256
|
+
columns[columnIndex] = currentColumn;
|
|
17257
|
+
currentColumn.push({ end: adjustedEnd, event });
|
|
17258
|
+
const width = columnIndex === 0 ? 1 : 0.9;
|
|
17259
|
+
const left = columnIndex === 0 ? 0 : columnIndex * 0.1;
|
|
17260
|
+
positionedEvents.push({
|
|
17261
|
+
event,
|
|
17262
|
+
height,
|
|
17263
|
+
left,
|
|
17264
|
+
top,
|
|
17265
|
+
width,
|
|
17266
|
+
zIndex: 10 + columnIndex
|
|
17267
|
+
// Higher columns get higher z-index
|
|
17268
|
+
});
|
|
17269
|
+
}
|
|
17270
|
+
return positionedEvents;
|
|
17271
|
+
});
|
|
17272
|
+
return result;
|
|
17273
|
+
}, [days, events]);
|
|
17274
|
+
const handleEventClick = (event, e) => {
|
|
17275
|
+
e.stopPropagation();
|
|
17276
|
+
onEventSelect(event);
|
|
17277
|
+
};
|
|
17278
|
+
const showAllDaySection = allDayEvents.length > 0;
|
|
17279
|
+
const { currentTimePosition, currentTimeVisible } = useCurrentTimeIndicatorAgenda(currentDate, "week");
|
|
17280
|
+
return /* @__PURE__ */ jsxs73("div", { className: "flex h-full flex-col", "data-slot": "week-view", children: [
|
|
17281
|
+
/* @__PURE__ */ jsxs73("div", { className: "sticky top-0 z-30 grid grid-cols-8 border-border/70 border-b bg-background", children: [
|
|
17282
|
+
/* @__PURE__ */ jsx95("div", { className: "py-2 text-center text-muted-foreground/70 text-sm", children: /* @__PURE__ */ jsx95("span", { className: "max-[479px]:sr-only", children: format16(/* @__PURE__ */ new Date(), "O") }) }),
|
|
17283
|
+
days.map((day) => /* @__PURE__ */ jsxs73(
|
|
17284
|
+
"div",
|
|
17285
|
+
{
|
|
17286
|
+
className: "py-2 text-center text-muted-foreground/70 text-sm data-today:font-medium data-today:text-foreground",
|
|
17287
|
+
"data-today": isToday6(day) || void 0,
|
|
17288
|
+
children: [
|
|
17289
|
+
/* @__PURE__ */ jsxs73("span", { "aria-hidden": "true", className: "sm:hidden", children: [
|
|
17290
|
+
format16(day, "EEE", { locale: ptBR14 })[0],
|
|
17291
|
+
" ",
|
|
17292
|
+
format16(day, "d", { locale: ptBR14 })
|
|
17293
|
+
] }),
|
|
17294
|
+
/* @__PURE__ */ jsx95("span", { className: "max-sm:hidden", children: format16(day, "EEE dd", { locale: ptBR14 }) })
|
|
17295
|
+
]
|
|
17296
|
+
},
|
|
17297
|
+
day.toString()
|
|
17298
|
+
))
|
|
17299
|
+
] }),
|
|
17300
|
+
showAllDaySection && /* @__PURE__ */ jsx95("div", { className: "border-border/70 border-b bg-muted/50", children: /* @__PURE__ */ jsxs73("div", { className: "grid grid-cols-8", children: [
|
|
17301
|
+
/* @__PURE__ */ jsx95("div", { className: "relative border-border/70 border-r", children: /* @__PURE__ */ jsx95("span", { className: "absolute bottom-0 left-0 h-6 w-16 max-w-full pe-2 text-right text-[10px] text-muted-foreground/70 sm:pe-4 sm:text-xs", children: "Todo Dia" }) }),
|
|
17302
|
+
days.map((day, dayIndex) => {
|
|
17303
|
+
const dayAllDayEvents = allDayEvents.filter((event) => {
|
|
17304
|
+
const eventStart = event.start ? new Date(event.start) : void 0;
|
|
17305
|
+
const eventEnd = event.end ? new Date(event.end) : void 0;
|
|
17306
|
+
if (!eventStart && !eventEnd) return false;
|
|
17307
|
+
return eventStart && isSameDay11(day, eventStart) || eventStart && eventEnd && day > eventStart && day < eventEnd || eventEnd && isSameDay11(day, eventEnd);
|
|
17308
|
+
});
|
|
17309
|
+
return /* @__PURE__ */ jsx95(
|
|
17310
|
+
"div",
|
|
17311
|
+
{
|
|
17312
|
+
className: "relative border-border/70 border-r p-1 last:border-r-0",
|
|
17313
|
+
"data-today": isToday6(day) || void 0,
|
|
17314
|
+
children: dayAllDayEvents.map((event) => {
|
|
17315
|
+
const eventStart = event.start ? new Date(event.start) : void 0;
|
|
17316
|
+
const eventEnd = event.end ? new Date(event.end) : void 0;
|
|
17317
|
+
const isFirstDay = eventStart ? isSameDay11(day, eventStart) : false;
|
|
17318
|
+
const isLastDay = eventEnd ? isSameDay11(day, eventEnd) : false;
|
|
17319
|
+
const isFirstVisibleDay = eventStart ? dayIndex === 0 && isBefore3(eventStart, weekStart) : false;
|
|
17320
|
+
const shouldShowTitle = isFirstDay || isFirstVisibleDay;
|
|
17321
|
+
return /* @__PURE__ */ jsx95(
|
|
17322
|
+
EventItemAgenda,
|
|
17323
|
+
{
|
|
17324
|
+
event,
|
|
17325
|
+
isFirstDay,
|
|
17326
|
+
isLastDay,
|
|
17327
|
+
onClick: (e) => handleEventClick(event, e),
|
|
17328
|
+
view: "month",
|
|
17329
|
+
children: /* @__PURE__ */ jsx95(
|
|
17330
|
+
"div",
|
|
17331
|
+
{
|
|
17332
|
+
"aria-hidden": !shouldShowTitle,
|
|
17333
|
+
className: cn(
|
|
17334
|
+
"truncate",
|
|
17335
|
+
!shouldShowTitle && "invisible"
|
|
17336
|
+
),
|
|
17337
|
+
children: event.title
|
|
17338
|
+
}
|
|
17339
|
+
)
|
|
17340
|
+
},
|
|
17341
|
+
`spanning-${event.id}`
|
|
17342
|
+
);
|
|
17343
|
+
})
|
|
17344
|
+
},
|
|
17345
|
+
day.toString()
|
|
17346
|
+
);
|
|
17347
|
+
})
|
|
17348
|
+
] }) }),
|
|
17349
|
+
/* @__PURE__ */ jsxs73("div", { className: "grid flex-1 grid-cols-8 overflow-hidden", children: [
|
|
17350
|
+
/* @__PURE__ */ jsx95("div", { className: "grid auto-cols-fr border-border/70 border-r", children: hours.map((hour, index) => /* @__PURE__ */ jsx95(
|
|
17351
|
+
"div",
|
|
17352
|
+
{
|
|
17353
|
+
className: "relative min-h-[var(--week-cells-height)] border-border/70 border-b last:border-b-0",
|
|
17354
|
+
children: index > 0 && /* @__PURE__ */ jsx95("span", { className: "-top-3 absolute left-0 flex h-6 w-16 max-w-full items-center justify-end bg-background pe-2 text-[10px] text-muted-foreground/70 sm:pe-4 sm:text-xs", children: format16(hour, "HH:mm") })
|
|
17355
|
+
},
|
|
17356
|
+
hour.toString()
|
|
17357
|
+
)) }),
|
|
17358
|
+
days.map((day, dayIndex) => /* @__PURE__ */ jsxs73(
|
|
17359
|
+
"div",
|
|
17360
|
+
{
|
|
17361
|
+
className: "relative grid auto-cols-fr border-border/70 border-r last:border-r-0",
|
|
17362
|
+
"data-today": isToday6(day) || void 0,
|
|
17363
|
+
children: [
|
|
17364
|
+
(processedDayEvents[dayIndex] ?? []).map((positionedEvent) => /* @__PURE__ */ jsx95(
|
|
17365
|
+
"div",
|
|
17366
|
+
{
|
|
17367
|
+
className: "absolute z-10 px-0.5",
|
|
17368
|
+
onClick: (e) => e.stopPropagation(),
|
|
17369
|
+
style: {
|
|
17370
|
+
height: `${positionedEvent.height}px`,
|
|
17371
|
+
left: `${positionedEvent.left * 100}%`,
|
|
17372
|
+
top: `${positionedEvent.top}px`,
|
|
17373
|
+
width: `${positionedEvent.width * 100}%`,
|
|
17374
|
+
zIndex: positionedEvent.zIndex
|
|
17375
|
+
},
|
|
17376
|
+
children: /* @__PURE__ */ jsx95("div", { className: "size-full", children: /* @__PURE__ */ jsx95(
|
|
17377
|
+
DraggableEvent2,
|
|
17378
|
+
{
|
|
17379
|
+
event: positionedEvent.event,
|
|
17380
|
+
height: positionedEvent.height,
|
|
17381
|
+
onClick: (e) => handleEventClick(positionedEvent.event, e),
|
|
17382
|
+
draggable: false,
|
|
17383
|
+
showTime: true,
|
|
17384
|
+
view: "week"
|
|
17385
|
+
}
|
|
17386
|
+
) })
|
|
17387
|
+
},
|
|
17388
|
+
positionedEvent.event.id
|
|
17389
|
+
)),
|
|
17390
|
+
currentTimeVisible && isToday6(day) && /* @__PURE__ */ jsx95(
|
|
17391
|
+
"div",
|
|
17392
|
+
{
|
|
17393
|
+
className: "pointer-events-none absolute right-0 left-0 z-20",
|
|
17394
|
+
style: { top: `${currentTimePosition}%` },
|
|
17395
|
+
children: /* @__PURE__ */ jsxs73("div", { className: "relative flex items-center", children: [
|
|
17396
|
+
/* @__PURE__ */ jsx95("div", { className: "-left-1 absolute h-2 w-2 rounded-full bg-primary" }),
|
|
17397
|
+
/* @__PURE__ */ jsx95("div", { className: "h-[2px] w-full bg-primary" })
|
|
17398
|
+
] })
|
|
17399
|
+
}
|
|
17400
|
+
),
|
|
17401
|
+
hours.map((hour) => {
|
|
17402
|
+
const hourValue = getHours4(hour);
|
|
17403
|
+
return /* @__PURE__ */ jsx95(
|
|
17404
|
+
"div",
|
|
17405
|
+
{
|
|
17406
|
+
className: "relative min-h-[var(--week-cells-height)] border-border/70 border-b last:border-b-0",
|
|
17407
|
+
children: [0, 1, 2, 3].map((quarter) => {
|
|
17408
|
+
const quarterHourTime = hourValue + quarter * 0.25;
|
|
17409
|
+
return /* @__PURE__ */ jsx95(
|
|
17410
|
+
DroppableCellAgenda,
|
|
17411
|
+
{
|
|
17412
|
+
className: cn(
|
|
17413
|
+
"absolute h-[calc(var(--week-cells-height)/4)] w-full",
|
|
17414
|
+
quarter === 0 && "top-0",
|
|
17415
|
+
quarter === 1 && "top-[calc(var(--week-cells-height)/4)]",
|
|
17416
|
+
quarter === 2 && "top-[calc(var(--week-cells-height)/4*2)]",
|
|
17417
|
+
quarter === 3 && "top-[calc(var(--week-cells-height)/4*)]"
|
|
17418
|
+
),
|
|
17419
|
+
date: day,
|
|
17420
|
+
id: `week-cell-${day.toISOString()}-${quarterHourTime}`,
|
|
17421
|
+
onClick: () => {
|
|
17422
|
+
const startTime = new Date(day);
|
|
17423
|
+
startTime.setHours(hourValue);
|
|
17424
|
+
startTime.setMinutes(quarter * 15);
|
|
17425
|
+
if (onEventCreate) onEventCreate(startTime);
|
|
17426
|
+
},
|
|
17427
|
+
time: quarterHourTime
|
|
17428
|
+
},
|
|
17429
|
+
`${hour.toString()}-${quarter}`
|
|
17430
|
+
);
|
|
17431
|
+
})
|
|
17432
|
+
},
|
|
17433
|
+
hour.toString()
|
|
17434
|
+
);
|
|
17435
|
+
})
|
|
17436
|
+
]
|
|
17437
|
+
},
|
|
17438
|
+
day.toString()
|
|
17439
|
+
))
|
|
17440
|
+
] }),
|
|
17441
|
+
/* @__PURE__ */ jsx95(
|
|
17442
|
+
UndatedEvents,
|
|
17443
|
+
{
|
|
17444
|
+
events,
|
|
17445
|
+
onEventSelect,
|
|
17446
|
+
show: showUndatedEvents
|
|
17447
|
+
}
|
|
17448
|
+
)
|
|
17449
|
+
] });
|
|
17450
|
+
}
|
|
17451
|
+
|
|
17452
|
+
// src/components/ui/data/Banner.tsx
|
|
17453
|
+
import { RocketIcon, XIcon as XIcon13 } from "@phosphor-icons/react";
|
|
17454
|
+
import React45, { useState as useState37 } from "react";
|
|
17455
|
+
import { jsx as jsx96, jsxs as jsxs74 } from "react/jsx-runtime";
|
|
17456
|
+
|
|
15413
17457
|
// src/hooks/use-drag.tsx
|
|
15414
|
-
import { useState as
|
|
17458
|
+
import { useState as useState38, useCallback as useCallback16, useRef as useRef18, useEffect as useEffect28 } from "react";
|
|
15415
17459
|
var useDrag = (options = {}) => {
|
|
15416
|
-
const [isDragging, setIsDragging] =
|
|
15417
|
-
const [positions, setPositions] =
|
|
15418
|
-
const dragStartPos =
|
|
15419
|
-
const dragId =
|
|
17460
|
+
const [isDragging, setIsDragging] = useState38(null);
|
|
17461
|
+
const [positions, setPositions] = useState38({});
|
|
17462
|
+
const dragStartPos = useRef18(null);
|
|
17463
|
+
const dragId = useRef18(null);
|
|
15420
17464
|
const handleMouseDown = useCallback16((id, e) => {
|
|
15421
17465
|
e.preventDefault();
|
|
15422
17466
|
const currentPosition = positions[id] || { top: 0, left: 0 };
|
|
@@ -15454,7 +17498,7 @@ var useDrag = (options = {}) => {
|
|
|
15454
17498
|
dragStartPos.current = null;
|
|
15455
17499
|
dragId.current = null;
|
|
15456
17500
|
}, [options]);
|
|
15457
|
-
|
|
17501
|
+
useEffect28(() => {
|
|
15458
17502
|
if (isDragging) {
|
|
15459
17503
|
document.addEventListener("mousemove", handleMouseMove);
|
|
15460
17504
|
document.addEventListener("mouseup", handleMouseUp);
|
|
@@ -15488,7 +17532,9 @@ var useDrag = (options = {}) => {
|
|
|
15488
17532
|
};
|
|
15489
17533
|
export {
|
|
15490
17534
|
AddButton,
|
|
17535
|
+
Agenda,
|
|
15491
17536
|
AgendaDaysToShow,
|
|
17537
|
+
AgendaDaysToShowAgenda,
|
|
15492
17538
|
AgendaView,
|
|
15493
17539
|
AlertDialogActionBase,
|
|
15494
17540
|
AlertDialogBase,
|
|
@@ -15519,6 +17565,7 @@ export {
|
|
|
15519
17565
|
ButtonGroupBase,
|
|
15520
17566
|
CalendarBase,
|
|
15521
17567
|
CalendarDndProvider,
|
|
17568
|
+
CalendarDndProviderAgenda,
|
|
15522
17569
|
CardBase,
|
|
15523
17570
|
CardContentBase,
|
|
15524
17571
|
CardDescriptionBase,
|
|
@@ -15569,9 +17616,12 @@ export {
|
|
|
15569
17616
|
CopyButton,
|
|
15570
17617
|
DateTimePicker,
|
|
15571
17618
|
DayView,
|
|
17619
|
+
DayViewAgenda,
|
|
15572
17620
|
DebouncedInput,
|
|
15573
17621
|
DefaultEndHour,
|
|
17622
|
+
DefaultEndHourAgenda,
|
|
15574
17623
|
DefaultStartHour,
|
|
17624
|
+
DefaultStartHourAgenda,
|
|
15575
17625
|
DestructiveDialog,
|
|
15576
17626
|
DialogBase,
|
|
15577
17627
|
DialogCloseBase,
|
|
@@ -15612,14 +17662,20 @@ export {
|
|
|
15612
17662
|
DropDownMenuSubTriggerBase,
|
|
15613
17663
|
DropDownMenuTriggerBase,
|
|
15614
17664
|
DroppableCell,
|
|
17665
|
+
DroppableCellAgenda,
|
|
15615
17666
|
EditButton,
|
|
15616
17667
|
EndHour,
|
|
17668
|
+
EndHourAgenda,
|
|
15617
17669
|
ErrorMessage_default as ErrorMessage,
|
|
17670
|
+
EventAgenda,
|
|
15618
17671
|
EventCalendar,
|
|
15619
17672
|
EventDialog,
|
|
15620
17673
|
EventGap,
|
|
17674
|
+
EventGapAgenda,
|
|
15621
17675
|
EventHeight,
|
|
17676
|
+
EventHeightAgenda,
|
|
15622
17677
|
EventItem,
|
|
17678
|
+
EventItemAgenda,
|
|
15623
17679
|
EventsPopup,
|
|
15624
17680
|
FavoriteButton,
|
|
15625
17681
|
FileUploader,
|
|
@@ -15651,6 +17707,7 @@ export {
|
|
|
15651
17707
|
ModalTriggerBase,
|
|
15652
17708
|
ModeToggleBase,
|
|
15653
17709
|
MonthView,
|
|
17710
|
+
MonthViewAgenda,
|
|
15654
17711
|
MoreButton,
|
|
15655
17712
|
MultiCombobox,
|
|
15656
17713
|
MultiSelectBase,
|
|
@@ -15736,6 +17793,7 @@ export {
|
|
|
15736
17793
|
SkeletonBase,
|
|
15737
17794
|
SlideBase,
|
|
15738
17795
|
StartHour,
|
|
17796
|
+
StartHourAgenda,
|
|
15739
17797
|
StatusIndicator,
|
|
15740
17798
|
SwitchBase,
|
|
15741
17799
|
TableBase,
|
|
@@ -15761,6 +17819,7 @@ export {
|
|
|
15761
17819
|
TooltipSimple_default as TooltipSimple,
|
|
15762
17820
|
TooltipTriggerBase,
|
|
15763
17821
|
TooltipWithTotal_default as TooltipWithTotal,
|
|
17822
|
+
UndatedEvents,
|
|
15764
17823
|
UniversalTooltipRenderer,
|
|
15765
17824
|
UnlockButton,
|
|
15766
17825
|
UploadButton,
|
|
@@ -15768,8 +17827,11 @@ export {
|
|
|
15768
17827
|
ViewButton,
|
|
15769
17828
|
VisibilityButton,
|
|
15770
17829
|
WeekCellsHeight,
|
|
17830
|
+
WeekCellsHeightAgenda,
|
|
15771
17831
|
WeekView,
|
|
17832
|
+
WeekViewAgenda,
|
|
15772
17833
|
addHoursToDate,
|
|
17834
|
+
addHoursToDateAgenda,
|
|
15773
17835
|
badgeVariants,
|
|
15774
17836
|
buttonVariantsBase,
|
|
15775
17837
|
compactTick,
|
|
@@ -15780,13 +17842,19 @@ export {
|
|
|
15780
17842
|
formatFieldName,
|
|
15781
17843
|
generateAdditionalColors,
|
|
15782
17844
|
getAgendaEventsForDay,
|
|
17845
|
+
getAgendaEventsForDayAgenda,
|
|
15783
17846
|
getAllEventsForDay,
|
|
17847
|
+
getAllEventsForDayAgenda,
|
|
15784
17848
|
getArrowByType,
|
|
15785
17849
|
getBorderRadiusClasses,
|
|
17850
|
+
getBorderRadiusClassesAgenda,
|
|
15786
17851
|
getDateByType,
|
|
15787
17852
|
getEventColorClasses,
|
|
17853
|
+
getEventColorClassesAgenda,
|
|
15788
17854
|
getEventsForDay,
|
|
17855
|
+
getEventsForDayAgenda,
|
|
15789
17856
|
getSpanningEventsForDay,
|
|
17857
|
+
getSpanningEventsForDayAgenda,
|
|
15790
17858
|
getValid12Hour,
|
|
15791
17859
|
getValidArrow12Hour,
|
|
15792
17860
|
getValidArrowHour,
|
|
@@ -15796,10 +17864,12 @@ export {
|
|
|
15796
17864
|
getValidMinuteOrSecond,
|
|
15797
17865
|
getValidNumber,
|
|
15798
17866
|
isMultiDayEvent,
|
|
17867
|
+
isMultiDayEventAgenda,
|
|
15799
17868
|
isValid12Hour,
|
|
15800
17869
|
isValidHour,
|
|
15801
17870
|
isValidMinuteOrSecond,
|
|
15802
17871
|
niceCeil,
|
|
17872
|
+
normalizeAttendDate,
|
|
15803
17873
|
renderInsideBarLabel,
|
|
15804
17874
|
pillLabelRenderer_default as renderPillLabel,
|
|
15805
17875
|
resolveChartMargins,
|
|
@@ -15810,12 +17880,16 @@ export {
|
|
|
15810
17880
|
setMinutes,
|
|
15811
17881
|
setSeconds,
|
|
15812
17882
|
sortEvents,
|
|
17883
|
+
sortEventsAgenda,
|
|
15813
17884
|
toast2 as toast,
|
|
15814
17885
|
useCalendarDnd,
|
|
17886
|
+
useCalendarDndAgenda,
|
|
15815
17887
|
useChartHighlights,
|
|
15816
17888
|
useCurrentTimeIndicator,
|
|
17889
|
+
useCurrentTimeIndicatorAgenda,
|
|
15817
17890
|
useDrag,
|
|
15818
17891
|
useEventVisibility,
|
|
17892
|
+
useEventVisibilityAgenda,
|
|
15819
17893
|
useIsMobile,
|
|
15820
17894
|
useTheme
|
|
15821
17895
|
};
|