@mantine/schedule 9.5.0 → 9.5.1-alpha.0

package/esm/components/ResourcesMonthView/ResourcesMonthView.mjs

@@ -13,9 +13,10 @@ import { DragContext } from "../DragContext/DragContext.mjs";
 import { ScheduleEvent } from "../ScheduleEvent/ScheduleEvent.mjs";
 import { MoreEvents } from "../MoreEvents/MoreEvents.mjs";
 import { ScheduleHeaderBase } from "../ScheduleHeader/ScheduleHeaderBase.mjs";
+import { useDayGridEventResize } from "../../hooks/use-day-grid-event-resize.mjs";
 import ResourcesMonthView_module_default from "./ResourcesMonthView.module.mjs";
 import dayjs from "dayjs";
-import { Box, ScrollArea, UnstyledButton, createVarsResolver, factory, getRadius, rem, useProps, useResolvedStylesApi, useStyles } from "@mantine/core";
+import { Box, ScrollArea, UnstyledButton, createVarsResolver, factory, getRadius, rem, useMantineTheme, useProps, useResolvedStylesApi, useStyles } from "@mantine/core";
 import { useIsomorphicEffect, useMergedRef } from "@mantine/hooks";
 import { createElement, useCallback, useMemo, useRef } from "react";
 import { useDatesContext } from "@mantine/dates";
