@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.js
CHANGED
|
@@ -486,7 +486,9 @@ var require_colors2 = __commonJS({
|
|
|
486
486
|
var index_exports = {};
|
|
487
487
|
__export(index_exports, {
|
|
488
488
|
AddButton: () => AddButton,
|
|
489
|
+
Agenda: () => Agenda,
|
|
489
490
|
AgendaDaysToShow: () => AgendaDaysToShow,
|
|
491
|
+
AgendaDaysToShowAgenda: () => AgendaDaysToShowAgenda,
|
|
490
492
|
AgendaView: () => AgendaView,
|
|
491
493
|
AlertDialogActionBase: () => AlertDialogActionBase,
|
|
492
494
|
AlertDialogBase: () => AlertDialogBase,
|
|
@@ -517,6 +519,7 @@ __export(index_exports, {
|
|
|
517
519
|
ButtonGroupBase: () => ButtonGroupBase,
|
|
518
520
|
CalendarBase: () => CalendarBase,
|
|
519
521
|
CalendarDndProvider: () => CalendarDndProvider,
|
|
522
|
+
CalendarDndProviderAgenda: () => CalendarDndProviderAgenda,
|
|
520
523
|
CardBase: () => CardBase,
|
|
521
524
|
CardContentBase: () => CardContentBase,
|
|
522
525
|
CardDescriptionBase: () => CardDescriptionBase,
|
|
@@ -567,9 +570,12 @@ __export(index_exports, {
|
|
|
567
570
|
CopyButton: () => CopyButton,
|
|
568
571
|
DateTimePicker: () => DateTimePicker,
|
|
569
572
|
DayView: () => DayView,
|
|
573
|
+
DayViewAgenda: () => DayViewAgenda,
|
|
570
574
|
DebouncedInput: () => DebouncedInput,
|
|
571
575
|
DefaultEndHour: () => DefaultEndHour,
|
|
576
|
+
DefaultEndHourAgenda: () => DefaultEndHourAgenda,
|
|
572
577
|
DefaultStartHour: () => DefaultStartHour,
|
|
578
|
+
DefaultStartHourAgenda: () => DefaultStartHourAgenda,
|
|
573
579
|
DestructiveDialog: () => DestructiveDialog,
|
|
574
580
|
DialogBase: () => DialogBase,
|
|
575
581
|
DialogCloseBase: () => DialogCloseBase,
|
|
@@ -610,14 +616,20 @@ __export(index_exports, {
|
|
|
610
616
|
DropDownMenuSubTriggerBase: () => DropDownMenuSubTriggerBase,
|
|
611
617
|
DropDownMenuTriggerBase: () => DropDownMenuTriggerBase,
|
|
612
618
|
DroppableCell: () => DroppableCell,
|
|
619
|
+
DroppableCellAgenda: () => DroppableCellAgenda,
|
|
613
620
|
EditButton: () => EditButton,
|
|
614
621
|
EndHour: () => EndHour,
|
|
622
|
+
EndHourAgenda: () => EndHourAgenda,
|
|
615
623
|
ErrorMessage: () => ErrorMessage_default,
|
|
624
|
+
EventAgenda: () => EventAgenda,
|
|
616
625
|
EventCalendar: () => EventCalendar,
|
|
617
626
|
EventDialog: () => EventDialog,
|
|
618
627
|
EventGap: () => EventGap,
|
|
628
|
+
EventGapAgenda: () => EventGapAgenda,
|
|
619
629
|
EventHeight: () => EventHeight,
|
|
630
|
+
EventHeightAgenda: () => EventHeightAgenda,
|
|
620
631
|
EventItem: () => EventItem,
|
|
632
|
+
EventItemAgenda: () => EventItemAgenda,
|
|
621
633
|
EventsPopup: () => EventsPopup,
|
|
622
634
|
FavoriteButton: () => FavoriteButton,
|
|
623
635
|
FileUploader: () => FileUploader,
|
|
@@ -649,6 +661,7 @@ __export(index_exports, {
|
|
|
649
661
|
ModalTriggerBase: () => ModalTriggerBase,
|
|
650
662
|
ModeToggleBase: () => ModeToggleBase,
|
|
651
663
|
MonthView: () => MonthView,
|
|
664
|
+
MonthViewAgenda: () => MonthViewAgenda,
|
|
652
665
|
MoreButton: () => MoreButton,
|
|
653
666
|
MultiCombobox: () => MultiCombobox,
|
|
654
667
|
MultiSelectBase: () => MultiSelectBase,
|
|
@@ -734,6 +747,7 @@ __export(index_exports, {
|
|
|
734
747
|
SkeletonBase: () => SkeletonBase,
|
|
735
748
|
SlideBase: () => SlideBase,
|
|
736
749
|
StartHour: () => StartHour,
|
|
750
|
+
StartHourAgenda: () => StartHourAgenda,
|
|
737
751
|
StatusIndicator: () => StatusIndicator,
|
|
738
752
|
SwitchBase: () => SwitchBase,
|
|
739
753
|
TableBase: () => TableBase,
|
|
@@ -759,6 +773,7 @@ __export(index_exports, {
|
|
|
759
773
|
TooltipSimple: () => TooltipSimple_default,
|
|
760
774
|
TooltipTriggerBase: () => TooltipTriggerBase,
|
|
761
775
|
TooltipWithTotal: () => TooltipWithTotal_default,
|
|
776
|
+
UndatedEvents: () => UndatedEvents,
|
|
762
777
|
UniversalTooltipRenderer: () => UniversalTooltipRenderer,
|
|
763
778
|
UnlockButton: () => UnlockButton,
|
|
764
779
|
UploadButton: () => UploadButton,
|
|
@@ -766,8 +781,11 @@ __export(index_exports, {
|
|
|
766
781
|
ViewButton: () => ViewButton,
|
|
767
782
|
VisibilityButton: () => VisibilityButton,
|
|
768
783
|
WeekCellsHeight: () => WeekCellsHeight,
|
|
784
|
+
WeekCellsHeightAgenda: () => WeekCellsHeightAgenda,
|
|
769
785
|
WeekView: () => WeekView,
|
|
786
|
+
WeekViewAgenda: () => WeekViewAgenda,
|
|
770
787
|
addHoursToDate: () => addHoursToDate,
|
|
788
|
+
addHoursToDateAgenda: () => addHoursToDateAgenda,
|
|
771
789
|
badgeVariants: () => badgeVariants,
|
|
772
790
|
buttonVariantsBase: () => buttonVariantsBase,
|
|
773
791
|
compactTick: () => compactTick,
|
|
@@ -778,13 +796,19 @@ __export(index_exports, {
|
|
|
778
796
|
formatFieldName: () => formatFieldName,
|
|
779
797
|
generateAdditionalColors: () => generateAdditionalColors,
|
|
780
798
|
getAgendaEventsForDay: () => getAgendaEventsForDay,
|
|
799
|
+
getAgendaEventsForDayAgenda: () => getAgendaEventsForDayAgenda,
|
|
781
800
|
getAllEventsForDay: () => getAllEventsForDay,
|
|
801
|
+
getAllEventsForDayAgenda: () => getAllEventsForDayAgenda,
|
|
782
802
|
getArrowByType: () => getArrowByType,
|
|
783
803
|
getBorderRadiusClasses: () => getBorderRadiusClasses,
|
|
804
|
+
getBorderRadiusClassesAgenda: () => getBorderRadiusClassesAgenda,
|
|
784
805
|
getDateByType: () => getDateByType,
|
|
785
806
|
getEventColorClasses: () => getEventColorClasses,
|
|
807
|
+
getEventColorClassesAgenda: () => getEventColorClassesAgenda,
|
|
786
808
|
getEventsForDay: () => getEventsForDay,
|
|
809
|
+
getEventsForDayAgenda: () => getEventsForDayAgenda,
|
|
787
810
|
getSpanningEventsForDay: () => getSpanningEventsForDay,
|
|
811
|
+
getSpanningEventsForDayAgenda: () => getSpanningEventsForDayAgenda,
|
|
788
812
|
getValid12Hour: () => getValid12Hour,
|
|
789
813
|
getValidArrow12Hour: () => getValidArrow12Hour,
|
|
790
814
|
getValidArrowHour: () => getValidArrowHour,
|
|
@@ -794,10 +818,12 @@ __export(index_exports, {
|
|
|
794
818
|
getValidMinuteOrSecond: () => getValidMinuteOrSecond,
|
|
795
819
|
getValidNumber: () => getValidNumber,
|
|
796
820
|
isMultiDayEvent: () => isMultiDayEvent,
|
|
821
|
+
isMultiDayEventAgenda: () => isMultiDayEventAgenda,
|
|
797
822
|
isValid12Hour: () => isValid12Hour,
|
|
798
823
|
isValidHour: () => isValidHour,
|
|
799
824
|
isValidMinuteOrSecond: () => isValidMinuteOrSecond,
|
|
800
825
|
niceCeil: () => niceCeil,
|
|
826
|
+
normalizeAttendDate: () => normalizeAttendDate,
|
|
801
827
|
renderInsideBarLabel: () => renderInsideBarLabel,
|
|
802
828
|
renderPillLabel: () => pillLabelRenderer_default,
|
|
803
829
|
resolveChartMargins: () => resolveChartMargins,
|
|
@@ -808,12 +834,16 @@ __export(index_exports, {
|
|
|
808
834
|
setMinutes: () => setMinutes,
|
|
809
835
|
setSeconds: () => setSeconds,
|
|
810
836
|
sortEvents: () => sortEvents,
|
|
837
|
+
sortEventsAgenda: () => sortEventsAgenda,
|
|
811
838
|
toast: () => toast2,
|
|
812
839
|
useCalendarDnd: () => useCalendarDnd,
|
|
840
|
+
useCalendarDndAgenda: () => useCalendarDndAgenda,
|
|
813
841
|
useChartHighlights: () => useChartHighlights,
|
|
814
842
|
useCurrentTimeIndicator: () => useCurrentTimeIndicator,
|
|
843
|
+
useCurrentTimeIndicatorAgenda: () => useCurrentTimeIndicatorAgenda,
|
|
815
844
|
useDrag: () => useDrag,
|
|
816
845
|
useEventVisibility: () => useEventVisibility,
|
|
846
|
+
useEventVisibilityAgenda: () => useEventVisibilityAgenda,
|
|
817
847
|
useIsMobile: () => useIsMobile,
|
|
818
848
|
useTheme: () => useTheme
|
|
819
849
|
});
|
|
@@ -12387,7 +12417,7 @@ function AgendaView({
|
|
|
12387
12417
|
onEventSelect,
|
|
12388
12418
|
showUndatedEvents = false
|
|
12389
12419
|
}) {
|
|
12390
|
-
const
|
|
12420
|
+
const isValidDate6 = (d) => {
|
|
12391
12421
|
try {
|
|
12392
12422
|
const t = d instanceof Date ? d.getTime() : new Date(String(d)).getTime();
|
|
12393
12423
|
return !isNaN(t);
|
|
@@ -12396,11 +12426,11 @@ function AgendaView({
|
|
|
12396
12426
|
}
|
|
12397
12427
|
};
|
|
12398
12428
|
const datedEvents = (0, import_react52.useMemo)(
|
|
12399
|
-
() => events.filter((e) =>
|
|
12429
|
+
() => events.filter((e) => isValidDate6(e.start) || isValidDate6(e.end)),
|
|
12400
12430
|
[events]
|
|
12401
12431
|
);
|
|
12402
12432
|
const undatedEvents = (0, import_react52.useMemo)(
|
|
12403
|
-
() => events.filter((e) => !(
|
|
12433
|
+
() => events.filter((e) => !(isValidDate6(e.start) || isValidDate6(e.end))),
|
|
12404
12434
|
[events]
|
|
12405
12435
|
);
|
|
12406
12436
|
const days = (0, import_react52.useMemo)(() => {
|
|
@@ -15565,14 +15595,2004 @@ function debounce(func, wait) {
|
|
|
15565
15595
|
};
|
|
15566
15596
|
}
|
|
15567
15597
|
|
|
15598
|
+
// src/components/event-calendar-view/Agenda.tsx
|
|
15599
|
+
var import_date_fns16 = require("date-fns");
|
|
15600
|
+
var import_locale9 = require("date-fns/locale");
|
|
15601
|
+
var import_react73 = require("react");
|
|
15602
|
+
var import_react74 = require("@phosphor-icons/react");
|
|
15603
|
+
var import_tailwind_merge2 = require("tailwind-merge");
|
|
15604
|
+
var import_jsx_runtime86 = require("react/jsx-runtime");
|
|
15605
|
+
function Agenda({
|
|
15606
|
+
currentDate,
|
|
15607
|
+
events,
|
|
15608
|
+
onEventSelect,
|
|
15609
|
+
showUndatedEvents = true
|
|
15610
|
+
}) {
|
|
15611
|
+
const isValidDate6 = (d) => {
|
|
15612
|
+
try {
|
|
15613
|
+
const t = d instanceof Date ? d.getTime() : new Date(String(d)).getTime();
|
|
15614
|
+
return !isNaN(t);
|
|
15615
|
+
} catch {
|
|
15616
|
+
return false;
|
|
15617
|
+
}
|
|
15618
|
+
};
|
|
15619
|
+
const datedEvents = (0, import_react73.useMemo)(
|
|
15620
|
+
() => events.filter((e) => isValidDate6(e.start) || isValidDate6(e.end)),
|
|
15621
|
+
[events]
|
|
15622
|
+
);
|
|
15623
|
+
const undatedEvents = (0, import_react73.useMemo)(
|
|
15624
|
+
() => events.filter((e) => !(isValidDate6(e.start) || isValidDate6(e.end))),
|
|
15625
|
+
[events]
|
|
15626
|
+
);
|
|
15627
|
+
const days = (0, import_react73.useMemo)(() => {
|
|
15628
|
+
console.log("Agenda view updating with date:", currentDate.toISOString());
|
|
15629
|
+
return Array.from(
|
|
15630
|
+
{ length: AgendaDaysToShowAgenda },
|
|
15631
|
+
(_, i) => (0, import_date_fns16.addDays)(new Date(currentDate), i)
|
|
15632
|
+
);
|
|
15633
|
+
}, [currentDate]);
|
|
15634
|
+
const handleEventClick = (event, e) => {
|
|
15635
|
+
e.stopPropagation();
|
|
15636
|
+
console.log("Agenda view event clicked:", event);
|
|
15637
|
+
if (onEventSelect) onEventSelect(event);
|
|
15638
|
+
};
|
|
15639
|
+
const hasEvents = days.some(
|
|
15640
|
+
(day) => getAgendaEventsForDayAgenda(datedEvents, day).length > 0
|
|
15641
|
+
);
|
|
15642
|
+
return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)("div", { className: "border-border/70 border-t px-4", children: !hasEvents && !(showUndatedEvents && undatedEvents.length > 0) ? /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)("div", { className: "flex min-h-[70svh] flex-col items-center justify-center py-16 text-center", children: [
|
|
15643
|
+
/* @__PURE__ */ (0, import_jsx_runtime86.jsx)(import_react74.CalendarIcon, { className: "mb-2 text-muted-foreground/50", size: 32 }),
|
|
15644
|
+
/* @__PURE__ */ (0, import_jsx_runtime86.jsx)("h3", { className: "font-medium text-lg", children: "Nenhum evento encontrado" }),
|
|
15645
|
+
/* @__PURE__ */ (0, import_jsx_runtime86.jsx)("p", { className: "text-muted-foreground", children: "N\xE3o h\xE1 eventos agendados para este per\xEDodo." })
|
|
15646
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(import_jsx_runtime86.Fragment, { children: [
|
|
15647
|
+
days.map((day) => {
|
|
15648
|
+
const dayEvents = getAgendaEventsForDayAgenda(datedEvents, day);
|
|
15649
|
+
if (dayEvents.length === 0) return null;
|
|
15650
|
+
return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(
|
|
15651
|
+
"div",
|
|
15652
|
+
{
|
|
15653
|
+
className: (0, import_tailwind_merge2.twMerge)(
|
|
15654
|
+
"relative my-12 border-border/70 border-t",
|
|
15655
|
+
(0, import_date_fns16.isToday)(day) ? "border-blue-200" : ""
|
|
15656
|
+
),
|
|
15657
|
+
children: [
|
|
15658
|
+
/* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
|
|
15659
|
+
"span",
|
|
15660
|
+
{
|
|
15661
|
+
className: (0, import_tailwind_merge2.twMerge)(
|
|
15662
|
+
"-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",
|
|
15663
|
+
(0, import_date_fns16.isToday)(day) ? "text-blue-500" : ""
|
|
15664
|
+
),
|
|
15665
|
+
"data-today": (0, import_date_fns16.isToday)(day) || void 0,
|
|
15666
|
+
children: (() => {
|
|
15667
|
+
const s = (0, import_date_fns16.format)(day, "d MMM, EEEE", { locale: import_locale9.ptBR });
|
|
15668
|
+
return s.split(" ").map((w) => w ? w[0].toUpperCase() + w.slice(1) : w).join(" ");
|
|
15669
|
+
})()
|
|
15670
|
+
}
|
|
15671
|
+
),
|
|
15672
|
+
/* @__PURE__ */ (0, import_jsx_runtime86.jsx)("div", { className: "mt-6 space-y-2", children: dayEvents.map((event) => /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
|
|
15673
|
+
EventItemAgenda,
|
|
15674
|
+
{
|
|
15675
|
+
event,
|
|
15676
|
+
onClick: onEventSelect ? (e) => handleEventClick(event, e) : void 0,
|
|
15677
|
+
view: "agenda",
|
|
15678
|
+
className: onEventSelect ? void 0 : "cursor-default hover:shadow-none hover:scale-100"
|
|
15679
|
+
},
|
|
15680
|
+
event.id
|
|
15681
|
+
)) })
|
|
15682
|
+
]
|
|
15683
|
+
},
|
|
15684
|
+
day.toString()
|
|
15685
|
+
);
|
|
15686
|
+
}),
|
|
15687
|
+
/* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
|
|
15688
|
+
UndatedEvents,
|
|
15689
|
+
{
|
|
15690
|
+
events,
|
|
15691
|
+
onEventSelect,
|
|
15692
|
+
show: showUndatedEvents,
|
|
15693
|
+
className: "my-12"
|
|
15694
|
+
}
|
|
15695
|
+
)
|
|
15696
|
+
] }) });
|
|
15697
|
+
}
|
|
15698
|
+
|
|
15699
|
+
// src/components/event-calendar-view/CalendarDND.tsx
|
|
15700
|
+
var import_core4 = require("@dnd-kit/core");
|
|
15701
|
+
var import_date_fns17 = require("date-fns");
|
|
15702
|
+
var import_react76 = require("react");
|
|
15703
|
+
|
|
15704
|
+
// src/components/event-calendar-view/hooks.ts
|
|
15705
|
+
var import_react75 = require("react");
|
|
15706
|
+
var CalendarDndContext2 = (0, import_react75.createContext)({
|
|
15707
|
+
activeEvent: null,
|
|
15708
|
+
activeId: null,
|
|
15709
|
+
activeView: null,
|
|
15710
|
+
currentTime: null,
|
|
15711
|
+
dragHandlePosition: null,
|
|
15712
|
+
eventHeight: null,
|
|
15713
|
+
isMultiDay: false,
|
|
15714
|
+
multiDayWidth: null
|
|
15715
|
+
});
|
|
15716
|
+
var useCalendarDndAgenda = () => (0, import_react75.useContext)(CalendarDndContext2);
|
|
15717
|
+
|
|
15718
|
+
// src/components/event-calendar-view/CalendarDND.tsx
|
|
15719
|
+
var import_jsx_runtime87 = require("react/jsx-runtime");
|
|
15720
|
+
function CalendarDndProviderAgenda({
|
|
15721
|
+
children,
|
|
15722
|
+
onEventUpdate
|
|
15723
|
+
}) {
|
|
15724
|
+
const [activeEvent, setActiveEvent] = (0, import_react76.useState)(null);
|
|
15725
|
+
const [activeId, setActiveId] = (0, import_react76.useState)(null);
|
|
15726
|
+
const [activeView, setActiveView] = (0, import_react76.useState)(
|
|
15727
|
+
null
|
|
15728
|
+
);
|
|
15729
|
+
const [currentTime, setCurrentTime] = (0, import_react76.useState)(null);
|
|
15730
|
+
const [eventHeight, setEventHeight] = (0, import_react76.useState)(null);
|
|
15731
|
+
const [isMultiDay, setIsMultiDay] = (0, import_react76.useState)(false);
|
|
15732
|
+
const [multiDayWidth, setMultiDayWidth] = (0, import_react76.useState)(null);
|
|
15733
|
+
const [dragHandlePosition, setDragHandlePosition] = (0, import_react76.useState)(null);
|
|
15734
|
+
const eventDimensions = (0, import_react76.useRef)({ height: 0 });
|
|
15735
|
+
const sensors = (0, import_core4.useSensors)(
|
|
15736
|
+
(0, import_core4.useSensor)(import_core4.MouseSensor, {
|
|
15737
|
+
// Require the mouse to move by 5px before activating
|
|
15738
|
+
activationConstraint: {
|
|
15739
|
+
distance: 5
|
|
15740
|
+
}
|
|
15741
|
+
}),
|
|
15742
|
+
(0, import_core4.useSensor)(import_core4.TouchSensor, {
|
|
15743
|
+
// Press delay of 250ms, with tolerance of 5px of movement
|
|
15744
|
+
activationConstraint: {
|
|
15745
|
+
delay: 250,
|
|
15746
|
+
tolerance: 5
|
|
15747
|
+
}
|
|
15748
|
+
}),
|
|
15749
|
+
(0, import_core4.useSensor)(import_core4.PointerSensor, {
|
|
15750
|
+
// Require the pointer to move by 5px before activating
|
|
15751
|
+
activationConstraint: {
|
|
15752
|
+
distance: 5
|
|
15753
|
+
}
|
|
15754
|
+
})
|
|
15755
|
+
);
|
|
15756
|
+
const dndContextId = (0, import_react76.useId)();
|
|
15757
|
+
const handleDragStart = (event) => {
|
|
15758
|
+
const { active } = event;
|
|
15759
|
+
if (!active.data.current) {
|
|
15760
|
+
console.error("Missing data in drag start event", event);
|
|
15761
|
+
return;
|
|
15762
|
+
}
|
|
15763
|
+
const {
|
|
15764
|
+
event: calendarEvent,
|
|
15765
|
+
view,
|
|
15766
|
+
height,
|
|
15767
|
+
isMultiDay: eventIsMultiDay,
|
|
15768
|
+
multiDayWidth: eventMultiDayWidth,
|
|
15769
|
+
dragHandlePosition: eventDragHandlePosition
|
|
15770
|
+
} = active.data.current;
|
|
15771
|
+
setActiveEvent(calendarEvent);
|
|
15772
|
+
setActiveId(active.id);
|
|
15773
|
+
setActiveView(view);
|
|
15774
|
+
setCurrentTime(calendarEvent.start ? new Date(calendarEvent.start) : null);
|
|
15775
|
+
setIsMultiDay(eventIsMultiDay || false);
|
|
15776
|
+
setMultiDayWidth(eventMultiDayWidth || null);
|
|
15777
|
+
setDragHandlePosition(eventDragHandlePosition || null);
|
|
15778
|
+
if (height) {
|
|
15779
|
+
eventDimensions.current.height = height;
|
|
15780
|
+
setEventHeight(height);
|
|
15781
|
+
}
|
|
15782
|
+
};
|
|
15783
|
+
const handleDragOver = (event) => {
|
|
15784
|
+
const { over } = event;
|
|
15785
|
+
if (over && activeEvent && over.data.current) {
|
|
15786
|
+
const { date, time } = over.data.current;
|
|
15787
|
+
if (time !== void 0 && activeView !== "month") {
|
|
15788
|
+
const newTime = new Date(date);
|
|
15789
|
+
const hours = Math.floor(time);
|
|
15790
|
+
const fractionalHour = time - hours;
|
|
15791
|
+
let minutes = 0;
|
|
15792
|
+
if (fractionalHour < 0.125) minutes = 0;
|
|
15793
|
+
else if (fractionalHour < 0.375) minutes = 15;
|
|
15794
|
+
else if (fractionalHour < 0.625) minutes = 30;
|
|
15795
|
+
else minutes = 45;
|
|
15796
|
+
newTime.setHours(hours, minutes, 0, 0);
|
|
15797
|
+
if (!currentTime || newTime.getHours() !== currentTime.getHours() || newTime.getMinutes() !== currentTime.getMinutes() || newTime.getDate() !== currentTime.getDate() || newTime.getMonth() !== currentTime.getMonth() || newTime.getFullYear() !== currentTime.getFullYear()) {
|
|
15798
|
+
setCurrentTime(newTime);
|
|
15799
|
+
}
|
|
15800
|
+
} else if (activeView === "month") {
|
|
15801
|
+
const newTime = new Date(date);
|
|
15802
|
+
if (currentTime) {
|
|
15803
|
+
newTime.setHours(
|
|
15804
|
+
currentTime.getHours(),
|
|
15805
|
+
currentTime.getMinutes(),
|
|
15806
|
+
currentTime.getSeconds(),
|
|
15807
|
+
currentTime.getMilliseconds()
|
|
15808
|
+
);
|
|
15809
|
+
}
|
|
15810
|
+
if (!currentTime || newTime.getDate() !== currentTime.getDate() || newTime.getMonth() !== currentTime.getMonth() || newTime.getFullYear() !== currentTime.getFullYear()) {
|
|
15811
|
+
setCurrentTime(newTime);
|
|
15812
|
+
}
|
|
15813
|
+
}
|
|
15814
|
+
}
|
|
15815
|
+
};
|
|
15816
|
+
const handleDragEnd = (event) => {
|
|
15817
|
+
const { active, over } = event;
|
|
15818
|
+
if (!over || !activeEvent || !currentTime) {
|
|
15819
|
+
setActiveEvent(null);
|
|
15820
|
+
setActiveId(null);
|
|
15821
|
+
setActiveView(null);
|
|
15822
|
+
setCurrentTime(null);
|
|
15823
|
+
setEventHeight(null);
|
|
15824
|
+
setIsMultiDay(false);
|
|
15825
|
+
setMultiDayWidth(null);
|
|
15826
|
+
setDragHandlePosition(null);
|
|
15827
|
+
return;
|
|
15828
|
+
}
|
|
15829
|
+
try {
|
|
15830
|
+
if (!active.data.current || !over.data.current) {
|
|
15831
|
+
throw new Error("Missing data in drag event");
|
|
15832
|
+
}
|
|
15833
|
+
const activeData = active.data.current;
|
|
15834
|
+
const overData = over.data.current;
|
|
15835
|
+
if (!activeData.event || !overData.date) {
|
|
15836
|
+
throw new Error("Missing required event data");
|
|
15837
|
+
}
|
|
15838
|
+
const calendarEvent = activeData.event;
|
|
15839
|
+
const date = overData.date;
|
|
15840
|
+
const time = overData.time;
|
|
15841
|
+
const newStart = new Date(date);
|
|
15842
|
+
if (time !== void 0) {
|
|
15843
|
+
const hours = Math.floor(time);
|
|
15844
|
+
const fractionalHour = time - hours;
|
|
15845
|
+
let minutes = 0;
|
|
15846
|
+
if (fractionalHour < 0.125) minutes = 0;
|
|
15847
|
+
else if (fractionalHour < 0.375) minutes = 15;
|
|
15848
|
+
else if (fractionalHour < 0.625) minutes = 30;
|
|
15849
|
+
else minutes = 45;
|
|
15850
|
+
newStart.setHours(hours, minutes, 0, 0);
|
|
15851
|
+
} else {
|
|
15852
|
+
newStart.setHours(
|
|
15853
|
+
currentTime.getHours(),
|
|
15854
|
+
currentTime.getMinutes(),
|
|
15855
|
+
currentTime.getSeconds(),
|
|
15856
|
+
currentTime.getMilliseconds()
|
|
15857
|
+
);
|
|
15858
|
+
}
|
|
15859
|
+
if (!calendarEvent.start || !calendarEvent.end) {
|
|
15860
|
+
console.error("Cannot compute duration: event start or end is null", calendarEvent);
|
|
15861
|
+
return;
|
|
15862
|
+
}
|
|
15863
|
+
const originalStart = new Date(calendarEvent.start);
|
|
15864
|
+
const originalEnd = new Date(calendarEvent.end);
|
|
15865
|
+
const durationMinutes = (0, import_date_fns17.differenceInMinutes)(originalEnd, originalStart);
|
|
15866
|
+
const newEnd = (0, import_date_fns17.addMinutes)(newStart, durationMinutes);
|
|
15867
|
+
const hasStartTimeChanged = originalStart.getFullYear() !== newStart.getFullYear() || originalStart.getMonth() !== newStart.getMonth() || originalStart.getDate() !== newStart.getDate() || originalStart.getHours() !== newStart.getHours() || originalStart.getMinutes() !== newStart.getMinutes();
|
|
15868
|
+
if (hasStartTimeChanged) {
|
|
15869
|
+
onEventUpdate({
|
|
15870
|
+
...calendarEvent,
|
|
15871
|
+
end: newEnd,
|
|
15872
|
+
start: newStart
|
|
15873
|
+
});
|
|
15874
|
+
}
|
|
15875
|
+
} catch (error) {
|
|
15876
|
+
console.error("Error in drag end handler:", error);
|
|
15877
|
+
} finally {
|
|
15878
|
+
setActiveEvent(null);
|
|
15879
|
+
setActiveId(null);
|
|
15880
|
+
setActiveView(null);
|
|
15881
|
+
setCurrentTime(null);
|
|
15882
|
+
setEventHeight(null);
|
|
15883
|
+
setIsMultiDay(false);
|
|
15884
|
+
setMultiDayWidth(null);
|
|
15885
|
+
setDragHandlePosition(null);
|
|
15886
|
+
}
|
|
15887
|
+
};
|
|
15888
|
+
return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
|
|
15889
|
+
import_core4.DndContext,
|
|
15890
|
+
{
|
|
15891
|
+
id: dndContextId,
|
|
15892
|
+
onDragEnd: handleDragEnd,
|
|
15893
|
+
onDragOver: handleDragOver,
|
|
15894
|
+
onDragStart: handleDragStart,
|
|
15895
|
+
sensors,
|
|
15896
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(
|
|
15897
|
+
CalendarDndContext2.Provider,
|
|
15898
|
+
{
|
|
15899
|
+
value: {
|
|
15900
|
+
activeEvent,
|
|
15901
|
+
activeId,
|
|
15902
|
+
activeView,
|
|
15903
|
+
currentTime,
|
|
15904
|
+
dragHandlePosition,
|
|
15905
|
+
eventHeight,
|
|
15906
|
+
isMultiDay,
|
|
15907
|
+
multiDayWidth
|
|
15908
|
+
},
|
|
15909
|
+
children: [
|
|
15910
|
+
children,
|
|
15911
|
+
/* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_core4.DragOverlay, { adjustScale: false, dropAnimation: null, children: activeEvent && activeView && /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
|
|
15912
|
+
"div",
|
|
15913
|
+
{
|
|
15914
|
+
style: {
|
|
15915
|
+
height: eventHeight ? `${eventHeight}px` : "auto",
|
|
15916
|
+
width: isMultiDay && multiDayWidth ? `${multiDayWidth}%` : "100%"
|
|
15917
|
+
},
|
|
15918
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
|
|
15919
|
+
EventItemAgenda,
|
|
15920
|
+
{
|
|
15921
|
+
currentTime: currentTime || void 0,
|
|
15922
|
+
event: activeEvent,
|
|
15923
|
+
isDragging: true,
|
|
15924
|
+
isFirstDay: dragHandlePosition?.data?.isFirstDay !== false,
|
|
15925
|
+
isLastDay: dragHandlePosition?.data?.isLastDay !== false,
|
|
15926
|
+
showTime: activeView !== "month",
|
|
15927
|
+
view: activeView
|
|
15928
|
+
}
|
|
15929
|
+
)
|
|
15930
|
+
}
|
|
15931
|
+
) })
|
|
15932
|
+
]
|
|
15933
|
+
}
|
|
15934
|
+
)
|
|
15935
|
+
}
|
|
15936
|
+
);
|
|
15937
|
+
}
|
|
15938
|
+
|
|
15939
|
+
// src/components/event-calendar-view/constants.ts
|
|
15940
|
+
var EventHeightAgenda = 24;
|
|
15941
|
+
var EventGapAgenda = 4;
|
|
15942
|
+
var WeekCellsHeightAgenda = 64;
|
|
15943
|
+
var AgendaDaysToShowAgenda = 30;
|
|
15944
|
+
var StartHourAgenda = 0;
|
|
15945
|
+
var EndHourAgenda = 24;
|
|
15946
|
+
var DefaultStartHourAgenda = 9;
|
|
15947
|
+
var DefaultEndHourAgenda = 10;
|
|
15948
|
+
|
|
15949
|
+
// src/components/event-calendar-view/DayView.tsx
|
|
15950
|
+
var import_date_fns21 = require("date-fns");
|
|
15951
|
+
var import_react80 = require("react");
|
|
15952
|
+
|
|
15953
|
+
// src/components/event-calendar-view/utils.ts
|
|
15954
|
+
var import_date_fns18 = require("date-fns");
|
|
15955
|
+
function getEventColorClassesAgenda(color) {
|
|
15956
|
+
const eventColor = color || "sky";
|
|
15957
|
+
switch (eventColor) {
|
|
15958
|
+
case "sky":
|
|
15959
|
+
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";
|
|
15960
|
+
case "amber":
|
|
15961
|
+
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";
|
|
15962
|
+
case "violet":
|
|
15963
|
+
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";
|
|
15964
|
+
case "rose":
|
|
15965
|
+
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";
|
|
15966
|
+
case "emerald":
|
|
15967
|
+
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";
|
|
15968
|
+
case "orange":
|
|
15969
|
+
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";
|
|
15970
|
+
default:
|
|
15971
|
+
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";
|
|
15972
|
+
}
|
|
15973
|
+
}
|
|
15974
|
+
function getBorderRadiusClassesAgenda(isFirstDay, isLastDay) {
|
|
15975
|
+
if (isFirstDay && isLastDay) {
|
|
15976
|
+
return "rounded";
|
|
15977
|
+
}
|
|
15978
|
+
if (isFirstDay) {
|
|
15979
|
+
return "rounded-l rounded-r-none";
|
|
15980
|
+
}
|
|
15981
|
+
if (isLastDay) {
|
|
15982
|
+
return "rounded-r rounded-l-none";
|
|
15983
|
+
}
|
|
15984
|
+
return "rounded-none";
|
|
15985
|
+
}
|
|
15986
|
+
function isMultiDayEventAgenda(event) {
|
|
15987
|
+
const eventStart = isValidDate3(event.start) ? new Date(event.start) : void 0;
|
|
15988
|
+
const eventEnd = isValidDate3(event.end) ? new Date(event.end) : void 0;
|
|
15989
|
+
if (!eventStart || !eventEnd) return !!event.allDay;
|
|
15990
|
+
return event.allDay || eventStart.getDate() !== eventEnd.getDate();
|
|
15991
|
+
}
|
|
15992
|
+
function getEventsForDayAgenda(events, day) {
|
|
15993
|
+
return events.filter((event) => {
|
|
15994
|
+
const eventStart = isValidDate3(event.start) ? new Date(event.start) : void 0;
|
|
15995
|
+
return eventStart ? (0, import_date_fns18.isSameDay)(day, eventStart) : false;
|
|
15996
|
+
}).sort((a, b) => getEventStartTimestamp2(a) - getEventStartTimestamp2(b));
|
|
15997
|
+
}
|
|
15998
|
+
function sortEventsAgenda(events) {
|
|
15999
|
+
return [...events].sort((a, b) => {
|
|
16000
|
+
const aIsMultiDay = isMultiDayEventAgenda(a);
|
|
16001
|
+
const bIsMultiDay = isMultiDayEventAgenda(b);
|
|
16002
|
+
if (aIsMultiDay && !bIsMultiDay) return -1;
|
|
16003
|
+
if (!aIsMultiDay && bIsMultiDay) return 1;
|
|
16004
|
+
return getEventStartTimestamp2(a) - getEventStartTimestamp2(b);
|
|
16005
|
+
});
|
|
16006
|
+
}
|
|
16007
|
+
function getSpanningEventsForDayAgenda(events, day) {
|
|
16008
|
+
return events.filter((event) => {
|
|
16009
|
+
if (!isMultiDayEventAgenda(event)) return false;
|
|
16010
|
+
const eventStart = isValidDate3(event.start) ? new Date(event.start) : void 0;
|
|
16011
|
+
const eventEnd = isValidDate3(event.end) ? new Date(event.end) : void 0;
|
|
16012
|
+
if (!eventStart || !eventEnd) return false;
|
|
16013
|
+
return !(0, import_date_fns18.isSameDay)(day, eventStart) && ((0, import_date_fns18.isSameDay)(day, eventEnd) || day > eventStart && day < eventEnd);
|
|
16014
|
+
});
|
|
16015
|
+
}
|
|
16016
|
+
function getAllEventsForDayAgenda(events, day) {
|
|
16017
|
+
return events.filter((event) => {
|
|
16018
|
+
const eventStart = isValidDate3(event.start) ? new Date(event.start) : void 0;
|
|
16019
|
+
const eventEnd = isValidDate3(event.end) ? new Date(event.end) : void 0;
|
|
16020
|
+
if (!eventStart) return false;
|
|
16021
|
+
return (0, import_date_fns18.isSameDay)(day, eventStart) || (eventEnd ? (0, import_date_fns18.isSameDay)(day, eventEnd) : false) || (eventEnd ? day > eventStart && day < eventEnd : false);
|
|
16022
|
+
});
|
|
16023
|
+
}
|
|
16024
|
+
function getAgendaEventsForDayAgenda(events, day) {
|
|
16025
|
+
return events.filter((event) => {
|
|
16026
|
+
const eventStart = isValidDate3(event.start) ? new Date(event.start) : void 0;
|
|
16027
|
+
const eventEnd = isValidDate3(event.end) ? new Date(event.end) : void 0;
|
|
16028
|
+
if (!eventStart) return false;
|
|
16029
|
+
return (0, import_date_fns18.isSameDay)(day, eventStart) || (eventEnd ? (0, import_date_fns18.isSameDay)(day, eventEnd) : false) || (eventEnd ? day > eventStart && day < eventEnd : false);
|
|
16030
|
+
}).sort((a, b) => getEventStartTimestamp2(a) - getEventStartTimestamp2(b));
|
|
16031
|
+
}
|
|
16032
|
+
function isValidDate3(d) {
|
|
16033
|
+
try {
|
|
16034
|
+
const t = d instanceof Date ? d.getTime() : new Date(String(d)).getTime();
|
|
16035
|
+
return !isNaN(t);
|
|
16036
|
+
} catch {
|
|
16037
|
+
return false;
|
|
16038
|
+
}
|
|
16039
|
+
}
|
|
16040
|
+
function getEventStartTimestamp2(e) {
|
|
16041
|
+
if (isValidDate3(e.start)) return new Date(e.start).getTime();
|
|
16042
|
+
return Number.MAX_SAFE_INTEGER;
|
|
16043
|
+
}
|
|
16044
|
+
function normalizeAttendDate(d) {
|
|
16045
|
+
if (d === void 0 || d === null) return void 0;
|
|
16046
|
+
try {
|
|
16047
|
+
const dt = d instanceof Date ? d : new Date(String(d));
|
|
16048
|
+
if (isNaN(dt.getTime())) return void 0;
|
|
16049
|
+
if (dt.getHours() !== 0 || dt.getMinutes() !== 0 || dt.getSeconds() !== 0 || dt.getMilliseconds() !== 0) {
|
|
16050
|
+
return dt;
|
|
16051
|
+
}
|
|
16052
|
+
return new Date(dt.getFullYear(), dt.getMonth(), dt.getDate());
|
|
16053
|
+
} catch {
|
|
16054
|
+
return void 0;
|
|
16055
|
+
}
|
|
16056
|
+
}
|
|
16057
|
+
function addHoursToDateAgenda(date, hours) {
|
|
16058
|
+
const result = new Date(date);
|
|
16059
|
+
result.setHours(result.getHours() + hours);
|
|
16060
|
+
return result;
|
|
16061
|
+
}
|
|
16062
|
+
|
|
16063
|
+
// src/components/event-calendar-view/hooks/use-current-time-indicator.ts
|
|
16064
|
+
var import_date_fns19 = require("date-fns");
|
|
16065
|
+
var import_locale10 = require("date-fns/locale");
|
|
16066
|
+
var import_react77 = require("react");
|
|
16067
|
+
function useCurrentTimeIndicatorAgenda(currentDate, view) {
|
|
16068
|
+
const [currentTimePosition, setCurrentTimePosition] = (0, import_react77.useState)(0);
|
|
16069
|
+
const [currentTimeVisible, setCurrentTimeVisible] = (0, import_react77.useState)(false);
|
|
16070
|
+
(0, import_react77.useEffect)(() => {
|
|
16071
|
+
const calculateTimePosition = () => {
|
|
16072
|
+
const now = /* @__PURE__ */ new Date();
|
|
16073
|
+
const hours = now.getHours();
|
|
16074
|
+
const minutes = now.getMinutes();
|
|
16075
|
+
const totalMinutes = (hours - StartHourAgenda) * 60 + minutes;
|
|
16076
|
+
const dayStartMinutes = 0;
|
|
16077
|
+
const dayEndMinutes = (EndHourAgenda - StartHourAgenda) * 60;
|
|
16078
|
+
const position = (totalMinutes - dayStartMinutes) / (dayEndMinutes - dayStartMinutes) * 100;
|
|
16079
|
+
let isCurrentTimeVisible = false;
|
|
16080
|
+
if (view === "day") {
|
|
16081
|
+
isCurrentTimeVisible = (0, import_date_fns19.isSameDay)(now, currentDate);
|
|
16082
|
+
} else if (view === "week") {
|
|
16083
|
+
const startOfWeekDate = (0, import_date_fns19.startOfWeek)(currentDate, { locale: import_locale10.ptBR });
|
|
16084
|
+
const endOfWeekDate = (0, import_date_fns19.endOfWeek)(currentDate, { locale: import_locale10.ptBR });
|
|
16085
|
+
isCurrentTimeVisible = (0, import_date_fns19.isWithinInterval)(now, {
|
|
16086
|
+
end: endOfWeekDate,
|
|
16087
|
+
start: startOfWeekDate
|
|
16088
|
+
});
|
|
16089
|
+
}
|
|
16090
|
+
setCurrentTimePosition(position);
|
|
16091
|
+
setCurrentTimeVisible(isCurrentTimeVisible);
|
|
16092
|
+
};
|
|
16093
|
+
calculateTimePosition();
|
|
16094
|
+
const interval = setInterval(calculateTimePosition, 6e4);
|
|
16095
|
+
return () => clearInterval(interval);
|
|
16096
|
+
}, [currentDate, view]);
|
|
16097
|
+
return { currentTimePosition, currentTimeVisible };
|
|
16098
|
+
}
|
|
16099
|
+
|
|
16100
|
+
// src/components/event-calendar-view/EventItemAgenda.tsx
|
|
16101
|
+
var import_date_fns20 = require("date-fns");
|
|
16102
|
+
var import_react78 = require("react");
|
|
16103
|
+
var import_react79 = require("@phosphor-icons/react");
|
|
16104
|
+
var import_jsx_runtime88 = require("react/jsx-runtime");
|
|
16105
|
+
var formatTimeWithOptionalMinutes2 = (date) => {
|
|
16106
|
+
return (0, import_date_fns20.format)(date, "HH:mm");
|
|
16107
|
+
};
|
|
16108
|
+
var isValidDate4 = (d) => {
|
|
16109
|
+
try {
|
|
16110
|
+
const dt = d instanceof Date ? d : new Date(String(d));
|
|
16111
|
+
return !isNaN(dt.getTime());
|
|
16112
|
+
} catch {
|
|
16113
|
+
return false;
|
|
16114
|
+
}
|
|
16115
|
+
};
|
|
16116
|
+
function EventWrapper2({
|
|
16117
|
+
event,
|
|
16118
|
+
isFirstDay = true,
|
|
16119
|
+
isLastDay = true,
|
|
16120
|
+
isDragging,
|
|
16121
|
+
onClick,
|
|
16122
|
+
className,
|
|
16123
|
+
children,
|
|
16124
|
+
currentTime,
|
|
16125
|
+
dndListeners,
|
|
16126
|
+
dndAttributes,
|
|
16127
|
+
onMouseDown,
|
|
16128
|
+
onTouchStart,
|
|
16129
|
+
ariaLabel
|
|
16130
|
+
}) {
|
|
16131
|
+
const hasValidTimeForWrapper = isValidDate4(event.start) || isValidDate4(event.end);
|
|
16132
|
+
const displayEnd = (() => {
|
|
16133
|
+
if (isValidDate4(event.start) && isValidDate4(event.end)) {
|
|
16134
|
+
return currentTime ? new Date(
|
|
16135
|
+
new Date(currentTime).getTime() + (new Date(event.end).getTime() - new Date(event.start).getTime())
|
|
16136
|
+
) : new Date(event.end);
|
|
16137
|
+
}
|
|
16138
|
+
if (isValidDate4(event.start) && !isValidDate4(event.end)) {
|
|
16139
|
+
return currentTime ? new Date(currentTime) : new Date(event.start);
|
|
16140
|
+
}
|
|
16141
|
+
if (!isValidDate4(event.start) && isValidDate4(event.end)) {
|
|
16142
|
+
return currentTime ? new Date(currentTime) : new Date(event.end);
|
|
16143
|
+
}
|
|
16144
|
+
return void 0;
|
|
16145
|
+
})();
|
|
16146
|
+
const isEventInPast = displayEnd ? (0, import_date_fns20.isPast)(displayEnd) : false;
|
|
16147
|
+
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";
|
|
16148
|
+
return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
|
|
16149
|
+
"button",
|
|
16150
|
+
{
|
|
16151
|
+
className: cn(
|
|
16152
|
+
"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",
|
|
16153
|
+
colorClasses,
|
|
16154
|
+
getBorderRadiusClassesAgenda(isFirstDay, isLastDay),
|
|
16155
|
+
className
|
|
16156
|
+
),
|
|
16157
|
+
"data-dragging": isDragging || void 0,
|
|
16158
|
+
"data-past-event": isEventInPast || void 0,
|
|
16159
|
+
onClick,
|
|
16160
|
+
onMouseDown,
|
|
16161
|
+
onTouchStart,
|
|
16162
|
+
"aria-label": ariaLabel,
|
|
16163
|
+
type: "button",
|
|
16164
|
+
...dndListeners,
|
|
16165
|
+
...dndAttributes,
|
|
16166
|
+
children
|
|
16167
|
+
}
|
|
16168
|
+
);
|
|
16169
|
+
}
|
|
16170
|
+
function EventItemAgenda({
|
|
16171
|
+
event,
|
|
16172
|
+
view,
|
|
16173
|
+
onClick,
|
|
16174
|
+
showTime,
|
|
16175
|
+
currentTime,
|
|
16176
|
+
isFirstDay = true,
|
|
16177
|
+
isLastDay = true,
|
|
16178
|
+
children,
|
|
16179
|
+
className,
|
|
16180
|
+
dndListeners,
|
|
16181
|
+
dndAttributes,
|
|
16182
|
+
onMouseDown,
|
|
16183
|
+
onTouchStart,
|
|
16184
|
+
agendaOnly = false
|
|
16185
|
+
}) {
|
|
16186
|
+
const eventColor = event.color;
|
|
16187
|
+
const hasValidTime = isValidDate4(event.start) || isValidDate4(event.end);
|
|
16188
|
+
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";
|
|
16189
|
+
const displayStart = (0, import_react78.useMemo)(() => {
|
|
16190
|
+
if (!hasValidTime) return void 0;
|
|
16191
|
+
if (isValidDate4(event.start))
|
|
16192
|
+
return currentTime || new Date(event.start);
|
|
16193
|
+
if (isValidDate4(event.end))
|
|
16194
|
+
return currentTime || new Date(event.end);
|
|
16195
|
+
return void 0;
|
|
16196
|
+
}, [currentTime, event.start, event.end, hasValidTime]);
|
|
16197
|
+
const displayEnd = (0, import_react78.useMemo)(() => {
|
|
16198
|
+
if (!hasValidTime) return void 0;
|
|
16199
|
+
if (isValidDate4(event.end)) {
|
|
16200
|
+
return currentTime ? new Date(
|
|
16201
|
+
new Date(currentTime).getTime() + (isValidDate4(event.start) ? new Date(event.end).getTime() - new Date(event.start).getTime() : 0)
|
|
16202
|
+
) : new Date(event.end);
|
|
16203
|
+
}
|
|
16204
|
+
if (isValidDate4(event.start)) {
|
|
16205
|
+
return currentTime ? new Date(currentTime) : new Date(event.start);
|
|
16206
|
+
}
|
|
16207
|
+
return void 0;
|
|
16208
|
+
}, [currentTime, event.start, event.end, hasValidTime]);
|
|
16209
|
+
const durationMinutes = (0, import_react78.useMemo)(() => {
|
|
16210
|
+
if (!hasValidTime || !displayStart || !displayEnd) return 0;
|
|
16211
|
+
return (0, import_date_fns20.differenceInMinutes)(displayEnd, displayStart);
|
|
16212
|
+
}, [displayStart, displayEnd, hasValidTime]);
|
|
16213
|
+
const getEventTime = () => {
|
|
16214
|
+
if (!hasValidTime) return "";
|
|
16215
|
+
if (event.allDay) return "All day";
|
|
16216
|
+
if (durationMinutes < 45) {
|
|
16217
|
+
return formatTimeWithOptionalMinutes2(displayStart);
|
|
16218
|
+
}
|
|
16219
|
+
return `${formatTimeWithOptionalMinutes2(
|
|
16220
|
+
displayStart
|
|
16221
|
+
)} - ${formatTimeWithOptionalMinutes2(displayEnd)}`;
|
|
16222
|
+
};
|
|
16223
|
+
let ariaLabel;
|
|
16224
|
+
if (!hasValidTime) {
|
|
16225
|
+
ariaLabel = event.title;
|
|
16226
|
+
} else if (event.allDay) {
|
|
16227
|
+
ariaLabel = `${event.title}, All day`;
|
|
16228
|
+
} else if (durationMinutes < 45) {
|
|
16229
|
+
ariaLabel = `${event.title}, ${formatTimeWithOptionalMinutes2(
|
|
16230
|
+
displayStart
|
|
16231
|
+
)}`;
|
|
16232
|
+
} else {
|
|
16233
|
+
ariaLabel = `${event.title}, ${formatTimeWithOptionalMinutes2(
|
|
16234
|
+
displayStart
|
|
16235
|
+
)} - ${formatTimeWithOptionalMinutes2(displayEnd)}`;
|
|
16236
|
+
}
|
|
16237
|
+
if (view === "month") {
|
|
16238
|
+
return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
|
|
16239
|
+
EventWrapper2,
|
|
16240
|
+
{
|
|
16241
|
+
className: cn(
|
|
16242
|
+
"mt-[var(--event-gap)] h-[var(--event-height)] items-center sm:text-xs",
|
|
16243
|
+
className
|
|
16244
|
+
),
|
|
16245
|
+
currentTime,
|
|
16246
|
+
dndAttributes,
|
|
16247
|
+
dndListeners,
|
|
16248
|
+
event,
|
|
16249
|
+
ariaLabel,
|
|
16250
|
+
isFirstDay,
|
|
16251
|
+
isLastDay,
|
|
16252
|
+
onClick,
|
|
16253
|
+
children: children || /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("span", { className: "flex items-center gap-2 truncate", children: [
|
|
16254
|
+
!event.allDay && hasValidTime && displayStart && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: "truncate text-2xl opacity-80 bg-white/10 px-2 rounded-full", children: formatTimeWithOptionalMinutes2(displayStart) }),
|
|
16255
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
|
|
16256
|
+
"span",
|
|
16257
|
+
{
|
|
16258
|
+
className: cn(
|
|
16259
|
+
"truncate",
|
|
16260
|
+
agendaOnly ? "font-bold text-lg" : "font-medium"
|
|
16261
|
+
),
|
|
16262
|
+
children: event.title
|
|
16263
|
+
}
|
|
16264
|
+
)
|
|
16265
|
+
] })
|
|
16266
|
+
}
|
|
16267
|
+
);
|
|
16268
|
+
}
|
|
16269
|
+
if (view === "week" || view === "day") {
|
|
16270
|
+
return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
|
|
16271
|
+
EventWrapper2,
|
|
16272
|
+
{
|
|
16273
|
+
className: cn(
|
|
16274
|
+
"py-1",
|
|
16275
|
+
durationMinutes < 45 ? "items-center" : "flex-col",
|
|
16276
|
+
view === "week" ? "text-[10px] sm:text-xs" : "text-xs",
|
|
16277
|
+
className
|
|
16278
|
+
),
|
|
16279
|
+
currentTime,
|
|
16280
|
+
dndAttributes,
|
|
16281
|
+
dndListeners,
|
|
16282
|
+
event,
|
|
16283
|
+
ariaLabel,
|
|
16284
|
+
isFirstDay,
|
|
16285
|
+
isLastDay,
|
|
16286
|
+
children: durationMinutes < 45 ? /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: "flex items-center justify-between w-full", children: [
|
|
16287
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: cn("truncate text-lg"), children: event.title }),
|
|
16288
|
+
showTime && hasValidTime && displayStart && /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("span", { className: "ml-2 flex items-center gap-3 bg-white/10 py-0.5 rounded-full opacity-90 text-lg ", children: [
|
|
16289
|
+
formatTimeWithOptionalMinutes2(displayStart),
|
|
16290
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)(import_react79.ClockUserIcon, {})
|
|
16291
|
+
] })
|
|
16292
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(import_jsx_runtime88.Fragment, { children: [
|
|
16293
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: cn("truncate font-medium text-lg"), children: event.title }),
|
|
16294
|
+
showTime && hasValidTime && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: "truncate font-normal opacity-70", children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: "inline-block bg-white/5 px-0.5 py-0.5 rounded-full", children: getEventTime() }) })
|
|
16295
|
+
] })
|
|
16296
|
+
}
|
|
16297
|
+
);
|
|
16298
|
+
}
|
|
16299
|
+
if (!hasValidTime) {
|
|
16300
|
+
return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(
|
|
16301
|
+
"button",
|
|
16302
|
+
{
|
|
16303
|
+
className: cn(
|
|
16304
|
+
"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",
|
|
16305
|
+
getEventColorClassesAgenda(eventColor),
|
|
16306
|
+
className
|
|
16307
|
+
),
|
|
16308
|
+
"aria-label": ariaLabel,
|
|
16309
|
+
onClick,
|
|
16310
|
+
onMouseDown,
|
|
16311
|
+
onTouchStart,
|
|
16312
|
+
type: "button",
|
|
16313
|
+
...dndListeners,
|
|
16314
|
+
...dndAttributes,
|
|
16315
|
+
children: [
|
|
16316
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: cn("font-medium", agendaOnly ? "text-lg" : "text-sm"), children: event.title }),
|
|
16317
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
|
|
16318
|
+
"div",
|
|
16319
|
+
{
|
|
16320
|
+
className: cn(
|
|
16321
|
+
"opacity-70 flex items-center gap-2",
|
|
16322
|
+
agendaOnly ? "text-sm" : "text-xs"
|
|
16323
|
+
),
|
|
16324
|
+
children: event.location && /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("span", { className: "opacity-80 flex items-center gap-1", children: [
|
|
16325
|
+
"-",
|
|
16326
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: "truncate", children: event.location })
|
|
16327
|
+
] })
|
|
16328
|
+
}
|
|
16329
|
+
),
|
|
16330
|
+
event.description && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
|
|
16331
|
+
"div",
|
|
16332
|
+
{
|
|
16333
|
+
className: cn(
|
|
16334
|
+
"my-1 opacity-90",
|
|
16335
|
+
agendaOnly ? "text-md" : "text-xs"
|
|
16336
|
+
),
|
|
16337
|
+
style: {
|
|
16338
|
+
display: "-webkit-box",
|
|
16339
|
+
WebkitLineClamp: 2,
|
|
16340
|
+
WebkitBoxOrient: "vertical",
|
|
16341
|
+
overflow: "hidden"
|
|
16342
|
+
},
|
|
16343
|
+
children: event.description
|
|
16344
|
+
}
|
|
16345
|
+
)
|
|
16346
|
+
]
|
|
16347
|
+
}
|
|
16348
|
+
);
|
|
16349
|
+
}
|
|
16350
|
+
return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(
|
|
16351
|
+
"button",
|
|
16352
|
+
{
|
|
16353
|
+
className: cn(
|
|
16354
|
+
"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",
|
|
16355
|
+
colorClasses,
|
|
16356
|
+
className
|
|
16357
|
+
),
|
|
16358
|
+
"data-past-event": (0, import_date_fns20.isPast)(displayEnd) || void 0,
|
|
16359
|
+
"aria-label": ariaLabel,
|
|
16360
|
+
onClick,
|
|
16361
|
+
onMouseDown,
|
|
16362
|
+
onTouchStart,
|
|
16363
|
+
type: "button",
|
|
16364
|
+
...dndListeners,
|
|
16365
|
+
...dndAttributes,
|
|
16366
|
+
children: [
|
|
16367
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { className: "flex w-full justify-between ", children: [
|
|
16368
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: cn("font-bold text-lg"), children: event.title }),
|
|
16369
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { className: cn("opacity-90 flex items-center gap-2 text-lg"), children: event.allDay ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { children: "Dia todo" }) : /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("span", { className: "uppercase font-semibold flex items-center gap-2 ", children: [
|
|
16370
|
+
formatTimeWithOptionalMinutes2(displayStart),
|
|
16371
|
+
/* @__PURE__ */ (0, import_jsx_runtime88.jsx)(import_react79.ClockUserIcon, {})
|
|
16372
|
+
] }) })
|
|
16373
|
+
] }),
|
|
16374
|
+
event.description && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
|
|
16375
|
+
"div",
|
|
16376
|
+
{
|
|
16377
|
+
className: cn("my-1 opacity-90 flex text-md"),
|
|
16378
|
+
style: {
|
|
16379
|
+
display: "-webkit-box",
|
|
16380
|
+
WebkitLineClamp: 2,
|
|
16381
|
+
WebkitBoxOrient: "vertical",
|
|
16382
|
+
overflow: "hidden"
|
|
16383
|
+
},
|
|
16384
|
+
children: event.description
|
|
16385
|
+
}
|
|
16386
|
+
)
|
|
16387
|
+
]
|
|
16388
|
+
}
|
|
16389
|
+
);
|
|
16390
|
+
}
|
|
16391
|
+
|
|
16392
|
+
// src/components/event-calendar-view/DroppableCell.tsx
|
|
16393
|
+
var import_core5 = require("@dnd-kit/core");
|
|
16394
|
+
var import_jsx_runtime89 = require("react/jsx-runtime");
|
|
16395
|
+
function DroppableCellAgenda({
|
|
16396
|
+
id,
|
|
16397
|
+
date,
|
|
16398
|
+
time,
|
|
16399
|
+
children,
|
|
16400
|
+
className,
|
|
16401
|
+
onClick
|
|
16402
|
+
}) {
|
|
16403
|
+
const { activeEvent } = useCalendarDndAgenda();
|
|
16404
|
+
const { setNodeRef, isOver } = (0, import_core5.useDroppable)({
|
|
16405
|
+
data: {
|
|
16406
|
+
date,
|
|
16407
|
+
time
|
|
16408
|
+
},
|
|
16409
|
+
id
|
|
16410
|
+
});
|
|
16411
|
+
const formattedTime = time !== void 0 ? `${Math.floor(time)}:${Math.round((time - Math.floor(time)) * 60).toString().padStart(2, "0")}` : null;
|
|
16412
|
+
return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
|
|
16413
|
+
"div",
|
|
16414
|
+
{
|
|
16415
|
+
className: cn(
|
|
16416
|
+
"flex h-full flex-col overflow-hidden px-0.5 py-1 data-dragging:bg-accent sm:px-1",
|
|
16417
|
+
className
|
|
16418
|
+
),
|
|
16419
|
+
"data-dragging": isOver && activeEvent ? true : void 0,
|
|
16420
|
+
onClick,
|
|
16421
|
+
ref: setNodeRef,
|
|
16422
|
+
title: formattedTime ? `${formattedTime}` : void 0,
|
|
16423
|
+
children
|
|
16424
|
+
}
|
|
16425
|
+
);
|
|
16426
|
+
}
|
|
16427
|
+
|
|
16428
|
+
// src/components/event-calendar-view/DayView.tsx
|
|
16429
|
+
var import_jsx_runtime90 = require("react/jsx-runtime");
|
|
16430
|
+
function DayViewAgenda({
|
|
16431
|
+
currentDate,
|
|
16432
|
+
events,
|
|
16433
|
+
onEventSelect,
|
|
16434
|
+
showUndatedEvents
|
|
16435
|
+
}) {
|
|
16436
|
+
const hours = (0, import_react80.useMemo)(() => {
|
|
16437
|
+
const dayStart = (0, import_date_fns21.startOfDay)(currentDate);
|
|
16438
|
+
return (0, import_date_fns21.eachHourOfInterval)({
|
|
16439
|
+
end: (0, import_date_fns21.addHours)(dayStart, EndHourAgenda - 1),
|
|
16440
|
+
start: (0, import_date_fns21.addHours)(dayStart, StartHourAgenda)
|
|
16441
|
+
});
|
|
16442
|
+
}, [currentDate]);
|
|
16443
|
+
const dayEvents = (0, import_react80.useMemo)(() => {
|
|
16444
|
+
return events.filter((event) => {
|
|
16445
|
+
const eventStart = new Date(event.start ?? event.end ?? Date.now());
|
|
16446
|
+
const eventEnd = new Date(event.end ?? event.start ?? Date.now());
|
|
16447
|
+
return (0, import_date_fns21.isSameDay)(currentDate, eventStart) || (0, import_date_fns21.isSameDay)(currentDate, eventEnd) || currentDate > eventStart && currentDate < eventEnd;
|
|
16448
|
+
}).sort(
|
|
16449
|
+
(a, b) => new Date(a.start ?? a.end ?? Date.now()).getTime() - new Date(b.start ?? b.end ?? Date.now()).getTime()
|
|
16450
|
+
);
|
|
16451
|
+
}, [currentDate, events]);
|
|
16452
|
+
const allDayEvents = (0, import_react80.useMemo)(() => {
|
|
16453
|
+
return dayEvents.filter((event) => {
|
|
16454
|
+
return event.allDay || isMultiDayEventAgenda(event);
|
|
16455
|
+
});
|
|
16456
|
+
}, [dayEvents]);
|
|
16457
|
+
const timeEvents = (0, import_react80.useMemo)(() => {
|
|
16458
|
+
return dayEvents.filter((event) => {
|
|
16459
|
+
return !event.allDay && !isMultiDayEventAgenda(event);
|
|
16460
|
+
});
|
|
16461
|
+
}, [dayEvents]);
|
|
16462
|
+
const positionedEvents = (0, import_react80.useMemo)(() => {
|
|
16463
|
+
const result = [];
|
|
16464
|
+
const dayStart = (0, import_date_fns21.startOfDay)(currentDate);
|
|
16465
|
+
const sortedEvents = [...timeEvents].sort((a, b) => {
|
|
16466
|
+
const aStart = new Date(a.start ?? a.end ?? Date.now());
|
|
16467
|
+
const bStart = new Date(b.start ?? b.end ?? Date.now());
|
|
16468
|
+
const aEnd = new Date(a.end ?? a.start ?? Date.now());
|
|
16469
|
+
const bEnd = new Date(b.end ?? b.start ?? Date.now());
|
|
16470
|
+
if (aStart < bStart) return -1;
|
|
16471
|
+
if (aStart > bStart) return 1;
|
|
16472
|
+
const aDuration = (0, import_date_fns21.differenceInMinutes)(aEnd, aStart);
|
|
16473
|
+
const bDuration = (0, import_date_fns21.differenceInMinutes)(bEnd, bStart);
|
|
16474
|
+
return bDuration - aDuration;
|
|
16475
|
+
});
|
|
16476
|
+
const columns = [];
|
|
16477
|
+
for (const event of sortedEvents) {
|
|
16478
|
+
const eventStart = new Date(event.start ?? event.end ?? Date.now());
|
|
16479
|
+
const eventEnd = new Date(event.end ?? event.start ?? Date.now());
|
|
16480
|
+
const adjustedStart = (0, import_date_fns21.isSameDay)(currentDate, eventStart) ? eventStart : dayStart;
|
|
16481
|
+
const adjustedEnd = (0, import_date_fns21.isSameDay)(currentDate, eventEnd) ? eventEnd : (0, import_date_fns21.addHours)(dayStart, 24);
|
|
16482
|
+
const startHour = (0, import_date_fns21.getHours)(adjustedStart) + (0, import_date_fns21.getMinutes)(adjustedStart) / 60;
|
|
16483
|
+
const endHour = (0, import_date_fns21.getHours)(adjustedEnd) + (0, import_date_fns21.getMinutes)(adjustedEnd) / 60;
|
|
16484
|
+
const top = (startHour - StartHourAgenda) * WeekCellsHeightAgenda;
|
|
16485
|
+
const height = (endHour - startHour) * WeekCellsHeightAgenda;
|
|
16486
|
+
let columnIndex = 0;
|
|
16487
|
+
let placed = false;
|
|
16488
|
+
while (!placed) {
|
|
16489
|
+
const col = columns[columnIndex] || [];
|
|
16490
|
+
if (col.length === 0) {
|
|
16491
|
+
columns[columnIndex] = col;
|
|
16492
|
+
placed = true;
|
|
16493
|
+
} else {
|
|
16494
|
+
const overlaps = col.some(
|
|
16495
|
+
(c) => (0, import_date_fns21.areIntervalsOverlapping)(
|
|
16496
|
+
{ end: adjustedEnd, start: adjustedStart },
|
|
16497
|
+
{
|
|
16498
|
+
end: new Date(c.event.end ?? c.event.start ?? Date.now()),
|
|
16499
|
+
start: new Date(c.event.start ?? c.event.end ?? Date.now())
|
|
16500
|
+
}
|
|
16501
|
+
)
|
|
16502
|
+
);
|
|
16503
|
+
if (!overlaps) {
|
|
16504
|
+
placed = true;
|
|
16505
|
+
} else {
|
|
16506
|
+
columnIndex++;
|
|
16507
|
+
}
|
|
16508
|
+
}
|
|
16509
|
+
}
|
|
16510
|
+
const currentColumn = columns[columnIndex] || [];
|
|
16511
|
+
columns[columnIndex] = currentColumn;
|
|
16512
|
+
currentColumn.push({
|
|
16513
|
+
end: adjustedEnd,
|
|
16514
|
+
event,
|
|
16515
|
+
start: adjustedStart
|
|
16516
|
+
});
|
|
16517
|
+
const width = columnIndex === 0 ? 1 : 0.9;
|
|
16518
|
+
const left = columnIndex === 0 ? 0 : columnIndex * 0.1;
|
|
16519
|
+
result.push({
|
|
16520
|
+
event,
|
|
16521
|
+
height,
|
|
16522
|
+
left,
|
|
16523
|
+
top,
|
|
16524
|
+
width,
|
|
16525
|
+
zIndex: 10 + columnIndex
|
|
16526
|
+
});
|
|
16527
|
+
}
|
|
16528
|
+
return result;
|
|
16529
|
+
}, [currentDate, timeEvents]);
|
|
16530
|
+
const handleEventClick = (event, e) => {
|
|
16531
|
+
e.stopPropagation();
|
|
16532
|
+
onEventSelect(event);
|
|
16533
|
+
};
|
|
16534
|
+
const showAllDaySection = allDayEvents.length > 0;
|
|
16535
|
+
const { currentTimePosition, currentTimeVisible } = useCurrentTimeIndicatorAgenda(currentDate, "day");
|
|
16536
|
+
return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("div", { className: "contents", "data-slot": "day-view", children: [
|
|
16537
|
+
showAllDaySection && /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { className: "border-border/70 border-t bg-muted/50", children: /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("div", { className: "grid grid-cols-[3rem_1fr] sm:grid-cols-[4rem_1fr]", children: [
|
|
16538
|
+
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { className: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("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" }) }),
|
|
16539
|
+
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { className: "relative border-border/70 border-r p-1 last:border-r-0", children: allDayEvents.map((event) => {
|
|
16540
|
+
const eventStart = new Date(
|
|
16541
|
+
event.start ?? event.end ?? Date.now()
|
|
16542
|
+
);
|
|
16543
|
+
const eventEnd = new Date(
|
|
16544
|
+
event.end ?? event.start ?? Date.now()
|
|
16545
|
+
);
|
|
16546
|
+
const isFirstDay = (0, import_date_fns21.isSameDay)(currentDate, eventStart);
|
|
16547
|
+
const isLastDay = (0, import_date_fns21.isSameDay)(currentDate, eventEnd);
|
|
16548
|
+
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
|
|
16549
|
+
EventItemAgenda,
|
|
16550
|
+
{
|
|
16551
|
+
event,
|
|
16552
|
+
isFirstDay,
|
|
16553
|
+
isLastDay,
|
|
16554
|
+
onClick: (e) => handleEventClick(event, e),
|
|
16555
|
+
view: "month",
|
|
16556
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { children: event.title })
|
|
16557
|
+
},
|
|
16558
|
+
`spanning-${event.id}`
|
|
16559
|
+
);
|
|
16560
|
+
}) })
|
|
16561
|
+
] }) }),
|
|
16562
|
+
/* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("div", { className: "grid flex-1 grid-cols-[3rem_1fr] overflow-hidden border-border/70 border-t sm:grid-cols-[4rem_1fr]", children: [
|
|
16563
|
+
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { children: hours.map((hour, index) => /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
|
|
16564
|
+
"div",
|
|
16565
|
+
{
|
|
16566
|
+
className: "relative h-[var(--week-cells-height)] border-border/70 border-b last:border-b-0",
|
|
16567
|
+
children: index > 0 && /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("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: (0, import_date_fns21.format)(hour, "HH:mm") })
|
|
16568
|
+
},
|
|
16569
|
+
hour.toString()
|
|
16570
|
+
)) }),
|
|
16571
|
+
/* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("div", { className: "relative", children: [
|
|
16572
|
+
positionedEvents.map((positionedEvent) => {
|
|
16573
|
+
const evt = positionedEvent.event;
|
|
16574
|
+
const eventStart = new Date(evt.start ?? evt.end ?? Date.now());
|
|
16575
|
+
const eventEnd = new Date(evt.end ?? evt.start ?? Date.now());
|
|
16576
|
+
const isFirstDay = (0, import_date_fns21.isSameDay)(currentDate, eventStart);
|
|
16577
|
+
const isLastDay = (0, import_date_fns21.isSameDay)(currentDate, eventEnd);
|
|
16578
|
+
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
|
|
16579
|
+
"div",
|
|
16580
|
+
{
|
|
16581
|
+
className: "absolute z-10 px-0.5",
|
|
16582
|
+
style: {
|
|
16583
|
+
height: `${positionedEvent.height}px`,
|
|
16584
|
+
left: `${positionedEvent.left * 100}%`,
|
|
16585
|
+
top: `${positionedEvent.top}px`,
|
|
16586
|
+
width: `${positionedEvent.width * 100}%`,
|
|
16587
|
+
zIndex: positionedEvent.zIndex
|
|
16588
|
+
},
|
|
16589
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
|
|
16590
|
+
EventItemAgenda,
|
|
16591
|
+
{
|
|
16592
|
+
event: evt,
|
|
16593
|
+
view: "day",
|
|
16594
|
+
isFirstDay,
|
|
16595
|
+
isLastDay,
|
|
16596
|
+
onClick: (e) => handleEventClick(evt, e),
|
|
16597
|
+
showTime: true
|
|
16598
|
+
}
|
|
16599
|
+
)
|
|
16600
|
+
},
|
|
16601
|
+
positionedEvent.event.id
|
|
16602
|
+
);
|
|
16603
|
+
}),
|
|
16604
|
+
currentTimeVisible && /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
|
|
16605
|
+
"div",
|
|
16606
|
+
{
|
|
16607
|
+
className: "pointer-events-none absolute right-0 left-0 z-20",
|
|
16608
|
+
style: { top: `${currentTimePosition}%` },
|
|
16609
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)("div", { className: "relative flex items-center", children: [
|
|
16610
|
+
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { className: "-left-1 absolute h-2 w-2 rounded-full bg-primary" }),
|
|
16611
|
+
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)("div", { className: "h-[2px] w-full bg-primary" })
|
|
16612
|
+
] })
|
|
16613
|
+
}
|
|
16614
|
+
),
|
|
16615
|
+
hours.map((hour) => {
|
|
16616
|
+
const hourValue = (0, import_date_fns21.getHours)(hour);
|
|
16617
|
+
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
|
|
16618
|
+
"div",
|
|
16619
|
+
{
|
|
16620
|
+
className: "relative h-[var(--week-cells-height)] border-border/70 border-b last:border-b-0",
|
|
16621
|
+
children: [0, 1, 2, 3].map((quarter) => {
|
|
16622
|
+
const quarterHourTime = hourValue + quarter * 0.25;
|
|
16623
|
+
return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
|
|
16624
|
+
DroppableCellAgenda,
|
|
16625
|
+
{
|
|
16626
|
+
className: cn(
|
|
16627
|
+
"absolute h-[calc(var(--week-cells-height)/4)] w-full",
|
|
16628
|
+
quarter === 0 && "top-0",
|
|
16629
|
+
quarter === 1 && "top-[calc(var(--week-cells-height)/4)]",
|
|
16630
|
+
quarter === 2 && "top-[calc(var(--week-cells-height)/4*2)]",
|
|
16631
|
+
quarter === 3 && "top-[calc(var(--week-cells-height)/4*3)]"
|
|
16632
|
+
),
|
|
16633
|
+
date: currentDate,
|
|
16634
|
+
id: `day-cell-${currentDate.toISOString()}-${quarterHourTime}`,
|
|
16635
|
+
onClick: () => {
|
|
16636
|
+
const startTime = new Date(currentDate);
|
|
16637
|
+
startTime.setHours(hourValue);
|
|
16638
|
+
startTime.setMinutes(quarter * 15);
|
|
16639
|
+
},
|
|
16640
|
+
time: quarterHourTime
|
|
16641
|
+
},
|
|
16642
|
+
`${hour.toString()}-${quarter}`
|
|
16643
|
+
);
|
|
16644
|
+
})
|
|
16645
|
+
},
|
|
16646
|
+
hour.toString()
|
|
16647
|
+
);
|
|
16648
|
+
})
|
|
16649
|
+
] })
|
|
16650
|
+
] }),
|
|
16651
|
+
/* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
|
|
16652
|
+
UndatedEvents,
|
|
16653
|
+
{
|
|
16654
|
+
events,
|
|
16655
|
+
onEventSelect,
|
|
16656
|
+
show: showUndatedEvents
|
|
16657
|
+
}
|
|
16658
|
+
)
|
|
16659
|
+
] });
|
|
16660
|
+
}
|
|
16661
|
+
|
|
16662
|
+
// src/components/event-calendar-view/EventAgenda.tsx
|
|
16663
|
+
var import_date_fns22 = require("date-fns");
|
|
16664
|
+
var import_locale11 = require("date-fns/locale");
|
|
16665
|
+
var import_react81 = require("react");
|
|
16666
|
+
var import_sonner4 = require("sonner");
|
|
16667
|
+
var import_react82 = require("@phosphor-icons/react");
|
|
16668
|
+
var import_jsx_runtime91 = require("react/jsx-runtime");
|
|
16669
|
+
function EventAgenda({
|
|
16670
|
+
events = [],
|
|
16671
|
+
onEventUpdate,
|
|
16672
|
+
className,
|
|
16673
|
+
initialView = "month",
|
|
16674
|
+
initialDate
|
|
16675
|
+
}) {
|
|
16676
|
+
const [currentDate, setCurrentDate] = (0, import_react81.useState)(
|
|
16677
|
+
initialDate && new Date(initialDate) || /* @__PURE__ */ new Date()
|
|
16678
|
+
);
|
|
16679
|
+
const [view, setView] = (0, import_react81.useState)(initialView);
|
|
16680
|
+
const goPrevious = () => {
|
|
16681
|
+
if (view === "month") setCurrentDate((d) => (0, import_date_fns22.subMonths)(d, 1));
|
|
16682
|
+
else if (view === "week") setCurrentDate((d) => (0, import_date_fns22.subWeeks)(d, 1));
|
|
16683
|
+
else if (view === "day") setCurrentDate((d) => (0, import_date_fns22.addDays)(d, -1));
|
|
16684
|
+
else if (view === "agenda")
|
|
16685
|
+
setCurrentDate((d) => (0, import_date_fns22.addDays)(d, -AgendaDaysToShowAgenda));
|
|
16686
|
+
};
|
|
16687
|
+
const goNext = () => {
|
|
16688
|
+
if (view === "month") setCurrentDate((d) => (0, import_date_fns22.addMonths)(d, 1));
|
|
16689
|
+
else if (view === "week") setCurrentDate((d) => (0, import_date_fns22.addWeeks)(d, 1));
|
|
16690
|
+
else if (view === "day") setCurrentDate((d) => (0, import_date_fns22.addDays)(d, 1));
|
|
16691
|
+
else if (view === "agenda")
|
|
16692
|
+
setCurrentDate((d) => (0, import_date_fns22.addDays)(d, AgendaDaysToShowAgenda));
|
|
16693
|
+
};
|
|
16694
|
+
const handleEventSelect = (event) => {
|
|
16695
|
+
console.log("Event selected:", event);
|
|
16696
|
+
};
|
|
16697
|
+
const handleEventUpdate = (updatedEvent) => {
|
|
16698
|
+
onEventUpdate?.(updatedEvent);
|
|
16699
|
+
const startDate = updatedEvent.start ?? /* @__PURE__ */ new Date();
|
|
16700
|
+
(0, import_sonner4.toast)(`Evento "${updatedEvent.title}" movido`, {
|
|
16701
|
+
description: (0, import_date_fns22.format)(startDate, "d 'de' MMMM 'de' yyyy", { locale: import_locale11.ptBR }),
|
|
16702
|
+
position: "bottom-left"
|
|
16703
|
+
});
|
|
16704
|
+
};
|
|
16705
|
+
const viewLabel = (v, condensed = false) => {
|
|
16706
|
+
const labels = {
|
|
16707
|
+
month: { full: "M\xEAs", short: "M" },
|
|
16708
|
+
week: { full: "Semana", short: "S" },
|
|
16709
|
+
day: { full: "Dia", short: "D" },
|
|
16710
|
+
agenda: { full: "Agenda", short: "A" }
|
|
16711
|
+
};
|
|
16712
|
+
const entry = labels[v] || { full: v, short: v };
|
|
16713
|
+
return condensed ? entry.short : entry.full;
|
|
16714
|
+
};
|
|
16715
|
+
const viewTitle = (0, import_react81.useMemo)(() => {
|
|
16716
|
+
const capitalize = (s) => s ? s.charAt(0).toUpperCase() + s.slice(1) : s;
|
|
16717
|
+
if (view === "month")
|
|
16718
|
+
return capitalize((0, import_date_fns22.format)(currentDate, "MMMM yyyy", { locale: import_locale11.ptBR }));
|
|
16719
|
+
if (view === "week") {
|
|
16720
|
+
const start = (0, import_date_fns22.startOfWeek)(currentDate, { weekStartsOn: 1 });
|
|
16721
|
+
const end = (0, import_date_fns22.endOfWeek)(currentDate, { weekStartsOn: 1 });
|
|
16722
|
+
if ((0, import_date_fns22.isSameMonth)(start, end))
|
|
16723
|
+
return capitalize((0, import_date_fns22.format)(start, "MMMM yyyy", { locale: import_locale11.ptBR }));
|
|
16724
|
+
const s1 = capitalize((0, import_date_fns22.format)(start, "MMM", { locale: import_locale11.ptBR }));
|
|
16725
|
+
const s2 = capitalize((0, import_date_fns22.format)(end, "MMM yyyy", { locale: import_locale11.ptBR }));
|
|
16726
|
+
return `${s1} - ${s2}`;
|
|
16727
|
+
}
|
|
16728
|
+
if (view === "day")
|
|
16729
|
+
return (0, import_date_fns22.format)(currentDate, "d 'de' MMMM 'de' yyyy", { locale: import_locale11.ptBR });
|
|
16730
|
+
if (view === "agenda") {
|
|
16731
|
+
const start = currentDate;
|
|
16732
|
+
const end = (0, import_date_fns22.addDays)(currentDate, AgendaDaysToShowAgenda - 1);
|
|
16733
|
+
if ((0, import_date_fns22.isSameMonth)(start, end))
|
|
16734
|
+
return capitalize((0, import_date_fns22.format)(start, "MMMM yyyy", { locale: import_locale11.ptBR }));
|
|
16735
|
+
const s1 = capitalize((0, import_date_fns22.format)(start, "MMMM", { locale: import_locale11.ptBR }));
|
|
16736
|
+
const s2 = capitalize((0, import_date_fns22.format)(end, "MMMM yyyy", { locale: import_locale11.ptBR }));
|
|
16737
|
+
return `${s1} - ${s2}`;
|
|
16738
|
+
}
|
|
16739
|
+
return capitalize((0, import_date_fns22.format)(currentDate, "MMMM yyyy", { locale: import_locale11.ptBR }));
|
|
16740
|
+
}, [currentDate, view]);
|
|
16741
|
+
return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
|
|
16742
|
+
"div",
|
|
16743
|
+
{
|
|
16744
|
+
className: cn(
|
|
16745
|
+
"flex flex-col rounded-lg border has-data-[slot=month-view]:flex-1 px-6 py-2",
|
|
16746
|
+
className
|
|
16747
|
+
),
|
|
16748
|
+
style: {
|
|
16749
|
+
"--event-gap": `${EventGapAgenda}px`,
|
|
16750
|
+
"--event-height": `${EventHeightAgenda}px`,
|
|
16751
|
+
"--week-cells-height": `${WeekCellsHeightAgenda}px`
|
|
16752
|
+
},
|
|
16753
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(CalendarDndProviderAgenda, { onEventUpdate: handleEventUpdate, children: [
|
|
16754
|
+
/* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("div", { className: "flex items-center justify-between p-2 sm:p-4", children: [
|
|
16755
|
+
/* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("div", { className: "flex items-center gap-1 sm:gap-4", children: [
|
|
16756
|
+
/* @__PURE__ */ (0, import_jsx_runtime91.jsxs)("div", { className: "flex items-center sm:gap-2", children: [
|
|
16757
|
+
/* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
|
|
16758
|
+
ButtonBase,
|
|
16759
|
+
{
|
|
16760
|
+
"aria-label": "Anterior",
|
|
16761
|
+
onClick: goPrevious,
|
|
16762
|
+
size: "icon",
|
|
16763
|
+
variant: "ghost",
|
|
16764
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(import_react82.CaretLeftIcon, { "aria-hidden": true, size: 16 })
|
|
16765
|
+
}
|
|
16766
|
+
),
|
|
16767
|
+
/* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
|
|
16768
|
+
ButtonBase,
|
|
16769
|
+
{
|
|
16770
|
+
"aria-label": "Pr\xF3ximo",
|
|
16771
|
+
onClick: goNext,
|
|
16772
|
+
size: "icon",
|
|
16773
|
+
variant: "ghost",
|
|
16774
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(import_react82.CaretRightIcon, { "aria-hidden": true, size: 16 })
|
|
16775
|
+
}
|
|
16776
|
+
)
|
|
16777
|
+
] }),
|
|
16778
|
+
/* @__PURE__ */ (0, import_jsx_runtime91.jsx)("h2", { className: "font-semibold text-md sm:text-xl", children: viewTitle })
|
|
16779
|
+
] }),
|
|
16780
|
+
/* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
|
|
16781
|
+
Select,
|
|
16782
|
+
{
|
|
16783
|
+
selected: view,
|
|
16784
|
+
onChange: (v) => {
|
|
16785
|
+
setView(v);
|
|
16786
|
+
},
|
|
16787
|
+
items: ["month", "week", "day", "agenda"].map((v) => ({
|
|
16788
|
+
label: viewLabel(v),
|
|
16789
|
+
value: v
|
|
16790
|
+
})),
|
|
16791
|
+
className: "gap-2 px-3 py-1.5 max-[479px]:h-8",
|
|
16792
|
+
placeholder: viewLabel(view)
|
|
16793
|
+
}
|
|
16794
|
+
) })
|
|
16795
|
+
] }),
|
|
16796
|
+
/* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(
|
|
16797
|
+
"div",
|
|
16798
|
+
{
|
|
16799
|
+
className: "flex flex-1 flex-col transition-all duration-200 ease-in-out",
|
|
16800
|
+
"aria-live": "polite",
|
|
16801
|
+
children: [
|
|
16802
|
+
view === "month" && /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
|
|
16803
|
+
MonthViewAgenda,
|
|
16804
|
+
{
|
|
16805
|
+
currentDate,
|
|
16806
|
+
events,
|
|
16807
|
+
onEventSelect: handleEventSelect
|
|
16808
|
+
}
|
|
16809
|
+
),
|
|
16810
|
+
view === "week" && /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
|
|
16811
|
+
WeekViewAgenda,
|
|
16812
|
+
{
|
|
16813
|
+
currentDate,
|
|
16814
|
+
events,
|
|
16815
|
+
onEventSelect: handleEventSelect
|
|
16816
|
+
}
|
|
16817
|
+
),
|
|
16818
|
+
view === "day" && /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
|
|
16819
|
+
DayViewAgenda,
|
|
16820
|
+
{
|
|
16821
|
+
currentDate,
|
|
16822
|
+
events,
|
|
16823
|
+
onEventSelect: handleEventSelect
|
|
16824
|
+
}
|
|
16825
|
+
),
|
|
16826
|
+
view === "agenda" && /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
|
|
16827
|
+
Agenda,
|
|
16828
|
+
{
|
|
16829
|
+
currentDate,
|
|
16830
|
+
events,
|
|
16831
|
+
onEventSelect: handleEventSelect
|
|
16832
|
+
}
|
|
16833
|
+
)
|
|
16834
|
+
]
|
|
16835
|
+
}
|
|
16836
|
+
)
|
|
16837
|
+
] })
|
|
16838
|
+
}
|
|
16839
|
+
);
|
|
16840
|
+
}
|
|
16841
|
+
|
|
16842
|
+
// src/components/event-calendar-view/UndatedEvents.tsx
|
|
16843
|
+
var import_react83 = require("react");
|
|
16844
|
+
var import_jsx_runtime92 = require("react/jsx-runtime");
|
|
16845
|
+
var isValidDate5 = (d) => {
|
|
16846
|
+
try {
|
|
16847
|
+
const t = d instanceof Date ? d.getTime() : new Date(String(d)).getTime();
|
|
16848
|
+
return !isNaN(t);
|
|
16849
|
+
} catch {
|
|
16850
|
+
return false;
|
|
16851
|
+
}
|
|
16852
|
+
};
|
|
16853
|
+
function UndatedEvents({
|
|
16854
|
+
events,
|
|
16855
|
+
onEventSelect,
|
|
16856
|
+
className,
|
|
16857
|
+
title = "Data de Atendimento n\xE3o Prevista",
|
|
16858
|
+
show = true
|
|
16859
|
+
}) {
|
|
16860
|
+
const undatedEvents = (0, import_react83.useMemo)(
|
|
16861
|
+
() => events.filter((e) => !(isValidDate5(e.start) || isValidDate5(e.end))),
|
|
16862
|
+
[events]
|
|
16863
|
+
);
|
|
16864
|
+
if (!show || undatedEvents.length === 0) return null;
|
|
16865
|
+
return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { className, children: /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)("div", { className: "relative border-border/70 border-t", children: [
|
|
16866
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)("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 }),
|
|
16867
|
+
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)("div", { className: "mt-6 space-y-2", children: undatedEvents.map((event) => /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
16868
|
+
EventItemAgenda,
|
|
16869
|
+
{
|
|
16870
|
+
event,
|
|
16871
|
+
onClick: onEventSelect ? () => onEventSelect(event) : void 0,
|
|
16872
|
+
view: "agenda",
|
|
16873
|
+
agendaOnly: true,
|
|
16874
|
+
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 "
|
|
16875
|
+
},
|
|
16876
|
+
event.id
|
|
16877
|
+
)) })
|
|
16878
|
+
] }) });
|
|
16879
|
+
}
|
|
16880
|
+
|
|
16881
|
+
// src/components/event-calendar-view/hooks/use-event-visibility.ts
|
|
16882
|
+
var import_react84 = require("react");
|
|
16883
|
+
function useEventVisibilityAgenda({
|
|
16884
|
+
eventHeight,
|
|
16885
|
+
eventGap
|
|
16886
|
+
}) {
|
|
16887
|
+
const contentRef = (0, import_react84.useRef)(null);
|
|
16888
|
+
const observerRef = (0, import_react84.useRef)(null);
|
|
16889
|
+
const [contentHeight, setContentHeight] = (0, import_react84.useState)(null);
|
|
16890
|
+
(0, import_react84.useLayoutEffect)(() => {
|
|
16891
|
+
if (!contentRef.current) return;
|
|
16892
|
+
const updateHeight = () => {
|
|
16893
|
+
if (contentRef.current) {
|
|
16894
|
+
setContentHeight(contentRef.current.clientHeight);
|
|
16895
|
+
}
|
|
16896
|
+
};
|
|
16897
|
+
updateHeight();
|
|
16898
|
+
if (!observerRef.current) {
|
|
16899
|
+
observerRef.current = new ResizeObserver(() => {
|
|
16900
|
+
updateHeight();
|
|
16901
|
+
});
|
|
16902
|
+
}
|
|
16903
|
+
observerRef.current.observe(contentRef.current);
|
|
16904
|
+
return () => {
|
|
16905
|
+
if (observerRef.current) {
|
|
16906
|
+
observerRef.current.disconnect();
|
|
16907
|
+
}
|
|
16908
|
+
};
|
|
16909
|
+
}, []);
|
|
16910
|
+
const getVisibleEventCount = (0, import_react84.useMemo)(() => {
|
|
16911
|
+
return (totalEvents) => {
|
|
16912
|
+
if (!contentHeight) return totalEvents;
|
|
16913
|
+
const maxEvents = Math.floor(contentHeight / (eventHeight + eventGap));
|
|
16914
|
+
if (totalEvents <= maxEvents) {
|
|
16915
|
+
return totalEvents;
|
|
16916
|
+
}
|
|
16917
|
+
return maxEvents > 0 ? maxEvents - 1 : 0;
|
|
16918
|
+
};
|
|
16919
|
+
}, [contentHeight, eventHeight, eventGap]);
|
|
16920
|
+
return {
|
|
16921
|
+
contentHeight,
|
|
16922
|
+
contentRef,
|
|
16923
|
+
getVisibleEventCount
|
|
16924
|
+
};
|
|
16925
|
+
}
|
|
16926
|
+
|
|
16927
|
+
// src/components/event-calendar-view/MonthView.tsx
|
|
16928
|
+
var import_date_fns23 = require("date-fns");
|
|
16929
|
+
var import_locale12 = require("date-fns/locale");
|
|
16930
|
+
var import_react85 = require("react");
|
|
16931
|
+
var import_tailwind_merge3 = require("tailwind-merge");
|
|
16932
|
+
var import_jsx_runtime93 = require("react/jsx-runtime");
|
|
16933
|
+
function MonthViewAgenda({
|
|
16934
|
+
currentDate,
|
|
16935
|
+
events,
|
|
16936
|
+
onEventSelect,
|
|
16937
|
+
showUndatedEvents
|
|
16938
|
+
}) {
|
|
16939
|
+
const days = (0, import_react85.useMemo)(() => {
|
|
16940
|
+
const monthStart = (0, import_date_fns23.startOfMonth)(currentDate);
|
|
16941
|
+
const monthEnd = (0, import_date_fns23.endOfMonth)(monthStart);
|
|
16942
|
+
const calendarStart = (0, import_date_fns23.startOfWeek)(monthStart, { weekStartsOn: 0 });
|
|
16943
|
+
const calendarEnd = (0, import_date_fns23.endOfWeek)(monthEnd, { weekStartsOn: 0 });
|
|
16944
|
+
return (0, import_date_fns23.eachDayOfInterval)({ end: calendarEnd, start: calendarStart });
|
|
16945
|
+
}, [currentDate]);
|
|
16946
|
+
const weekdays = (0, import_react85.useMemo)(() => {
|
|
16947
|
+
return Array.from({ length: 7 }).map((_, i) => {
|
|
16948
|
+
const date = (0, import_date_fns23.addDays)((0, import_date_fns23.startOfWeek)(/* @__PURE__ */ new Date(), { weekStartsOn: 0 }), i);
|
|
16949
|
+
const short = (0, import_date_fns23.format)(date, "EEE", { locale: import_locale12.ptBR });
|
|
16950
|
+
return short.charAt(0).toUpperCase() + short.slice(1);
|
|
16951
|
+
});
|
|
16952
|
+
}, []);
|
|
16953
|
+
const weeks = (0, import_react85.useMemo)(() => {
|
|
16954
|
+
const result = [];
|
|
16955
|
+
let week = [];
|
|
16956
|
+
for (let i = 0; i < days.length; i++) {
|
|
16957
|
+
week.push(days[i]);
|
|
16958
|
+
if (week.length === 7 || i === days.length - 1) {
|
|
16959
|
+
result.push(week);
|
|
16960
|
+
week = [];
|
|
16961
|
+
}
|
|
16962
|
+
}
|
|
16963
|
+
return result;
|
|
16964
|
+
}, [days]);
|
|
16965
|
+
const handleEventClick = (event, e) => {
|
|
16966
|
+
e.stopPropagation();
|
|
16967
|
+
onEventSelect(event);
|
|
16968
|
+
};
|
|
16969
|
+
const [isMounted, setIsMounted] = (0, import_react85.useState)(false);
|
|
16970
|
+
const { contentRef, getVisibleEventCount } = useEventVisibilityAgenda({
|
|
16971
|
+
eventGap: EventGapAgenda,
|
|
16972
|
+
eventHeight: EventHeightAgenda
|
|
16973
|
+
});
|
|
16974
|
+
(0, import_react85.useEffect)(() => {
|
|
16975
|
+
setIsMounted(true);
|
|
16976
|
+
}, []);
|
|
16977
|
+
return /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)("div", { className: "contents", "data-slot": "month-view", children: [
|
|
16978
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)("div", { className: "grid grid-cols-7 border-border/70 border-b", children: weekdays.map((day) => /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
16979
|
+
"div",
|
|
16980
|
+
{
|
|
16981
|
+
className: "py-2 text-center text-muted-foreground/70 text-sm uppercase tracking-wide bg-muted/5",
|
|
16982
|
+
children: day
|
|
16983
|
+
},
|
|
16984
|
+
day
|
|
16985
|
+
)) }),
|
|
16986
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)("div", { className: "grid flex-1 auto-rows-fr", children: weeks.map((week, weekIndex) => /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
16987
|
+
"div",
|
|
16988
|
+
{
|
|
16989
|
+
className: "grid grid-cols-7 [&:last-child>*]:border-b-0",
|
|
16990
|
+
children: week.map((day, dayIndex) => {
|
|
16991
|
+
if (!day) return null;
|
|
16992
|
+
const dayEvents = getEventsForDayAgenda(events, day);
|
|
16993
|
+
const spanningEvents = getSpanningEventsForDayAgenda(events, day);
|
|
16994
|
+
const isCurrentMonth = (0, import_date_fns23.isSameMonth)(day, currentDate);
|
|
16995
|
+
const cellId = `month-cell-${day.toISOString()}`;
|
|
16996
|
+
const allDayEvents = [...spanningEvents, ...dayEvents];
|
|
16997
|
+
const allEvents = getAllEventsForDayAgenda(events, day);
|
|
16998
|
+
const isReferenceCell = weekIndex === 0 && dayIndex === 0;
|
|
16999
|
+
const visibleCount = isMounted ? getVisibleEventCount(allDayEvents.length) : void 0;
|
|
17000
|
+
const hasMore = visibleCount !== void 0 && allDayEvents.length > visibleCount;
|
|
17001
|
+
const remainingCount = hasMore ? allDayEvents.length - visibleCount : 0;
|
|
17002
|
+
return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
17003
|
+
"div",
|
|
17004
|
+
{
|
|
17005
|
+
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 ",
|
|
17006
|
+
"data-outside-cell": !isCurrentMonth || void 0,
|
|
17007
|
+
"data-today": (0, import_date_fns23.isToday)(day) || void 0,
|
|
17008
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(
|
|
17009
|
+
DroppableCellAgenda,
|
|
17010
|
+
{
|
|
17011
|
+
date: day,
|
|
17012
|
+
id: cellId,
|
|
17013
|
+
onClick: () => {
|
|
17014
|
+
const startTime = new Date(day);
|
|
17015
|
+
startTime.setHours(DefaultStartHourAgenda, 0, 0);
|
|
17016
|
+
},
|
|
17017
|
+
children: [
|
|
17018
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
17019
|
+
"div",
|
|
17020
|
+
{
|
|
17021
|
+
className: (0, import_tailwind_merge3.twMerge)(
|
|
17022
|
+
`mt-1 inline-flex w-7 h-7 items-center justify-center rounded-full text-sm font-semibold text-muted-foreground`,
|
|
17023
|
+
(0, import_date_fns23.isToday)(day) ? "bg-blue-500 text-white" : ""
|
|
17024
|
+
),
|
|
17025
|
+
children: (0, import_date_fns23.format)(day, "d")
|
|
17026
|
+
}
|
|
17027
|
+
),
|
|
17028
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(
|
|
17029
|
+
"div",
|
|
17030
|
+
{
|
|
17031
|
+
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",
|
|
17032
|
+
ref: isReferenceCell ? contentRef : null,
|
|
17033
|
+
children: [
|
|
17034
|
+
sortEventsAgenda(allDayEvents).map((event, index) => {
|
|
17035
|
+
const eventStart = new Date(
|
|
17036
|
+
event.start ?? event.end ?? Date.now()
|
|
17037
|
+
);
|
|
17038
|
+
const eventEnd = new Date(
|
|
17039
|
+
event.end ?? event.start ?? Date.now()
|
|
17040
|
+
);
|
|
17041
|
+
const isFirstDay = (0, import_date_fns23.isSameDay)(day, eventStart);
|
|
17042
|
+
const isLastDay = (0, import_date_fns23.isSameDay)(day, eventEnd);
|
|
17043
|
+
const isHidden = isMounted && visibleCount && index >= visibleCount;
|
|
17044
|
+
if (!visibleCount) return null;
|
|
17045
|
+
if (!isFirstDay) {
|
|
17046
|
+
return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
17047
|
+
"div",
|
|
17048
|
+
{
|
|
17049
|
+
"aria-hidden": isHidden ? "true" : void 0,
|
|
17050
|
+
className: "aria-hidden:hidden",
|
|
17051
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
17052
|
+
EventItemAgenda,
|
|
17053
|
+
{
|
|
17054
|
+
event,
|
|
17055
|
+
isFirstDay,
|
|
17056
|
+
isLastDay,
|
|
17057
|
+
onClick: (e) => handleEventClick(event, e),
|
|
17058
|
+
view: "month",
|
|
17059
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)("div", { "aria-hidden": true, className: "invisible", children: [
|
|
17060
|
+
!event.allDay && /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)("span", { children: [
|
|
17061
|
+
(0, import_date_fns23.format)(eventStart, "HH:mm"),
|
|
17062
|
+
" "
|
|
17063
|
+
] }),
|
|
17064
|
+
event.title
|
|
17065
|
+
] })
|
|
17066
|
+
}
|
|
17067
|
+
)
|
|
17068
|
+
},
|
|
17069
|
+
`spanning-${event.id}-${day.toISOString().slice(0, 10)}`
|
|
17070
|
+
);
|
|
17071
|
+
}
|
|
17072
|
+
return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
17073
|
+
"div",
|
|
17074
|
+
{
|
|
17075
|
+
"aria-hidden": isHidden ? "true" : void 0,
|
|
17076
|
+
className: "aria-hidden:hidden",
|
|
17077
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
17078
|
+
EventItemAgenda,
|
|
17079
|
+
{
|
|
17080
|
+
className: "cursor-default",
|
|
17081
|
+
event,
|
|
17082
|
+
isFirstDay,
|
|
17083
|
+
isLastDay,
|
|
17084
|
+
onClick: (e) => handleEventClick(event, e),
|
|
17085
|
+
view: "month",
|
|
17086
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)("span", { className: "flex items-center gap-2 truncate", children: [
|
|
17087
|
+
!event.allDay && /* @__PURE__ */ (0, import_jsx_runtime93.jsx)("span", { className: "truncate font-normal opacity-80 sm:text-[11px] bg-white/10 px-2 py-0.5 rounded-full text-[11px]", children: (0, import_date_fns23.format)(eventStart, "HH:mm") }),
|
|
17088
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)("span", { className: "truncate font-medium", children: event.title })
|
|
17089
|
+
] })
|
|
17090
|
+
}
|
|
17091
|
+
)
|
|
17092
|
+
},
|
|
17093
|
+
event.id
|
|
17094
|
+
);
|
|
17095
|
+
}),
|
|
17096
|
+
hasMore && /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(PopoverBase, { modal: true, children: [
|
|
17097
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)(PopoverTriggerBase, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(
|
|
17098
|
+
"button",
|
|
17099
|
+
{
|
|
17100
|
+
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",
|
|
17101
|
+
onClick: (e) => e.stopPropagation(),
|
|
17102
|
+
type: "button",
|
|
17103
|
+
"aria-label": `Show ${remainingCount} more events on ${(0, import_date_fns23.format)(
|
|
17104
|
+
day,
|
|
17105
|
+
"PPP",
|
|
17106
|
+
{ locale: import_locale12.ptBR }
|
|
17107
|
+
)}`,
|
|
17108
|
+
children: [
|
|
17109
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsxs)("span", { className: "font-medium", children: [
|
|
17110
|
+
"+ ",
|
|
17111
|
+
remainingCount
|
|
17112
|
+
] }),
|
|
17113
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)("span", { className: "sr-only", children: " more" })
|
|
17114
|
+
]
|
|
17115
|
+
}
|
|
17116
|
+
) }),
|
|
17117
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
17118
|
+
PopoverContentBase,
|
|
17119
|
+
{
|
|
17120
|
+
align: "center",
|
|
17121
|
+
className: "max-w-52 p-3",
|
|
17122
|
+
style: {
|
|
17123
|
+
"--event-height": `${EventHeightAgenda}px`
|
|
17124
|
+
},
|
|
17125
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)("div", { className: "space-y-2", children: [
|
|
17126
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)("div", { className: "font-medium text-sm", children: (0, import_date_fns23.format)(day, "EEE d", { locale: import_locale12.ptBR }) }),
|
|
17127
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)("div", { className: "space-y-1", children: sortEventsAgenda(allEvents).map((event) => {
|
|
17128
|
+
const eventStart = new Date(
|
|
17129
|
+
event.start ?? event.end ?? Date.now()
|
|
17130
|
+
);
|
|
17131
|
+
const eventEnd = new Date(
|
|
17132
|
+
event.end ?? event.start ?? Date.now()
|
|
17133
|
+
);
|
|
17134
|
+
const isFirstDay = (0, import_date_fns23.isSameDay)(day, eventStart);
|
|
17135
|
+
const isLastDay = (0, import_date_fns23.isSameDay)(day, eventEnd);
|
|
17136
|
+
return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
17137
|
+
EventItemAgenda,
|
|
17138
|
+
{
|
|
17139
|
+
event,
|
|
17140
|
+
isFirstDay,
|
|
17141
|
+
isLastDay,
|
|
17142
|
+
onClick: (e) => handleEventClick(event, e),
|
|
17143
|
+
view: "month"
|
|
17144
|
+
},
|
|
17145
|
+
event.id
|
|
17146
|
+
);
|
|
17147
|
+
}) })
|
|
17148
|
+
] })
|
|
17149
|
+
}
|
|
17150
|
+
)
|
|
17151
|
+
] })
|
|
17152
|
+
]
|
|
17153
|
+
}
|
|
17154
|
+
)
|
|
17155
|
+
]
|
|
17156
|
+
}
|
|
17157
|
+
)
|
|
17158
|
+
},
|
|
17159
|
+
day.toString()
|
|
17160
|
+
);
|
|
17161
|
+
})
|
|
17162
|
+
},
|
|
17163
|
+
`week-${week}`
|
|
17164
|
+
)) }),
|
|
17165
|
+
/* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
17166
|
+
UndatedEvents,
|
|
17167
|
+
{
|
|
17168
|
+
events,
|
|
17169
|
+
onEventSelect,
|
|
17170
|
+
className: "my-12",
|
|
17171
|
+
show: showUndatedEvents
|
|
17172
|
+
}
|
|
17173
|
+
)
|
|
17174
|
+
] });
|
|
17175
|
+
}
|
|
17176
|
+
|
|
17177
|
+
// src/components/event-calendar-view/WeekView.tsx
|
|
17178
|
+
var import_date_fns25 = require("date-fns");
|
|
17179
|
+
var import_locale13 = require("date-fns/locale");
|
|
17180
|
+
var import_react87 = require("react");
|
|
17181
|
+
|
|
17182
|
+
// src/components/event-calendar-view/DraggablaEvent.tsx
|
|
17183
|
+
var import_core6 = require("@dnd-kit/core");
|
|
17184
|
+
var import_utilities2 = require("@dnd-kit/utilities");
|
|
17185
|
+
var import_date_fns24 = require("date-fns");
|
|
17186
|
+
var import_react86 = require("react");
|
|
17187
|
+
var import_jsx_runtime94 = require("react/jsx-runtime");
|
|
17188
|
+
function DraggableEvent2({
|
|
17189
|
+
event,
|
|
17190
|
+
view,
|
|
17191
|
+
showTime,
|
|
17192
|
+
onClick,
|
|
17193
|
+
height,
|
|
17194
|
+
isMultiDay,
|
|
17195
|
+
multiDayWidth,
|
|
17196
|
+
isFirstDay = true,
|
|
17197
|
+
isLastDay = true,
|
|
17198
|
+
"aria-hidden": ariaHidden,
|
|
17199
|
+
draggable = true
|
|
17200
|
+
}) {
|
|
17201
|
+
const { activeId } = useCalendarDndAgenda();
|
|
17202
|
+
const elementRef = (0, import_react86.useRef)(null);
|
|
17203
|
+
const [dragHandlePosition, setDragHandlePosition] = (0, import_react86.useState)(null);
|
|
17204
|
+
const eventStart = new Date(event.start ?? Date.now());
|
|
17205
|
+
const eventEnd = new Date(event.end ?? Date.now());
|
|
17206
|
+
const isMultiDayEvent2 = isMultiDay || event.allDay || (0, import_date_fns24.differenceInDays)(eventEnd, eventStart) >= 1;
|
|
17207
|
+
const { attributes, listeners, setNodeRef, transform, isDragging } = (0, import_core6.useDraggable)({
|
|
17208
|
+
data: {
|
|
17209
|
+
dragHandlePosition,
|
|
17210
|
+
event,
|
|
17211
|
+
height: height || elementRef.current?.offsetHeight || null,
|
|
17212
|
+
isFirstDay,
|
|
17213
|
+
isLastDay,
|
|
17214
|
+
isMultiDay: isMultiDayEvent2,
|
|
17215
|
+
multiDayWidth,
|
|
17216
|
+
view
|
|
17217
|
+
},
|
|
17218
|
+
// allow callers to disable dragging
|
|
17219
|
+
disabled: !draggable,
|
|
17220
|
+
id: `${event.id}-${view}`
|
|
17221
|
+
});
|
|
17222
|
+
const handleMouseDown = (e) => {
|
|
17223
|
+
if (elementRef.current) {
|
|
17224
|
+
const rect = elementRef.current.getBoundingClientRect();
|
|
17225
|
+
setDragHandlePosition({
|
|
17226
|
+
x: e.clientX - rect.left,
|
|
17227
|
+
y: e.clientY - rect.top
|
|
17228
|
+
});
|
|
17229
|
+
}
|
|
17230
|
+
};
|
|
17231
|
+
if (isDragging || activeId === `${event.id}-${view}`) {
|
|
17232
|
+
return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
|
|
17233
|
+
"div",
|
|
17234
|
+
{
|
|
17235
|
+
className: "opacity-0",
|
|
17236
|
+
ref: setNodeRef,
|
|
17237
|
+
style: { height: height || "auto" }
|
|
17238
|
+
}
|
|
17239
|
+
);
|
|
17240
|
+
}
|
|
17241
|
+
const style = transform ? {
|
|
17242
|
+
height: height || "auto",
|
|
17243
|
+
transform: import_utilities2.CSS.Translate.toString(transform),
|
|
17244
|
+
width: isMultiDayEvent2 && multiDayWidth ? `${multiDayWidth}%` : void 0
|
|
17245
|
+
} : {
|
|
17246
|
+
height: height || "auto",
|
|
17247
|
+
width: isMultiDayEvent2 && multiDayWidth ? `${multiDayWidth}%` : void 0
|
|
17248
|
+
};
|
|
17249
|
+
const handleTouchStart = (e) => {
|
|
17250
|
+
if (elementRef.current) {
|
|
17251
|
+
const rect = elementRef.current.getBoundingClientRect();
|
|
17252
|
+
const touch = e.touches[0];
|
|
17253
|
+
if (touch) {
|
|
17254
|
+
setDragHandlePosition({
|
|
17255
|
+
x: touch.clientX - rect.left,
|
|
17256
|
+
y: touch.clientY - rect.top
|
|
17257
|
+
});
|
|
17258
|
+
}
|
|
17259
|
+
}
|
|
17260
|
+
};
|
|
17261
|
+
return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
|
|
17262
|
+
"div",
|
|
17263
|
+
{
|
|
17264
|
+
className: "touch-none",
|
|
17265
|
+
ref: (node) => {
|
|
17266
|
+
setNodeRef(node);
|
|
17267
|
+
if (elementRef) elementRef.current = node;
|
|
17268
|
+
},
|
|
17269
|
+
style,
|
|
17270
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
|
|
17271
|
+
EventItemAgenda,
|
|
17272
|
+
{
|
|
17273
|
+
"aria-hidden": ariaHidden,
|
|
17274
|
+
dndAttributes: attributes,
|
|
17275
|
+
dndListeners: listeners,
|
|
17276
|
+
event,
|
|
17277
|
+
isDragging,
|
|
17278
|
+
isFirstDay,
|
|
17279
|
+
isLastDay,
|
|
17280
|
+
onClick,
|
|
17281
|
+
onMouseDown: handleMouseDown,
|
|
17282
|
+
onTouchStart: handleTouchStart,
|
|
17283
|
+
showTime,
|
|
17284
|
+
view
|
|
17285
|
+
}
|
|
17286
|
+
)
|
|
17287
|
+
}
|
|
17288
|
+
);
|
|
17289
|
+
}
|
|
17290
|
+
|
|
17291
|
+
// src/components/event-calendar-view/WeekView.tsx
|
|
17292
|
+
var import_jsx_runtime95 = require("react/jsx-runtime");
|
|
17293
|
+
function WeekViewAgenda({
|
|
17294
|
+
currentDate,
|
|
17295
|
+
events,
|
|
17296
|
+
onEventSelect,
|
|
17297
|
+
onEventCreate,
|
|
17298
|
+
showUndatedEvents
|
|
17299
|
+
}) {
|
|
17300
|
+
const days = (0, import_react87.useMemo)(() => {
|
|
17301
|
+
const weekStart2 = (0, import_date_fns25.startOfWeek)(currentDate, { weekStartsOn: 0 });
|
|
17302
|
+
const weekEnd = (0, import_date_fns25.endOfWeek)(currentDate, { weekStartsOn: 0 });
|
|
17303
|
+
return (0, import_date_fns25.eachDayOfInterval)({ end: weekEnd, start: weekStart2 });
|
|
17304
|
+
}, [currentDate]);
|
|
17305
|
+
const weekStart = (0, import_react87.useMemo)(
|
|
17306
|
+
() => (0, import_date_fns25.startOfWeek)(currentDate, { weekStartsOn: 0 }),
|
|
17307
|
+
[currentDate]
|
|
17308
|
+
);
|
|
17309
|
+
const hours = (0, import_react87.useMemo)(() => {
|
|
17310
|
+
const dayStart = (0, import_date_fns25.startOfDay)(currentDate);
|
|
17311
|
+
return (0, import_date_fns25.eachHourOfInterval)({
|
|
17312
|
+
end: (0, import_date_fns25.addHours)(dayStart, EndHour - 1),
|
|
17313
|
+
start: (0, import_date_fns25.addHours)(dayStart, StartHour)
|
|
17314
|
+
});
|
|
17315
|
+
}, [currentDate]);
|
|
17316
|
+
const allDayEvents = (0, import_react87.useMemo)(() => {
|
|
17317
|
+
return events.filter((event) => {
|
|
17318
|
+
return event.allDay || isMultiDayEventAgenda(event);
|
|
17319
|
+
}).filter((event) => {
|
|
17320
|
+
const eventStart = event.start ? new Date(event.start) : event.end ? new Date(event.end) : void 0;
|
|
17321
|
+
const eventEnd = event.end ? new Date(event.end) : event.start ? new Date(event.start) : void 0;
|
|
17322
|
+
return days.some((day) => {
|
|
17323
|
+
if (eventStart && (0, import_date_fns25.isSameDay)(day, eventStart)) return true;
|
|
17324
|
+
if (eventEnd && (0, import_date_fns25.isSameDay)(day, eventEnd)) return true;
|
|
17325
|
+
if (eventStart && eventEnd && day > eventStart && day < eventEnd)
|
|
17326
|
+
return true;
|
|
17327
|
+
return false;
|
|
17328
|
+
});
|
|
17329
|
+
});
|
|
17330
|
+
}, [events, days]);
|
|
17331
|
+
const processedDayEvents = (0, import_react87.useMemo)(() => {
|
|
17332
|
+
const result = days.map((day) => {
|
|
17333
|
+
const dayEvents = events.filter((event) => {
|
|
17334
|
+
if (event.allDay || isMultiDayEventAgenda(event)) return false;
|
|
17335
|
+
const eventStart = new Date(event.start ?? event.end ?? Date.now());
|
|
17336
|
+
const eventEnd = new Date(event.end ?? event.start ?? Date.now());
|
|
17337
|
+
return (0, import_date_fns25.isSameDay)(day, eventStart) || (0, import_date_fns25.isSameDay)(day, eventEnd) || eventStart < day && eventEnd > day;
|
|
17338
|
+
});
|
|
17339
|
+
const sortedEvents = [...dayEvents].sort((a, b) => {
|
|
17340
|
+
const aStart = new Date(a.start ?? a.end ?? Date.now());
|
|
17341
|
+
const bStart = new Date(b.start ?? b.end ?? Date.now());
|
|
17342
|
+
const aEnd = new Date(a.end ?? a.start ?? Date.now());
|
|
17343
|
+
const bEnd = new Date(b.end ?? b.start ?? Date.now());
|
|
17344
|
+
if (aStart < bStart) return -1;
|
|
17345
|
+
if (aStart > bStart) return 1;
|
|
17346
|
+
const aDuration = (0, import_date_fns25.differenceInMinutes)(aEnd, aStart);
|
|
17347
|
+
const bDuration = (0, import_date_fns25.differenceInMinutes)(bEnd, bStart);
|
|
17348
|
+
return bDuration - aDuration;
|
|
17349
|
+
});
|
|
17350
|
+
const positionedEvents = [];
|
|
17351
|
+
const dayStart = (0, import_date_fns25.startOfDay)(day);
|
|
17352
|
+
const columns = [];
|
|
17353
|
+
for (const event of sortedEvents) {
|
|
17354
|
+
const eventStart = new Date(event.start ?? event.end ?? Date.now());
|
|
17355
|
+
const eventEnd = new Date(event.end ?? event.start ?? Date.now());
|
|
17356
|
+
const adjustedStart = (0, import_date_fns25.isSameDay)(day, eventStart) ? eventStart : dayStart;
|
|
17357
|
+
const adjustedEnd = (0, import_date_fns25.isSameDay)(day, eventEnd) ? eventEnd : (0, import_date_fns25.addHours)(dayStart, 24);
|
|
17358
|
+
const startHour = (0, import_date_fns25.getHours)(adjustedStart) + (0, import_date_fns25.getMinutes)(adjustedStart) / 60;
|
|
17359
|
+
const endHour = (0, import_date_fns25.getHours)(adjustedEnd) + (0, import_date_fns25.getMinutes)(adjustedEnd) / 60;
|
|
17360
|
+
const top = (startHour - StartHour) * WeekCellsHeightAgenda;
|
|
17361
|
+
const height = (endHour - startHour) * WeekCellsHeightAgenda;
|
|
17362
|
+
let columnIndex = 0;
|
|
17363
|
+
let placed = false;
|
|
17364
|
+
while (!placed) {
|
|
17365
|
+
const col = columns[columnIndex] || [];
|
|
17366
|
+
if (col.length === 0) {
|
|
17367
|
+
columns[columnIndex] = col;
|
|
17368
|
+
placed = true;
|
|
17369
|
+
} else {
|
|
17370
|
+
const overlaps = col.some(
|
|
17371
|
+
(c) => (0, import_date_fns25.areIntervalsOverlapping)(
|
|
17372
|
+
{ end: adjustedEnd, start: adjustedStart },
|
|
17373
|
+
{
|
|
17374
|
+
end: new Date(c.event.end ?? c.event.start ?? Date.now()),
|
|
17375
|
+
start: new Date(c.event.start ?? c.event.end ?? Date.now())
|
|
17376
|
+
}
|
|
17377
|
+
)
|
|
17378
|
+
);
|
|
17379
|
+
if (!overlaps) {
|
|
17380
|
+
placed = true;
|
|
17381
|
+
} else {
|
|
17382
|
+
columnIndex++;
|
|
17383
|
+
}
|
|
17384
|
+
}
|
|
17385
|
+
}
|
|
17386
|
+
const currentColumn = columns[columnIndex] || [];
|
|
17387
|
+
columns[columnIndex] = currentColumn;
|
|
17388
|
+
currentColumn.push({ end: adjustedEnd, event });
|
|
17389
|
+
const width = columnIndex === 0 ? 1 : 0.9;
|
|
17390
|
+
const left = columnIndex === 0 ? 0 : columnIndex * 0.1;
|
|
17391
|
+
positionedEvents.push({
|
|
17392
|
+
event,
|
|
17393
|
+
height,
|
|
17394
|
+
left,
|
|
17395
|
+
top,
|
|
17396
|
+
width,
|
|
17397
|
+
zIndex: 10 + columnIndex
|
|
17398
|
+
// Higher columns get higher z-index
|
|
17399
|
+
});
|
|
17400
|
+
}
|
|
17401
|
+
return positionedEvents;
|
|
17402
|
+
});
|
|
17403
|
+
return result;
|
|
17404
|
+
}, [days, events]);
|
|
17405
|
+
const handleEventClick = (event, e) => {
|
|
17406
|
+
e.stopPropagation();
|
|
17407
|
+
onEventSelect(event);
|
|
17408
|
+
};
|
|
17409
|
+
const showAllDaySection = allDayEvents.length > 0;
|
|
17410
|
+
const { currentTimePosition, currentTimeVisible } = useCurrentTimeIndicatorAgenda(currentDate, "week");
|
|
17411
|
+
return /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("div", { className: "flex h-full flex-col", "data-slot": "week-view", children: [
|
|
17412
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("div", { className: "sticky top-0 z-30 grid grid-cols-8 border-border/70 border-b bg-background", children: [
|
|
17413
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)("div", { className: "py-2 text-center text-muted-foreground/70 text-sm", children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("span", { className: "max-[479px]:sr-only", children: (0, import_date_fns25.format)(/* @__PURE__ */ new Date(), "O") }) }),
|
|
17414
|
+
days.map((day) => /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)(
|
|
17415
|
+
"div",
|
|
17416
|
+
{
|
|
17417
|
+
className: "py-2 text-center text-muted-foreground/70 text-sm data-today:font-medium data-today:text-foreground",
|
|
17418
|
+
"data-today": (0, import_date_fns25.isToday)(day) || void 0,
|
|
17419
|
+
children: [
|
|
17420
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("span", { "aria-hidden": "true", className: "sm:hidden", children: [
|
|
17421
|
+
(0, import_date_fns25.format)(day, "EEE", { locale: import_locale13.ptBR })[0],
|
|
17422
|
+
" ",
|
|
17423
|
+
(0, import_date_fns25.format)(day, "d", { locale: import_locale13.ptBR })
|
|
17424
|
+
] }),
|
|
17425
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)("span", { className: "max-sm:hidden", children: (0, import_date_fns25.format)(day, "EEE dd", { locale: import_locale13.ptBR }) })
|
|
17426
|
+
]
|
|
17427
|
+
},
|
|
17428
|
+
day.toString()
|
|
17429
|
+
))
|
|
17430
|
+
] }),
|
|
17431
|
+
showAllDaySection && /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("div", { className: "border-border/70 border-b bg-muted/50", children: /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("div", { className: "grid grid-cols-8", children: [
|
|
17432
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)("div", { className: "relative border-border/70 border-r", children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("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" }) }),
|
|
17433
|
+
days.map((day, dayIndex) => {
|
|
17434
|
+
const dayAllDayEvents = allDayEvents.filter((event) => {
|
|
17435
|
+
const eventStart = event.start ? new Date(event.start) : void 0;
|
|
17436
|
+
const eventEnd = event.end ? new Date(event.end) : void 0;
|
|
17437
|
+
if (!eventStart && !eventEnd) return false;
|
|
17438
|
+
return eventStart && (0, import_date_fns25.isSameDay)(day, eventStart) || eventStart && eventEnd && day > eventStart && day < eventEnd || eventEnd && (0, import_date_fns25.isSameDay)(day, eventEnd);
|
|
17439
|
+
});
|
|
17440
|
+
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
17441
|
+
"div",
|
|
17442
|
+
{
|
|
17443
|
+
className: "relative border-border/70 border-r p-1 last:border-r-0",
|
|
17444
|
+
"data-today": (0, import_date_fns25.isToday)(day) || void 0,
|
|
17445
|
+
children: dayAllDayEvents.map((event) => {
|
|
17446
|
+
const eventStart = event.start ? new Date(event.start) : void 0;
|
|
17447
|
+
const eventEnd = event.end ? new Date(event.end) : void 0;
|
|
17448
|
+
const isFirstDay = eventStart ? (0, import_date_fns25.isSameDay)(day, eventStart) : false;
|
|
17449
|
+
const isLastDay = eventEnd ? (0, import_date_fns25.isSameDay)(day, eventEnd) : false;
|
|
17450
|
+
const isFirstVisibleDay = eventStart ? dayIndex === 0 && (0, import_date_fns25.isBefore)(eventStart, weekStart) : false;
|
|
17451
|
+
const shouldShowTitle = isFirstDay || isFirstVisibleDay;
|
|
17452
|
+
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
17453
|
+
EventItemAgenda,
|
|
17454
|
+
{
|
|
17455
|
+
event,
|
|
17456
|
+
isFirstDay,
|
|
17457
|
+
isLastDay,
|
|
17458
|
+
onClick: (e) => handleEventClick(event, e),
|
|
17459
|
+
view: "month",
|
|
17460
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
17461
|
+
"div",
|
|
17462
|
+
{
|
|
17463
|
+
"aria-hidden": !shouldShowTitle,
|
|
17464
|
+
className: cn(
|
|
17465
|
+
"truncate",
|
|
17466
|
+
!shouldShowTitle && "invisible"
|
|
17467
|
+
),
|
|
17468
|
+
children: event.title
|
|
17469
|
+
}
|
|
17470
|
+
)
|
|
17471
|
+
},
|
|
17472
|
+
`spanning-${event.id}`
|
|
17473
|
+
);
|
|
17474
|
+
})
|
|
17475
|
+
},
|
|
17476
|
+
day.toString()
|
|
17477
|
+
);
|
|
17478
|
+
})
|
|
17479
|
+
] }) }),
|
|
17480
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("div", { className: "grid flex-1 grid-cols-8 overflow-hidden", children: [
|
|
17481
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)("div", { className: "grid auto-cols-fr border-border/70 border-r", children: hours.map((hour, index) => /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
17482
|
+
"div",
|
|
17483
|
+
{
|
|
17484
|
+
className: "relative min-h-[var(--week-cells-height)] border-border/70 border-b last:border-b-0",
|
|
17485
|
+
children: index > 0 && /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("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: (0, import_date_fns25.format)(hour, "HH:mm") })
|
|
17486
|
+
},
|
|
17487
|
+
hour.toString()
|
|
17488
|
+
)) }),
|
|
17489
|
+
days.map((day, dayIndex) => /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)(
|
|
17490
|
+
"div",
|
|
17491
|
+
{
|
|
17492
|
+
className: "relative grid auto-cols-fr border-border/70 border-r last:border-r-0",
|
|
17493
|
+
"data-today": (0, import_date_fns25.isToday)(day) || void 0,
|
|
17494
|
+
children: [
|
|
17495
|
+
(processedDayEvents[dayIndex] ?? []).map((positionedEvent) => /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
17496
|
+
"div",
|
|
17497
|
+
{
|
|
17498
|
+
className: "absolute z-10 px-0.5",
|
|
17499
|
+
onClick: (e) => e.stopPropagation(),
|
|
17500
|
+
style: {
|
|
17501
|
+
height: `${positionedEvent.height}px`,
|
|
17502
|
+
left: `${positionedEvent.left * 100}%`,
|
|
17503
|
+
top: `${positionedEvent.top}px`,
|
|
17504
|
+
width: `${positionedEvent.width * 100}%`,
|
|
17505
|
+
zIndex: positionedEvent.zIndex
|
|
17506
|
+
},
|
|
17507
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("div", { className: "size-full", children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
17508
|
+
DraggableEvent2,
|
|
17509
|
+
{
|
|
17510
|
+
event: positionedEvent.event,
|
|
17511
|
+
height: positionedEvent.height,
|
|
17512
|
+
onClick: (e) => handleEventClick(positionedEvent.event, e),
|
|
17513
|
+
draggable: false,
|
|
17514
|
+
showTime: true,
|
|
17515
|
+
view: "week"
|
|
17516
|
+
}
|
|
17517
|
+
) })
|
|
17518
|
+
},
|
|
17519
|
+
positionedEvent.event.id
|
|
17520
|
+
)),
|
|
17521
|
+
currentTimeVisible && (0, import_date_fns25.isToday)(day) && /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
17522
|
+
"div",
|
|
17523
|
+
{
|
|
17524
|
+
className: "pointer-events-none absolute right-0 left-0 z-20",
|
|
17525
|
+
style: { top: `${currentTimePosition}%` },
|
|
17526
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("div", { className: "relative flex items-center", children: [
|
|
17527
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)("div", { className: "-left-1 absolute h-2 w-2 rounded-full bg-primary" }),
|
|
17528
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)("div", { className: "h-[2px] w-full bg-primary" })
|
|
17529
|
+
] })
|
|
17530
|
+
}
|
|
17531
|
+
),
|
|
17532
|
+
hours.map((hour) => {
|
|
17533
|
+
const hourValue = (0, import_date_fns25.getHours)(hour);
|
|
17534
|
+
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
17535
|
+
"div",
|
|
17536
|
+
{
|
|
17537
|
+
className: "relative min-h-[var(--week-cells-height)] border-border/70 border-b last:border-b-0",
|
|
17538
|
+
children: [0, 1, 2, 3].map((quarter) => {
|
|
17539
|
+
const quarterHourTime = hourValue + quarter * 0.25;
|
|
17540
|
+
return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
17541
|
+
DroppableCellAgenda,
|
|
17542
|
+
{
|
|
17543
|
+
className: cn(
|
|
17544
|
+
"absolute h-[calc(var(--week-cells-height)/4)] w-full",
|
|
17545
|
+
quarter === 0 && "top-0",
|
|
17546
|
+
quarter === 1 && "top-[calc(var(--week-cells-height)/4)]",
|
|
17547
|
+
quarter === 2 && "top-[calc(var(--week-cells-height)/4*2)]",
|
|
17548
|
+
quarter === 3 && "top-[calc(var(--week-cells-height)/4*)]"
|
|
17549
|
+
),
|
|
17550
|
+
date: day,
|
|
17551
|
+
id: `week-cell-${day.toISOString()}-${quarterHourTime}`,
|
|
17552
|
+
onClick: () => {
|
|
17553
|
+
const startTime = new Date(day);
|
|
17554
|
+
startTime.setHours(hourValue);
|
|
17555
|
+
startTime.setMinutes(quarter * 15);
|
|
17556
|
+
if (onEventCreate) onEventCreate(startTime);
|
|
17557
|
+
},
|
|
17558
|
+
time: quarterHourTime
|
|
17559
|
+
},
|
|
17560
|
+
`${hour.toString()}-${quarter}`
|
|
17561
|
+
);
|
|
17562
|
+
})
|
|
17563
|
+
},
|
|
17564
|
+
hour.toString()
|
|
17565
|
+
);
|
|
17566
|
+
})
|
|
17567
|
+
]
|
|
17568
|
+
},
|
|
17569
|
+
day.toString()
|
|
17570
|
+
))
|
|
17571
|
+
] }),
|
|
17572
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
17573
|
+
UndatedEvents,
|
|
17574
|
+
{
|
|
17575
|
+
events,
|
|
17576
|
+
onEventSelect,
|
|
17577
|
+
show: showUndatedEvents
|
|
17578
|
+
}
|
|
17579
|
+
)
|
|
17580
|
+
] });
|
|
17581
|
+
}
|
|
17582
|
+
|
|
17583
|
+
// src/components/ui/data/Banner.tsx
|
|
17584
|
+
var import_react88 = require("@phosphor-icons/react");
|
|
17585
|
+
var import_react89 = __toESM(require("react"));
|
|
17586
|
+
var import_jsx_runtime96 = require("react/jsx-runtime");
|
|
17587
|
+
|
|
15568
17588
|
// src/hooks/use-drag.tsx
|
|
15569
|
-
var
|
|
17589
|
+
var import_react90 = require("react");
|
|
15570
17590
|
var useDrag = (options = {}) => {
|
|
15571
|
-
const [isDragging, setIsDragging] = (0,
|
|
15572
|
-
const [positions, setPositions] = (0,
|
|
15573
|
-
const dragStartPos = (0,
|
|
15574
|
-
const dragId = (0,
|
|
15575
|
-
const handleMouseDown = (0,
|
|
17591
|
+
const [isDragging, setIsDragging] = (0, import_react90.useState)(null);
|
|
17592
|
+
const [positions, setPositions] = (0, import_react90.useState)({});
|
|
17593
|
+
const dragStartPos = (0, import_react90.useRef)(null);
|
|
17594
|
+
const dragId = (0, import_react90.useRef)(null);
|
|
17595
|
+
const handleMouseDown = (0, import_react90.useCallback)((id, e) => {
|
|
15576
17596
|
e.preventDefault();
|
|
15577
17597
|
const currentPosition = positions[id] || { top: 0, left: 0 };
|
|
15578
17598
|
dragStartPos.current = {
|
|
@@ -15585,7 +17605,7 @@ var useDrag = (options = {}) => {
|
|
|
15585
17605
|
setIsDragging(id);
|
|
15586
17606
|
options.onDragStart?.(id);
|
|
15587
17607
|
}, [positions, options]);
|
|
15588
|
-
const handleMouseMove = (0,
|
|
17608
|
+
const handleMouseMove = (0, import_react90.useCallback)((e) => {
|
|
15589
17609
|
if (!isDragging || !dragStartPos.current || !dragId.current) return;
|
|
15590
17610
|
const deltaX = e.clientX - dragStartPos.current.x;
|
|
15591
17611
|
const deltaY = e.clientY - dragStartPos.current.y;
|
|
@@ -15601,7 +17621,7 @@ var useDrag = (options = {}) => {
|
|
|
15601
17621
|
}));
|
|
15602
17622
|
options.onDrag?.(dragId.current, newPosition);
|
|
15603
17623
|
}, [isDragging, options]);
|
|
15604
|
-
const handleMouseUp = (0,
|
|
17624
|
+
const handleMouseUp = (0, import_react90.useCallback)(() => {
|
|
15605
17625
|
if (dragId.current) {
|
|
15606
17626
|
options.onDragEnd?.(dragId.current);
|
|
15607
17627
|
}
|
|
@@ -15609,7 +17629,7 @@ var useDrag = (options = {}) => {
|
|
|
15609
17629
|
dragStartPos.current = null;
|
|
15610
17630
|
dragId.current = null;
|
|
15611
17631
|
}, [options]);
|
|
15612
|
-
(0,
|
|
17632
|
+
(0, import_react90.useEffect)(() => {
|
|
15613
17633
|
if (isDragging) {
|
|
15614
17634
|
document.addEventListener("mousemove", handleMouseMove);
|
|
15615
17635
|
document.addEventListener("mouseup", handleMouseUp);
|
|
@@ -15621,16 +17641,16 @@ var useDrag = (options = {}) => {
|
|
|
15621
17641
|
};
|
|
15622
17642
|
}
|
|
15623
17643
|
}, [isDragging, handleMouseMove, handleMouseUp]);
|
|
15624
|
-
const setPosition = (0,
|
|
17644
|
+
const setPosition = (0, import_react90.useCallback)((id, position) => {
|
|
15625
17645
|
setPositions((prev) => ({
|
|
15626
17646
|
...prev,
|
|
15627
17647
|
[id]: position
|
|
15628
17648
|
}));
|
|
15629
17649
|
}, []);
|
|
15630
|
-
const getPosition = (0,
|
|
17650
|
+
const getPosition = (0, import_react90.useCallback)((id) => {
|
|
15631
17651
|
return positions[id] || { top: 0, left: 0 };
|
|
15632
17652
|
}, [positions]);
|
|
15633
|
-
const isElementDragging = (0,
|
|
17653
|
+
const isElementDragging = (0, import_react90.useCallback)((id) => {
|
|
15634
17654
|
return isDragging === id;
|
|
15635
17655
|
}, [isDragging]);
|
|
15636
17656
|
return {
|