@@ -35,6 +36,7 @@ const defaultProps = {
 	withWeekendDays: true,
 	withEventsDragAndDrop: false,
 	withDragSlotSelect: false,
+	withEventResize: false,
 	mode: "default"
 };
 function compareCellEvents(a, b) {
@@ -54,7 +56,7 @@ function isMultiDayEvent(event) {
 }
 const ResourcesMonthView = factory((_props) => {
 	const props = useProps("ResourcesMonthView", defaultProps, _props);
-	const { classNames, className, style, styles, unstyled, attributes, vars, mod, date, onDateChange, resources, locale, weekdayFormat, weekendDays, withWeekendDays, startScrollDate, __staticSelector, onDayClick, highlightToday, radius, withHeader, monthYearSelectProps, onViewChange, todayControlProps, nextControlProps, previousControlProps, viewSelectProps, events, dayWidth, rowHeight, renderResourceLabel, groups, renderGroupLabel, groupLabelWidth, renderEventBody, renderEvent, withEventsDragAndDrop, onEventDrop, canDragEvent, onEventDragStart, onEventDragEnd, onEventClick, withDragSlotSelect, onSlotDragEnd, labels, mode, scrollAreaProps, onExternalEventDrop, maxEventsPerTimeSlot: _maxEventsPerTimeSlot, moreEventsProps, recurrenceExpansionLimit, ...others } = props;
+	const { classNames, className, style, styles, unstyled, attributes, vars, mod, date, onDateChange, resources, locale, weekdayFormat, weekendDays, withWeekendDays, startScrollDate, __staticSelector, onDayClick, highlightToday, radius, withHeader, monthYearSelectProps, onViewChange, todayControlProps, nextControlProps, previousControlProps, viewSelectProps, events, dayWidth, rowHeight, renderResourceLabel, groups, renderGroupLabel, groupLabelWidth, renderEventBody, renderEvent, withEventsDragAndDrop, onEventDrop, canDragEvent, onEventDragStart, onEventDragEnd, withEventResize, onEventResize, canResizeEvent, onEventClick, withDragSlotSelect, onSlotDragEnd, labels, mode, scrollAreaProps, onExternalEventDrop, maxEventsPerTimeSlot: _maxEventsPerTimeSlot, moreEventsProps, recurrenceExpansionLimit, ...others } = props;
 	const maxEventsPerTimeSlot = Math.min(10, Math.max(1, _maxEventsPerTimeSlot ?? 2));
 	const getStyles = useStyles({
 		name: __staticSelector,
@@ -82,6 +84,7 @@ const ResourcesMonthView = factory((_props) => {
 		__staticSelector,
 		radius
 	};
+	const theme = useMantineTheme();
 	const ctx = useDatesContext();
 	const resolvedWeekendDays = ctx.getWeekendDays(weekendDays);
 	const { orderedResources, groupRanges, resourceGroupMap } = useMemo(() => getOrderedResources(resources, groups), [resources, groups]);
@@ -134,13 +137,34 @@ const ResourcesMonthView = factory((_props) => {
 		date,
 		recurrenceExpansionLimit
 	]);
+	const monthDaySet = useMemo(() => new Set(monthDays), [monthDays]);
+	const eventResize = useDayGridEventResize({
+		enabled: withEventResize,
+		mode,
+		onEventResize,
+		canResizeEvent
+	});
+	const { resizingEventId, previewStart, previewEnd } = eventResize;
+	const layoutEvents = useMemo(() => {
+		if (resizingEventId === null || previewStart === null || previewEnd === null) return expandedEvents;
+		return expandedEvents.map((event) => event.id === resizingEventId ? {
+			...event,
+			start: previewStart,
+			end: previewEnd
+		} : event);
+	}, [
+		expandedEvents,
+		resizingEventId,
+		previewStart,
+		previewEnd
+	]);
 	const { eventsByResourceAndDay, eventLayoutByResource } = useMemo(() => {
 		const eventsByResourceAndDay = {};
 		for (const resource of resources) {
 			eventsByResourceAndDay[resource.id] = {};
 			for (const day of monthDays) eventsByResourceAndDay[resource.id][day] = [];
 		}
-		if (expandedEvents) for (const event of expandedEvents) {
+		if (layoutEvents) for (const event of layoutEvents) {
 			if (event.resourceId === void 0 || !(event.resourceId in eventsByResourceAndDay)) continue;
 			const eventStart = dayjs(event.start);
 			const eventEnd = dayjs(event.end);
@@ -255,7 +279,7 @@ const ResourcesMonthView = factory((_props) => {
 	}, [
 		resources,
 		monthDays,
-		expandedEvents,
+		layoutEvents,
 		maxEventsPerTimeSlot
 	]);
 	const handleExternalDrop = useCallback((e, target) => {
@@ -346,8 +370,69 @@ const ResourcesMonthView = factory((_props) => {
 		cellsRef.current[nextResourceIndex]?.[nextDayIndex]?.focus();
 	};
 	const rowHeightPercent = 100 / maxEventsPerTimeSlot;
+	const renderEventNode = ({ key, event, resourceIndex, style, hanging, eventMod, withStartHandle, withEndHandle }) => {
+		const isResizable = eventResize.isResizableEvent(event);
+		const isThisEventResizing = eventResize.resizingEventId === event.id;
+		const eventEnd = dayjs(event.end);
+		const lastDay = (eventEnd.hour() === 0 && eventEnd.minute() === 0 && eventEnd.second() === 0 ? eventEnd.subtract(1, "day") : eventEnd).format("YYYY-MM-DD");
+		const showStartHandle = withStartHandle && monthDaySet.has(dayjs(event.start).format("YYYY-MM-DD"));
+		const showEndHandle = withEndHandle && monthDaySet.has(lastDay);
+		const eventColors = isResizable ? theme.variantColorResolver({
+			color: event.color || theme.primaryColor,
+			theme,
+			variant: event.variant || "light",
+			autoContrast: true
+		}) : null;
+		const getHandleProps = (edge) => ({
+			...getStyles("resourcesMonthViewResizeHandle"),
+			"data-edge": edge,
+			"data-active": isThisEventResizing && eventResize.resizingEdge === edge || void 0,
+			onPointerDown: (e) => eventResize.handleResizeStart({
+				event,
+				edge,
+				cells: cellsRef.current[resourceIndex] ?? [],
+				days: monthDays,
+				pointerEvent: e
+			})
+		});
+		return /* @__PURE__ */ jsxs(Box, {
+			...getStyles("resourcesMonthViewEventWrapper", { style: {
+				position: "absolute",
+				zIndex: 3,
+				...style
+			} }),
+			__vars: eventColors ? { "--event-color": eventColors.color } : void 0,
+			"data-resizing": isThisEventResizing || void 0,
+			children: [
+				/* @__PURE__ */ jsx(ScheduleEvent, {
+					event,
+					nowrap: true,
+					autoSize: true,
+					size: "sm",
+					hanging,
+					mod: eventMod,
+					draggable: dragDrop.isDraggableEvent(event),
+					isResizing: isThisEventResizing,
+					renderEventBody,
+					renderEvent,
+					radius,
+					mode,
+					onClick: onEventClick ? (e) => {
+						if (!eventResize.wasResizing()) onEventClick(event, e);
+					} : void 0,
+					style: {
+						width: "100%",
+						height: "100%"
+					}
+				}),
+				isResizable && showStartHandle && /* @__PURE__ */ jsx("div", { ...getHandleProps("start") }),
+				isResizable && showEndHandle && /* @__PURE__ */ jsx("div", { ...getHandleProps("end") })
+			]
+		}, key);
+	};
 	const rows = orderedResources.map((resource, resourceIndex) => {
 		if (!cellsRef.current[resourceIndex]) cellsRef.current[resourceIndex] = [];
+		cellsRef.current[resourceIndex].length = monthDays.length;
 		const slotGroup = String(resource.id);
 		const dropTarget = dragDrop.dropTarget;
 		const totalDays = monthDays.length;
@@ -368,29 +453,21 @@ const ResourcesMonthView = factory((_props) => {
 			const hasHiddenEvents = hiddenEventsCount > 0 && mode !== "static";
 			visibleEvents.forEach(({ event, row }) => {
 				if (isMultiDayEvent(event)) return;
-				const isDraggable = dragDrop.isDraggableEvent(event);
 				const topValue = hasHiddenEvents ? `calc((100% - 18px) * ${row} / ${maxEventsPerTimeSlot} + 1px)` : `calc(${row * rowHeightPercent}% + 1px)`;
 				const heightValue = hasHiddenEvents ? `calc((100% - 18px) / ${maxEventsPerTimeSlot} - 2px)` : `calc(${rowHeightPercent}% - 2px)`;
-				eventNodes.push(/* @__PURE__ */ jsx(ScheduleEvent, {
+				eventNodes.push(renderEventNode({
+					key: `${event.id}-${day}`,
 					event,
-					nowrap: true,
-					autoSize: true,
-					size: "sm",
-					draggable: isDraggable,
-					renderEventBody,
-					renderEvent,
-					radius,
-					mode,
-					onClick: onEventClick ? (e) => onEventClick(event, e) : void 0,
+					resourceIndex,
+					withStartHandle: true,
+					withEndHandle: true,
 					style: {
-						position: "absolute",
 						top: topValue,
 						left: `calc(${dayLeftPercent}% + 1px)`,
 						width: `calc(${dayWidthPercent}% - 2px)`,
-						height: heightValue,
-						zIndex: 3
+						height: heightValue
 					}
-				}, `${event.id}-${day}`));
+				}));
 			});
 			if (hiddenEventsCount > 0 && mode !== "static") moreNodes.push(/* @__PURE__ */ jsx(MoreEvents, {
 				events: dayEvents,
@@ -440,37 +517,29 @@ const ResourcesMonthView = factory((_props) => {
 			}, day);
 		});
 		(eventLayoutByResource[resource.id]?.segments ?? []).forEach((segment) => {
-			const isDraggable = dragDrop.isDraggableEvent(segment.event);
 			const segmentLeftPercent = segment.startDayIndex / totalDays * 100;
 			const segmentWidthPercent = (segment.endDayIndex - segment.startDayIndex + 1) / totalDays * 100;
 			const compressed = segment.hiddenInSpan && mode !== "static";
 			const topValue = compressed ? `calc((100% - 18px) * ${segment.row} / ${maxEventsPerTimeSlot} + 1px)` : `calc(${segment.row * rowHeightPercent}% + 1px)`;
 			const heightValue = compressed ? `calc((100% - 18px) / ${maxEventsPerTimeSlot} - 2px)` : `calc(${rowHeightPercent}% - 2px)`;
-			eventNodes.push(/* @__PURE__ */ jsx(ScheduleEvent, {
+			eventNodes.push(renderEventNode({
+				key: `${segment.event.id}-segment-${segment.startDayIndex}`,
 				event: segment.event,
-				nowrap: true,
-				autoSize: true,
-				size: "sm",
+				resourceIndex,
 				hanging: segment.hanging,
-				draggable: isDraggable,
-				renderEventBody,
-				renderEvent,
-				radius,
-				mode,
-				mod: {
+				eventMod: {
 					"clip-start": segment.clipStart,
 					"clip-end": segment.clipEnd
 				},
-				onClick: onEventClick ? (e) => onEventClick(segment.event, e) : void 0,
+				withStartHandle: !segment.clipStart && segment.hanging !== "start" && segment.hanging !== "both",
+				withEndHandle: !segment.clipEnd && segment.hanging !== "end" && segment.hanging !== "both",
 				style: {
-					position: "absolute",
 					top: topValue,
 					left: `calc(${segmentLeftPercent}% + 1px)`,
 					width: `calc(${segmentWidthPercent}% - 2px)`,
-					height: heightValue,
-					zIndex: 3
+					height: heightValue
 				}
-			}, `${segment.event.id}-segment-${segment.startDayIndex}`));
+			}));
 		});
 		const groupInfo = hasGroups ? resourceGroupMap[resourceIndex] : void 0;
 		const isGroupStart = groupInfo?.position === "first" || groupInfo?.position === "only";
@@ -517,7 +586,8 @@ const ResourcesMonthView = factory((_props) => {
 		mod: [{
 			static: mode === "static",
 			"slot-dragging": slotDragSelect.isDragging,
-			"event-interaction": dragDrop.dragContextValue.isDragging
+			"event-interaction": eventResize.isResizing || dragDrop.dragContextValue.isDragging,
+			resizing: eventResize.isResizing
 		}, mod],
 		...getStyles("resourcesMonthView"),
 		...others,

package/esm/components/ResourcesMonthView/ResourcesMonthView.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ResourcesMonthView.mjs","names":["classes"],"sources":["../../../src/components/ResourcesMonthView/ResourcesMonthView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport { useCallback, useMemo, useRef } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  MantineRadius,\n  rem,\n  ScrollArea,\n  ScrollAreaProps,\n  StylesApiProps,\n  UnstyledButton,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useIsomorphicEffect, useMergedRef } from '@mantine/hooks';\nimport { useDragDropHandlers } from '../../hooks/use-drag-drop-handlers';\nimport { useSlotDragSelect } from '../../hooks/use-slot-drag-select';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport {\n  DateLabelFormat,\n  DateStringValue,\n  DateTimeStringValue,\n  DayOfWeek,\n  ScheduleEventData,\n  ScheduleMode,\n  ScheduleResourceData,\n  ScheduleResourceGroup,\n  ScheduleViewLevel,\n} from '../../types';\nimport {\n  calculateMonthDropDate,\n  expandRecurringEvents,\n  formatDate,\n  getGroupToResourceIdMap,\n  getIndexFromDragPoint,\n  getOrderedResources,\n  toDateString,\n} from '../../utils';\nimport { DragContext } from '../DragContext/DragContext';\nimport { MoreEvents, MoreEventsProps, MoreEventsStylesNames } from '../MoreEvents/MoreEvents';\nimport { RenderEvent, RenderEventBody, ScheduleEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { MonthYearSelectProps } from '../ScheduleHeader/MonthYearSelect/MonthYearSelect';\nimport { CombinedScheduleHeaderStylesNames } from '../ScheduleHeader/ScheduleHeader';\nimport { ScheduleHeaderBase } from '../ScheduleHeader/ScheduleHeaderBase';\nimport { ViewSelectProps } from '../ScheduleHeader/ViewSelect/ViewSelect';\nimport classes from './ResourcesMonthView.module.css';\n\nexport type ResourcesMonthViewStylesNames =\n  | 'resourcesMonthView'\n  | 'resourcesMonthViewRoot'\n  | 'resourcesMonthViewScrollArea'\n  | 'resourcesMonthViewDayLabelsRow'\n  | 'resourcesMonthViewCorner'\n  | 'resourcesMonthViewDayLabel'\n  | 'resourcesMonthViewDayLabelWeekday'\n  | 'resourcesMonthViewDayLabelNumber'\n  | 'resourcesMonthViewRow'\n  | 'resourcesMonthViewResourceLabel'\n  | 'resourcesMonthViewRowSlots'\n  | 'resourcesMonthViewCell'\n  | 'resourcesMonthViewInner'\n  | 'resourcesMonthViewGroupColumn'\n  | 'resourcesMonthViewGroupColumnEmpty'\n  | MoreEventsStylesNames\n  | CombinedScheduleHeaderStylesNames;\n\nexport type ResourcesMonthViewCssVariables = {\n  resourcesMonthView:\n    | '--resources-month-view-radius'\n    | '--resources-month-view-day-width'\n    | '--resources-month-view-row-height'\n    | '--resources-month-view-group-label-width';\n};\n\nexport interface ResourcesMonthViewProps\n  extends BoxProps, StylesApiProps<ResourcesMonthViewFactory>, ElementProps<'div'> {\n  __staticSelector?: string;\n\n  /** Date to display, Date object or date string in `YYYY-MM-DD` format */\n  date: Date | string;\n\n  /** Called with the new date value when a date is selected */\n  onDateChange?: (value: DateStringValue) => void;\n\n  /** List of resources to display as rows */\n  resources: ScheduleResourceData[];\n\n  /** Locale passed down to dayjs */\n  locale?: string;\n\n  /** `dayjs` format for weekdays in day column headers @default 'dd' */\n  weekdayFormat?: DateLabelFormat;\n\n  /** Indices of weekend days */\n  weekendDays?: DayOfWeek[];\n\n  /** If set to false, weekend days are hidden @default true */\n  withWeekendDays?: boolean;\n\n  /** Date to scroll to on initial render, in `YYYY-MM-DD` format */\n  startScrollDate?: string;\n\n  /** Called when a cell is clicked, includes resourceId */\n  onDayClick?: (data: {\n    date: DateStringValue;\n    nativeEvent: React.MouseEvent<HTMLButtonElement>;\n    resourceId?: string | number;\n  }) => void;\n\n  /** If set, highlights the current day @default true */\n  highlightToday?: boolean;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** If set, the header is displayed @default true */\n  withHeader?: boolean;\n\n  /** Props passed down to `MonthYearSelect` component */\n  monthYearSelectProps?: Partial<MonthYearSelectProps>;\n\n  /** Called when view level select button is clicked */\n  onViewChange?: (view: ScheduleViewLevel) => void;\n\n  /** Props passed to previous control */\n  previousControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n  /** Props passed to next control */\n  nextControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n  /** Props passed to today control */\n  todayControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n  /** Props passed to view level select */\n  viewSelectProps?: Partial<ViewSelectProps> & DataAttributes;\n\n  /** Events to display */\n  events?: ScheduleEventData[];\n\n  /** Width of each day column @default 40px */\n  dayWidth?: React.CSSProperties['width'];\n\n  /** Height of each resource row @default 48px */\n  rowHeight?: React.CSSProperties['height'];\n\n  /** Function to customize event body */\n  renderEventBody?: RenderEventBody;\n\n  /** Function to fully customize event rendering */\n  renderEvent?: RenderEvent;\n\n  /** Function to customize resource label rendering */\n  renderResourceLabel?: (resource: ScheduleResourceData) => React.ReactNode;\n\n  /** List of resource groups to display as a column to the left of resource labels */\n  groups?: ScheduleResourceGroup[];\n\n  /** Function to customize group label rendering */\n  renderGroupLabel?: (group: ScheduleResourceGroup) => React.ReactNode;\n\n  /** Width of the group label column @default 80px */\n  groupLabelWidth?: React.CSSProperties['width'];\n\n  /** If true, events can be dragged and dropped @default false */\n  withEventsDragAndDrop?: boolean;\n\n  /** Called when event is dropped, includes target resourceId */\n  onEventDrop?: (data: {\n    eventId: string | number;\n    newStart: DateTimeStringValue;\n    newEnd: DateTimeStringValue;\n    event: ScheduleEventData;\n    resourceId?: string | number;\n  }) => void;\n\n  /** Function to determine if event can be dragged */\n  canDragEvent?: (event: ScheduleEventData) => boolean;\n\n  /** Called when any event drag starts */\n  onEventDragStart?: (event: ScheduleEventData) => void;\n\n  /** Called when any event drag ends */\n  onEventDragEnd?: () => void;\n\n  /** Called when event is clicked */\n  onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n\n  /** If set, enables drag-to-select day ranges @default false */\n  withDragSlotSelect?: boolean;\n\n  /** Called when a day range is selected by dragging, includes resourceId */\n  onSlotDragEnd?: (data: {\n    rangeStart: DateTimeStringValue;\n    rangeEnd: DateTimeStringValue;\n    resourceId?: string | number;\n  }) => void;\n\n  /** Labels override for i18n */\n  labels?: ScheduleLabelsOverride;\n\n  /** Interaction mode @default default */\n  mode?: ScheduleMode;\n\n  /** Props passed down to `ScrollArea` component */\n  scrollAreaProps?: Partial<ScrollAreaProps> & DataAttributes;\n\n  /** Called when an external item is dropped */\n  onExternalEventDrop?: (data: {\n    dataTransfer: DataTransfer;\n    dropDateTime: DateTimeStringValue;\n    resourceId?: string | number;\n  }) => void;\n\n  /** Maximum number of events visible per cell before \"+more\" indicator @default 2 */\n  maxEventsPerTimeSlot?: number;\n\n  /** Props passed down to `MoreEvents` component */\n  moreEventsProps?: Partial<MoreEventsProps>;\n\n  /** Max number of generated recurring instances @default 2000 */\n  recurrenceExpansionLimit?: number;\n}\n\nexport type ResourcesMonthViewFactory = Factory<{\n  props: ResourcesMonthViewProps;\n  ref: HTMLDivElement;\n  stylesNames: ResourcesMonthViewStylesNames;\n  vars: ResourcesMonthViewCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<ResourcesMonthViewFactory>(\n  (_theme, { radius, dayWidth, rowHeight, groupLabelWidth }) => ({\n    resourcesMonthView: {\n      '--resources-month-view-radius': radius ? getRadius(radius) : undefined,\n      '--resources-month-view-day-width': rem(dayWidth),\n      '--resources-month-view-row-height': rem(rowHeight),\n      '--resources-month-view-group-label-width': rem(groupLabelWidth),\n    },\n  })\n);\n\nconst defaultProps = {\n  __staticSelector: 'ResourcesMonthView',\n  highlightToday: true,\n  withHeader: true,\n  weekdayFormat: 'ddd',\n  withWeekendDays: true,\n  withEventsDragAndDrop: false,\n  withDragSlotSelect: false,\n  mode: 'default',\n} satisfies Partial<ResourcesMonthViewProps>;\n\nfunction compareCellEvents(a: ScheduleEventData, b: ScheduleEventData): number {\n  const aStart = dayjs(a.start);\n  const bStart = dayjs(b.start);\n  const aSpan = dayjs(a.end).startOf('day').diff(aStart.startOf('day'), 'day');\n  const bSpan = dayjs(b.end).startOf('day').diff(bStart.startOf('day'), 'day');\n\n  if (aSpan !== bSpan) {\n    return bSpan - aSpan;\n  }\n\n  return aStart.valueOf() - bStart.valueOf();\n}\n\nfunction getFirstAvailableRow(usedRows: Set<number>, maxRows: number): number | null {\n  for (let row = 0; row < maxRows; row += 1) {\n    if (!usedRows.has(row)) {\n      return row;\n    }\n  }\n\n  return null;\n}\n\ninterface ResourcesMonthViewCellLayout {\n  visible: { event: ScheduleEventData; row: number }[];\n  hiddenCount: number;\n}\n\ninterface ResourcesMonthViewSegment {\n  event: ScheduleEventData;\n  startDayIndex: number;\n  endDayIndex: number;\n  row: number;\n  clipStart: boolean;\n  clipEnd: boolean;\n  hanging: 'start' | 'end' | 'both' | 'none';\n\n  /** True when any day the segment covers shows a \"+N more\" indicator (those days compress rows) */\n  hiddenInSpan: boolean;\n}\n\ninterface ResourcesMonthViewResourceLayout {\n  byDay: Record<string, ResourcesMonthViewCellLayout>;\n  segments: ResourcesMonthViewSegment[];\n}\n\nfunction isMultiDayEvent(event: ScheduleEventData): boolean {\n  return dayjs(event.end).startOf('day').isAfter(dayjs(event.start).startOf('day'));\n}\n\nexport const ResourcesMonthView = factory<ResourcesMonthViewFactory>((_props) => {\n  const props = useProps('ResourcesMonthView', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    mod,\n    date,\n    onDateChange,\n    resources,\n    locale,\n    weekdayFormat,\n    weekendDays,\n    withWeekendDays,\n    startScrollDate,\n    __staticSelector,\n    onDayClick,\n    highlightToday,\n    radius,\n    withHeader,\n    monthYearSelectProps,\n    onViewChange,\n    todayControlProps,\n    nextControlProps,\n    previousControlProps,\n    viewSelectProps,\n    events,\n    dayWidth,\n    rowHeight,\n    renderResourceLabel,\n    groups,\n    renderGroupLabel,\n    groupLabelWidth,\n    renderEventBody,\n    renderEvent,\n    withEventsDragAndDrop,\n    onEventDrop,\n    canDragEvent,\n    onEventDragStart,\n    onEventDragEnd,\n    onEventClick,\n    withDragSlotSelect,\n    onSlotDragEnd,\n    labels,\n    mode,\n    scrollAreaProps,\n    onExternalEventDrop,\n    maxEventsPerTimeSlot: _maxEventsPerTimeSlot,\n    moreEventsProps,\n    recurrenceExpansionLimit,\n    ...others\n  } = props;\n\n  const maxEventsPerTimeSlot = Math.min(10, Math.max(1, _maxEventsPerTimeSlot ?? 2));\n\n  const getStyles = useStyles<ResourcesMonthViewFactory>({\n    name: __staticSelector,\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n    rootSelector: 'resourcesMonthView',\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<ResourcesMonthViewFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const stylesApiProps = {\n    classNames: resolvedClassNames,\n    styles: resolvedStyles,\n    attributes,\n    __staticSelector,\n    radius,\n  };\n\n  const ctx = useDatesContext();\n  const resolvedWeekendDays = ctx.getWeekendDays(weekendDays);\n  const { orderedResources, groupRanges, resourceGroupMap } = useMemo(\n    () => getOrderedResources(resources, groups),\n    [resources, groups]\n  );\n  const hasGroups = groupRanges.length > 0;\n\n  const monthDays = useMemo(() => {\n    const start = dayjs(date).startOf('month');\n    const daysCount = start.endOf('month').date();\n    const weekendDayList = ctx.getWeekendDays(weekendDays);\n    const days: string[] = [];\n    for (let d = 1; d <= daysCount; d++) {\n      const day = start.date(d);\n      if (!withWeekendDays && weekendDayList.includes(day.day() as DayOfWeek)) {\n        continue;\n      }\n      days.push(day.format('YYYY-MM-DD'));\n    }\n    return days;\n  }, [date, withWeekendDays, weekendDays, ctx]);\n\n  const viewportRef = useRef<HTMLDivElement>(null);\n  const mergedViewportRef = useMergedRef(viewportRef, scrollAreaProps?.viewportRef);\n  const dayLabelRefs = useRef<(HTMLDivElement | null)[]>([]);\n\n  const resourceLabelRef = useRef<HTMLDivElement>(null);\n\n  const scrollToDay = useCallback(\n    (targetDate: string) => {\n      if (!viewportRef.current) {\n        return;\n      }\n      const targetIndex = monthDays.indexOf(targetDate);\n      if (targetIndex < 0) {\n        return;\n      }\n      const targetLabel = dayLabelRefs.current[targetIndex];\n      if (!targetLabel) {\n        return;\n      }\n      const labelRect = targetLabel.getBoundingClientRect();\n      const viewportRect = viewportRef.current.getBoundingClientRect();\n      const labelWidth = resourceLabelRef.current?.getBoundingClientRect().width ?? 0;\n      viewportRef.current.scrollTo({\n        left: labelRect.left - viewportRect.left - labelWidth,\n        top: 0,\n      });\n    },\n    [monthDays]\n  );\n\n  useIsomorphicEffect(() => {\n    if (startScrollDate) {\n      scrollToDay(startScrollDate);\n    }\n  }, []);\n\n  const expandedEvents = useMemo(\n    () =>\n      expandRecurringEvents({\n        events,\n        rangeStart: dayjs(date).startOf('month').toDate(),\n        rangeEnd: dayjs(date).endOf('month').toDate(),\n        expansionLimit: recurrenceExpansionLimit,\n      }),\n    [events, date, recurrenceExpansionLimit]\n  );\n\n  const { eventsByResourceAndDay, eventLayoutByResource } = useMemo(() => {\n    const eventsByResourceAndDay: Record<string | number, Record<string, ScheduleEventData[]>> = {};\n    for (const resource of resources) {\n      eventsByResourceAndDay[resource.id] = {};\n      for (const day of monthDays) {\n        eventsByResourceAndDay[resource.id][day] = [];\n      }\n    }\n\n    if (expandedEvents) {\n      for (const event of expandedEvents) {\n        if (event.resourceId === undefined || !(event.resourceId in eventsByResourceAndDay)) {\n          continue;\n        }\n\n        const eventStart = dayjs(event.start);\n        const eventEnd = dayjs(event.end);\n\n        for (const day of monthDays) {\n          const dayStart = dayjs(day).startOf('day');\n          const dayEnd = dayjs(day).endOf('day');\n\n          if (eventStart.isBefore(dayEnd) && eventEnd.isAfter(dayStart)) {\n            eventsByResourceAndDay[event.resourceId][day].push(event);\n          }\n        }\n      }\n    }\n\n    const eventLayoutByResource: Record<string | number, ResourcesMonthViewResourceLayout> = {};\n    const monthRangeStart = dayjs(monthDays[0]).startOf('day');\n    const monthEndExclusive = dayjs(monthDays[monthDays.length - 1])\n      .add(1, 'day')\n      .startOf('day');\n\n    for (const resource of resources) {\n      const byDay: Record<string, ResourcesMonthViewCellLayout> = {};\n      const lastRow = new Map<string | number, number>();\n      const rowByEventDay = new Map<string | number, Map<number, number>>();\n      const overlapByEvent = new Map<\n        string | number,\n        { event: ScheduleEventData; days: number[] }\n      >();\n\n      monthDays.forEach((day, dayIndex) => {\n        const dayEvents = eventsByResourceAndDay[resource.id][day];\n        dayEvents.sort(compareCellEvents);\n\n        for (const event of dayEvents) {\n          const overlap = overlapByEvent.get(event.id);\n          if (overlap) {\n            overlap.days.push(dayIndex);\n          } else {\n            overlapByEvent.set(event.id, { event, days: [dayIndex] });\n          }\n        }\n\n        const usedRows = new Set<number>();\n        const visible: ResourcesMonthViewCellLayout['visible'] = [];\n        let hiddenCount = 0;\n\n        for (const event of dayEvents) {\n          let row: number | null | undefined = lastRow.get(event.id);\n\n          if (row === undefined || row >= maxEventsPerTimeSlot || usedRows.has(row)) {\n            row = getFirstAvailableRow(usedRows, maxEventsPerTimeSlot);\n          }\n\n          if (row === null) {\n            hiddenCount += 1;\n            continue;\n          }\n\n          usedRows.add(row);\n          visible.push({ event, row });\n          if (!rowByEventDay.has(event.id)) {\n            rowByEventDay.set(event.id, new Map());\n          }\n          rowByEventDay.get(event.id)!.set(dayIndex, row);\n          lastRow.set(event.id, row);\n        }\n\n        byDay[day] = { visible, hiddenCount };\n      });\n\n      const segments: ResourcesMonthViewSegment[] = [];\n\n      for (const { event, days } of overlapByEvent.values()) {\n        if (!isMultiDayEvent(event)) {\n          continue;\n        }\n\n        const firstOverlap = days[0];\n        const lastOverlap = days[days.length - 1];\n        const rows = rowByEventDay.get(event.id);\n        const extendsBefore = dayjs(event.start).isBefore(monthRangeStart);\n        const extendsAfter = dayjs(event.end).isAfter(monthEndExclusive);\n        let run: { startDayIndex: number; endDayIndex: number; row: number } | null = null;\n\n        const flushRun = () => {\n          if (!run) {\n            return;\n          }\n          const clipStart = run.startDayIndex > firstOverlap;\n          const clipEnd = run.endDayIndex < lastOverlap;\n          const hangStart = !clipStart && extendsBefore;\n          const hangEnd = !clipEnd && extendsAfter;\n          let hiddenInSpan = false;\n          for (let dayIndex = run.startDayIndex; dayIndex <= run.endDayIndex; dayIndex += 1) {\n            if ((byDay[monthDays[dayIndex]]?.hiddenCount ?? 0) > 0) {\n              hiddenInSpan = true;\n              break;\n            }\n          }\n          segments.push({\n            event,\n            startDayIndex: run.startDayIndex,\n            endDayIndex: run.endDayIndex,\n            row: run.row,\n            clipStart,\n            clipEnd,\n            hanging: hangStart && hangEnd ? 'both' : hangStart ? 'start' : hangEnd ? 'end' : 'none',\n            hiddenInSpan,\n          });\n          run = null;\n        };\n\n        for (let dayIndex = firstOverlap; dayIndex <= lastOverlap; dayIndex += 1) {\n          const row = rows?.get(dayIndex);\n\n          if (row === undefined) {\n            flushRun();\n            continue;\n          }\n\n          if (run && run.row === row && run.endDayIndex === dayIndex - 1) {\n            run.endDayIndex = dayIndex;\n          } else {\n            flushRun();\n            run = { startDayIndex: dayIndex, endDayIndex: dayIndex, row };\n          }\n        }\n\n        flushRun();\n      }\n\n      eventLayoutByResource[resource.id] = { byDay, segments };\n    }\n\n    return { eventsByResourceAndDay, eventLayoutByResource };\n  }, [resources, monthDays, expandedEvents, maxEventsPerTimeSlot]);\n\n  type DropTargetCell = { day: string; resourceId: string | number };\n\n  const handleExternalDrop = useCallback(\n    (e: React.DragEvent, target: DropTargetCell) => {\n      if (!onExternalEventDrop) {\n        return;\n      }\n      onExternalEventDrop({\n        dataTransfer: e.dataTransfer,\n        dropDateTime: `${dayjs(target.day).format('YYYY-MM-DD')} 00:00:00`,\n        resourceId: target.resourceId,\n      });\n    },\n    [onExternalEventDrop]\n  );\n\n  const dragDrop = useDragDropHandlers<DropTargetCell>({\n    enabled: withEventsDragAndDrop,\n    mode,\n    onEventDrop: (data) => {\n      onEventDrop?.({ ...data, resourceId: lastDropResourceId.current });\n    },\n    canDragEvent,\n    onEventDragStart,\n    onEventDragEnd,\n    calculateDropTarget: (target: DropTargetCell, draggedEvent: ScheduleEventData) => {\n      lastDropResourceId.current = target.resourceId;\n      return calculateMonthDropDate({ draggedEvent, targetDay: target.day });\n    },\n    onExternalDrop: onExternalEventDrop ? handleExternalDrop : undefined,\n  });\n\n  const lastDropResourceId = useRef<string | number | undefined>(undefined);\n\n  const withDragHandlers = (withEventsDragAndDrop || !!onExternalEventDrop) && mode !== 'static';\n\n  const groupToResourceId = useMemo(() => getGroupToResourceIdMap(resources), [resources]);\n\n  const slotDragSelect = useSlotDragSelect({\n    enabled: withDragSlotSelect && mode !== 'static',\n    onDragEnd: (startIndex, endIndex, group) => {\n      if (!onSlotDragEnd) {\n        return;\n      }\n      const startDay = monthDays[startIndex];\n      const endDay = monthDays[endIndex];\n      if (startDay && endDay) {\n        onSlotDragEnd({\n          rangeStart: dayjs(startDay).startOf('day').format('YYYY-MM-DD HH:mm:ss'),\n          rangeEnd: dayjs(endDay).endOf('day').format('YYYY-MM-DD HH:mm:ss'),\n          resourceId: groupToResourceId.get(group) ?? group,\n        });\n      }\n    },\n  });\n\n  const dayLabels = monthDays.map((day, dayIndex) => {\n    const d = dayjs(day);\n    const weekend = resolvedWeekendDays.includes(d.day() as DayOfWeek);\n    const today = d.isSame(dayjs(), 'day') && highlightToday;\n\n    return (\n      <Box\n        {...getStyles('resourcesMonthViewDayLabel')}\n        key={day}\n        mod={{ weekend, today }}\n        ref={(node) => {\n          dayLabelRefs.current[dayIndex] = node;\n        }}\n      >\n        <span {...getStyles('resourcesMonthViewDayLabelWeekday')}>\n          {formatDate({ date: d, locale: ctx.getLocale(locale), format: weekdayFormat })}\n        </span>\n        <span {...getStyles('resourcesMonthViewDayLabelNumber')}>{d.date()}</span>\n      </Box>\n    );\n  });\n\n  const cellsRef = useRef<HTMLButtonElement[][]>([]);\n\n  const getDayIndexFromDragPoint = useCallback((event: React.DragEvent, resourceIndex: number) => {\n    return getIndexFromDragPoint(cellsRef.current[resourceIndex] ?? [], event.clientX);\n  }, []);\n\n  const handleCellKeyDown = (\n    event: React.KeyboardEvent<HTMLButtonElement>,\n    resourceIndex: number,\n    dayIndex: number\n  ) => {\n    const key = event.key;\n    let nextResourceIndex = resourceIndex;\n    let nextDayIndex = dayIndex;\n\n    if (key === 'ArrowRight') {\n      nextDayIndex = Math.min(dayIndex + 1, monthDays.length - 1);\n    } else if (key === 'ArrowLeft') {\n      nextDayIndex = Math.max(dayIndex - 1, 0);\n    } else if (key === 'ArrowDown') {\n      nextResourceIndex = Math.min(resourceIndex + 1, resources.length - 1);\n    } else if (key === 'ArrowUp') {\n      nextResourceIndex = Math.max(resourceIndex - 1, 0);\n    } else {\n      return;\n    }\n\n    event.preventDefault();\n    cellsRef.current[nextResourceIndex]?.[nextDayIndex]?.focus();\n  };\n\n  const rowHeightPercent = 100 / maxEventsPerTimeSlot;\n\n  const rows = orderedResources.map((resource, resourceIndex) => {\n    if (!cellsRef.current[resourceIndex]) {\n      cellsRef.current[resourceIndex] = [];\n    }\n\n    const slotGroup = String(resource.id);\n    const dropTarget = dragDrop.dropTarget;\n\n    const totalDays = monthDays.length;\n    const eventNodes: React.ReactNode[] = [];\n    const moreNodes: React.ReactNode[] = [];\n\n    const cells = monthDays.map((day, dayIndex) => {\n      const d = dayjs(day);\n      const weekend = ctx.getWeekendDays(weekendDays).includes(d.day() as DayOfWeek);\n      const isDropTarget =\n        dropTarget !== null &&\n        typeof dropTarget === 'object' &&\n        'day' in dropTarget &&\n        (dropTarget as DropTargetCell).day === day &&\n        (dropTarget as DropTargetCell).resourceId === resource.id;\n      const isDragSelected = slotDragSelect.isSlotSelected(dayIndex, slotGroup);\n      const dayEvents = eventsByResourceAndDay[resource.id]?.[day] || [];\n      const layout = eventLayoutByResource[resource.id]?.byDay[day];\n      const visibleEvents = layout?.visible ?? [];\n      const hiddenEventsCount = layout?.hiddenCount ?? 0;\n      const isFirstCell = resourceIndex === 0 && dayIndex === 0;\n      const dayLeftPercent = (dayIndex / totalDays) * 100;\n      const dayWidthPercent = 100 / totalDays;\n\n      const hasHiddenEvents = hiddenEventsCount > 0 && mode !== 'static';\n\n      visibleEvents.forEach(({ event, row }) => {\n        if (isMultiDayEvent(event)) {\n          return;\n        }\n\n        const isDraggable = dragDrop.isDraggableEvent(event);\n        const topValue = hasHiddenEvents\n          ? `calc((100% - 18px) * ${row} / ${maxEventsPerTimeSlot} + 1px)`\n          : `calc(${row * rowHeightPercent}% + 1px)`;\n        const heightValue = hasHiddenEvents\n          ? `calc((100% - 18px) / ${maxEventsPerTimeSlot} - 2px)`\n          : `calc(${rowHeightPercent}% - 2px)`;\n\n        eventNodes.push(\n          <ScheduleEvent\n            key={`${event.id}-${day}`}\n            event={event}\n            nowrap\n            autoSize\n            size=\"sm\"\n            draggable={isDraggable}\n            renderEventBody={renderEventBody}\n            renderEvent={renderEvent}\n            radius={radius}\n            mode={mode}\n            onClick={onEventClick ? (e) => onEventClick(event, e) : undefined}\n            style={{\n              position: 'absolute',\n              top: topValue,\n              left: `calc(${dayLeftPercent}% + 1px)`,\n              width: `calc(${dayWidthPercent}% - 2px)`,\n              height: heightValue,\n              zIndex: 3,\n            }}\n          />\n        );\n      });\n\n      if (hiddenEventsCount > 0 && mode !== 'static') {\n        moreNodes.push(\n          <MoreEvents\n            key={`more-${resource.id}-${day}`}\n            events={dayEvents}\n            moreEventsCount={hiddenEventsCount}\n            mode={mode}\n            labels={labels}\n            renderEventBody={renderEventBody}\n            renderEvent={renderEvent}\n            onEventClick={onEventClick}\n            style={{\n              position: 'absolute',\n              bottom: 1,\n              left: `calc(${dayLeftPercent}% + 1px)`,\n              width: `calc(${dayWidthPercent}% - 2px)`,\n              height: 18,\n              zIndex: 4,\n            }}\n            {...stylesApiProps}\n            {...moreEventsProps}\n          />\n        );\n      }\n\n      return (\n        <UnstyledButton\n          key={day}\n          ref={(node) => {\n            if (node) {\n              if (!cellsRef.current[resourceIndex]) {\n                cellsRef.current[resourceIndex] = [];\n              }\n              cellsRef.current[resourceIndex][dayIndex] = node;\n            }\n          }}\n          {...getStyles('resourcesMonthViewCell')}\n          aria-label={`${resource.label} ${d.format('MMMM D, YYYY')}`}\n          data-drag-slot-index={withDragSlotSelect && mode !== 'static' ? dayIndex : undefined}\n          data-drag-slot-group={withDragSlotSelect && mode !== 'static' ? slotGroup : undefined}\n          mod={{\n            weekend,\n            'drop-target': isDropTarget,\n            'drag-selected': isDragSelected,\n            static: mode === 'static',\n          }}\n          tabIndex={mode === 'static' ? -1 : isFirstCell ? 0 : -1}\n          onClick={\n            mode === 'static'\n              ? undefined\n              : (e) => onDayClick?.({ date: day, nativeEvent: e, resourceId: resource.id })\n          }\n          onKeyDown={\n            mode === 'static' ? undefined : (e) => handleCellKeyDown(e, resourceIndex, dayIndex)\n          }\n          onPointerDown={\n            withDragSlotSelect && mode !== 'static'\n              ? (e) =>\n                  slotDragSelect.handleSlotPointerDown(\n                    e as React.PointerEvent<HTMLButtonElement>,\n                    dayIndex,\n                    slotGroup\n                  )\n              : undefined\n          }\n          onDragOver={withDragHandlers ? (e) => e.preventDefault() : undefined}\n        />\n      );\n    });\n\n    const resourceSegments = eventLayoutByResource[resource.id]?.segments ?? [];\n\n    resourceSegments.forEach((segment) => {\n      const isDraggable = dragDrop.isDraggableEvent(segment.event);\n      const segmentLeftPercent = (segment.startDayIndex / totalDays) * 100;\n      const segmentWidthPercent =\n        ((segment.endDayIndex - segment.startDayIndex + 1) / totalDays) * 100;\n      const compressed = segment.hiddenInSpan && mode !== 'static';\n      const topValue = compressed\n        ? `calc((100% - 18px) * ${segment.row} / ${maxEventsPerTimeSlot} + 1px)`\n        : `calc(${segment.row * rowHeightPercent}% + 1px)`;\n      const heightValue = compressed\n        ? `calc((100% - 18px) / ${maxEventsPerTimeSlot} - 2px)`\n        : `calc(${rowHeightPercent}% - 2px)`;\n\n      eventNodes.push(\n        <ScheduleEvent\n          key={`${segment.event.id}-segment-${segment.startDayIndex}`}\n          event={segment.event}\n          nowrap\n          autoSize\n          size=\"sm\"\n          hanging={segment.hanging}\n          draggable={isDraggable}\n          renderEventBody={renderEventBody}\n          renderEvent={renderEvent}\n          radius={radius}\n          mode={mode}\n          mod={{ 'clip-start': segment.clipStart, 'clip-end': segment.clipEnd }}\n          onClick={onEventClick ? (e) => onEventClick(segment.event, e) : undefined}\n          style={{\n            position: 'absolute',\n            top: topValue,\n            left: `calc(${segmentLeftPercent}% + 1px)`,\n            width: `calc(${segmentWidthPercent}% - 2px)`,\n            height: heightValue,\n            zIndex: 3,\n          }}\n        />\n      );\n    });\n\n    const groupInfo = hasGroups ? resourceGroupMap[resourceIndex] : undefined;\n    const isGroupStart = groupInfo?.position === 'first' || groupInfo?.position === 'only';\n\n    const groupCell =\n      groupInfo !== undefined ? (\n        groupInfo !== null ? (\n          <Box\n            {...getStyles('resourcesMonthViewGroupColumn')}\n            mod={{ 'group-position': groupInfo.position }}\n          >\n            {isGroupStart && (\n              <span\n                style={\n                  groupInfo.count > 1\n                    ? {\n                        transform: `translateY(calc((${groupInfo.count - 1} * (var(--resources-month-view-row-height) + 1px)) / 2))`,\n                      }\n                    : undefined\n                }\n              >\n                {renderGroupLabel ? renderGroupLabel(groupInfo.group) : groupInfo.group.label}\n              </span>\n            )}\n          </Box>\n        ) : (\n          <Box {...getStyles('resourcesMonthViewGroupColumnEmpty')} />\n        )\n      ) : null;\n\n    return (\n      <div {...getStyles('resourcesMonthViewRow')} key={resource.id}>\n        {groupCell}\n        <div\n          {...getStyles('resourcesMonthViewResourceLabel')}\n          data-has-groups={hasGroups || undefined}\n        >\n          {renderResourceLabel ? renderResourceLabel(resource) : resource.label}\n        </div>\n        <div\n          {...getStyles('resourcesMonthViewRowSlots')}\n          onDragOver={\n            withDragHandlers\n              ? (e) => {\n                  const dayIndex = getDayIndexFromDragPoint(e, resourceIndex);\n                  if (dayIndex !== null && monthDays[dayIndex]) {\n                    dragDrop.handleDragOver(e, {\n                      day: monthDays[dayIndex],\n                      resourceId: resource.id,\n                    });\n                  }\n                }\n              : undefined\n          }\n          onDragLeave={withDragHandlers ? dragDrop.handleDragLeave : undefined}\n          onDrop={\n            withDragHandlers\n              ? (e) => {\n                  const dayIndex = getDayIndexFromDragPoint(e, resourceIndex);\n                  if (dayIndex !== null && monthDays[dayIndex]) {\n                    dragDrop.handleDrop(e, {\n                      day: monthDays[dayIndex],\n                      resourceId: resource.id,\n                    });\n                  }\n                }\n              : undefined\n          }\n        >\n          {eventNodes}\n          {moreNodes}\n          {cells}\n        </div>\n      </div>\n    );\n  });\n\n  const content = (\n    <Box\n      mod={[\n        {\n          static: mode === 'static',\n          'slot-dragging': slotDragSelect.isDragging,\n          'event-interaction': dragDrop.dragContextValue.isDragging,\n        },\n        mod,\n      ]}\n      {...getStyles('resourcesMonthView')}\n      {...others}\n    >\n      {withHeader && (\n        <ScheduleHeaderBase\n          view=\"month\"\n          navigationHandlers={{\n            previous: () => toDateString(dayjs(date).subtract(1, 'month').startOf('month')),\n            next: () => toDateString(dayjs(date).add(1, 'month').startOf('month')),\n            today: () => {\n              requestAnimationFrame(() => {\n                scrollToDay(dayjs().format('YYYY-MM-DD'));\n              });\n              return toDateString(dayjs());\n            },\n          }}\n          control={{\n            monthYearSelect: {\n              locale,\n              yearValue: dayjs(date).get('year'),\n              monthValue: dayjs(date).get('month'),\n              onYearChange: (year) =>\n                onDateChange?.(toDateString(dayjs(date).set('year', year).startOf('month'))),\n              onMonthChange: (month) =>\n                onDateChange?.(toDateString(dayjs(date).set('month', month).startOf('month'))),\n              ...monthYearSelectProps,\n            },\n          }}\n          labels={labels}\n          onDateChange={onDateChange}\n          onViewChange={onViewChange}\n          previousControlProps={previousControlProps}\n          nextControlProps={nextControlProps}\n          todayControlProps={todayControlProps}\n          viewSelectProps={{ views: ['day', 'week', 'month'] as const, ...viewSelectProps }}\n          stylesApiProps={stylesApiProps}\n        />\n      )}\n\n      <Box {...getStyles('resourcesMonthViewRoot')}>\n        <ScrollArea\n          scrollbars=\"x\"\n          scrollbarSize={4}\n          {...scrollAreaProps}\n          {...getStyles('resourcesMonthViewScrollArea', {\n            className: scrollAreaProps?.className,\n            style: scrollAreaProps?.style,\n          })}\n          viewportRef={mergedViewportRef}\n        >\n          <div {...getStyles('resourcesMonthViewInner')}>\n            <div {...getStyles('resourcesMonthViewDayLabelsRow')}>\n              <div\n                {...getStyles('resourcesMonthViewCorner')}\n                key=\"corner\"\n                ref={resourceLabelRef}\n                style={\n                  hasGroups\n                    ? {\n                        flexBasis:\n                          'calc(var(--resources-month-view-resource-label-width) + var(--resources-month-view-group-label-width))',\n                        minWidth:\n                          'calc(var(--resources-month-view-resource-label-width) + var(--resources-month-view-group-label-width))',\n                      }\n                    : undefined\n                }\n              >\n                {getLabel('resources', labels)}\n              </div>\n              {dayLabels}\n            </div>\n\n            {rows}\n          </div>\n        </ScrollArea>\n      </Box>\n    </Box>\n  );\n\n  if (withEventsDragAndDrop) {\n    return <DragContext.Provider value={dragDrop.dragContextValue}>{content}</DragContext.Provider>;\n  }\n\n  return content;\n});\n\nResourcesMonthView.displayName = '@mantine/schedule/ResourcesMonthView';\nResourcesMonthView.classes = classes;\nResourcesMonthView.varsResolver = varsResolver;\n"],"mappings":"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"}
+{"version":3,"file":"ResourcesMonthView.mjs","names":["classes"],"sources":["../../../src/components/ResourcesMonthView/ResourcesMonthView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport { useCallback, useMemo, useRef } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  DataAttributes,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  MantineRadius,\n  rem,\n  ScrollArea,\n  ScrollAreaProps,\n  StylesApiProps,\n  UnstyledButton,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useIsomorphicEffect, useMergedRef } from '@mantine/hooks';\nimport { useDayGridEventResize } from '../../hooks/use-day-grid-event-resize';\nimport { useDragDropHandlers } from '../../hooks/use-drag-drop-handlers';\nimport { useSlotDragSelect } from '../../hooks/use-slot-drag-select';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport {\n  DateLabelFormat,\n  DateStringValue,\n  DateTimeStringValue,\n  DayOfWeek,\n  ScheduleEventData,\n  ScheduleMode,\n  ScheduleResourceData,\n  ScheduleResourceGroup,\n  ScheduleViewLevel,\n} from '../../types';\nimport {\n  calculateMonthDropDate,\n  expandRecurringEvents,\n  formatDate,\n  getGroupToResourceIdMap,\n  getIndexFromDragPoint,\n  getOrderedResources,\n  toDateString,\n} from '../../utils';\nimport { DragContext } from '../DragContext/DragContext';\nimport { MoreEvents, MoreEventsProps, MoreEventsStylesNames } from '../MoreEvents/MoreEvents';\nimport { RenderEvent, RenderEventBody, ScheduleEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { MonthYearSelectProps } from '../ScheduleHeader/MonthYearSelect/MonthYearSelect';\nimport { CombinedScheduleHeaderStylesNames } from '../ScheduleHeader/ScheduleHeader';\nimport { ScheduleHeaderBase } from '../ScheduleHeader/ScheduleHeaderBase';\nimport { ViewSelectProps } from '../ScheduleHeader/ViewSelect/ViewSelect';\nimport classes from './ResourcesMonthView.module.css';\n\nexport type ResourcesMonthViewStylesNames =\n  | 'resourcesMonthView'\n  | 'resourcesMonthViewRoot'\n  | 'resourcesMonthViewScrollArea'\n  | 'resourcesMonthViewDayLabelsRow'\n  | 'resourcesMonthViewCorner'\n  | 'resourcesMonthViewDayLabel'\n  | 'resourcesMonthViewDayLabelWeekday'\n  | 'resourcesMonthViewDayLabelNumber'\n  | 'resourcesMonthViewRow'\n  | 'resourcesMonthViewResourceLabel'\n  | 'resourcesMonthViewRowSlots'\n  | 'resourcesMonthViewCell'\n  | 'resourcesMonthViewEventWrapper'\n  | 'resourcesMonthViewResizeHandle'\n  | 'resourcesMonthViewInner'\n  | 'resourcesMonthViewGroupColumn'\n  | 'resourcesMonthViewGroupColumnEmpty'\n  | MoreEventsStylesNames\n  | CombinedScheduleHeaderStylesNames;\n\nexport type ResourcesMonthViewCssVariables = {\n  resourcesMonthView:\n    | '--resources-month-view-radius'\n    | '--resources-month-view-day-width'\n    | '--resources-month-view-row-height'\n    | '--resources-month-view-group-label-width';\n};\n\nexport interface ResourcesMonthViewProps\n  extends BoxProps, StylesApiProps<ResourcesMonthViewFactory>, ElementProps<'div'> {\n  __staticSelector?: string;\n\n  /** Date to display, Date object or date string in `YYYY-MM-DD` format */\n  date: Date | string;\n\n  /** Called with the new date value when a date is selected */\n  onDateChange?: (value: DateStringValue) => void;\n\n  /** List of resources to display as rows */\n  resources: ScheduleResourceData[];\n\n  /** Locale passed down to dayjs */\n  locale?: string;\n\n  /** `dayjs` format for weekdays in day column headers @default 'dd' */\n  weekdayFormat?: DateLabelFormat;\n\n  /** Indices of weekend days */\n  weekendDays?: DayOfWeek[];\n\n  /** If set to false, weekend days are hidden @default true */\n  withWeekendDays?: boolean;\n\n  /** Date to scroll to on initial render, in `YYYY-MM-DD` format */\n  startScrollDate?: string;\n\n  /** Called when a cell is clicked, includes resourceId */\n  onDayClick?: (data: {\n    date: DateStringValue;\n    nativeEvent: React.MouseEvent<HTMLButtonElement>;\n    resourceId?: string | number;\n  }) => void;\n\n  /** If set, highlights the current day @default true */\n  highlightToday?: boolean;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n  radius?: MantineRadius;\n\n  /** If set, the header is displayed @default true */\n  withHeader?: boolean;\n\n  /** Props passed down to `MonthYearSelect` component */\n  monthYearSelectProps?: Partial<MonthYearSelectProps>;\n\n  /** Called when view level select button is clicked */\n  onViewChange?: (view: ScheduleViewLevel) => void;\n\n  /** Props passed to previous control */\n  previousControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n  /** Props passed to next control */\n  nextControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n  /** Props passed to today control */\n  todayControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n  /** Props passed to view level select */\n  viewSelectProps?: Partial<ViewSelectProps> & DataAttributes;\n\n  /** Events to display */\n  events?: ScheduleEventData[];\n\n  /** Width of each day column @default 40px */\n  dayWidth?: React.CSSProperties['width'];\n\n  /** Height of each resource row @default 48px */\n  rowHeight?: React.CSSProperties['height'];\n\n  /** Function to customize event body */\n  renderEventBody?: RenderEventBody;\n\n  /** Function to fully customize event rendering */\n  renderEvent?: RenderEvent;\n\n  /** Function to customize resource label rendering */\n  renderResourceLabel?: (resource: ScheduleResourceData) => React.ReactNode;\n\n  /** List of resource groups to display as a column to the left of resource labels */\n  groups?: ScheduleResourceGroup[];\n\n  /** Function to customize group label rendering */\n  renderGroupLabel?: (group: ScheduleResourceGroup) => React.ReactNode;\n\n  /** Width of the group label column @default 80px */\n  groupLabelWidth?: React.CSSProperties['width'];\n\n  /** If true, events can be dragged and dropped @default false */\n  withEventsDragAndDrop?: boolean;\n\n  /** Called when event is dropped, includes target resourceId */\n  onEventDrop?: (data: {\n    eventId: string | number;\n    newStart: DateTimeStringValue;\n    newEnd: DateTimeStringValue;\n    event: ScheduleEventData;\n    resourceId?: string | number;\n  }) => void;\n\n  /** Function to determine if event can be dragged */\n  canDragEvent?: (event: ScheduleEventData) => boolean;\n\n  /** Called when any event drag starts */\n  onEventDragStart?: (event: ScheduleEventData) => void;\n\n  /** Called when any event drag ends */\n  onEventDragEnd?: () => void;\n\n  /** If true, events can be resized by dragging their start and end edges, resizing snaps to whole days @default false */\n  withEventResize?: boolean;\n\n  /** Called when event is resized */\n  onEventResize?: (data: {\n    eventId: string | number;\n    newStart: DateTimeStringValue;\n    newEnd: DateTimeStringValue;\n    event: ScheduleEventData;\n  }) => void;\n\n  /** Function to determine if event can be resized */\n  canResizeEvent?: (event: ScheduleEventData) => boolean;\n\n  /** Called when event is clicked */\n  onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n\n  /** If set, enables drag-to-select day ranges @default false */\n  withDragSlotSelect?: boolean;\n\n  /** Called when a day range is selected by dragging, includes resourceId */\n  onSlotDragEnd?: (data: {\n    rangeStart: DateTimeStringValue;\n    rangeEnd: DateTimeStringValue;\n    resourceId?: string | number;\n  }) => void;\n\n  /** Labels override for i18n */\n  labels?: ScheduleLabelsOverride;\n\n  /** Interaction mode @default default */\n  mode?: ScheduleMode;\n\n  /** Props passed down to `ScrollArea` component */\n  scrollAreaProps?: Partial<ScrollAreaProps> & DataAttributes;\n\n  /** Called when an external item is dropped */\n  onExternalEventDrop?: (data: {\n    dataTransfer: DataTransfer;\n    dropDateTime: DateTimeStringValue;\n    resourceId?: string | number;\n  }) => void;\n\n  /** Maximum number of events visible per cell before \"+more\" indicator @default 2 */\n  maxEventsPerTimeSlot?: number;\n\n  /** Props passed down to `MoreEvents` component */\n  moreEventsProps?: Partial<MoreEventsProps>;\n\n  /** Max number of generated recurring instances @default 2000 */\n  recurrenceExpansionLimit?: number;\n}\n\nexport type ResourcesMonthViewFactory = Factory<{\n  props: ResourcesMonthViewProps;\n  ref: HTMLDivElement;\n  stylesNames: ResourcesMonthViewStylesNames;\n  vars: ResourcesMonthViewCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<ResourcesMonthViewFactory>(\n  (_theme, { radius, dayWidth, rowHeight, groupLabelWidth }) => ({\n    resourcesMonthView: {\n      '--resources-month-view-radius': radius ? getRadius(radius) : undefined,\n      '--resources-month-view-day-width': rem(dayWidth),\n      '--resources-month-view-row-height': rem(rowHeight),\n      '--resources-month-view-group-label-width': rem(groupLabelWidth),\n    },\n  })\n);\n\nconst defaultProps = {\n  __staticSelector: 'ResourcesMonthView',\n  highlightToday: true,\n  withHeader: true,\n  weekdayFormat: 'ddd',\n  withWeekendDays: true,\n  withEventsDragAndDrop: false,\n  withDragSlotSelect: false,\n  withEventResize: false,\n  mode: 'default',\n} satisfies Partial<ResourcesMonthViewProps>;\n\nfunction compareCellEvents(a: ScheduleEventData, b: ScheduleEventData): number {\n  const aStart = dayjs(a.start);\n  const bStart = dayjs(b.start);\n  const aSpan = dayjs(a.end).startOf('day').diff(aStart.startOf('day'), 'day');\n  const bSpan = dayjs(b.end).startOf('day').diff(bStart.startOf('day'), 'day');\n\n  if (aSpan !== bSpan) {\n    return bSpan - aSpan;\n  }\n\n  return aStart.valueOf() - bStart.valueOf();\n}\n\nfunction getFirstAvailableRow(usedRows: Set<number>, maxRows: number): number | null {\n  for (let row = 0; row < maxRows; row += 1) {\n    if (!usedRows.has(row)) {\n      return row;\n    }\n  }\n\n  return null;\n}\n\ninterface ResourcesMonthViewCellLayout {\n  visible: { event: ScheduleEventData; row: number }[];\n  hiddenCount: number;\n}\n\ninterface ResourcesMonthViewSegment {\n  event: ScheduleEventData;\n  startDayIndex: number;\n  endDayIndex: number;\n  row: number;\n  clipStart: boolean;\n  clipEnd: boolean;\n  hanging: 'start' | 'end' | 'both' | 'none';\n\n  /** True when any day the segment covers shows a \"+N more\" indicator (those days compress rows) */\n  hiddenInSpan: boolean;\n}\n\ninterface ResourcesMonthViewResourceLayout {\n  byDay: Record<string, ResourcesMonthViewCellLayout>;\n  segments: ResourcesMonthViewSegment[];\n}\n\nfunction isMultiDayEvent(event: ScheduleEventData): boolean {\n  return dayjs(event.end).startOf('day').isAfter(dayjs(event.start).startOf('day'));\n}\n\nexport const ResourcesMonthView = factory<ResourcesMonthViewFactory>((_props) => {\n  const props = useProps('ResourcesMonthView', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    mod,\n    date,\n    onDateChange,\n    resources,\n    locale,\n    weekdayFormat,\n    weekendDays,\n    withWeekendDays,\n    startScrollDate,\n    __staticSelector,\n    onDayClick,\n    highlightToday,\n    radius,\n    withHeader,\n    monthYearSelectProps,\n    onViewChange,\n    todayControlProps,\n    nextControlProps,\n    previousControlProps,\n    viewSelectProps,\n    events,\n    dayWidth,\n    rowHeight,\n    renderResourceLabel,\n    groups,\n    renderGroupLabel,\n    groupLabelWidth,\n    renderEventBody,\n    renderEvent,\n    withEventsDragAndDrop,\n    onEventDrop,\n    canDragEvent,\n    onEventDragStart,\n    onEventDragEnd,\n    withEventResize,\n    onEventResize,\n    canResizeEvent,\n    onEventClick,\n    withDragSlotSelect,\n    onSlotDragEnd,\n    labels,\n    mode,\n    scrollAreaProps,\n    onExternalEventDrop,\n    maxEventsPerTimeSlot: _maxEventsPerTimeSlot,\n    moreEventsProps,\n    recurrenceExpansionLimit,\n    ...others\n  } = props;\n\n  const maxEventsPerTimeSlot = Math.min(10, Math.max(1, _maxEventsPerTimeSlot ?? 2));\n\n  const getStyles = useStyles<ResourcesMonthViewFactory>({\n    name: __staticSelector,\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n    rootSelector: 'resourcesMonthView',\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<ResourcesMonthViewFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const stylesApiProps = {\n    classNames: resolvedClassNames,\n    styles: resolvedStyles,\n    attributes,\n    __staticSelector,\n    radius,\n  };\n\n  const theme = useMantineTheme();\n  const ctx = useDatesContext();\n  const resolvedWeekendDays = ctx.getWeekendDays(weekendDays);\n  const { orderedResources, groupRanges, resourceGroupMap } = useMemo(\n    () => getOrderedResources(resources, groups),\n    [resources, groups]\n  );\n  const hasGroups = groupRanges.length > 0;\n\n  const monthDays = useMemo(() => {\n    const start = dayjs(date).startOf('month');\n    const daysCount = start.endOf('month').date();\n    const weekendDayList = ctx.getWeekendDays(weekendDays);\n    const days: string[] = [];\n    for (let d = 1; d <= daysCount; d++) {\n      const day = start.date(d);\n      if (!withWeekendDays && weekendDayList.includes(day.day() as DayOfWeek)) {\n        continue;\n      }\n      days.push(day.format('YYYY-MM-DD'));\n    }\n    return days;\n  }, [date, withWeekendDays, weekendDays, ctx]);\n\n  const viewportRef = useRef<HTMLDivElement>(null);\n  const mergedViewportRef = useMergedRef(viewportRef, scrollAreaProps?.viewportRef);\n  const dayLabelRefs = useRef<(HTMLDivElement | null)[]>([]);\n\n  const resourceLabelRef = useRef<HTMLDivElement>(null);\n\n  const scrollToDay = useCallback(\n    (targetDate: string) => {\n      if (!viewportRef.current) {\n        return;\n      }\n      const targetIndex = monthDays.indexOf(targetDate);\n      if (targetIndex < 0) {\n        return;\n      }\n      const targetLabel = dayLabelRefs.current[targetIndex];\n      if (!targetLabel) {\n        return;\n      }\n      const labelRect = targetLabel.getBoundingClientRect();\n      const viewportRect = viewportRef.current.getBoundingClientRect();\n      const labelWidth = resourceLabelRef.current?.getBoundingClientRect().width ?? 0;\n      viewportRef.current.scrollTo({\n        left: labelRect.left - viewportRect.left - labelWidth,\n        top: 0,\n      });\n    },\n    [monthDays]\n  );\n\n  useIsomorphicEffect(() => {\n    if (startScrollDate) {\n      scrollToDay(startScrollDate);\n    }\n  }, []);\n\n  const expandedEvents = useMemo(\n    () =>\n      expandRecurringEvents({\n        events,\n        rangeStart: dayjs(date).startOf('month').toDate(),\n        rangeEnd: dayjs(date).endOf('month').toDate(),\n        expansionLimit: recurrenceExpansionLimit,\n      }),\n    [events, date, recurrenceExpansionLimit]\n  );\n\n  const monthDaySet = useMemo(() => new Set(monthDays), [monthDays]);\n\n  const eventResize = useDayGridEventResize({\n    enabled: withEventResize,\n    mode,\n    onEventResize,\n    canResizeEvent,\n  });\n\n  const { resizingEventId, previewStart, previewEnd } = eventResize;\n\n  const layoutEvents = useMemo(() => {\n    if (resizingEventId === null || previewStart === null || previewEnd === null) {\n      return expandedEvents;\n    }\n\n    return expandedEvents.map((event) =>\n      event.id === resizingEventId ? { ...event, start: previewStart, end: previewEnd } : event\n    );\n  }, [expandedEvents, resizingEventId, previewStart, previewEnd]);\n\n  const { eventsByResourceAndDay, eventLayoutByResource } = useMemo(() => {\n    const eventsByResourceAndDay: Record<string | number, Record<string, ScheduleEventData[]>> = {};\n    for (const resource of resources) {\n      eventsByResourceAndDay[resource.id] = {};\n      for (const day of monthDays) {\n        eventsByResourceAndDay[resource.id][day] = [];\n      }\n    }\n\n    if (layoutEvents) {\n      for (const event of layoutEvents) {\n        if (event.resourceId === undefined || !(event.resourceId in eventsByResourceAndDay)) {\n          continue;\n        }\n\n        const eventStart = dayjs(event.start);\n        const eventEnd = dayjs(event.end);\n\n        for (const day of monthDays) {\n          const dayStart = dayjs(day).startOf('day');\n          const dayEnd = dayjs(day).endOf('day');\n\n          if (eventStart.isBefore(dayEnd) && eventEnd.isAfter(dayStart)) {\n            eventsByResourceAndDay[event.resourceId][day].push(event);\n          }\n        }\n      }\n    }\n\n    const eventLayoutByResource: Record<string | number, ResourcesMonthViewResourceLayout> = {};\n    const monthRangeStart = dayjs(monthDays[0]).startOf('day');\n    const monthEndExclusive = dayjs(monthDays[monthDays.length - 1])\n      .add(1, 'day')\n      .startOf('day');\n\n    for (const resource of resources) {\n      const byDay: Record<string, ResourcesMonthViewCellLayout> = {};\n      const lastRow = new Map<string | number, number>();\n      const rowByEventDay = new Map<string | number, Map<number, number>>();\n      const overlapByEvent = new Map<\n        string | number,\n        { event: ScheduleEventData; days: number[] }\n      >();\n\n      monthDays.forEach((day, dayIndex) => {\n        const dayEvents = eventsByResourceAndDay[resource.id][day];\n        dayEvents.sort(compareCellEvents);\n\n        for (const event of dayEvents) {\n          const overlap = overlapByEvent.get(event.id);\n          if (overlap) {\n            overlap.days.push(dayIndex);\n          } else {\n            overlapByEvent.set(event.id, { event, days: [dayIndex] });\n          }\n        }\n\n        const usedRows = new Set<number>();\n        const visible: ResourcesMonthViewCellLayout['visible'] = [];\n        let hiddenCount = 0;\n\n        for (const event of dayEvents) {\n          let row: number | null | undefined = lastRow.get(event.id);\n\n          if (row === undefined || row >= maxEventsPerTimeSlot || usedRows.has(row)) {\n            row = getFirstAvailableRow(usedRows, maxEventsPerTimeSlot);\n          }\n\n          if (row === null) {\n            hiddenCount += 1;\n            continue;\n          }\n\n          usedRows.add(row);\n          visible.push({ event, row });\n          if (!rowByEventDay.has(event.id)) {\n            rowByEventDay.set(event.id, new Map());\n          }\n          rowByEventDay.get(event.id)!.set(dayIndex, row);\n          lastRow.set(event.id, row);\n        }\n\n        byDay[day] = { visible, hiddenCount };\n      });\n\n      const segments: ResourcesMonthViewSegment[] = [];\n\n      for (const { event, days } of overlapByEvent.values()) {\n        if (!isMultiDayEvent(event)) {\n          continue;\n        }\n\n        const firstOverlap = days[0];\n        const lastOverlap = days[days.length - 1];\n        const rows = rowByEventDay.get(event.id);\n        const extendsBefore = dayjs(event.start).isBefore(monthRangeStart);\n        const extendsAfter = dayjs(event.end).isAfter(monthEndExclusive);\n        let run: { startDayIndex: number; endDayIndex: number; row: number } | null = null;\n\n        const flushRun = () => {\n          if (!run) {\n            return;\n          }\n          const clipStart = run.startDayIndex > firstOverlap;\n          const clipEnd = run.endDayIndex < lastOverlap;\n          const hangStart = !clipStart && extendsBefore;\n          const hangEnd = !clipEnd && extendsAfter;\n          let hiddenInSpan = false;\n          for (let dayIndex = run.startDayIndex; dayIndex <= run.endDayIndex; dayIndex += 1) {\n            if ((byDay[monthDays[dayIndex]]?.hiddenCount ?? 0) > 0) {\n              hiddenInSpan = true;\n              break;\n            }\n          }\n          segments.push({\n            event,\n            startDayIndex: run.startDayIndex,\n            endDayIndex: run.endDayIndex,\n            row: run.row,\n            clipStart,\n            clipEnd,\n            hanging: hangStart && hangEnd ? 'both' : hangStart ? 'start' : hangEnd ? 'end' : 'none',\n            hiddenInSpan,\n          });\n          run = null;\n        };\n\n        for (let dayIndex = firstOverlap; dayIndex <= lastOverlap; dayIndex += 1) {\n          const row = rows?.get(dayIndex);\n\n          if (row === undefined) {\n            flushRun();\n            continue;\n          }\n\n          if (run && run.row === row && run.endDayIndex === dayIndex - 1) {\n            run.endDayIndex = dayIndex;\n          } else {\n            flushRun();\n            run = { startDayIndex: dayIndex, endDayIndex: dayIndex, row };\n          }\n        }\n\n        flushRun();\n      }\n\n      eventLayoutByResource[resource.id] = { byDay, segments };\n    }\n\n    return { eventsByResourceAndDay, eventLayoutByResource };\n  }, [resources, monthDays, layoutEvents, maxEventsPerTimeSlot]);\n\n  type DropTargetCell = { day: string; resourceId: string | number };\n\n  const handleExternalDrop = useCallback(\n    (e: React.DragEvent, target: DropTargetCell) => {\n      if (!onExternalEventDrop) {\n        return;\n      }\n      onExternalEventDrop({\n        dataTransfer: e.dataTransfer,\n        dropDateTime: `${dayjs(target.day).format('YYYY-MM-DD')} 00:00:00`,\n        resourceId: target.resourceId,\n      });\n    },\n    [onExternalEventDrop]\n  );\n\n  const dragDrop = useDragDropHandlers<DropTargetCell>({\n    enabled: withEventsDragAndDrop,\n    mode,\n    onEventDrop: (data) => {\n      onEventDrop?.({ ...data, resourceId: lastDropResourceId.current });\n    },\n    canDragEvent,\n    onEventDragStart,\n    onEventDragEnd,\n    calculateDropTarget: (target: DropTargetCell, draggedEvent: ScheduleEventData) => {\n      lastDropResourceId.current = target.resourceId;\n      return calculateMonthDropDate({ draggedEvent, targetDay: target.day });\n    },\n    onExternalDrop: onExternalEventDrop ? handleExternalDrop : undefined,\n  });\n\n  const lastDropResourceId = useRef<string | number | undefined>(undefined);\n\n  const withDragHandlers = (withEventsDragAndDrop || !!onExternalEventDrop) && mode !== 'static';\n\n  const groupToResourceId = useMemo(() => getGroupToResourceIdMap(resources), [resources]);\n\n  const slotDragSelect = useSlotDragSelect({\n    enabled: withDragSlotSelect && mode !== 'static',\n    onDragEnd: (startIndex, endIndex, group) => {\n      if (!onSlotDragEnd) {\n        return;\n      }\n      const startDay = monthDays[startIndex];\n      const endDay = monthDays[endIndex];\n      if (startDay && endDay) {\n        onSlotDragEnd({\n          rangeStart: dayjs(startDay).startOf('day').format('YYYY-MM-DD HH:mm:ss'),\n          rangeEnd: dayjs(endDay).endOf('day').format('YYYY-MM-DD HH:mm:ss'),\n          resourceId: groupToResourceId.get(group) ?? group,\n        });\n      }\n    },\n  });\n\n  const dayLabels = monthDays.map((day, dayIndex) => {\n    const d = dayjs(day);\n    const weekend = resolvedWeekendDays.includes(d.day() as DayOfWeek);\n    const today = d.isSame(dayjs(), 'day') && highlightToday;\n\n    return (\n      <Box\n        {...getStyles('resourcesMonthViewDayLabel')}\n        key={day}\n        mod={{ weekend, today }}\n        ref={(node) => {\n          dayLabelRefs.current[dayIndex] = node;\n        }}\n      >\n        <span {...getStyles('resourcesMonthViewDayLabelWeekday')}>\n          {formatDate({ date: d, locale: ctx.getLocale(locale), format: weekdayFormat })}\n        </span>\n        <span {...getStyles('resourcesMonthViewDayLabelNumber')}>{d.date()}</span>\n      </Box>\n    );\n  });\n\n  const cellsRef = useRef<HTMLButtonElement[][]>([]);\n\n  const getDayIndexFromDragPoint = useCallback((event: React.DragEvent, resourceIndex: number) => {\n    return getIndexFromDragPoint(cellsRef.current[resourceIndex] ?? [], event.clientX);\n  }, []);\n\n  const handleCellKeyDown = (\n    event: React.KeyboardEvent<HTMLButtonElement>,\n    resourceIndex: number,\n    dayIndex: number\n  ) => {\n    const key = event.key;\n    let nextResourceIndex = resourceIndex;\n    let nextDayIndex = dayIndex;\n\n    if (key === 'ArrowRight') {\n      nextDayIndex = Math.min(dayIndex + 1, monthDays.length - 1);\n    } else if (key === 'ArrowLeft') {\n      nextDayIndex = Math.max(dayIndex - 1, 0);\n    } else if (key === 'ArrowDown') {\n      nextResourceIndex = Math.min(resourceIndex + 1, resources.length - 1);\n    } else if (key === 'ArrowUp') {\n      nextResourceIndex = Math.max(resourceIndex - 1, 0);\n    } else {\n      return;\n    }\n\n    event.preventDefault();\n    cellsRef.current[nextResourceIndex]?.[nextDayIndex]?.focus();\n  };\n\n  const rowHeightPercent = 100 / maxEventsPerTimeSlot;\n\n  const renderEventNode = ({\n    key,\n    event,\n    resourceIndex,\n    style,\n    hanging,\n    eventMod,\n    withStartHandle,\n    withEndHandle,\n  }: {\n    key: string;\n    event: ScheduleEventData;\n    resourceIndex: number;\n    style: React.CSSProperties;\n    hanging?: ResourcesMonthViewSegment['hanging'];\n    eventMod?: Record<string, any>;\n    withStartHandle: boolean;\n    withEndHandle: boolean;\n  }) => {\n    const isResizable = eventResize.isResizableEvent(event);\n    const isThisEventResizing = eventResize.resizingEventId === event.id;\n\n    const eventEnd = dayjs(event.end);\n    const endsAtMidnight =\n      eventEnd.hour() === 0 && eventEnd.minute() === 0 && eventEnd.second() === 0;\n    const lastDay = (endsAtMidnight ? eventEnd.subtract(1, 'day') : eventEnd).format('YYYY-MM-DD');\n\n    const showStartHandle =\n      withStartHandle && monthDaySet.has(dayjs(event.start).format('YYYY-MM-DD'));\n    const showEndHandle = withEndHandle && monthDaySet.has(lastDay);\n\n    const eventColors = isResizable\n      ? theme.variantColorResolver({\n          color: event.color || theme.primaryColor,\n          theme,\n          variant: event.variant || 'light',\n          autoContrast: true,\n        })\n      : null;\n\n    const getHandleProps = (edge: 'start' | 'end') => ({\n      ...getStyles('resourcesMonthViewResizeHandle'),\n      'data-edge': edge,\n      'data-active': (isThisEventResizing && eventResize.resizingEdge === edge) || undefined,\n      onPointerDown: (e: React.PointerEvent) =>\n        eventResize.handleResizeStart({\n          event,\n          edge,\n          cells: cellsRef.current[resourceIndex] ?? [],\n          days: monthDays,\n          pointerEvent: e,\n        }),\n    });\n\n    return (\n      <Box\n        key={key}\n        {...getStyles('resourcesMonthViewEventWrapper', {\n          style: { position: 'absolute', zIndex: 3, ...style },\n        })}\n        __vars={eventColors ? { '--event-color': eventColors.color } : undefined}\n        data-resizing={isThisEventResizing || undefined}\n      >\n        <ScheduleEvent\n          event={event}\n          nowrap\n          autoSize\n          size=\"sm\"\n          hanging={hanging}\n          mod={eventMod}\n          draggable={dragDrop.isDraggableEvent(event)}\n          isResizing={isThisEventResizing}\n          renderEventBody={renderEventBody}\n          renderEvent={renderEvent}\n          radius={radius}\n          mode={mode}\n          onClick={\n            onEventClick\n              ? (e) => {\n                  if (!eventResize.wasResizing()) {\n                    onEventClick(event, e);\n                  }\n                }\n              : undefined\n          }\n          style={{ width: '100%', height: '100%' }}\n        />\n        {isResizable && showStartHandle && <div {...getHandleProps('start')} />}\n        {isResizable && showEndHandle && <div {...getHandleProps('end')} />}\n      </Box>\n    );\n  };\n\n  const rows = orderedResources.map((resource, resourceIndex) => {\n    if (!cellsRef.current[resourceIndex]) {\n      cellsRef.current[resourceIndex] = [];\n    }\n\n    cellsRef.current[resourceIndex].length = monthDays.length;\n\n    const slotGroup = String(resource.id);\n    const dropTarget = dragDrop.dropTarget;\n\n    const totalDays = monthDays.length;\n    const eventNodes: React.ReactNode[] = [];\n    const moreNodes: React.ReactNode[] = [];\n\n    const cells = monthDays.map((day, dayIndex) => {\n      const d = dayjs(day);\n      const weekend = ctx.getWeekendDays(weekendDays).includes(d.day() as DayOfWeek);\n      const isDropTarget =\n        dropTarget !== null &&\n        typeof dropTarget === 'object' &&\n        'day' in dropTarget &&\n        (dropTarget as DropTargetCell).day === day &&\n        (dropTarget as DropTargetCell).resourceId === resource.id;\n      const isDragSelected = slotDragSelect.isSlotSelected(dayIndex, slotGroup);\n      const dayEvents = eventsByResourceAndDay[resource.id]?.[day] || [];\n      const layout = eventLayoutByResource[resource.id]?.byDay[day];\n      const visibleEvents = layout?.visible ?? [];\n      const hiddenEventsCount = layout?.hiddenCount ?? 0;\n      const isFirstCell = resourceIndex === 0 && dayIndex === 0;\n      const dayLeftPercent = (dayIndex / totalDays) * 100;\n      const dayWidthPercent = 100 / totalDays;\n\n      const hasHiddenEvents = hiddenEventsCount > 0 && mode !== 'static';\n\n      visibleEvents.forEach(({ event, row }) => {\n        if (isMultiDayEvent(event)) {\n          return;\n        }\n\n        const topValue = hasHiddenEvents\n          ? `calc((100% - 18px) * ${row} / ${maxEventsPerTimeSlot} + 1px)`\n          : `calc(${row * rowHeightPercent}% + 1px)`;\n        const heightValue = hasHiddenEvents\n          ? `calc((100% - 18px) / ${maxEventsPerTimeSlot} - 2px)`\n          : `calc(${rowHeightPercent}% - 2px)`;\n\n        eventNodes.push(\n          renderEventNode({\n            key: `${event.id}-${day}`,\n            event,\n            resourceIndex,\n            withStartHandle: true,\n            withEndHandle: true,\n            style: {\n              top: topValue,\n              left: `calc(${dayLeftPercent}% + 1px)`,\n              width: `calc(${dayWidthPercent}% - 2px)`,\n              height: heightValue,\n            },\n          })\n        );\n      });\n\n      if (hiddenEventsCount > 0 && mode !== 'static') {\n        moreNodes.push(\n          <MoreEvents\n            key={`more-${resource.id}-${day}`}\n            events={dayEvents}\n            moreEventsCount={hiddenEventsCount}\n            mode={mode}\n            labels={labels}\n            renderEventBody={renderEventBody}\n            renderEvent={renderEvent}\n            onEventClick={onEventClick}\n            style={{\n              position: 'absolute',\n              bottom: 1,\n              left: `calc(${dayLeftPercent}% + 1px)`,\n              width: `calc(${dayWidthPercent}% - 2px)`,\n              height: 18,\n              zIndex: 4,\n            }}\n            {...stylesApiProps}\n            {...moreEventsProps}\n          />\n        );\n      }\n\n      return (\n        <UnstyledButton\n          key={day}\n          ref={(node) => {\n            if (node) {\n              if (!cellsRef.current[resourceIndex]) {\n                cellsRef.current[resourceIndex] = [];\n              }\n              cellsRef.current[resourceIndex][dayIndex] = node;\n            }\n          }}\n          {...getStyles('resourcesMonthViewCell')}\n          aria-label={`${resource.label} ${d.format('MMMM D, YYYY')}`}\n          data-drag-slot-index={withDragSlotSelect && mode !== 'static' ? dayIndex : undefined}\n          data-drag-slot-group={withDragSlotSelect && mode !== 'static' ? slotGroup : undefined}\n          mod={{\n            weekend,\n            'drop-target': isDropTarget,\n            'drag-selected': isDragSelected,\n            static: mode === 'static',\n          }}\n          tabIndex={mode === 'static' ? -1 : isFirstCell ? 0 : -1}\n          onClick={\n            mode === 'static'\n              ? undefined\n              : (e) => onDayClick?.({ date: day, nativeEvent: e, resourceId: resource.id })\n          }\n          onKeyDown={\n            mode === 'static' ? undefined : (e) => handleCellKeyDown(e, resourceIndex, dayIndex)\n          }\n          onPointerDown={\n            withDragSlotSelect && mode !== 'static'\n              ? (e) =>\n                  slotDragSelect.handleSlotPointerDown(\n                    e as React.PointerEvent<HTMLButtonElement>,\n                    dayIndex,\n                    slotGroup\n                  )\n              : undefined\n          }\n          onDragOver={withDragHandlers ? (e) => e.preventDefault() : undefined}\n        />\n      );\n    });\n\n    const resourceSegments = eventLayoutByResource[resource.id]?.segments ?? [];\n\n    resourceSegments.forEach((segment) => {\n      const segmentLeftPercent = (segment.startDayIndex / totalDays) * 100;\n      const segmentWidthPercent =\n        ((segment.endDayIndex - segment.startDayIndex + 1) / totalDays) * 100;\n      const compressed = segment.hiddenInSpan && mode !== 'static';\n      const topValue = compressed\n        ? `calc((100% - 18px) * ${segment.row} / ${maxEventsPerTimeSlot} + 1px)`\n        : `calc(${segment.row * rowHeightPercent}% + 1px)`;\n      const heightValue = compressed\n        ? `calc((100% - 18px) / ${maxEventsPerTimeSlot} - 2px)`\n        : `calc(${rowHeightPercent}% - 2px)`;\n\n      eventNodes.push(\n        renderEventNode({\n          key: `${segment.event.id}-segment-${segment.startDayIndex}`,\n          event: segment.event,\n          resourceIndex,\n          hanging: segment.hanging,\n          eventMod: { 'clip-start': segment.clipStart, 'clip-end': segment.clipEnd },\n          withStartHandle:\n            !segment.clipStart && segment.hanging !== 'start' && segment.hanging !== 'both',\n          withEndHandle:\n            !segment.clipEnd && segment.hanging !== 'end' && segment.hanging !== 'both',\n          style: {\n            top: topValue,\n            left: `calc(${segmentLeftPercent}% + 1px)`,\n            width: `calc(${segmentWidthPercent}% - 2px)`,\n            height: heightValue,\n          },\n        })\n      );\n    });\n\n    const groupInfo = hasGroups ? resourceGroupMap[resourceIndex] : undefined;\n    const isGroupStart = groupInfo?.position === 'first' || groupInfo?.position === 'only';\n\n    const groupCell =\n      groupInfo !== undefined ? (\n        groupInfo !== null ? (\n          <Box\n            {...getStyles('resourcesMonthViewGroupColumn')}\n            mod={{ 'group-position': groupInfo.position }}\n          >\n            {isGroupStart && (\n              <span\n                style={\n                  groupInfo.count > 1\n                    ? {\n                        transform: `translateY(calc((${groupInfo.count - 1} * (var(--resources-month-view-row-height) + 1px)) / 2))`,\n                      }\n                    : undefined\n                }\n              >\n                {renderGroupLabel ? renderGroupLabel(groupInfo.group) : groupInfo.group.label}\n              </span>\n            )}\n          </Box>\n        ) : (\n          <Box {...getStyles('resourcesMonthViewGroupColumnEmpty')} />\n        )\n      ) : null;\n\n    return (\n      <div {...getStyles('resourcesMonthViewRow')} key={resource.id}>\n        {groupCell}\n        <div\n          {...getStyles('resourcesMonthViewResourceLabel')}\n          data-has-groups={hasGroups || undefined}\n        >\n          {renderResourceLabel ? renderResourceLabel(resource) : resource.label}\n        </div>\n        <div\n          {...getStyles('resourcesMonthViewRowSlots')}\n          onDragOver={\n            withDragHandlers\n              ? (e) => {\n                  const dayIndex = getDayIndexFromDragPoint(e, resourceIndex);\n                  if (dayIndex !== null && monthDays[dayIndex]) {\n                    dragDrop.handleDragOver(e, {\n                      day: monthDays[dayIndex],\n                      resourceId: resource.id,\n                    });\n                  }\n                }\n              : undefined\n          }\n          onDragLeave={withDragHandlers ? dragDrop.handleDragLeave : undefined}\n          onDrop={\n            withDragHandlers\n              ? (e) => {\n                  const dayIndex = getDayIndexFromDragPoint(e, resourceIndex);\n                  if (dayIndex !== null && monthDays[dayIndex]) {\n                    dragDrop.handleDrop(e, {\n                      day: monthDays[dayIndex],\n                      resourceId: resource.id,\n                    });\n                  }\n                }\n              : undefined\n          }\n        >\n          {eventNodes}\n          {moreNodes}\n          {cells}\n        </div>\n      </div>\n    );\n  });\n\n  const content = (\n    <Box\n      mod={[\n        {\n          static: mode === 'static',\n          'slot-dragging': slotDragSelect.isDragging,\n          'event-interaction': eventResize.isResizing || dragDrop.dragContextValue.isDragging,\n          resizing: eventResize.isResizing,\n        },\n        mod,\n      ]}\n      {...getStyles('resourcesMonthView')}\n      {...others}\n    >\n      {withHeader && (\n        <ScheduleHeaderBase\n          view=\"month\"\n          navigationHandlers={{\n            previous: () => toDateString(dayjs(date).subtract(1, 'month').startOf('month')),\n            next: () => toDateString(dayjs(date).add(1, 'month').startOf('month')),\n            today: () => {\n              requestAnimationFrame(() => {\n                scrollToDay(dayjs().format('YYYY-MM-DD'));\n              });\n              return toDateString(dayjs());\n            },\n          }}\n          control={{\n            monthYearSelect: {\n              locale,\n              yearValue: dayjs(date).get('year'),\n              monthValue: dayjs(date).get('month'),\n              onYearChange: (year) =>\n                onDateChange?.(toDateString(dayjs(date).set('year', year).startOf('month'))),\n              onMonthChange: (month) =>\n                onDateChange?.(toDateString(dayjs(date).set('month', month).startOf('month'))),\n              ...monthYearSelectProps,\n            },\n          }}\n          labels={labels}\n          onDateChange={onDateChange}\n          onViewChange={onViewChange}\n          previousControlProps={previousControlProps}\n          nextControlProps={nextControlProps}\n          todayControlProps={todayControlProps}\n          viewSelectProps={{ views: ['day', 'week', 'month'] as const, ...viewSelectProps }}\n          stylesApiProps={stylesApiProps}\n        />\n      )}\n\n      <Box {...getStyles('resourcesMonthViewRoot')}>\n        <ScrollArea\n          scrollbars=\"x\"\n          scrollbarSize={4}\n          {...scrollAreaProps}\n          {...getStyles('resourcesMonthViewScrollArea', {\n            className: scrollAreaProps?.className,\n            style: scrollAreaProps?.style,\n          })}\n          viewportRef={mergedViewportRef}\n        >\n          <div {...getStyles('resourcesMonthViewInner')}>\n            <div {...getStyles('resourcesMonthViewDayLabelsRow')}>\n              <div\n                {...getStyles('resourcesMonthViewCorner')}\n                key=\"corner\"\n                ref={resourceLabelRef}\n                style={\n                  hasGroups\n                    ? {\n                        flexBasis:\n                          'calc(var(--resources-month-view-resource-label-width) + var(--resources-month-view-group-label-width))',\n                        minWidth:\n                          'calc(var(--resources-month-view-resource-label-width) + var(--resources-month-view-group-label-width))',\n                      }\n                    : undefined\n                }\n              >\n                {getLabel('resources', labels)}\n              </div>\n              {dayLabels}\n            </div>\n\n            {rows}\n          </div>\n        </ScrollArea>\n      </Box>\n    </Box>\n  );\n\n  if (withEventsDragAndDrop) {\n    return <DragContext.Provider value={dragDrop.dragContextValue}>{content}</DragContext.Provider>;\n  }\n\n  return content;\n});\n\nResourcesMonthView.displayName = '@mantine/schedule/ResourcesMonthView';\nResourcesMonthView.classes = classes;\nResourcesMonthView.varsResolver = varsResolver;\n"],"mappings":"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"}

package/esm/components/ResourcesMonthView/ResourcesMonthView.module.mjs

@@ -15,7 +15,9 @@ var ResourcesMonthView_module_default = {
 	"resourcesMonthViewGroupColumn": "m_1fc335a8",
 	"resourcesMonthViewGroupColumnEmpty": "m_d5a3a885",
 	"resourcesMonthViewRowSlots": "m_4be74668",
-	"resourcesMonthViewCell": "m_146709cf"
+	"resourcesMonthViewCell": "m_146709cf",
+	"resourcesMonthViewEventWrapper": "m_4a182c06",
+	"resourcesMonthViewResizeHandle": "m_4dcd6369"
 };
 //#endregion
 export { ResourcesMonthView_module_default as default };

package/esm/components/ResourcesMonthView/ResourcesMonthView.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ResourcesMonthView.module.mjs","names":[],"sources":["../../../src/components/ResourcesMonthView/ResourcesMonthView.module.css"],"sourcesContent":[".resourcesMonthView {\n  --resources-month-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n  --resources-month-view-resource-label-width: 120px;\n  --resources-month-view-day-width: 80px;\n  --resources-month-view-row-height: 64px;\n  --resources-month-view-group-label-width: 80px;\n\n  @mixin where-light {\n    --resources-month-view-border-color: var(--mantine-color-gray-3);\n  }\n\n  @mixin where-dark {\n    --resources-month-view-border-color: var(--mantine-color-dark-4);\n  }\n}\n\n.resourcesMonthViewRoot {\n  border: 1px solid var(--resources-month-view-border-color);\n  border-radius: var(--resources-month-view-radius);\n  overflow: hidden;\n  max-width: fit-content;\n}\n\n.resourcesMonthViewScrollArea {\n  :where([data-mantine-scrollbar]) {\n    z-index: 20;\n  }\n\n  :where([data-scrollarea-viewport]) {\n    overscroll-behavior-x: none;\n  }\n}\n\n.resourcesMonthViewInner {\n  display: inline-flex;\n  flex-direction: column;\n}\n\n.resourcesMonthViewDayLabelsRow {\n  display: flex;\n  position: sticky;\n  top: 0;\n  z-index: 5;\n  background-color: var(--mantine-color-body);\n  border-bottom: 1px solid var(--resources-month-view-border-color);\n  margin-bottom: -1px;\n}\n\n.resourcesMonthViewCorner {\n  flex: 0 0 var(--resources-month-view-resource-label-width);\n  min-width: var(--resources-month-view-resource-label-width);\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n  position: sticky;\n  left: 0;\n  z-index: 6;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  background-color: var(--mantine-color-body);\n}\n\n.resourcesMonthViewDayLabel {\n  flex: 0 0 var(--resources-month-view-day-width);\n  min-width: var(--resources-month-view-day-width);\n  max-width: var(--resources-month-view-day-width);\n  height: 42px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-xs);\n  user-select: none;\n  cursor: default;\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-weekend]) {\n    color: var(--mantine-color-red-6);\n  }\n\n  &:where([data-today]) {\n    background-color: var(--mantine-primary-color-filled);\n    color: var(--mantine-primary-color-contrast);\n  }\n}\n\n.resourcesMonthViewDayLabelWeekday {\n  font-size: 12px;\n  font-weight: var(--mantine-font-weight-medium);\n  text-transform: capitalize;\n  line-height: 1;\n  margin-bottom: 3px;\n}\n\n.resourcesMonthViewDayLabelNumber {\n  font-weight: var(--mantine-font-weight-medium);\n  font-size: 12px;\n  line-height: 1;\n}\n\n.resourcesMonthViewRow {\n  display: flex;\n  border-top: 1px solid var(--resources-month-view-border-color);\n}\n\n.resourcesMonthViewResourceLabel {\n  flex: 0 0 var(--resources-month-view-resource-label-width);\n  min-width: var(--resources-month-view-resource-label-width);\n  display: flex;\n  align-items: center;\n  padding: 4px 8px;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n  min-height: var(--resources-month-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 4;\n  background-color: var(--mantine-color-body);\n\n  &:where([data-has-groups]) {\n    left: var(--resources-month-view-group-label-width);\n  }\n}\n\n.resourcesMonthViewGroupColumn {\n  flex: 0 0 var(--resources-month-view-group-label-width);\n  min-width: var(--resources-month-view-group-label-width);\n  min-height: var(--resources-month-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 5;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  overflow-wrap: break-word;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n  overflow: visible;\n\n  &:where([data-group-position='first']),\n  &:where([data-group-position='only']) {\n    z-index: 6;\n  }\n\n  &:where([data-group-position='middle']),\n  &:where([data-group-position='last']) {\n    margin-top: -1px;\n    min-height: calc(var(--resources-month-view-row-height) + 1px);\n  }\n}\n\n.resourcesMonthViewGroupColumnEmpty {\n  flex: 0 0 var(--resources-month-view-group-label-width);\n  min-width: var(--resources-month-view-group-label-width);\n  min-height: var(--resources-month-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 5;\n  background-color: var(--mantine-color-body);\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n}\n\n.resourcesMonthViewRowSlots {\n  display: flex;\n  position: relative;\n  min-height: var(--resources-month-view-row-height);\n}\n\n.resourcesMonthViewCell {\n  flex: 0 0 var(--resources-month-view-day-width);\n  min-width: var(--resources-month-view-day-width);\n  max-width: var(--resources-month-view-day-width);\n  min-height: var(--resources-month-view-row-height);\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n  cursor: pointer;\n  position: relative;\n  overflow: hidden;\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where(:focus) {\n    z-index: 1;\n  }\n\n  @mixin hover {\n    &:where(:not([data-static])) {\n      @mixin where-light {\n        background-color: var(--mantine-color-gray-0);\n      }\n\n      @mixin where-dark {\n        background-color: var(--mantine-color-dark-6);\n      }\n    }\n  }\n\n  &:where([data-weekend]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-0);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-8);\n    }\n  }\n\n  &:where([data-drop-target]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-blue-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n      border-radius: 2px;\n\n      @mixin where-light {\n        border-color: var(--mantine-color-blue-4);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-color-blue-6);\n      }\n    }\n  }\n\n  &:where([data-drag-selected]) {\n    &,\n    &:hover {\n      background-color: var(--mantine-primary-color-light);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n\n      @mixin where-light {\n        border-color: var(--mantine-primary-color-2);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-primary-color-9);\n      }\n    }\n  }\n\n  &:where([data-drag-slot-index]) {\n    touch-action: none;\n  }\n\n  &:where([data-static]) {\n    cursor: default;\n    pointer-events: none;\n  }\n}\n\n.resourcesMonthView:where([data-event-interaction]) .resourcesMonthViewCell {\n  pointer-events: none;\n}\n"],"mappings":""}
+{"version":3,"file":"ResourcesMonthView.module.mjs","names":[],"sources":["../../../src/components/ResourcesMonthView/ResourcesMonthView.module.css"],"sourcesContent":[".resourcesMonthView {\n  --resources-month-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n  --resources-month-view-resource-label-width: 120px;\n  --resources-month-view-day-width: 80px;\n  --resources-month-view-row-height: 64px;\n  --resources-month-view-group-label-width: 80px;\n\n  @mixin where-light {\n    --resources-month-view-border-color: var(--mantine-color-gray-3);\n  }\n\n  @mixin where-dark {\n    --resources-month-view-border-color: var(--mantine-color-dark-4);\n  }\n}\n\n.resourcesMonthViewRoot {\n  border: 1px solid var(--resources-month-view-border-color);\n  border-radius: var(--resources-month-view-radius);\n  overflow: hidden;\n  max-width: fit-content;\n}\n\n.resourcesMonthViewScrollArea {\n  :where([data-mantine-scrollbar]) {\n    z-index: 20;\n  }\n\n  :where([data-scrollarea-viewport]) {\n    overscroll-behavior-x: none;\n  }\n}\n\n.resourcesMonthViewInner {\n  display: inline-flex;\n  flex-direction: column;\n}\n\n.resourcesMonthViewDayLabelsRow {\n  display: flex;\n  position: sticky;\n  top: 0;\n  z-index: 5;\n  background-color: var(--mantine-color-body);\n  border-bottom: 1px solid var(--resources-month-view-border-color);\n  margin-bottom: -1px;\n}\n\n.resourcesMonthViewCorner {\n  flex: 0 0 var(--resources-month-view-resource-label-width);\n  min-width: var(--resources-month-view-resource-label-width);\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n  position: sticky;\n  left: 0;\n  z-index: 6;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  background-color: var(--mantine-color-body);\n}\n\n.resourcesMonthViewDayLabel {\n  flex: 0 0 var(--resources-month-view-day-width);\n  min-width: var(--resources-month-view-day-width);\n  max-width: var(--resources-month-view-day-width);\n  height: 42px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-xs);\n  user-select: none;\n  cursor: default;\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-weekend]) {\n    color: var(--mantine-color-red-6);\n  }\n\n  &:where([data-today]) {\n    background-color: var(--mantine-primary-color-filled);\n    color: var(--mantine-primary-color-contrast);\n  }\n}\n\n.resourcesMonthViewDayLabelWeekday {\n  font-size: 12px;\n  font-weight: var(--mantine-font-weight-medium);\n  text-transform: capitalize;\n  line-height: 1;\n  margin-bottom: 3px;\n}\n\n.resourcesMonthViewDayLabelNumber {\n  font-weight: var(--mantine-font-weight-medium);\n  font-size: 12px;\n  line-height: 1;\n}\n\n.resourcesMonthViewRow {\n  display: flex;\n  border-top: 1px solid var(--resources-month-view-border-color);\n}\n\n.resourcesMonthViewResourceLabel {\n  flex: 0 0 var(--resources-month-view-resource-label-width);\n  min-width: var(--resources-month-view-resource-label-width);\n  display: flex;\n  align-items: center;\n  padding: 4px 8px;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n  min-height: var(--resources-month-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 4;\n  background-color: var(--mantine-color-body);\n\n  &:where([data-has-groups]) {\n    left: var(--resources-month-view-group-label-width);\n  }\n}\n\n.resourcesMonthViewGroupColumn {\n  flex: 0 0 var(--resources-month-view-group-label-width);\n  min-width: var(--resources-month-view-group-label-width);\n  min-height: var(--resources-month-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 5;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  overflow-wrap: break-word;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n  overflow: visible;\n\n  &:where([data-group-position='first']),\n  &:where([data-group-position='only']) {\n    z-index: 6;\n  }\n\n  &:where([data-group-position='middle']),\n  &:where([data-group-position='last']) {\n    margin-top: -1px;\n    min-height: calc(var(--resources-month-view-row-height) + 1px);\n  }\n}\n\n.resourcesMonthViewGroupColumnEmpty {\n  flex: 0 0 var(--resources-month-view-group-label-width);\n  min-width: var(--resources-month-view-group-label-width);\n  min-height: var(--resources-month-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 5;\n  background-color: var(--mantine-color-body);\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n}\n\n.resourcesMonthViewRowSlots {\n  display: flex;\n  position: relative;\n  min-height: var(--resources-month-view-row-height);\n}\n\n.resourcesMonthViewCell {\n  flex: 0 0 var(--resources-month-view-day-width);\n  min-width: var(--resources-month-view-day-width);\n  max-width: var(--resources-month-view-day-width);\n  min-height: var(--resources-month-view-row-height);\n  border-inline-end: 1px solid var(--resources-month-view-border-color);\n  cursor: pointer;\n  position: relative;\n  overflow: hidden;\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where(:focus) {\n    z-index: 1;\n  }\n\n  @mixin hover {\n    &:where(:not([data-static])) {\n      @mixin where-light {\n        background-color: var(--mantine-color-gray-0);\n      }\n\n      @mixin where-dark {\n        background-color: var(--mantine-color-dark-6);\n      }\n    }\n  }\n\n  &:where([data-weekend]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-0);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-8);\n    }\n  }\n\n  &:where([data-drop-target]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-blue-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n      border-radius: 2px;\n\n      @mixin where-light {\n        border-color: var(--mantine-color-blue-4);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-color-blue-6);\n      }\n    }\n  }\n\n  &:where([data-drag-selected]) {\n    &,\n    &:hover {\n      background-color: var(--mantine-primary-color-light);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n\n      @mixin where-light {\n        border-color: var(--mantine-primary-color-2);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-primary-color-9);\n      }\n    }\n  }\n\n  &:where([data-drag-slot-index]) {\n    touch-action: none;\n  }\n\n  &:where([data-static]) {\n    cursor: default;\n    pointer-events: none;\n  }\n}\n\n.resourcesMonthView:where([data-event-interaction]) .resourcesMonthViewCell {\n  pointer-events: none;\n}\n\n.resourcesMonthViewEventWrapper {\n  &:hover .resourcesMonthViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesMonthViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesMonthViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesMonthViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesMonthViewResizeHandle {\n  position: absolute;\n  top: 20%;\n  width: 4px;\n  height: 60%;\n  cursor: ew-resize;\n  z-index: 5;\n  border-radius: 2px;\n  opacity: 0;\n  transition: opacity 100ms ease;\n  pointer-events: all;\n  touch-action: none;\n  background-color: var(--event-color);\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: -4px -6px;\n  }\n\n  &:where([data-edge='start']) {\n    inset-inline-start: -2px;\n  }\n\n  &:where([data-edge='end']) {\n    inset-inline-end: -2px;\n  }\n}\n\n.resourcesMonthView:where([data-resizing]) {\n  & * {\n    cursor: ew-resize !important;\n  }\n\n  & .resourcesMonthViewEventWrapper:not([data-resizing]) {\n    pointer-events: none;\n\n    & .resourcesMonthViewResizeHandle {\n      opacity: 0;\n    }\n  }\n}\n"],"mappings":""}

package/esm/components/ResourcesSchedule/ResourcesSchedule.mjs

@@ -85,6 +85,9 @@ const ResourcesSchedule = factory((_props) => {
 			case "month": return /* @__PURE__ */ jsx(ResourcesMonthView, {
 				...commonProps,
 				onDayClick,
+				withEventResize: mode === "static" ? false : withEventResize,
+				onEventResize,
+				canResizeEvent,
 				...monthViewProps
 			});
 			default: return null;