@mantine/schedule 9.4.0 → 9.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/components/DayView/DayView.cjs +6 -2
- package/cjs/components/DayView/DayView.cjs.map +1 -1
- package/cjs/components/ResourcesDayView/ResourcesDayView.cjs +26 -18
- package/cjs/components/ResourcesDayView/ResourcesDayView.cjs.map +1 -1
- package/cjs/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.cjs +22 -6
- package/cjs/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.cjs.map +1 -1
- package/cjs/components/ResourcesSchedule/ResourcesSchedule.cjs +3 -0
- package/cjs/components/ResourcesSchedule/ResourcesSchedule.cjs.map +1 -1
- package/cjs/components/ResourcesWeekView/ResourcesWeekView.cjs +99 -25
- package/cjs/components/ResourcesWeekView/ResourcesWeekView.cjs.map +1 -1
- package/cjs/components/ResourcesWeekView/get-resources-week-view-events/get-resources-week-view-events.cjs +3 -2
- package/cjs/components/ResourcesWeekView/get-resources-week-view-events/get-resources-week-view-events.cjs.map +1 -1
- package/cjs/components/ScheduleEvent/ScheduleEvent.module.cjs.map +1 -1
- package/cjs/components/WeekView/WeekView.cjs +7 -3
- package/cjs/components/WeekView/WeekView.cjs.map +1 -1
- package/cjs/hooks/use-horizontal-event-resize.cjs +12 -4
- package/cjs/hooks/use-horizontal-event-resize.cjs.map +1 -1
- package/cjs/index.cjs +4 -0
- package/cjs/utils/clamp-interval-minutes/clamp-interval-minutes.cjs +13 -4
- package/cjs/utils/clamp-interval-minutes/clamp-interval-minutes.cjs.map +1 -1
- package/cjs/utils/get-day-relative-percent/get-day-relative-percent.cjs +18 -0
- package/cjs/utils/get-day-relative-percent/get-day-relative-percent.cjs.map +1 -0
- package/cjs/utils/get-time-axis-event-style/get-time-axis-event-style.cjs +21 -0
- package/cjs/utils/get-time-axis-event-style/get-time-axis-event-style.cjs.map +1 -0
- package/esm/components/DayView/DayView.mjs +6 -2
- package/esm/components/DayView/DayView.mjs.map +1 -1
- package/esm/components/ResourcesDayView/ResourcesDayView.mjs +26 -18
- package/esm/components/ResourcesDayView/ResourcesDayView.mjs.map +1 -1
- package/esm/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.mjs +22 -6
- package/esm/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.mjs.map +1 -1
- package/esm/components/ResourcesSchedule/ResourcesSchedule.mjs +3 -0
- package/esm/components/ResourcesSchedule/ResourcesSchedule.mjs.map +1 -1
- package/esm/components/ResourcesWeekView/ResourcesWeekView.mjs +100 -26
- package/esm/components/ResourcesWeekView/ResourcesWeekView.mjs.map +1 -1
- package/esm/components/ResourcesWeekView/get-resources-week-view-events/get-resources-week-view-events.mjs +3 -2
- package/esm/components/ResourcesWeekView/get-resources-week-view-events/get-resources-week-view-events.mjs.map +1 -1
- package/esm/components/ScheduleEvent/ScheduleEvent.module.mjs.map +1 -1
- package/esm/components/WeekView/WeekView.mjs +7 -3
- package/esm/components/WeekView/WeekView.mjs.map +1 -1
- package/esm/hooks/use-horizontal-event-resize.mjs +12 -4
- package/esm/hooks/use-horizontal-event-resize.mjs.map +1 -1
- package/esm/index.mjs +3 -1
- package/esm/utils/clamp-interval-minutes/clamp-interval-minutes.mjs +13 -4
- package/esm/utils/clamp-interval-minutes/clamp-interval-minutes.mjs.map +1 -1
- package/esm/utils/get-day-relative-percent/get-day-relative-percent.mjs +18 -0
- package/esm/utils/get-day-relative-percent/get-day-relative-percent.mjs.map +1 -0
- package/esm/utils/get-time-axis-event-style/get-time-axis-event-style.mjs +21 -0
- package/esm/utils/get-time-axis-event-style/get-time-axis-event-style.mjs.map +1 -0
- package/lib/components/DayView/DayView.d.ts +1 -1
- package/lib/components/ResourcesDayView/ResourcesDayView.d.ts +6 -2
- package/lib/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.d.ts +2 -1
- package/lib/components/ResourcesWeekView/ResourcesWeekView.d.ts +17 -1
- package/lib/components/ResourcesWeekView/get-resources-week-view-events/get-resources-week-view-events.d.ts +2 -1
- package/lib/components/WeekView/WeekView.d.ts +1 -1
- package/lib/hooks/use-horizontal-event-resize.d.ts +3 -1
- package/lib/utils/clamp-interval-minutes/clamp-interval-minutes.d.ts +10 -1
- package/lib/utils/get-day-relative-percent/get-day-relative-percent.d.ts +15 -0
- package/lib/utils/get-time-axis-event-style/get-time-axis-event-style.d.ts +26 -0
- package/lib/utils/index.d.ts +2 -0
- package/package.json +4 -4
- package/styles.css +16 -1
- package/styles.layer.css +16 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-resources-day-view-events.mjs","names":[],"sources":["../../../../src/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport {\n AnyDateValue,\n DayPositionedEventData,\n ScheduleEventData,\n ScheduleResourceData,\n} from '../../../types';\nimport { getDayPosition, isAllDayEvent, isEventInTimeRange, validateEvent } from '../../../utils';\nimport { getDayPositionedEvents } from '../../DayView/get-day-view-events/get-day-positioned-events';\n\ninterface GetResourcesDayViewEventsInput {\n events: ScheduleEventData[] | undefined;\n resources: ScheduleResourceData[];\n date: AnyDateValue;\n startTime?: string;\n endTime?: string;\n}\n\nexport interface ResourcesDayViewEventsResult {\n regularEvents: Record<string | number, DayPositionedEventData[]>;\n allDayEvents: Record<string | number, DayPositionedEventData[]>;\n backgroundTimedEvents: Record<string | number, DayPositionedEventData[]>;\n backgroundAllDayEvents: Record<string | number, DayPositionedEventData[]>;\n}\n\nexport function getResourcesDayViewEvents({\n events,\n resources,\n date,\n startTime,\n endTime,\n}: GetResourcesDayViewEventsInput): ResourcesDayViewEventsResult {\n const result: ResourcesDayViewEventsResult = {\n regularEvents: {},\n allDayEvents: {},\n backgroundTimedEvents: {},\n backgroundAllDayEvents: {},\n };\n\n for (const resource of resources) {\n result.regularEvents[resource.id] = [];\n result.allDayEvents[resource.id] = [];\n result.backgroundTimedEvents[resource.id] = [];\n result.backgroundAllDayEvents[resource.id] = [];\n }\n\n if (events === undefined) {\n return result;\n }\n\n const dayStart = dayjs(date).startOf('day');\n const dayEnd = dayjs(date).endOf('day');\n\n const eventsByResource: Record<string | number, ScheduleEventData[]> = {};\n const backgroundByResource: Record<string | number, ScheduleEventData[]> = {};\n\n for (const resource of resources) {\n eventsByResource[resource.id] = [];\n backgroundByResource[resource.id] = [];\n }\n\n const ids = new Set<string | number>();\n\n for (const event of events) {\n if (event.resourceId === undefined) {\n continue;\n }\n\n if (!(event.resourceId in eventsByResource)) {\n continue;\n }\n\n const eventStart = dayjs(event.start);\n const eventEnd = dayjs(event.end);\n const isOnDay = eventStart.isSame(dayStart, 'day');\n const
|
|
1
|
+
{"version":3,"file":"get-resources-day-view-events.mjs","names":[],"sources":["../../../../src/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport {\n AnyDateValue,\n DayPositionedEventData,\n ScheduleEventData,\n ScheduleResourceData,\n} from '../../../types';\nimport { getDayPosition, isAllDayEvent, isEventInTimeRange, validateEvent } from '../../../utils';\nimport { getDayPositionedEvents } from '../../DayView/get-day-view-events/get-day-positioned-events';\n\ninterface GetResourcesDayViewEventsInput {\n events: ScheduleEventData[] | undefined;\n resources: ScheduleResourceData[];\n date: AnyDateValue;\n startTime?: string;\n endTime?: string;\n intervalMinutes?: number;\n}\n\nexport interface ResourcesDayViewEventsResult {\n regularEvents: Record<string | number, DayPositionedEventData[]>;\n allDayEvents: Record<string | number, DayPositionedEventData[]>;\n backgroundTimedEvents: Record<string | number, DayPositionedEventData[]>;\n backgroundAllDayEvents: Record<string | number, DayPositionedEventData[]>;\n}\n\nexport function getResourcesDayViewEvents({\n events,\n resources,\n date,\n startTime,\n endTime,\n intervalMinutes,\n}: GetResourcesDayViewEventsInput): ResourcesDayViewEventsResult {\n const result: ResourcesDayViewEventsResult = {\n regularEvents: {},\n allDayEvents: {},\n backgroundTimedEvents: {},\n backgroundAllDayEvents: {},\n };\n\n for (const resource of resources) {\n result.regularEvents[resource.id] = [];\n result.allDayEvents[resource.id] = [];\n result.backgroundTimedEvents[resource.id] = [];\n result.backgroundAllDayEvents[resource.id] = [];\n }\n\n if (events === undefined) {\n return result;\n }\n\n const dayStart = dayjs(date).startOf('day');\n const dayEnd = dayjs(date).endOf('day');\n\n const eventsByResource: Record<string | number, ScheduleEventData[]> = {};\n const backgroundByResource: Record<string | number, ScheduleEventData[]> = {};\n\n for (const resource of resources) {\n eventsByResource[resource.id] = [];\n backgroundByResource[resource.id] = [];\n }\n\n const ids = new Set<string | number>();\n\n for (const event of events) {\n if (event.resourceId === undefined) {\n continue;\n }\n\n if (!(event.resourceId in eventsByResource)) {\n continue;\n }\n\n const eventStart = dayjs(event.start);\n const eventEnd = dayjs(event.end);\n\n const isOnDay = eventStart.isSame(dayStart, 'day');\n const overlapsDay = eventStart.isBefore(dayEnd) && eventEnd.isAfter(dayStart);\n\n if (isOnDay || overlapsDay) {\n if (isOnDay && !isEventInTimeRange({ event, startTime, endTime })) {\n continue;\n }\n\n const validated = validateEvent(event);\n\n if (!ids.has(event.id)) {\n ids.add(event.id);\n } else {\n throw new Error(\n `[@mantine/schedule] ResourcesDayView: Duplicated event ids found: ${event.id}`\n );\n }\n\n if (event.display === 'background') {\n backgroundByResource[event.resourceId].push(validated);\n } else if (isOnDay) {\n eventsByResource[event.resourceId].push(validated);\n } else {\n const clippedStart = eventStart.isBefore(dayStart) ? dayStart : eventStart;\n const clippedEnd = eventEnd.isAfter(dayEnd) ? dayEnd : eventEnd;\n\n const clippedEvent = {\n ...validated,\n start: clippedStart.format('YYYY-MM-DD HH:mm:ss'),\n end: clippedEnd.format('YYYY-MM-DD HH:mm:ss'),\n };\n\n if (isEventInTimeRange({ event: clippedEvent, startTime, endTime })) {\n eventsByResource[event.resourceId].push(clippedEvent);\n }\n }\n }\n }\n\n for (const resource of resources) {\n const positioned = getDayPositionedEvents({\n events: eventsByResource[resource.id],\n startTime,\n endTime,\n date,\n intervalMinutes,\n });\n\n for (const event of positioned) {\n if (event.position.allDay) {\n result.allDayEvents[resource.id].push(event);\n } else {\n result.regularEvents[resource.id].push(event);\n }\n }\n\n for (const event of backgroundByResource[resource.id]) {\n const eventStart = dayjs(event.start);\n const eventEnd = dayjs(event.end);\n const clippedStart = eventStart.isBefore(dayStart) ? dayStart : eventStart;\n const clippedEnd = eventEnd.isAfter(dayEnd) ? dayEnd : eventEnd;\n\n const clippedEvent = {\n ...event,\n start: clippedStart.format('YYYY-MM-DD HH:mm:ss'),\n end: clippedEnd.format('YYYY-MM-DD HH:mm:ss'),\n };\n\n const allDay = isAllDayEvent({ event: clippedEvent, date });\n\n if (allDay) {\n result.backgroundAllDayEvents[resource.id].push({\n ...event,\n position: {\n top: 0,\n height: 100,\n allDay: true,\n width: 100,\n offset: 0,\n column: 0,\n overlaps: 1,\n },\n });\n } else {\n const { top, height } = getDayPosition({\n event: clippedEvent,\n startTime,\n endTime,\n intervalMinutes,\n });\n if (height <= 0) {\n continue;\n }\n result.backgroundTimedEvents[resource.id].push({\n ...event,\n position: { top, height, allDay: false, width: 100, offset: 0, column: 0, overlaps: 1 },\n });\n }\n }\n }\n\n return result;\n}\n"],"mappings":"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"}
|
|
@@ -77,6 +77,9 @@ const ResourcesSchedule = factory((_props) => {
|
|
|
77
77
|
case "week": return /* @__PURE__ */ jsx(ResourcesWeekView, {
|
|
78
78
|
...commonProps,
|
|
79
79
|
onTimeSlotClick,
|
|
80
|
+
withEventResize: mode === "static" ? false : withEventResize,
|
|
81
|
+
onEventResize,
|
|
82
|
+
canResizeEvent,
|
|
80
83
|
...weekViewProps
|
|
81
84
|
});
|
|
82
85
|
case "month": return /* @__PURE__ */ jsx(ResourcesMonthView, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResourcesSchedule.mjs","names":["classes"],"sources":["../../../src/components/ResourcesSchedule/ResourcesSchedule.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n ElementProps,\n factory,\n Factory,\n MantineRadius,\n StylesApiProps,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { ScheduleLabelsOverride } from '../../labels';\nimport {\n DateStringValue,\n DateTimeStringValue,\n ScheduleEventData,\n ScheduleMode,\n ScheduleResourceData,\n ScheduleViewLevel,\n} from '../../types';\nimport {\n ResourcesDayView,\n ResourcesDayViewProps,\n ResourcesDayViewStylesNames,\n} from '../ResourcesDayView/ResourcesDayView';\nimport {\n ResourcesMonthView,\n ResourcesMonthViewProps,\n ResourcesMonthViewStylesNames,\n} from '../ResourcesMonthView/ResourcesMonthView';\nimport {\n ResourcesWeekView,\n ResourcesWeekViewProps,\n ResourcesWeekViewStylesNames,\n} from '../ResourcesWeekView/ResourcesWeekView';\nimport { RenderEventBody } from '../ScheduleEvent/ScheduleEvent';\nimport classes from './ResourcesSchedule.module.css';\n\nexport type ResourcesScheduleStylesNames =\n | 'root'\n | ResourcesDayViewStylesNames\n | ResourcesWeekViewStylesNames\n | ResourcesMonthViewStylesNames;\n\nexport type ResourcesScheduleViewLevel = 'day' | 'week' | 'month';\n\ntype ResourcesScheduleCommonProps =\n | 'date'\n | 'onDateChange'\n | 'resources'\n | 'events'\n | 'locale'\n | 'radius'\n | 'labels'\n | 'renderEventBody'\n | 'renderResourceLabel'\n | 'withEventsDragAndDrop'\n | 'onEventDrop'\n | 'canDragEvent'\n | 'onEventDragStart'\n | 'onEventDragEnd'\n | 'onTimeSlotClick'\n | 'onEventClick'\n | 'onDayClick'\n | 'withDragSlotSelect'\n | 'onSlotDragEnd'\n | 'view'\n | 'onViewChange'\n | 'mode'\n | 'onExternalEventDrop'\n | 'withEventResize'\n | 'onEventResize'\n | 'canResizeEvent'\n | 'recurrenceExpansionLimit';\n\ntype ResourcesScheduleViewProps<T> = Partial<Omit<T, ResourcesScheduleCommonProps>>;\n\nexport interface ResourcesScheduleProps\n extends BoxProps, StylesApiProps<ResourcesScheduleFactory>, ElementProps<'div'> {\n __staticSelector?: string;\n\n /** List of resources to display */\n resources: ScheduleResourceData[];\n\n /** Current date to display (controlled) */\n date?: Date | DateStringValue;\n\n /** Default date (uncontrolled) */\n defaultDate?: Date | DateStringValue;\n\n /** Called when date changes via navigation */\n onDateChange?: (date: DateStringValue) => void;\n\n /** Current view level (controlled) */\n view?: ResourcesScheduleViewLevel;\n\n /** Default view level (uncontrolled) @default 'day' */\n defaultView?: ResourcesScheduleViewLevel;\n\n /** Called when view level changes */\n onViewChange?: (view: ResourcesScheduleViewLevel) => void;\n\n /** Events to display across all views */\n events?: ScheduleEventData[];\n\n /** Locale for date formatting */\n locale?: string;\n\n /** Key of theme.radius or any valid CSS value to set border-radius */\n radius?: MantineRadius;\n\n /** Labels override for i18n */\n labels?: ScheduleLabelsOverride;\n\n /** Custom event body renderer */\n renderEventBody?: RenderEventBody;\n\n /** Custom resource label renderer */\n renderResourceLabel?: (resource: ScheduleResourceData) => React.ReactNode;\n\n /** Enable drag and drop for events @default false */\n withEventsDragAndDrop?: boolean;\n\n /** Called when event is dropped */\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 time slot is clicked */\n onTimeSlotClick?: (data: {\n slotStart: DateTimeStringValue;\n slotEnd: DateTimeStringValue;\n nativeEvent: React.MouseEvent<HTMLButtonElement>;\n resourceId?: string | number;\n }) => void;\n\n /** Called when day is clicked in month view */\n onDayClick?: (data: {\n date: DateStringValue;\n nativeEvent: React.MouseEvent<HTMLButtonElement>;\n resourceId?: string | number;\n }) => 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 slot ranges @default false */\n withDragSlotSelect?: boolean;\n\n /** Called when a slot range is selected by dragging */\n onSlotDragEnd?: (data: {\n rangeStart: DateTimeStringValue;\n rangeEnd: DateTimeStringValue;\n resourceId?: string | number;\n }) => void;\n\n /** Interaction mode @default default */\n mode?: ScheduleMode;\n\n /** Called when an external item is dropped onto the schedule */\n onExternalEventDrop?: (data: {\n dataTransfer: DataTransfer;\n dropDateTime: DateTimeStringValue;\n resourceId?: string | number;\n }) => void;\n\n /** If true, events can be resized @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 /** Max number of generated recurring instances @default 2000 */\n recurrenceExpansionLimit?: number;\n\n /** Props specific to ResourcesDayView */\n dayViewProps?: ResourcesScheduleViewProps<ResourcesDayViewProps>;\n\n /** Props specific to ResourcesWeekView */\n weekViewProps?: ResourcesScheduleViewProps<ResourcesWeekViewProps>;\n\n /** Props specific to ResourcesMonthView */\n monthViewProps?: ResourcesScheduleViewProps<ResourcesMonthViewProps>;\n}\n\nexport type ResourcesScheduleFactory = Factory<{\n props: ResourcesScheduleProps;\n ref: HTMLDivElement;\n stylesNames: ResourcesScheduleStylesNames;\n}>;\n\nconst defaultProps: Partial<ResourcesScheduleProps> = {\n defaultView: 'day',\n mode: 'default',\n};\n\nexport const ResourcesSchedule = factory<ResourcesScheduleFactory>((_props) => {\n const props = useProps('ResourcesSchedule', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n resources,\n date,\n defaultDate,\n onDateChange,\n view,\n defaultView,\n onViewChange,\n events,\n locale,\n radius,\n labels,\n renderEventBody,\n renderResourceLabel,\n withEventsDragAndDrop,\n onEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n onTimeSlotClick,\n onDayClick,\n onEventClick,\n withDragSlotSelect,\n onSlotDragEnd,\n onExternalEventDrop,\n withEventResize,\n onEventResize,\n canResizeEvent,\n recurrenceExpansionLimit,\n mode,\n dayViewProps,\n weekViewProps,\n monthViewProps,\n __staticSelector,\n mod,\n ...others\n } = props;\n\n const getStyles = useStyles<ResourcesScheduleFactory>({\n name: __staticSelector || 'ResourcesSchedule',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n });\n\n const [_view, _setView] = useUncontrolled<ResourcesScheduleViewLevel>({\n value: view,\n defaultValue: defaultView,\n onChange: onViewChange,\n });\n\n const [_date, _setDate] = useUncontrolled<Date | DateStringValue>({\n value: date,\n defaultValue: defaultDate ?? new Date(),\n });\n\n const handleDateChange = (newDate: DateStringValue) => {\n _setDate(newDate);\n onDateChange?.(newDate);\n };\n\n const handleViewChange = (newView: ScheduleViewLevel) => {\n if (newView === 'day' || newView === 'week' || newView === 'month') {\n _setView(newView);\n }\n };\n\n const commonProps = {\n resources,\n date: _date,\n onDateChange: handleDateChange,\n onViewChange: handleViewChange,\n events,\n locale,\n radius,\n labels,\n renderEventBody,\n renderResourceLabel,\n withEventsDragAndDrop: mode === 'static' ? false : withEventsDragAndDrop,\n onEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n onEventClick,\n withDragSlotSelect,\n onSlotDragEnd,\n onExternalEventDrop,\n recurrenceExpansionLimit,\n mode,\n };\n\n const content = (() => {\n switch (_view) {\n case 'day':\n return (\n <ResourcesDayView\n {...commonProps}\n onTimeSlotClick={onTimeSlotClick}\n withEventResize={mode === 'static' ? false : withEventResize}\n onEventResize={onEventResize}\n canResizeEvent={canResizeEvent}\n {...dayViewProps}\n />\n );\n case 'week':\n return (\n <ResourcesWeekView\n {...commonProps}\n onTimeSlotClick={onTimeSlotClick}\n {...weekViewProps}\n />\n );\n case 'month':\n return <ResourcesMonthView {...commonProps} onDayClick={onDayClick} {...monthViewProps} />;\n default:\n return null;\n }\n })();\n\n return (\n <Box {...getStyles('root')} mod={mod} {...others}>\n {content}\n </Box>\n );\n});\n\nResourcesSchedule.displayName = '@mantine/schedule/ResourcesSchedule';\nResourcesSchedule.classes = classes;\n\nexport namespace ResourcesSchedule {\n export type Props = ResourcesScheduleProps;\n export type StylesNames = ResourcesScheduleStylesNames;\n export type Factory = ResourcesScheduleFactory;\n export type ViewLevel = ResourcesScheduleViewLevel;\n}\n"],"mappings":";;;;;;;;;AAqNA,MAAM,eAAgD;CACpD,aAAa;CACb,MAAM;AACR;AAEA,MAAa,oBAAoB,SAAmC,WAAW;CAC7E,MAAM,QAAQ,SAAS,qBAAqB,cAAc,MAAM;CAChE,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,WACA,MACA,aACA,cACA,MACA,aACA,cACA,QACA,QACA,QACA,QACA,iBACA,qBACA,uBACA,aACA,cACA,kBACA,gBACA,iBACA,YACA,cACA,oBACA,eACA,qBACA,iBACA,eACA,gBACA,0BACA,MACA,cACA,eACA,gBACA,kBACA,KACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAoC;EACpD,MAAM,oBAAoB;EAC1B,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,CAAC,OAAO,YAAY,gBAA4C;EACpE,OAAO;EACP,cAAc;EACd,UAAU;CACZ,CAAC;CAED,MAAM,CAAC,OAAO,YAAY,gBAAwC;EAChE,OAAO;EACP,cAAc,+BAAe,IAAI,KAAK;CACxC,CAAC;CAED,MAAM,oBAAoB,YAA6B;EACrD,SAAS,OAAO;EAChB,eAAe,OAAO;CACxB;CAEA,MAAM,oBAAoB,YAA+B;EACvD,IAAI,YAAY,SAAS,YAAY,UAAU,YAAY,SACzD,SAAS,OAAO;CAEpB;CAEA,MAAM,cAAc;EAClB;EACA,MAAM;EACN,cAAc;EACd,cAAc;EACd;EACA;EACA;EACA;EACA;EACA;EACA,uBAAuB,SAAS,WAAW,QAAQ;EACnD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CAEA,MAAM,iBAAiB;EACrB,QAAQ,OAAR;GACE,KAAK,OACH,OACE,oBAAC,kBAAD;IACE,GAAI;IACa;IACjB,iBAAiB,SAAS,WAAW,QAAQ;IAC9B;IACC;IAChB,GAAI;GACL,CAAA;GAEL,KAAK,QACH,OACE,oBAAC,mBAAD;IACE,GAAI;IACa;IACjB,GAAI;GACL,CAAA;GAEL,KAAK,SACH,OAAO,oBAAC,oBAAD;IAAoB,GAAI;IAAyB;IAAY,GAAI;GAAiB,CAAA;GAC3F,SACE,OAAO;EACX;CACF,EAAA,CAAG;CAEH,OACE,oBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAQ;EAAK,GAAI;YACvC;CACE,CAAA;AAET,CAAC;AAED,kBAAkB,cAAc;AAChC,kBAAkB,UAAUA"}
|
|
1
|
+
{"version":3,"file":"ResourcesSchedule.mjs","names":["classes"],"sources":["../../../src/components/ResourcesSchedule/ResourcesSchedule.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n ElementProps,\n factory,\n Factory,\n MantineRadius,\n StylesApiProps,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { ScheduleLabelsOverride } from '../../labels';\nimport {\n DateStringValue,\n DateTimeStringValue,\n ScheduleEventData,\n ScheduleMode,\n ScheduleResourceData,\n ScheduleViewLevel,\n} from '../../types';\nimport {\n ResourcesDayView,\n ResourcesDayViewProps,\n ResourcesDayViewStylesNames,\n} from '../ResourcesDayView/ResourcesDayView';\nimport {\n ResourcesMonthView,\n ResourcesMonthViewProps,\n ResourcesMonthViewStylesNames,\n} from '../ResourcesMonthView/ResourcesMonthView';\nimport {\n ResourcesWeekView,\n ResourcesWeekViewProps,\n ResourcesWeekViewStylesNames,\n} from '../ResourcesWeekView/ResourcesWeekView';\nimport { RenderEventBody } from '../ScheduleEvent/ScheduleEvent';\nimport classes from './ResourcesSchedule.module.css';\n\nexport type ResourcesScheduleStylesNames =\n | 'root'\n | ResourcesDayViewStylesNames\n | ResourcesWeekViewStylesNames\n | ResourcesMonthViewStylesNames;\n\nexport type ResourcesScheduleViewLevel = 'day' | 'week' | 'month';\n\ntype ResourcesScheduleCommonProps =\n | 'date'\n | 'onDateChange'\n | 'resources'\n | 'events'\n | 'locale'\n | 'radius'\n | 'labels'\n | 'renderEventBody'\n | 'renderResourceLabel'\n | 'withEventsDragAndDrop'\n | 'onEventDrop'\n | 'canDragEvent'\n | 'onEventDragStart'\n | 'onEventDragEnd'\n | 'onTimeSlotClick'\n | 'onEventClick'\n | 'onDayClick'\n | 'withDragSlotSelect'\n | 'onSlotDragEnd'\n | 'view'\n | 'onViewChange'\n | 'mode'\n | 'onExternalEventDrop'\n | 'withEventResize'\n | 'onEventResize'\n | 'canResizeEvent'\n | 'recurrenceExpansionLimit';\n\ntype ResourcesScheduleViewProps<T> = Partial<Omit<T, ResourcesScheduleCommonProps>>;\n\nexport interface ResourcesScheduleProps\n extends BoxProps, StylesApiProps<ResourcesScheduleFactory>, ElementProps<'div'> {\n __staticSelector?: string;\n\n /** List of resources to display */\n resources: ScheduleResourceData[];\n\n /** Current date to display (controlled) */\n date?: Date | DateStringValue;\n\n /** Default date (uncontrolled) */\n defaultDate?: Date | DateStringValue;\n\n /** Called when date changes via navigation */\n onDateChange?: (date: DateStringValue) => void;\n\n /** Current view level (controlled) */\n view?: ResourcesScheduleViewLevel;\n\n /** Default view level (uncontrolled) @default 'day' */\n defaultView?: ResourcesScheduleViewLevel;\n\n /** Called when view level changes */\n onViewChange?: (view: ResourcesScheduleViewLevel) => void;\n\n /** Events to display across all views */\n events?: ScheduleEventData[];\n\n /** Locale for date formatting */\n locale?: string;\n\n /** Key of theme.radius or any valid CSS value to set border-radius */\n radius?: MantineRadius;\n\n /** Labels override for i18n */\n labels?: ScheduleLabelsOverride;\n\n /** Custom event body renderer */\n renderEventBody?: RenderEventBody;\n\n /** Custom resource label renderer */\n renderResourceLabel?: (resource: ScheduleResourceData) => React.ReactNode;\n\n /** Enable drag and drop for events @default false */\n withEventsDragAndDrop?: boolean;\n\n /** Called when event is dropped */\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 time slot is clicked */\n onTimeSlotClick?: (data: {\n slotStart: DateTimeStringValue;\n slotEnd: DateTimeStringValue;\n nativeEvent: React.MouseEvent<HTMLButtonElement>;\n resourceId?: string | number;\n }) => void;\n\n /** Called when day is clicked in month view */\n onDayClick?: (data: {\n date: DateStringValue;\n nativeEvent: React.MouseEvent<HTMLButtonElement>;\n resourceId?: string | number;\n }) => 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 slot ranges @default false */\n withDragSlotSelect?: boolean;\n\n /** Called when a slot range is selected by dragging */\n onSlotDragEnd?: (data: {\n rangeStart: DateTimeStringValue;\n rangeEnd: DateTimeStringValue;\n resourceId?: string | number;\n }) => void;\n\n /** Interaction mode @default default */\n mode?: ScheduleMode;\n\n /** Called when an external item is dropped onto the schedule */\n onExternalEventDrop?: (data: {\n dataTransfer: DataTransfer;\n dropDateTime: DateTimeStringValue;\n resourceId?: string | number;\n }) => void;\n\n /** If true, events can be resized @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 /** Max number of generated recurring instances @default 2000 */\n recurrenceExpansionLimit?: number;\n\n /** Props specific to ResourcesDayView */\n dayViewProps?: ResourcesScheduleViewProps<ResourcesDayViewProps>;\n\n /** Props specific to ResourcesWeekView */\n weekViewProps?: ResourcesScheduleViewProps<ResourcesWeekViewProps>;\n\n /** Props specific to ResourcesMonthView */\n monthViewProps?: ResourcesScheduleViewProps<ResourcesMonthViewProps>;\n}\n\nexport type ResourcesScheduleFactory = Factory<{\n props: ResourcesScheduleProps;\n ref: HTMLDivElement;\n stylesNames: ResourcesScheduleStylesNames;\n}>;\n\nconst defaultProps: Partial<ResourcesScheduleProps> = {\n defaultView: 'day',\n mode: 'default',\n};\n\nexport const ResourcesSchedule = factory<ResourcesScheduleFactory>((_props) => {\n const props = useProps('ResourcesSchedule', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n resources,\n date,\n defaultDate,\n onDateChange,\n view,\n defaultView,\n onViewChange,\n events,\n locale,\n radius,\n labels,\n renderEventBody,\n renderResourceLabel,\n withEventsDragAndDrop,\n onEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n onTimeSlotClick,\n onDayClick,\n onEventClick,\n withDragSlotSelect,\n onSlotDragEnd,\n onExternalEventDrop,\n withEventResize,\n onEventResize,\n canResizeEvent,\n recurrenceExpansionLimit,\n mode,\n dayViewProps,\n weekViewProps,\n monthViewProps,\n __staticSelector,\n mod,\n ...others\n } = props;\n\n const getStyles = useStyles<ResourcesScheduleFactory>({\n name: __staticSelector || 'ResourcesSchedule',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n });\n\n const [_view, _setView] = useUncontrolled<ResourcesScheduleViewLevel>({\n value: view,\n defaultValue: defaultView,\n onChange: onViewChange,\n });\n\n const [_date, _setDate] = useUncontrolled<Date | DateStringValue>({\n value: date,\n defaultValue: defaultDate ?? new Date(),\n });\n\n const handleDateChange = (newDate: DateStringValue) => {\n _setDate(newDate);\n onDateChange?.(newDate);\n };\n\n const handleViewChange = (newView: ScheduleViewLevel) => {\n if (newView === 'day' || newView === 'week' || newView === 'month') {\n _setView(newView);\n }\n };\n\n const commonProps = {\n resources,\n date: _date,\n onDateChange: handleDateChange,\n onViewChange: handleViewChange,\n events,\n locale,\n radius,\n labels,\n renderEventBody,\n renderResourceLabel,\n withEventsDragAndDrop: mode === 'static' ? false : withEventsDragAndDrop,\n onEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n onEventClick,\n withDragSlotSelect,\n onSlotDragEnd,\n onExternalEventDrop,\n recurrenceExpansionLimit,\n mode,\n };\n\n const content = (() => {\n switch (_view) {\n case 'day':\n return (\n <ResourcesDayView\n {...commonProps}\n onTimeSlotClick={onTimeSlotClick}\n withEventResize={mode === 'static' ? false : withEventResize}\n onEventResize={onEventResize}\n canResizeEvent={canResizeEvent}\n {...dayViewProps}\n />\n );\n case 'week':\n return (\n <ResourcesWeekView\n {...commonProps}\n onTimeSlotClick={onTimeSlotClick}\n withEventResize={mode === 'static' ? false : withEventResize}\n onEventResize={onEventResize}\n canResizeEvent={canResizeEvent}\n {...weekViewProps}\n />\n );\n case 'month':\n return <ResourcesMonthView {...commonProps} onDayClick={onDayClick} {...monthViewProps} />;\n default:\n return null;\n }\n })();\n\n return (\n <Box {...getStyles('root')} mod={mod} {...others}>\n {content}\n </Box>\n );\n});\n\nResourcesSchedule.displayName = '@mantine/schedule/ResourcesSchedule';\nResourcesSchedule.classes = classes;\n\nexport namespace ResourcesSchedule {\n export type Props = ResourcesScheduleProps;\n export type StylesNames = ResourcesScheduleStylesNames;\n export type Factory = ResourcesScheduleFactory;\n export type ViewLevel = ResourcesScheduleViewLevel;\n}\n"],"mappings":";;;;;;;;;AAqNA,MAAM,eAAgD;CACpD,aAAa;CACb,MAAM;AACR;AAEA,MAAa,oBAAoB,SAAmC,WAAW;CAC7E,MAAM,QAAQ,SAAS,qBAAqB,cAAc,MAAM;CAChE,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,WACA,MACA,aACA,cACA,MACA,aACA,cACA,QACA,QACA,QACA,QACA,iBACA,qBACA,uBACA,aACA,cACA,kBACA,gBACA,iBACA,YACA,cACA,oBACA,eACA,qBACA,iBACA,eACA,gBACA,0BACA,MACA,cACA,eACA,gBACA,kBACA,KACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAoC;EACpD,MAAM,oBAAoB;EAC1B,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,CAAC,OAAO,YAAY,gBAA4C;EACpE,OAAO;EACP,cAAc;EACd,UAAU;CACZ,CAAC;CAED,MAAM,CAAC,OAAO,YAAY,gBAAwC;EAChE,OAAO;EACP,cAAc,+BAAe,IAAI,KAAK;CACxC,CAAC;CAED,MAAM,oBAAoB,YAA6B;EACrD,SAAS,OAAO;EAChB,eAAe,OAAO;CACxB;CAEA,MAAM,oBAAoB,YAA+B;EACvD,IAAI,YAAY,SAAS,YAAY,UAAU,YAAY,SACzD,SAAS,OAAO;CAEpB;CAEA,MAAM,cAAc;EAClB;EACA,MAAM;EACN,cAAc;EACd,cAAc;EACd;EACA;EACA;EACA;EACA;EACA;EACA,uBAAuB,SAAS,WAAW,QAAQ;EACnD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CAEA,MAAM,iBAAiB;EACrB,QAAQ,OAAR;GACE,KAAK,OACH,OACE,oBAAC,kBAAD;IACE,GAAI;IACa;IACjB,iBAAiB,SAAS,WAAW,QAAQ;IAC9B;IACC;IAChB,GAAI;GACL,CAAA;GAEL,KAAK,QACH,OACE,oBAAC,mBAAD;IACE,GAAI;IACa;IACjB,iBAAiB,SAAS,WAAW,QAAQ;IAC9B;IACC;IAChB,GAAI;GACL,CAAA;GAEL,KAAK,SACH,OAAO,oBAAC,oBAAD;IAAoB,GAAI;IAAyB;IAAY,GAAI;GAAiB,CAAA;GAC3F,SACE,OAAO;EACX;CACF,EAAA,CAAG;CAEH,OACE,oBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAQ;EAAK,GAAI;YACvC;CACE,CAAA;AAET,CAAC;AAED,kBAAkB,cAAc;AAChC,kBAAkB,UAAUA"}
|
|
@@ -9,6 +9,7 @@ import { previousWeek } from "../../utils/previous-week/previous-week.mjs";
|
|
|
9
9
|
import { getCurrentTimePosition } from "../../utils/get-current-time-position/get-current-time-position.mjs";
|
|
10
10
|
import { isInTimeRange } from "../../utils/is-in-time-range/is-in-time-range.mjs";
|
|
11
11
|
import { isAllDayEvent } from "../../utils/is-all-day-event/is-all-day-event.mjs";
|
|
12
|
+
import { getTimeAxisEventStyle } from "../../utils/get-time-axis-event-style/get-time-axis-event-style.mjs";
|
|
12
13
|
import { calculateDropTime } from "../../utils/calculate-drop-time/calculate-drop-time.mjs";
|
|
13
14
|
import { getBusinessHoursMod } from "../../utils/get-business-hours-mod/get-business-hours-mod.mjs";
|
|
14
15
|
import { getOrderedResources } from "../../utils/get-ordered-resources/get-ordered-resources.mjs";
|
|
@@ -22,6 +23,7 @@ import { ScheduleEvent } from "../ScheduleEvent/ScheduleEvent.mjs";
|
|
|
22
23
|
import { MoreEvents } from "../MoreEvents/MoreEvents.mjs";
|
|
23
24
|
import { ScheduleHeaderBase } from "../ScheduleHeader/ScheduleHeaderBase.mjs";
|
|
24
25
|
import { getWeekLabel } from "../WeekView/get-week-label/get-week-label.mjs";
|
|
26
|
+
import { useHorizontalEventResize } from "../../hooks/use-horizontal-event-resize.mjs";
|
|
25
27
|
import { getOverlapClusters } from "../ResourcesDayView/get-overlap-clusters/get-overlap-clusters.mjs";
|
|
26
28
|
import { getResourcesWeekViewEvents } from "./get-resources-week-view-events/get-resources-week-view-events.mjs";
|
|
27
29
|
import { ResourcesWeekViewRow } from "./ResourcesWeekViewRow.mjs";
|
|
@@ -31,7 +33,7 @@ import { Box, ScrollArea, createVarsResolver, factory, getRadius, rem, useMantin
|
|
|
31
33
|
import { useInterval, useIsomorphicEffect, useMergedRef } from "@mantine/hooks";
|
|
32
34
|
import { createElement, useCallback, useMemo, useRef, useState } from "react";
|
|
33
35
|
import { useDatesContext } from "@mantine/dates";
|
|
34
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
36
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
35
37
|
//#region packages/@mantine/schedule/src/components/ResourcesWeekView/ResourcesWeekView.tsx
|
|
36
38
|
const defaultProps = {
|
|
37
39
|
__staticSelector: "ResourcesWeekView",
|
|
@@ -39,12 +41,14 @@ const defaultProps = {
|
|
|
39
41
|
endTime: "23:59:59",
|
|
40
42
|
slotLabelFormat: "HH:mm",
|
|
41
43
|
intervalMinutes: 60,
|
|
44
|
+
minEventSize: 1,
|
|
42
45
|
withHeader: true,
|
|
43
46
|
weekLabelFormat: "MMM DD",
|
|
44
47
|
weekdayFormat: "ddd D",
|
|
45
48
|
highlightBusinessHours: false,
|
|
46
49
|
businessHours: ["09:00:00", "17:00:00"],
|
|
47
50
|
withEventsDragAndDrop: false,
|
|
51
|
+
withEventResize: false,
|
|
48
52
|
withDragSlotSelect: false,
|
|
49
53
|
withWeekendDays: true,
|
|
50
54
|
withCurrentTimeBubble: true,
|
|
@@ -60,7 +64,7 @@ const varsResolver = createVarsResolver((_theme, { radius, slotWidth, rowHeight,
|
|
|
60
64
|
} }));
|
|
61
65
|
const ResourcesWeekView = factory((_props) => {
|
|
62
66
|
const props = useProps("ResourcesWeekView", defaultProps, _props);
|
|
63
|
-
const { classNames, className, style, styles, unstyled, attributes, vars, startTime, endTime, date, onDateChange, resources, intervalMinutes, slotLabelFormat, radius, startScrollDateTime, scrollAreaProps, locale, withCurrentTimeIndicator: _withCurrentTimeIndicator, withCurrentTimeBubble, __staticSelector, withHeader, onViewChange, previousControlProps, nextControlProps, todayControlProps, viewSelectProps, weekLabelFormat, renderWeekLabel, events, slotWidth, rowHeight, labels, highlightBusinessHours, businessHours, renderEventBody, renderEvent, renderResourceLabel, groups, renderGroupLabel, groupLabelWidth, withEventsDragAndDrop, onEventDrop, canDragEvent, onEventDragStart, onEventDragEnd, onTimeSlotClick, onEventClick, withDragSlotSelect, onSlotDragEnd, mode, onExternalEventDrop, recurrenceExpansionLimit, maxEventsPerTimeSlot: _maxEventsPerTimeSlot, moreEventsProps, firstDayOfWeek, weekendDays, withWeekendDays, weekdayFormat, highlightToday, ...others } = props;
|
|
67
|
+
const { classNames, className, style, styles, unstyled, attributes, vars, startTime, endTime, date, onDateChange, resources, intervalMinutes, minEventSize, slotLabelFormat, radius, startScrollDateTime, scrollAreaProps, locale, withCurrentTimeIndicator: _withCurrentTimeIndicator, withCurrentTimeBubble, getCurrentTime, __staticSelector, withHeader, onViewChange, previousControlProps, nextControlProps, todayControlProps, viewSelectProps, weekLabelFormat, renderWeekLabel, events, slotWidth, rowHeight, labels, highlightBusinessHours, businessHours, renderEventBody, renderEvent, renderResourceLabel, groups, renderGroupLabel, groupLabelWidth, withEventsDragAndDrop, onEventDrop, canDragEvent, onEventDragStart, onEventDragEnd, withEventResize, onEventResize, canResizeEvent, onTimeSlotClick, onEventClick, withDragSlotSelect, onSlotDragEnd, mode, onExternalEventDrop, recurrenceExpansionLimit, maxEventsPerTimeSlot: _maxEventsPerTimeSlot, moreEventsProps, firstDayOfWeek, weekendDays, withWeekendDays, weekdayFormat, highlightToday, ...others } = props;
|
|
64
68
|
const maxEventsPerTimeSlot = _maxEventsPerTimeSlot !== void 0 ? Math.max(1, _maxEventsPerTimeSlot) : void 0;
|
|
65
69
|
const getStyles = useStyles({
|
|
66
70
|
name: __staticSelector,
|
|
@@ -112,27 +116,27 @@ const ResourcesWeekView = factory((_props) => {
|
|
|
112
116
|
ctx
|
|
113
117
|
]);
|
|
114
118
|
const totalSlotsPerDay = slots.length;
|
|
115
|
-
const
|
|
119
|
+
const resolveNow = () => getCurrentTime ? dayjs(getCurrentTime()) : dayjs();
|
|
120
|
+
const now = resolveNow();
|
|
121
|
+
const isToday = weekdays.some((day) => dayjs(day).isSame(now, "day"));
|
|
116
122
|
const withCurrentTimeIndicator = _withCurrentTimeIndicator ?? isToday;
|
|
117
|
-
const [
|
|
123
|
+
const [, setTimeIndicatorTick] = useState(0);
|
|
124
|
+
useInterval(() => setTimeIndicatorTick((tick) => tick + 1), 6e4, { autoInvoke: true });
|
|
125
|
+
const timeIndicatorOffset = getCurrentTimePosition({
|
|
118
126
|
startTime,
|
|
119
127
|
endTime,
|
|
120
|
-
intervalMinutes
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
endTime,
|
|
125
|
-
intervalMinutes
|
|
126
|
-
})), 6e4, { autoInvoke: true });
|
|
127
|
-
const todayDayIndex = weekdays.findIndex((day) => dayjs(day).isSame(dayjs(), "day"));
|
|
128
|
+
intervalMinutes,
|
|
129
|
+
now
|
|
130
|
+
});
|
|
131
|
+
const todayDayIndex = weekdays.findIndex((day) => dayjs(day).isSame(now, "day"));
|
|
128
132
|
const showTimeIndicator = withCurrentTimeIndicator && todayDayIndex >= 0 && isInTimeRange({
|
|
129
|
-
date:
|
|
133
|
+
date: now.toDate(),
|
|
130
134
|
startTime,
|
|
131
135
|
endTime
|
|
132
136
|
});
|
|
133
137
|
const formattedCurrentTime = withCurrentTimeBubble ? formatDate({
|
|
134
138
|
locale: ctx.getLocale(locale),
|
|
135
|
-
date:
|
|
139
|
+
date: now,
|
|
136
140
|
format: slotLabelFormat
|
|
137
141
|
}) : "";
|
|
138
142
|
const handleExternalDrop = useCallback((e, target) => {
|
|
@@ -195,6 +199,15 @@ const ResourcesWeekView = factory((_props) => {
|
|
|
195
199
|
});
|
|
196
200
|
}
|
|
197
201
|
});
|
|
202
|
+
const eventResize = useHorizontalEventResize({
|
|
203
|
+
enabled: withEventResize,
|
|
204
|
+
mode,
|
|
205
|
+
startTime,
|
|
206
|
+
endTime,
|
|
207
|
+
intervalMinutes,
|
|
208
|
+
onEventResize,
|
|
209
|
+
canResizeEvent
|
|
210
|
+
});
|
|
198
211
|
const withDragHandlers = (withEventsDragAndDrop || !!onExternalEventDrop) && mode !== "static";
|
|
199
212
|
const handleTimeSlotClick = (resourceId, day, slotTime, e) => {
|
|
200
213
|
if (!onTimeSlotClick) return;
|
|
@@ -215,6 +228,7 @@ const ResourcesWeekView = factory((_props) => {
|
|
|
215
228
|
weekdays,
|
|
216
229
|
startTime,
|
|
217
230
|
endTime,
|
|
231
|
+
intervalMinutes,
|
|
218
232
|
expansionLimit: recurrenceExpansionLimit
|
|
219
233
|
}), [
|
|
220
234
|
events,
|
|
@@ -222,11 +236,12 @@ const ResourcesWeekView = factory((_props) => {
|
|
|
222
236
|
weekdays,
|
|
223
237
|
startTime,
|
|
224
238
|
endTime,
|
|
239
|
+
intervalMinutes,
|
|
225
240
|
recurrenceExpansionLimit
|
|
226
241
|
]);
|
|
227
242
|
const dayLabels = weekdays.map((day) => {
|
|
228
243
|
const d = dayjs(day);
|
|
229
|
-
const today = d.isSame(
|
|
244
|
+
const today = d.isSame(now, "day") && highlightToday;
|
|
230
245
|
const weekend = ctx.getWeekendDays(weekendDays).includes(d.day());
|
|
231
246
|
return /* @__PURE__ */ createElement(Box, {
|
|
232
247
|
...getStyles("resourcesWeekViewDayLabel"),
|
|
@@ -345,32 +360,90 @@ const ResourcesWeekView = factory((_props) => {
|
|
|
345
360
|
const visibleEvents = maxEventsPerTimeSlot !== void 0 ? allRegularEvents.filter((event) => event.position.column < maxEventsPerTimeSlot) : allRegularEvents;
|
|
346
361
|
for (const event of visibleEvents) {
|
|
347
362
|
const isDraggable = dragDrop.isDraggableEvent(event);
|
|
348
|
-
const
|
|
349
|
-
const
|
|
363
|
+
const isResizable = eventResize.isResizableEvent(event);
|
|
364
|
+
const resizePosition = eventResize.getResizePosition(event.id);
|
|
365
|
+
const isThisEventResizing = resizePosition !== null;
|
|
366
|
+
const activeEdge = isThisEventResizing && eventResize.resizingEdge ? eventResize.resizingEdge : null;
|
|
367
|
+
const effectiveTop = resizePosition ? resizePosition.left : event.position.top;
|
|
368
|
+
const effectiveHeight = resizePosition ? resizePosition.width : event.position.height;
|
|
369
|
+
const eventLeft = dayOffsetPercent + effectiveTop / 100 * dayWidthPercent;
|
|
370
|
+
const eventWidth = effectiveHeight / 100 * dayWidthPercent;
|
|
371
|
+
const eventColors = isResizable ? theme.variantColorResolver({
|
|
372
|
+
color: event.color || theme.primaryColor,
|
|
373
|
+
theme,
|
|
374
|
+
variant: event.variant || "light",
|
|
375
|
+
autoContrast: true
|
|
376
|
+
}) : null;
|
|
350
377
|
const adjustPosition = maxEventsPerTimeSlot !== void 0 && event.position.overlaps > maxEventsPerTimeSlot;
|
|
351
|
-
|
|
378
|
+
const eventDate = dayjs(day).format("YYYY-MM-DD");
|
|
379
|
+
eventNodes.push(/* @__PURE__ */ jsxs(Box, {
|
|
352
380
|
...getStyles("resourcesWeekViewEventWrapper"),
|
|
381
|
+
__vars: eventColors ? { "--event-color": eventColors.color } : void 0,
|
|
382
|
+
"data-resizing": isThisEventResizing || void 0,
|
|
353
383
|
style: {
|
|
354
|
-
|
|
384
|
+
...getTimeAxisEventStyle({
|
|
385
|
+
start: eventLeft,
|
|
386
|
+
span: eventWidth,
|
|
387
|
+
minSize: minEventSize
|
|
388
|
+
}),
|
|
355
389
|
top: adjustPosition ? `calc((100% - 22px) * ${event.position.column} / ${maxEventsPerTimeSlot})` : `${event.position.offset}%`,
|
|
356
|
-
width: `calc(${eventWidth}% - 2px)`,
|
|
357
390
|
height: adjustPosition ? `calc((100% - 22px) / ${maxEventsPerTimeSlot})` : `${event.position.width}%`
|
|
358
391
|
},
|
|
359
|
-
children: /* @__PURE__ */ jsx(ScheduleEvent, {
|
|
392
|
+
children: [/* @__PURE__ */ jsx(ScheduleEvent, {
|
|
360
393
|
event,
|
|
361
394
|
autoSize: true,
|
|
362
395
|
nowrap: true,
|
|
363
396
|
draggable: isDraggable,
|
|
397
|
+
isResizing: isThisEventResizing,
|
|
364
398
|
renderEventBody,
|
|
365
399
|
renderEvent,
|
|
366
400
|
radius,
|
|
367
401
|
mode,
|
|
368
|
-
onClick: onEventClick ? (e) =>
|
|
402
|
+
onClick: onEventClick ? (e) => {
|
|
403
|
+
if (!eventResize.wasResizing()) onEventClick(event, e);
|
|
404
|
+
} : void 0,
|
|
369
405
|
style: {
|
|
370
406
|
width: "100%",
|
|
371
|
-
height: "100%"
|
|
407
|
+
height: "100%",
|
|
408
|
+
padding: 0
|
|
409
|
+
}
|
|
410
|
+
}), isResizable && mode !== "static" && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
|
|
411
|
+
...getStyles("resourcesWeekViewResizeHandle"),
|
|
412
|
+
"data-edge": "start",
|
|
413
|
+
"data-active": activeEdge === "start" || void 0,
|
|
414
|
+
onPointerDown: (e) => {
|
|
415
|
+
const container = rowSlotsContainersRef.current[resourceIndex];
|
|
416
|
+
if (container) eventResize.handleResizeStart({
|
|
417
|
+
event,
|
|
418
|
+
edge: "start",
|
|
419
|
+
container,
|
|
420
|
+
originalLeft: event.position.top,
|
|
421
|
+
originalWidth: event.position.height,
|
|
422
|
+
eventDate,
|
|
423
|
+
dayIndex,
|
|
424
|
+
dayCount: weekdays.length,
|
|
425
|
+
pointerEvent: e
|
|
426
|
+
});
|
|
427
|
+
}
|
|
428
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
429
|
+
...getStyles("resourcesWeekViewResizeHandle"),
|
|
430
|
+
"data-edge": "end",
|
|
431
|
+
"data-active": activeEdge === "end" || void 0,
|
|
432
|
+
onPointerDown: (e) => {
|
|
433
|
+
const container = rowSlotsContainersRef.current[resourceIndex];
|
|
434
|
+
if (container) eventResize.handleResizeStart({
|
|
435
|
+
event,
|
|
436
|
+
edge: "end",
|
|
437
|
+
container,
|
|
438
|
+
originalLeft: event.position.top,
|
|
439
|
+
originalWidth: event.position.height,
|
|
440
|
+
eventDate,
|
|
441
|
+
dayIndex,
|
|
442
|
+
dayCount: weekdays.length,
|
|
443
|
+
pointerEvent: e
|
|
444
|
+
});
|
|
372
445
|
}
|
|
373
|
-
})
|
|
446
|
+
})] })]
|
|
374
447
|
}, `${event.id}-${day}`));
|
|
375
448
|
}
|
|
376
449
|
if (maxEventsPerTimeSlot !== void 0) {
|
|
@@ -503,7 +576,8 @@ const ResourcesWeekView = factory((_props) => {
|
|
|
503
576
|
mod: {
|
|
504
577
|
static: mode === "static",
|
|
505
578
|
"slot-dragging": slotDragSelect.isDragging,
|
|
506
|
-
|
|
579
|
+
resizing: eventResize.isResizing,
|
|
580
|
+
"event-interaction": eventResize.isResizing || dragDrop.dragContextValue.isDragging
|
|
507
581
|
},
|
|
508
582
|
...others,
|
|
509
583
|
children: [withHeader && /* @__PURE__ */ jsx(ScheduleHeaderBase, {
|
|
@@ -511,7 +585,7 @@ const ResourcesWeekView = factory((_props) => {
|
|
|
511
585
|
navigationHandlers: {
|
|
512
586
|
previous: () => previousWeek(date, ctx.getFirstDayOfWeek(firstDayOfWeek)),
|
|
513
587
|
next: () => nextWeek(date, ctx.getFirstDayOfWeek(firstDayOfWeek)),
|
|
514
|
-
today: () => toDateString(
|
|
588
|
+
today: () => toDateString(resolveNow())
|
|
515
589
|
},
|
|
516
590
|
control: {
|
|
517
591
|
miw: 180,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResourcesWeekView.mjs","names":["classes"],"sources":["../../../src/components/ResourcesWeekView/ResourcesWeekView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport { useCallback, useMemo, useRef, useState } 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 useMantineTheme,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useInterval, 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 calculateDropTime,\n formatDate,\n getBusinessHoursMod,\n getCurrentTimePosition,\n getDayTimeIntervals,\n getGroupToResourceIdMap,\n getIndexFromDragPoint,\n getOrderedResources,\n getWeekDays,\n handleResourcesGridKeyDown,\n isAllDayEvent,\n isInTimeRange,\n nextWeek,\n previousWeek,\n ResourcesGridControlsRef,\n toDateString,\n} from '../../utils';\nimport { DragContext, DragContextValue } from '../DragContext/DragContext';\nimport { MoreEvents, MoreEventsProps, MoreEventsStylesNames } from '../MoreEvents/MoreEvents';\nimport { getOverlapClusters } from '../ResourcesDayView/get-overlap-clusters/get-overlap-clusters';\nimport { RenderEvent, RenderEventBody, ScheduleEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { CombinedScheduleHeaderStylesNames } from '../ScheduleHeader/ScheduleHeader';\nimport { ScheduleHeaderBase } from '../ScheduleHeader/ScheduleHeaderBase';\nimport { ViewSelectProps } from '../ScheduleHeader/ViewSelect/ViewSelect';\nimport { getWeekLabel } from '../WeekView/get-week-label/get-week-label';\nimport { getResourcesWeekViewEvents } from './get-resources-week-view-events/get-resources-week-view-events';\nimport { ResourcesWeekViewRow } from './ResourcesWeekViewRow';\nimport classes from './ResourcesWeekView.module.css';\n\nexport type ResourcesWeekViewStylesNames =\n | 'resourcesWeekView'\n | 'resourcesWeekViewRoot'\n | 'resourcesWeekViewInner'\n | 'resourcesWeekViewHeaderRows'\n | 'resourcesWeekViewHeaderContent'\n | 'resourcesWeekViewDayLabelsRow'\n | 'resourcesWeekViewDayLabel'\n | 'resourcesWeekViewTimeLabelsRow'\n | 'resourcesWeekViewScrollArea'\n | 'resourcesWeekViewCorner'\n | 'resourcesWeekViewTimeLabel'\n | 'resourcesWeekViewResourceLabel'\n | 'resourcesWeekViewRow'\n | 'resourcesWeekViewRowSlot'\n | 'resourcesWeekViewRowSlots'\n | 'resourcesWeekViewBackgroundEvent'\n | 'resourcesWeekViewAllDayEvent'\n | 'resourcesWeekViewCurrentTimeIndicator'\n | 'resourcesWeekViewCurrentTimeIndicatorLine'\n | 'resourcesWeekViewCurrentTimeIndicatorThumb'\n | 'resourcesWeekViewCurrentTimeIndicatorTimeBubble'\n | 'resourcesWeekViewEventWrapper'\n | 'resourcesWeekViewResizeHandle'\n | 'resourcesWeekViewGroupColumn'\n | 'resourcesWeekViewGroupColumnEmpty'\n | MoreEventsStylesNames\n | CombinedScheduleHeaderStylesNames;\n\nexport type ResourcesWeekViewCssVariables = {\n resourcesWeekView:\n | '--resources-week-view-radius'\n | '--resources-week-view-slot-width'\n | '--resources-week-view-row-height'\n | '--resources-week-view-group-label-width';\n};\n\nexport interface ResourcesWeekViewProps\n extends BoxProps, StylesApiProps<ResourcesWeekViewFactory>, ElementProps<'div'> {\n __staticSelector?: string;\n date: Date | string;\n onDateChange?: (value: DateStringValue) => void;\n resources: ScheduleResourceData[];\n startTime?: string;\n endTime?: string;\n intervalMinutes?: number;\n slotLabelFormat?: DateLabelFormat;\n radius?: MantineRadius;\n /** Date and time to scroll to on initial render, in `YYYY-MM-DD HH:mm:ss` format */\n startScrollDateTime?: string;\n scrollAreaProps?: Partial<ScrollAreaProps> & DataAttributes;\n locale?: string;\n withCurrentTimeIndicator?: boolean;\n withCurrentTimeBubble?: boolean;\n withHeader?: boolean;\n onViewChange?: (view: ScheduleViewLevel) => void;\n previousControlProps?: React.ComponentProps<'button'> & DataAttributes;\n nextControlProps?: React.ComponentProps<'button'> & DataAttributes;\n todayControlProps?: React.ComponentProps<'button'> & DataAttributes;\n viewSelectProps?: Partial<ViewSelectProps> & DataAttributes;\n weekLabelFormat?: DateLabelFormat;\n renderWeekLabel?: (params: {\n weekStart: DateStringValue;\n weekEnd: DateStringValue;\n }) => React.ReactNode;\n events?: ScheduleEventData[];\n slotWidth?: React.CSSProperties['width'];\n rowHeight?: React.CSSProperties['height'];\n labels?: ScheduleLabelsOverride;\n highlightBusinessHours?: boolean;\n businessHours?: [string, string];\n renderEventBody?: RenderEventBody;\n renderEvent?: RenderEvent;\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 withEventsDragAndDrop?: boolean;\n onEventDrop?: (data: {\n eventId: string | number;\n newStart: DateTimeStringValue;\n newEnd: DateTimeStringValue;\n event: ScheduleEventData;\n resourceId?: string | number;\n }) => void;\n canDragEvent?: (event: ScheduleEventData) => boolean;\n onEventDragStart?: (event: ScheduleEventData) => void;\n onEventDragEnd?: () => void;\n onTimeSlotClick?: (data: {\n slotStart: DateTimeStringValue;\n slotEnd: DateTimeStringValue;\n nativeEvent: React.MouseEvent<HTMLButtonElement>;\n resourceId?: string | number;\n }) => void;\n onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n withDragSlotSelect?: boolean;\n onSlotDragEnd?: (data: {\n rangeStart: DateTimeStringValue;\n rangeEnd: DateTimeStringValue;\n resourceId?: string | number;\n }) => void;\n mode?: ScheduleMode;\n onExternalEventDrop?: (data: {\n dataTransfer: DataTransfer;\n dropDateTime: DateTimeStringValue;\n resourceId?: string | number;\n }) => void;\n recurrenceExpansionLimit?: number;\n\n /** Maximum number of events visible per time slot before \"+more\" indicator shows, minimum value is 1 @default 2 */\n maxEventsPerTimeSlot?: number;\n\n /** Props passed down to `MoreEvents` component */\n moreEventsProps?: Partial<MoreEventsProps>;\n\n firstDayOfWeek?: DayOfWeek;\n weekendDays?: DayOfWeek[];\n withWeekendDays?: boolean;\n weekdayFormat?: DateLabelFormat;\n highlightToday?: boolean;\n}\n\nexport type ResourcesWeekViewFactory = Factory<{\n props: ResourcesWeekViewProps;\n ref: HTMLDivElement;\n stylesNames: ResourcesWeekViewStylesNames;\n vars: ResourcesWeekViewCssVariables;\n}>;\n\nconst defaultProps = {\n __staticSelector: 'ResourcesWeekView',\n startTime: '00:00:00',\n endTime: '23:59:59',\n slotLabelFormat: 'HH:mm',\n intervalMinutes: 60,\n withHeader: true,\n weekLabelFormat: 'MMM DD',\n weekdayFormat: 'ddd D',\n highlightBusinessHours: false,\n businessHours: ['09:00:00', '17:00:00'],\n withEventsDragAndDrop: false,\n withDragSlotSelect: false,\n withWeekendDays: true,\n withCurrentTimeBubble: true,\n highlightToday: true,\n mode: 'default',\n maxEventsPerTimeSlot: 2,\n} satisfies Partial<ResourcesWeekViewProps>;\n\nconst varsResolver = createVarsResolver<ResourcesWeekViewFactory>(\n (_theme, { radius, slotWidth, rowHeight, groupLabelWidth }) => ({\n resourcesWeekView: {\n '--resources-week-view-radius': radius ? getRadius(radius) : undefined,\n '--resources-week-view-slot-width': rem(slotWidth),\n '--resources-week-view-row-height': rem(rowHeight),\n '--resources-week-view-group-label-width': rem(groupLabelWidth),\n },\n })\n);\n\nexport const ResourcesWeekView = factory<ResourcesWeekViewFactory>((_props) => {\n const props = useProps('ResourcesWeekView', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n attributes,\n vars,\n startTime,\n endTime,\n date,\n onDateChange,\n resources,\n intervalMinutes,\n slotLabelFormat,\n radius,\n startScrollDateTime,\n scrollAreaProps,\n locale,\n withCurrentTimeIndicator: _withCurrentTimeIndicator,\n withCurrentTimeBubble,\n __staticSelector,\n withHeader,\n onViewChange,\n previousControlProps,\n nextControlProps,\n todayControlProps,\n viewSelectProps,\n weekLabelFormat,\n renderWeekLabel,\n events,\n slotWidth,\n rowHeight,\n labels,\n highlightBusinessHours,\n businessHours,\n renderEventBody,\n renderEvent,\n renderResourceLabel,\n groups,\n renderGroupLabel,\n groupLabelWidth,\n withEventsDragAndDrop,\n onEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n onTimeSlotClick,\n onEventClick,\n withDragSlotSelect,\n onSlotDragEnd,\n mode,\n onExternalEventDrop,\n recurrenceExpansionLimit,\n maxEventsPerTimeSlot: _maxEventsPerTimeSlot,\n moreEventsProps,\n firstDayOfWeek,\n weekendDays,\n withWeekendDays,\n weekdayFormat,\n highlightToday,\n ...others\n } = props;\n\n const maxEventsPerTimeSlot =\n _maxEventsPerTimeSlot !== undefined ? Math.max(1, _maxEventsPerTimeSlot) : undefined;\n\n const getStyles = useStyles<ResourcesWeekViewFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n varsResolver,\n attributes,\n rootSelector: 'resourcesWeekView',\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<ResourcesWeekViewFactory>({\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 [scrolled, setScrolled] = useState(false);\n const [scrolledX, setScrolledX] = useState(false);\n const ctx = useDatesContext();\n const slots = getDayTimeIntervals({ startTime, endTime, intervalMinutes });\n const { orderedResources, groupRanges, resourceGroupMap } = useMemo(\n () => getOrderedResources(resources, groups),\n [resources, groups]\n );\n const hasGroups = groupRanges.length > 0;\n\n const weekdays = useMemo(\n () =>\n getWeekDays({\n week: date,\n withWeekendDays,\n weekendDays: ctx.getWeekendDays(weekendDays),\n firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n }),\n [date, withWeekendDays, weekendDays, firstDayOfWeek, ctx]\n );\n\n const totalSlotsPerDay = slots.length;\n\n const isToday = weekdays.some((day) => dayjs(day).isSame(dayjs(), 'day'));\n const withCurrentTimeIndicator = _withCurrentTimeIndicator ?? isToday;\n\n const [timeIndicatorOffset, setTimeIndicatorOffset] = useState(\n getCurrentTimePosition({ startTime, endTime, intervalMinutes })\n );\n useInterval(\n () => setTimeIndicatorOffset(getCurrentTimePosition({ startTime, endTime, intervalMinutes })),\n 60000,\n { autoInvoke: true }\n );\n\n const todayDayIndex = weekdays.findIndex((day) => dayjs(day).isSame(dayjs(), 'day'));\n const showTimeIndicator =\n withCurrentTimeIndicator &&\n todayDayIndex >= 0 &&\n isInTimeRange({ date: dayjs().toDate(), startTime, endTime });\n const formattedCurrentTime = withCurrentTimeBubble\n ? formatDate({ locale: ctx.getLocale(locale), date: dayjs(), format: slotLabelFormat })\n : '';\n\n type DropTargetSlot = { resourceId: string | number; slotIndex: number };\n\n const handleExternalDrop = useCallback(\n (e: React.DragEvent, target: DropTargetSlot) => {\n if (!onExternalEventDrop) {\n return;\n }\n const dayIndex = Math.floor(target.slotIndex / totalSlotsPerDay);\n const slotInDay = target.slotIndex % totalSlotsPerDay;\n const slotDay = weekdays[dayIndex];\n if (slotDay) {\n onExternalEventDrop({\n dataTransfer: e.dataTransfer,\n dropDateTime: `${dayjs(slotDay).format('YYYY-MM-DD')} ${slots[slotInDay].startTime}`,\n resourceId: target.resourceId,\n });\n }\n },\n [onExternalEventDrop, slots, weekdays, totalSlotsPerDay]\n );\n\n const lastDropResourceId = useRef<string | number | undefined>(undefined);\n\n const handleInternalEventDrop = useCallback(\n (data: {\n eventId: string | number;\n newStart: DateTimeStringValue;\n newEnd: DateTimeStringValue;\n event: ScheduleEventData;\n }) => {\n onEventDrop?.({ ...data, resourceId: lastDropResourceId.current });\n },\n [onEventDrop]\n );\n\n const dragDrop = useDragDropHandlers<DropTargetSlot>({\n enabled: withEventsDragAndDrop,\n mode,\n onEventDrop: handleInternalEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n calculateDropTarget: (target: DropTargetSlot, draggedEvent: ScheduleEventData) => {\n lastDropResourceId.current = target.resourceId;\n const dayIndex = Math.floor(target.slotIndex / totalSlotsPerDay);\n const slotInDay = target.slotIndex % totalSlotsPerDay;\n const slotTime = slots[slotInDay].startTime;\n const targetDay = weekdays[dayIndex] || weekdays[0];\n return calculateDropTime({\n draggedEvent,\n targetDate: targetDay,\n targetSlotTime: slotTime,\n intervalMinutes,\n });\n },\n onExternalDrop: onExternalEventDrop ? handleExternalDrop : undefined,\n });\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 startDayIndex = Math.floor(startIndex / totalSlotsPerDay);\n const startSlotInDay = startIndex % totalSlotsPerDay;\n const endDayIndex = Math.floor(endIndex / totalSlotsPerDay);\n const endSlotInDay = endIndex % totalSlotsPerDay;\n const startDay = weekdays[startDayIndex];\n const endDay = weekdays[endDayIndex];\n if (startDay && endDay) {\n onSlotDragEnd({\n rangeStart: `${dayjs(startDay).format('YYYY-MM-DD')} ${slots[startSlotInDay].startTime}`,\n rangeEnd: `${dayjs(endDay).format('YYYY-MM-DD')} ${slots[endSlotInDay].endTime}`,\n resourceId: groupToResourceId.get(group) ?? group,\n });\n }\n },\n });\n\n const withDragHandlers = (withEventsDragAndDrop || !!onExternalEventDrop) && mode !== 'static';\n\n const handleTimeSlotClick = (\n resourceId: string | number,\n day: string,\n slotTime: string,\n e: React.MouseEvent<HTMLButtonElement>\n ) => {\n if (!onTimeSlotClick) {\n return;\n }\n const slotIndex = slots.findIndex((s) => s.startTime === slotTime);\n if (slotIndex === -1) {\n return;\n }\n const slot = slots[slotIndex];\n const dayStr = dayjs(day).format('YYYY-MM-DD');\n onTimeSlotClick({\n slotStart: `${dayStr} ${slot.startTime}`,\n slotEnd: `${dayStr} ${slot.endTime}`,\n nativeEvent: e,\n resourceId,\n });\n };\n\n const weekViewEvents = useMemo(\n () =>\n getResourcesWeekViewEvents({\n events,\n resources,\n weekdays,\n startTime,\n endTime,\n expansionLimit: recurrenceExpansionLimit,\n }),\n [events, resources, weekdays, startTime, endTime, recurrenceExpansionLimit]\n );\n\n const dayLabels = weekdays.map((day) => {\n const d = dayjs(day);\n const today = d.isSame(dayjs(), 'day') && highlightToday;\n const weekend = ctx.getWeekendDays(weekendDays).includes(d.day() as DayOfWeek);\n\n return (\n <Box\n {...getStyles('resourcesWeekViewDayLabel')}\n key={day}\n mod={{ today, weekend }}\n style={{ width: `calc(var(--resources-week-view-slot-width) * ${totalSlotsPerDay})` }}\n >\n {formatDate({ date: d, locale: ctx.getLocale(locale), format: weekdayFormat })}\n </Box>\n );\n });\n\n const timeLabels = weekdays.flatMap((day) =>\n slots.map((interval) => {\n const dayStr = dayjs(day).format('YYYY-MM-DD');\n const intervalTime = dayjs(`${dayStr} ${interval.startTime}`);\n const label = formatDate({\n date: intervalTime,\n locale: ctx.getLocale(locale),\n format: slotLabelFormat,\n });\n\n return (\n <Box\n {...getStyles('resourcesWeekViewTimeLabel')}\n key={`${day}-${interval.startTime}`}\n mod={{\n 'hour-start': interval.isHourStart,\n ...getBusinessHoursMod({\n time: interval.startTime,\n businessHours,\n highlightBusinessHours,\n }),\n }}\n >\n {label}\n </Box>\n );\n })\n );\n\n const slotsRef: ResourcesGridControlsRef = useRef<HTMLButtonElement[][]>([]);\n const rowSlotsContainersRef = useRef<(HTMLDivElement | null)[]>([]);\n const viewportRef = useRef<HTMLDivElement>(null);\n const mergedViewportRef = useMergedRef(viewportRef, scrollAreaProps?.viewportRef);\n\n const firstSlotIndex = { resourceIndex: 0, slotIndex: 0 };\n\n useIsomorphicEffect(() => {\n if (!startScrollDateTime || !viewportRef.current) {\n return;\n }\n const parsed = dayjs(startScrollDateTime);\n const targetDayStr = parsed.format('YYYY-MM-DD 00:00:00');\n const targetTime = parsed.format('HH:mm:ss');\n const dayIndex = weekdays.indexOf(targetDayStr);\n if (dayIndex < 0) {\n return;\n }\n const slotInDay = slots.findIndex((s) => s.startTime >= targetTime);\n if (slotInDay < 0) {\n return;\n }\n const flatIndex = dayIndex * totalSlotsPerDay + slotInDay;\n const firstResourceSlots = slotsRef.current[0];\n if (!firstResourceSlots || firstResourceSlots.length === 0) {\n return;\n }\n const targetSlot = firstResourceSlots[flatIndex];\n if (!targetSlot) {\n return;\n }\n const slotRect = targetSlot.getBoundingClientRect();\n const viewportRect = viewportRef.current.getBoundingClientRect();\n const cornerEl = viewportRef.current.querySelector(`.${classes.resourcesWeekViewCorner}`);\n const labelWidth = cornerEl ? cornerEl.getBoundingClientRect().width : 0;\n viewportRef.current.scrollTo({\n left: slotRect.left - viewportRect.left - labelWidth,\n top: 0,\n });\n }, []);\n\n const getSlotIndexFromDragPoint = useCallback((event: React.DragEvent, resourceIndex: number) => {\n return getIndexFromDragPoint(slotsRef.current[resourceIndex] ?? [], event.clientX);\n }, []);\n\n const handleSlotKeyDown = (\n event: React.KeyboardEvent<HTMLButtonElement>,\n resourceIndex: number,\n slotIndex: number\n ) => {\n handleResourcesGridKeyDown({\n controlsRef: slotsRef,\n resourceIndex,\n slotIndex,\n event,\n });\n };\n\n const dayWidthPercent = 100 / weekdays.length;\n\n const rows = orderedResources.map((resource, resourceIndex) => {\n const eventNodes: React.ReactNode[] = [];\n const resourceAllDayBars = weekViewEvents.allDayBars[resource.id] ?? [];\n const maxAllDayCount = resourceAllDayBars.reduce((max, bar) => Math.max(max, bar.row + 1), 0);\n\n weekdays.forEach((day, dayIndex) => {\n const dayEvents = weekViewEvents.byDay[day];\n if (!dayEvents) {\n return;\n }\n\n const dayOffsetPercent = (dayIndex / weekdays.length) * 100;\n\n const bgEvents = [\n ...(dayEvents.backgroundTimedEvents[resource.id] || []),\n ...(dayEvents.backgroundAllDayEvents[resource.id] || []),\n ];\n for (const event of bgEvents) {\n const colors = theme.variantColorResolver({\n color: event.color || theme.primaryColor,\n theme,\n variant: 'light',\n autoContrast: true,\n });\n\n const bgEventBody =\n typeof renderEventBody === 'function' ? renderEventBody(event) : event.title;\n\n const bgEventProps = {\n key: `bg-${event.id}-${day}`,\n ...getStyles('resourcesWeekViewBackgroundEvent', {\n style: {\n left: `${dayOffsetPercent + (event.position.top / 100) * dayWidthPercent}%`,\n width: `${(event.position.height / 100) * dayWidthPercent}%`,\n top: 0,\n height: '100%',\n },\n }),\n __vars: {\n '--bg-event-bg': colors.background,\n '--bg-event-color': colors.color,\n },\n children: bgEventBody,\n };\n\n if (typeof renderEvent === 'function') {\n eventNodes.push(renderEvent(event, bgEventProps as any));\n } else {\n eventNodes.push(<Box {...bgEventProps} />);\n }\n }\n\n const allRegularEvents = (dayEvents.regularEvents[resource.id] || []).filter(\n (event) => !isAllDayEvent({ event, date: day })\n );\n\n const visibleEvents =\n maxEventsPerTimeSlot !== undefined\n ? allRegularEvents.filter((event) => event.position.column < maxEventsPerTimeSlot)\n : allRegularEvents;\n\n for (const event of visibleEvents) {\n const isDraggable = dragDrop.isDraggableEvent(event);\n\n const eventLeft = dayOffsetPercent + (event.position.top / 100) * dayWidthPercent;\n const eventWidth = (event.position.height / 100) * dayWidthPercent;\n\n const adjustPosition =\n maxEventsPerTimeSlot !== undefined && event.position.overlaps > maxEventsPerTimeSlot;\n\n eventNodes.push(\n <div\n key={`${event.id}-${day}`}\n {...getStyles('resourcesWeekViewEventWrapper')}\n style={{\n left: `calc(${eventLeft}% + 1px)`,\n top: adjustPosition\n ? `calc((100% - 22px) * ${event.position.column} / ${maxEventsPerTimeSlot})`\n : `${event.position.offset}%`,\n width: `calc(${eventWidth}% - 2px)`,\n height: adjustPosition\n ? `calc((100% - 22px) / ${maxEventsPerTimeSlot})`\n : `${event.position.width}%`,\n }}\n >\n <ScheduleEvent\n event={event}\n autoSize\n nowrap\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={{ width: '100%', height: '100%' }}\n />\n </div>\n );\n }\n\n if (maxEventsPerTimeSlot !== undefined) {\n const clusters = getOverlapClusters(allRegularEvents);\n for (const cluster of clusters) {\n const hiddenCount = cluster.filter(\n (e) => e.position.column >= maxEventsPerTimeSlot\n ).length;\n\n if (hiddenCount > 0 && mode !== 'static') {\n const leftPercent =\n dayOffsetPercent +\n (Math.min(...cluster.map((e) => e.position.top)) / 100) * dayWidthPercent;\n const rightPercent =\n dayOffsetPercent +\n (Math.max(...cluster.map((e) => e.position.top + e.position.height)) / 100) *\n dayWidthPercent;\n\n eventNodes.push(\n <MoreEvents\n key={`more-${resource.id}-${day}-${cluster[0].id}`}\n events={cluster}\n moreEventsCount={hiddenCount}\n mode={mode}\n labels={labels}\n renderEventBody={renderEventBody}\n renderEvent={renderEvent}\n onEventClick={onEventClick}\n style={{\n position: 'absolute',\n left: `calc(${leftPercent}% + 1px)`,\n width: `calc(${rightPercent - leftPercent}% - 2px)`,\n bottom: 0,\n height: '22px',\n paddingInline: 4,\n zIndex: 4,\n }}\n {...stylesApiProps}\n {...moreEventsProps}\n />\n );\n }\n }\n }\n });\n\n const stickyLabelOffset = hasGroups\n ? 'calc(var(--resources-week-view-group-label-width) + var(--resources-week-view-resource-label-width) + 5px)'\n : 'calc(var(--resources-week-view-resource-label-width) + 5px)';\n\n resourceAllDayBars.forEach((bar) => {\n const leftPercent = bar.startDayIndex * dayWidthPercent;\n const widthPercent = (bar.endDayIndex - bar.startDayIndex + 1) * dayWidthPercent;\n\n eventNodes.push(\n <div\n key={`all-day-${bar.event.id}-${bar.startDayIndex}`}\n {...getStyles('resourcesWeekViewAllDayEvent', {\n style: {\n left: `calc(${leftPercent}% + 1px)`,\n width: `calc(${widthPercent}% - 2px)`,\n top: `calc(${bar.row} * (var(--resources-week-view-all-day-height) + 2px) + 2px)`,\n },\n })}\n >\n <ScheduleEvent\n event={bar.event}\n autoSize\n nowrap\n renderEventBody={(barEvent) => (\n <span\n style={{\n position: 'sticky',\n insetInlineStart: stickyLabelOffset,\n display: 'inline-block',\n maxWidth: '100%',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n }}\n >\n {renderEventBody ? renderEventBody(barEvent) : barEvent.title}\n </span>\n )}\n renderEvent={renderEvent}\n radius={radius}\n mode={mode}\n onClick={onEventClick ? (e) => onEventClick(bar.event, e) : undefined}\n style={{ width: '100%', height: '100%', overflow: 'visible' }}\n styles={{\n eventInner: {\n display: 'block',\n overflow: 'visible',\n lineHeight: 'var(--resources-week-view-all-day-height)',\n },\n }}\n />\n </div>\n );\n });\n\n return (\n <ResourcesWeekViewRow\n key={resource.id}\n resource={resource}\n resourceIndex={resourceIndex}\n weekdays={weekdays}\n slots={slots}\n getStyles={getStyles}\n labels={labels}\n highlightBusinessHours={highlightBusinessHours}\n businessHours={businessHours}\n withEventsDragAndDrop={withDragHandlers}\n mode={mode}\n slotsRef={slotsRef}\n firstSlotIndex={firstSlotIndex}\n onSlotKeyDown={handleSlotKeyDown}\n onSlotClick={handleTimeSlotClick}\n onRowSlotsDragOver={(event, resourceId, resIdx) => {\n const slotIndex = getSlotIndexFromDragPoint(event, resIdx);\n if (slotIndex !== null) {\n dragDrop.handleDragOver(event, { resourceId, slotIndex });\n }\n }}\n onRowSlotsDragLeave={dragDrop.handleDragLeave}\n onRowSlotsDrop={(event, resourceId, resIdx) => {\n const slotIndex = getSlotIndexFromDragPoint(event, resIdx);\n if (slotIndex !== null) {\n dragDrop.handleDrop(event, { resourceId, slotIndex });\n }\n }}\n dropTargetSlotIndex={\n dragDrop.dropTarget?.resourceId === resource.id\n ? dragDrop.dropTarget.slotIndex\n : undefined\n }\n withDragSlotSelect={withDragSlotSelect}\n onSlotPointerDown={slotDragSelect.handleSlotPointerDown}\n isSlotDragSelected={slotDragSelect.isSlotSelected}\n rowSlotsContainerRef={(node) => {\n rowSlotsContainersRef.current[resourceIndex] = node;\n }}\n renderResourceLabel={renderResourceLabel}\n renderGroupLabel={renderGroupLabel}\n scrolledX={scrolledX}\n groupInfo={hasGroups ? resourceGroupMap[resourceIndex] : undefined}\n allDayCount={maxAllDayCount}\n >\n {eventNodes}\n </ResourcesWeekViewRow>\n );\n });\n\n const headerLabel = getWeekLabel({\n weekdays,\n locale: ctx.getLocale(locale),\n weekLabelFormat: weekLabelFormat!,\n renderWeekLabel,\n });\n\n const indicatorLeftPercent =\n todayDayIndex >= 0 ? ((todayDayIndex + timeIndicatorOffset / 100) / weekdays.length) * 100 : 0;\n\n const content = (\n <Box\n {...getStyles('resourcesWeekView')}\n mod={{\n static: mode === 'static',\n 'slot-dragging': slotDragSelect.isDragging,\n 'event-interaction': dragDrop.dragContextValue.isDragging,\n }}\n {...others}\n >\n {withHeader && (\n <ScheduleHeaderBase\n view=\"week\"\n navigationHandlers={{\n previous: () => previousWeek(date, ctx.getFirstDayOfWeek(firstDayOfWeek)),\n next: () => nextWeek(date, ctx.getFirstDayOfWeek(firstDayOfWeek)),\n today: () => toDateString(dayjs()),\n }}\n control={{\n miw: 180,\n title: headerLabel,\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('resourcesWeekViewRoot')}>\n <ScrollArea\n scrollbarSize={4}\n {...scrollAreaProps}\n {...getStyles('resourcesWeekViewScrollArea', {\n className: scrollAreaProps?.className,\n style: scrollAreaProps?.style,\n })}\n onScrollPositionChange={(position) => {\n scrollAreaProps?.onScrollPositionChange?.(position);\n setScrolled(position.y !== 0);\n setScrolledX(position.x !== 0);\n }}\n viewportRef={mergedViewportRef}\n >\n <div {...getStyles('resourcesWeekViewInner')}>\n <div {...getStyles('resourcesWeekViewHeaderRows')}>\n <div\n {...getStyles('resourcesWeekViewCorner')}\n key=\"corner\"\n style={\n hasGroups\n ? {\n flexBasis:\n 'calc(var(--resources-week-view-resource-label-width) + var(--resources-week-view-group-label-width))',\n minWidth:\n 'calc(var(--resources-week-view-resource-label-width) + var(--resources-week-view-group-label-width))',\n }\n : undefined\n }\n >\n {getLabel('resources', labels)}\n </div>\n <div {...getStyles('resourcesWeekViewHeaderContent')}>\n <div {...getStyles('resourcesWeekViewDayLabelsRow')}>{dayLabels}</div>\n <Box {...getStyles('resourcesWeekViewTimeLabelsRow')} mod={{ scrolled }}>\n {timeLabels}\n </Box>\n </div>\n </div>\n\n {rows}\n\n {showTimeIndicator && (\n <Box\n {...getStyles('resourcesWeekViewCurrentTimeIndicator')}\n __vars={{\n '--indicator-left-offset': hasGroups\n ? `calc(var(--resources-week-view-resource-label-width) + var(--resources-week-view-group-label-width) + (100% - var(--resources-week-view-resource-label-width) - var(--resources-week-view-group-label-width)) * ${indicatorLeftPercent} / 100)`\n : `calc(var(--resources-week-view-resource-label-width) + (100% - var(--resources-week-view-resource-label-width)) * ${indicatorLeftPercent} / 100)`,\n '--_time-bubble-width': formattedCurrentTime\n ?.toString()\n .toLowerCase()\n .includes('m')\n ? '64px'\n : '46px',\n }}\n >\n {withCurrentTimeBubble && (\n <div {...getStyles('resourcesWeekViewCurrentTimeIndicatorTimeBubble')}>\n {formattedCurrentTime}\n </div>\n )}\n {!withCurrentTimeBubble && (\n <div {...getStyles('resourcesWeekViewCurrentTimeIndicatorThumb')} />\n )}\n <div {...getStyles('resourcesWeekViewCurrentTimeIndicatorLine')} />\n </Box>\n )}\n </div>\n </ScrollArea>\n </Box>\n </Box>\n );\n\n const dragContextValue = useMemo<DragContextValue>(\n () => dragDrop.dragContextValue,\n [dragDrop.dragContextValue]\n );\n\n if (withEventsDragAndDrop) {\n return <DragContext.Provider value={dragContextValue}>{content}</DragContext.Provider>;\n }\n\n return content;\n});\n\nResourcesWeekView.displayName = '@mantine/schedule/ResourcesWeekView';\nResourcesWeekView.classes = classes;\nResourcesWeekView.varsResolver = varsResolver;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ResourcesWeekView.mjs","names":["classes"],"sources":["../../../src/components/ResourcesWeekView/ResourcesWeekView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport { useCallback, useMemo, useRef, useState } 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 useMantineTheme,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useInterval, useIsomorphicEffect, useMergedRef } from '@mantine/hooks';\nimport { useDragDropHandlers } from '../../hooks/use-drag-drop-handlers';\nimport { useHorizontalEventResize } from '../../hooks/use-horizontal-event-resize';\nimport { useSlotDragSelect } from '../../hooks/use-slot-drag-select';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport {\n AnyDateValue,\n DateLabelFormat,\n DateStringValue,\n DateTimeStringValue,\n DayOfWeek,\n ScheduleEventData,\n ScheduleMode,\n ScheduleResourceData,\n ScheduleResourceGroup,\n ScheduleViewLevel,\n} from '../../types';\nimport {\n calculateDropTime,\n formatDate,\n getBusinessHoursMod,\n getCurrentTimePosition,\n getDayTimeIntervals,\n getGroupToResourceIdMap,\n getIndexFromDragPoint,\n getOrderedResources,\n getTimeAxisEventStyle,\n getWeekDays,\n handleResourcesGridKeyDown,\n isAllDayEvent,\n isInTimeRange,\n nextWeek,\n previousWeek,\n ResourcesGridControlsRef,\n toDateString,\n} from '../../utils';\nimport { DragContext, DragContextValue } from '../DragContext/DragContext';\nimport { MoreEvents, MoreEventsProps, MoreEventsStylesNames } from '../MoreEvents/MoreEvents';\nimport { getOverlapClusters } from '../ResourcesDayView/get-overlap-clusters/get-overlap-clusters';\nimport { RenderEvent, RenderEventBody, ScheduleEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { CombinedScheduleHeaderStylesNames } from '../ScheduleHeader/ScheduleHeader';\nimport { ScheduleHeaderBase } from '../ScheduleHeader/ScheduleHeaderBase';\nimport { ViewSelectProps } from '../ScheduleHeader/ViewSelect/ViewSelect';\nimport { getWeekLabel } from '../WeekView/get-week-label/get-week-label';\nimport { getResourcesWeekViewEvents } from './get-resources-week-view-events/get-resources-week-view-events';\nimport { ResourcesWeekViewRow } from './ResourcesWeekViewRow';\nimport classes from './ResourcesWeekView.module.css';\n\nexport type ResourcesWeekViewStylesNames =\n | 'resourcesWeekView'\n | 'resourcesWeekViewRoot'\n | 'resourcesWeekViewInner'\n | 'resourcesWeekViewHeaderRows'\n | 'resourcesWeekViewHeaderContent'\n | 'resourcesWeekViewDayLabelsRow'\n | 'resourcesWeekViewDayLabel'\n | 'resourcesWeekViewTimeLabelsRow'\n | 'resourcesWeekViewScrollArea'\n | 'resourcesWeekViewCorner'\n | 'resourcesWeekViewTimeLabel'\n | 'resourcesWeekViewResourceLabel'\n | 'resourcesWeekViewRow'\n | 'resourcesWeekViewRowSlot'\n | 'resourcesWeekViewRowSlots'\n | 'resourcesWeekViewBackgroundEvent'\n | 'resourcesWeekViewAllDayEvent'\n | 'resourcesWeekViewCurrentTimeIndicator'\n | 'resourcesWeekViewCurrentTimeIndicatorLine'\n | 'resourcesWeekViewCurrentTimeIndicatorThumb'\n | 'resourcesWeekViewCurrentTimeIndicatorTimeBubble'\n | 'resourcesWeekViewEventWrapper'\n | 'resourcesWeekViewResizeHandle'\n | 'resourcesWeekViewGroupColumn'\n | 'resourcesWeekViewGroupColumnEmpty'\n | MoreEventsStylesNames\n | CombinedScheduleHeaderStylesNames;\n\nexport type ResourcesWeekViewCssVariables = {\n resourcesWeekView:\n | '--resources-week-view-radius'\n | '--resources-week-view-slot-width'\n | '--resources-week-view-row-height'\n | '--resources-week-view-group-label-width';\n};\n\nexport interface ResourcesWeekViewProps\n extends BoxProps, StylesApiProps<ResourcesWeekViewFactory>, ElementProps<'div'> {\n __staticSelector?: string;\n date: Date | string;\n onDateChange?: (value: DateStringValue) => void;\n resources: ScheduleResourceData[];\n startTime?: string;\n endTime?: string;\n /** Number of minutes for each interval in the week view. Must divide evenly into an hour (e.g. `15`, `30`) or be a whole number of hours (e.g. `120`, `240`) @default 60 */\n intervalMinutes?: number;\n /** Minimum on-screen size of an event along the time axis, in px. Prevents very short events from collapsing. Larger values make brief events easier to see but extend them past their real start time. @default 1 */\n minEventSize?: number;\n slotLabelFormat?: DateLabelFormat;\n radius?: MantineRadius;\n /** Date and time to scroll to on initial render, in `YYYY-MM-DD HH:mm:ss` format */\n startScrollDateTime?: string;\n scrollAreaProps?: Partial<ScrollAreaProps> & DataAttributes;\n locale?: string;\n withCurrentTimeIndicator?: boolean;\n withCurrentTimeBubble?: boolean;\n\n /** A function to get the current time, called on every tick. Can be used to display the current time indicator in a different timezone. @default () => dayjs() */\n getCurrentTime?: () => AnyDateValue;\n\n withHeader?: boolean;\n onViewChange?: (view: ScheduleViewLevel) => void;\n previousControlProps?: React.ComponentProps<'button'> & DataAttributes;\n nextControlProps?: React.ComponentProps<'button'> & DataAttributes;\n todayControlProps?: React.ComponentProps<'button'> & DataAttributes;\n viewSelectProps?: Partial<ViewSelectProps> & DataAttributes;\n weekLabelFormat?: DateLabelFormat;\n renderWeekLabel?: (params: {\n weekStart: DateStringValue;\n weekEnd: DateStringValue;\n }) => React.ReactNode;\n events?: ScheduleEventData[];\n slotWidth?: React.CSSProperties['width'];\n rowHeight?: React.CSSProperties['height'];\n labels?: ScheduleLabelsOverride;\n highlightBusinessHours?: boolean;\n businessHours?: [string, string];\n renderEventBody?: RenderEventBody;\n renderEvent?: RenderEvent;\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 withEventsDragAndDrop?: boolean;\n onEventDrop?: (data: {\n eventId: string | number;\n newStart: DateTimeStringValue;\n newEnd: DateTimeStringValue;\n event: ScheduleEventData;\n resourceId?: string | number;\n }) => void;\n canDragEvent?: (event: ScheduleEventData) => boolean;\n onEventDragStart?: (event: ScheduleEventData) => void;\n onEventDragEnd?: () => void;\n onTimeSlotClick?: (data: {\n slotStart: DateTimeStringValue;\n slotEnd: DateTimeStringValue;\n nativeEvent: React.MouseEvent<HTMLButtonElement>;\n resourceId?: string | number;\n }) => void;\n onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n withDragSlotSelect?: boolean;\n onSlotDragEnd?: (data: {\n rangeStart: DateTimeStringValue;\n rangeEnd: DateTimeStringValue;\n resourceId?: string | number;\n }) => void;\n mode?: ScheduleMode;\n onExternalEventDrop?: (data: {\n dataTransfer: DataTransfer;\n dropDateTime: DateTimeStringValue;\n resourceId?: string | number;\n }) => void;\n\n /** If true, events can be resized by dragging their left/right edges @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 recurrenceExpansionLimit?: number;\n\n /** Maximum number of events visible per time slot before \"+more\" indicator shows, minimum value is 1 @default 2 */\n maxEventsPerTimeSlot?: number;\n\n /** Props passed down to `MoreEvents` component */\n moreEventsProps?: Partial<MoreEventsProps>;\n\n firstDayOfWeek?: DayOfWeek;\n weekendDays?: DayOfWeek[];\n withWeekendDays?: boolean;\n weekdayFormat?: DateLabelFormat;\n highlightToday?: boolean;\n}\n\nexport type ResourcesWeekViewFactory = Factory<{\n props: ResourcesWeekViewProps;\n ref: HTMLDivElement;\n stylesNames: ResourcesWeekViewStylesNames;\n vars: ResourcesWeekViewCssVariables;\n}>;\n\nconst defaultProps = {\n __staticSelector: 'ResourcesWeekView',\n startTime: '00:00:00',\n endTime: '23:59:59',\n slotLabelFormat: 'HH:mm',\n intervalMinutes: 60,\n minEventSize: 1,\n withHeader: true,\n weekLabelFormat: 'MMM DD',\n weekdayFormat: 'ddd D',\n highlightBusinessHours: false,\n businessHours: ['09:00:00', '17:00:00'],\n withEventsDragAndDrop: false,\n withEventResize: false,\n withDragSlotSelect: false,\n withWeekendDays: true,\n withCurrentTimeBubble: true,\n highlightToday: true,\n mode: 'default',\n maxEventsPerTimeSlot: 2,\n} satisfies Partial<ResourcesWeekViewProps>;\n\nconst varsResolver = createVarsResolver<ResourcesWeekViewFactory>(\n (_theme, { radius, slotWidth, rowHeight, groupLabelWidth }) => ({\n resourcesWeekView: {\n '--resources-week-view-radius': radius ? getRadius(radius) : undefined,\n '--resources-week-view-slot-width': rem(slotWidth),\n '--resources-week-view-row-height': rem(rowHeight),\n '--resources-week-view-group-label-width': rem(groupLabelWidth),\n },\n })\n);\n\nexport const ResourcesWeekView = factory<ResourcesWeekViewFactory>((_props) => {\n const props = useProps('ResourcesWeekView', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n attributes,\n vars,\n startTime,\n endTime,\n date,\n onDateChange,\n resources,\n intervalMinutes,\n minEventSize,\n slotLabelFormat,\n radius,\n startScrollDateTime,\n scrollAreaProps,\n locale,\n withCurrentTimeIndicator: _withCurrentTimeIndicator,\n withCurrentTimeBubble,\n getCurrentTime,\n __staticSelector,\n withHeader,\n onViewChange,\n previousControlProps,\n nextControlProps,\n todayControlProps,\n viewSelectProps,\n weekLabelFormat,\n renderWeekLabel,\n events,\n slotWidth,\n rowHeight,\n labels,\n highlightBusinessHours,\n businessHours,\n renderEventBody,\n renderEvent,\n renderResourceLabel,\n groups,\n renderGroupLabel,\n groupLabelWidth,\n withEventsDragAndDrop,\n onEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n withEventResize,\n onEventResize,\n canResizeEvent,\n onTimeSlotClick,\n onEventClick,\n withDragSlotSelect,\n onSlotDragEnd,\n mode,\n onExternalEventDrop,\n recurrenceExpansionLimit,\n maxEventsPerTimeSlot: _maxEventsPerTimeSlot,\n moreEventsProps,\n firstDayOfWeek,\n weekendDays,\n withWeekendDays,\n weekdayFormat,\n highlightToday,\n ...others\n } = props;\n\n const maxEventsPerTimeSlot =\n _maxEventsPerTimeSlot !== undefined ? Math.max(1, _maxEventsPerTimeSlot) : undefined;\n\n const getStyles = useStyles<ResourcesWeekViewFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n varsResolver,\n attributes,\n rootSelector: 'resourcesWeekView',\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<ResourcesWeekViewFactory>({\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 [scrolled, setScrolled] = useState(false);\n const [scrolledX, setScrolledX] = useState(false);\n const ctx = useDatesContext();\n const slots = getDayTimeIntervals({ startTime, endTime, intervalMinutes });\n const { orderedResources, groupRanges, resourceGroupMap } = useMemo(\n () => getOrderedResources(resources, groups),\n [resources, groups]\n );\n const hasGroups = groupRanges.length > 0;\n\n const weekdays = useMemo(\n () =>\n getWeekDays({\n week: date,\n withWeekendDays,\n weekendDays: ctx.getWeekendDays(weekendDays),\n firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n }),\n [date, withWeekendDays, weekendDays, firstDayOfWeek, ctx]\n );\n\n const totalSlotsPerDay = slots.length;\n\n const resolveNow = () => (getCurrentTime ? dayjs(getCurrentTime()) : dayjs());\n const now = resolveNow();\n const isToday = weekdays.some((day) => dayjs(day).isSame(now, 'day'));\n const withCurrentTimeIndicator = _withCurrentTimeIndicator ?? isToday;\n\n const [, setTimeIndicatorTick] = useState(0);\n useInterval(() => setTimeIndicatorTick((tick) => tick + 1), 60000, { autoInvoke: true });\n const timeIndicatorOffset = getCurrentTimePosition({ startTime, endTime, intervalMinutes, now });\n\n const todayDayIndex = weekdays.findIndex((day) => dayjs(day).isSame(now, 'day'));\n const showTimeIndicator =\n withCurrentTimeIndicator &&\n todayDayIndex >= 0 &&\n isInTimeRange({ date: now.toDate(), startTime, endTime });\n const formattedCurrentTime = withCurrentTimeBubble\n ? formatDate({ locale: ctx.getLocale(locale), date: now, format: slotLabelFormat })\n : '';\n\n type DropTargetSlot = { resourceId: string | number; slotIndex: number };\n\n const handleExternalDrop = useCallback(\n (e: React.DragEvent, target: DropTargetSlot) => {\n if (!onExternalEventDrop) {\n return;\n }\n const dayIndex = Math.floor(target.slotIndex / totalSlotsPerDay);\n const slotInDay = target.slotIndex % totalSlotsPerDay;\n const slotDay = weekdays[dayIndex];\n if (slotDay) {\n onExternalEventDrop({\n dataTransfer: e.dataTransfer,\n dropDateTime: `${dayjs(slotDay).format('YYYY-MM-DD')} ${slots[slotInDay].startTime}`,\n resourceId: target.resourceId,\n });\n }\n },\n [onExternalEventDrop, slots, weekdays, totalSlotsPerDay]\n );\n\n const lastDropResourceId = useRef<string | number | undefined>(undefined);\n\n const handleInternalEventDrop = useCallback(\n (data: {\n eventId: string | number;\n newStart: DateTimeStringValue;\n newEnd: DateTimeStringValue;\n event: ScheduleEventData;\n }) => {\n onEventDrop?.({ ...data, resourceId: lastDropResourceId.current });\n },\n [onEventDrop]\n );\n\n const dragDrop = useDragDropHandlers<DropTargetSlot>({\n enabled: withEventsDragAndDrop,\n mode,\n onEventDrop: handleInternalEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n calculateDropTarget: (target: DropTargetSlot, draggedEvent: ScheduleEventData) => {\n lastDropResourceId.current = target.resourceId;\n const dayIndex = Math.floor(target.slotIndex / totalSlotsPerDay);\n const slotInDay = target.slotIndex % totalSlotsPerDay;\n const slotTime = slots[slotInDay].startTime;\n const targetDay = weekdays[dayIndex] || weekdays[0];\n return calculateDropTime({\n draggedEvent,\n targetDate: targetDay,\n targetSlotTime: slotTime,\n intervalMinutes,\n });\n },\n onExternalDrop: onExternalEventDrop ? handleExternalDrop : undefined,\n });\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 startDayIndex = Math.floor(startIndex / totalSlotsPerDay);\n const startSlotInDay = startIndex % totalSlotsPerDay;\n const endDayIndex = Math.floor(endIndex / totalSlotsPerDay);\n const endSlotInDay = endIndex % totalSlotsPerDay;\n const startDay = weekdays[startDayIndex];\n const endDay = weekdays[endDayIndex];\n if (startDay && endDay) {\n onSlotDragEnd({\n rangeStart: `${dayjs(startDay).format('YYYY-MM-DD')} ${slots[startSlotInDay].startTime}`,\n rangeEnd: `${dayjs(endDay).format('YYYY-MM-DD')} ${slots[endSlotInDay].endTime}`,\n resourceId: groupToResourceId.get(group) ?? group,\n });\n }\n },\n });\n\n const eventResize = useHorizontalEventResize({\n enabled: withEventResize,\n mode,\n startTime,\n endTime,\n intervalMinutes,\n onEventResize,\n canResizeEvent,\n });\n\n const withDragHandlers = (withEventsDragAndDrop || !!onExternalEventDrop) && mode !== 'static';\n\n const handleTimeSlotClick = (\n resourceId: string | number,\n day: string,\n slotTime: string,\n e: React.MouseEvent<HTMLButtonElement>\n ) => {\n if (!onTimeSlotClick) {\n return;\n }\n const slotIndex = slots.findIndex((s) => s.startTime === slotTime);\n if (slotIndex === -1) {\n return;\n }\n const slot = slots[slotIndex];\n const dayStr = dayjs(day).format('YYYY-MM-DD');\n onTimeSlotClick({\n slotStart: `${dayStr} ${slot.startTime}`,\n slotEnd: `${dayStr} ${slot.endTime}`,\n nativeEvent: e,\n resourceId,\n });\n };\n\n const weekViewEvents = useMemo(\n () =>\n getResourcesWeekViewEvents({\n events,\n resources,\n weekdays,\n startTime,\n endTime,\n intervalMinutes,\n expansionLimit: recurrenceExpansionLimit,\n }),\n [events, resources, weekdays, startTime, endTime, intervalMinutes, recurrenceExpansionLimit]\n );\n\n const dayLabels = weekdays.map((day) => {\n const d = dayjs(day);\n const today = d.isSame(now, 'day') && highlightToday;\n const weekend = ctx.getWeekendDays(weekendDays).includes(d.day() as DayOfWeek);\n\n return (\n <Box\n {...getStyles('resourcesWeekViewDayLabel')}\n key={day}\n mod={{ today, weekend }}\n style={{ width: `calc(var(--resources-week-view-slot-width) * ${totalSlotsPerDay})` }}\n >\n {formatDate({ date: d, locale: ctx.getLocale(locale), format: weekdayFormat })}\n </Box>\n );\n });\n\n const timeLabels = weekdays.flatMap((day) =>\n slots.map((interval) => {\n const dayStr = dayjs(day).format('YYYY-MM-DD');\n const intervalTime = dayjs(`${dayStr} ${interval.startTime}`);\n const label = formatDate({\n date: intervalTime,\n locale: ctx.getLocale(locale),\n format: slotLabelFormat,\n });\n\n return (\n <Box\n {...getStyles('resourcesWeekViewTimeLabel')}\n key={`${day}-${interval.startTime}`}\n mod={{\n 'hour-start': interval.isHourStart,\n ...getBusinessHoursMod({\n time: interval.startTime,\n businessHours,\n highlightBusinessHours,\n }),\n }}\n >\n {label}\n </Box>\n );\n })\n );\n\n const slotsRef: ResourcesGridControlsRef = useRef<HTMLButtonElement[][]>([]);\n const rowSlotsContainersRef = useRef<(HTMLDivElement | null)[]>([]);\n const viewportRef = useRef<HTMLDivElement>(null);\n const mergedViewportRef = useMergedRef(viewportRef, scrollAreaProps?.viewportRef);\n\n const firstSlotIndex = { resourceIndex: 0, slotIndex: 0 };\n\n useIsomorphicEffect(() => {\n if (!startScrollDateTime || !viewportRef.current) {\n return;\n }\n const parsed = dayjs(startScrollDateTime);\n const targetDayStr = parsed.format('YYYY-MM-DD 00:00:00');\n const targetTime = parsed.format('HH:mm:ss');\n const dayIndex = weekdays.indexOf(targetDayStr);\n if (dayIndex < 0) {\n return;\n }\n const slotInDay = slots.findIndex((s) => s.startTime >= targetTime);\n if (slotInDay < 0) {\n return;\n }\n const flatIndex = dayIndex * totalSlotsPerDay + slotInDay;\n const firstResourceSlots = slotsRef.current[0];\n if (!firstResourceSlots || firstResourceSlots.length === 0) {\n return;\n }\n const targetSlot = firstResourceSlots[flatIndex];\n if (!targetSlot) {\n return;\n }\n const slotRect = targetSlot.getBoundingClientRect();\n const viewportRect = viewportRef.current.getBoundingClientRect();\n const cornerEl = viewportRef.current.querySelector(`.${classes.resourcesWeekViewCorner}`);\n const labelWidth = cornerEl ? cornerEl.getBoundingClientRect().width : 0;\n viewportRef.current.scrollTo({\n left: slotRect.left - viewportRect.left - labelWidth,\n top: 0,\n });\n }, []);\n\n const getSlotIndexFromDragPoint = useCallback((event: React.DragEvent, resourceIndex: number) => {\n return getIndexFromDragPoint(slotsRef.current[resourceIndex] ?? [], event.clientX);\n }, []);\n\n const handleSlotKeyDown = (\n event: React.KeyboardEvent<HTMLButtonElement>,\n resourceIndex: number,\n slotIndex: number\n ) => {\n handleResourcesGridKeyDown({\n controlsRef: slotsRef,\n resourceIndex,\n slotIndex,\n event,\n });\n };\n\n const dayWidthPercent = 100 / weekdays.length;\n\n const rows = orderedResources.map((resource, resourceIndex) => {\n const eventNodes: React.ReactNode[] = [];\n const resourceAllDayBars = weekViewEvents.allDayBars[resource.id] ?? [];\n const maxAllDayCount = resourceAllDayBars.reduce((max, bar) => Math.max(max, bar.row + 1), 0);\n\n weekdays.forEach((day, dayIndex) => {\n const dayEvents = weekViewEvents.byDay[day];\n if (!dayEvents) {\n return;\n }\n\n const dayOffsetPercent = (dayIndex / weekdays.length) * 100;\n\n const bgEvents = [\n ...(dayEvents.backgroundTimedEvents[resource.id] || []),\n ...(dayEvents.backgroundAllDayEvents[resource.id] || []),\n ];\n for (const event of bgEvents) {\n const colors = theme.variantColorResolver({\n color: event.color || theme.primaryColor,\n theme,\n variant: 'light',\n autoContrast: true,\n });\n\n const bgEventBody =\n typeof renderEventBody === 'function' ? renderEventBody(event) : event.title;\n\n const bgEventProps = {\n key: `bg-${event.id}-${day}`,\n ...getStyles('resourcesWeekViewBackgroundEvent', {\n style: {\n left: `${dayOffsetPercent + (event.position.top / 100) * dayWidthPercent}%`,\n width: `${(event.position.height / 100) * dayWidthPercent}%`,\n top: 0,\n height: '100%',\n },\n }),\n __vars: {\n '--bg-event-bg': colors.background,\n '--bg-event-color': colors.color,\n },\n children: bgEventBody,\n };\n\n if (typeof renderEvent === 'function') {\n eventNodes.push(renderEvent(event, bgEventProps as any));\n } else {\n eventNodes.push(<Box {...bgEventProps} />);\n }\n }\n\n const allRegularEvents = (dayEvents.regularEvents[resource.id] || []).filter(\n (event) => !isAllDayEvent({ event, date: day })\n );\n\n const visibleEvents =\n maxEventsPerTimeSlot !== undefined\n ? allRegularEvents.filter((event) => event.position.column < maxEventsPerTimeSlot)\n : allRegularEvents;\n\n for (const event of visibleEvents) {\n const isDraggable = dragDrop.isDraggableEvent(event);\n const isResizable = eventResize.isResizableEvent(event);\n const resizePosition = eventResize.getResizePosition(event.id);\n const isThisEventResizing = resizePosition !== null;\n const activeEdge =\n isThisEventResizing && eventResize.resizingEdge ? eventResize.resizingEdge : null;\n\n const effectiveTop = resizePosition ? resizePosition.left : event.position.top;\n const effectiveHeight = resizePosition ? resizePosition.width : event.position.height;\n const eventLeft = dayOffsetPercent + (effectiveTop / 100) * dayWidthPercent;\n const eventWidth = (effectiveHeight / 100) * dayWidthPercent;\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 adjustPosition =\n maxEventsPerTimeSlot !== undefined && event.position.overlaps > maxEventsPerTimeSlot;\n\n const eventDate = dayjs(day).format('YYYY-MM-DD');\n\n eventNodes.push(\n <Box\n key={`${event.id}-${day}`}\n {...getStyles('resourcesWeekViewEventWrapper')}\n __vars={eventColors ? { '--event-color': eventColors.color } : undefined}\n data-resizing={isThisEventResizing || undefined}\n style={{\n ...getTimeAxisEventStyle({\n start: eventLeft,\n span: eventWidth,\n minSize: minEventSize,\n }),\n top: adjustPosition\n ? `calc((100% - 22px) * ${event.position.column} / ${maxEventsPerTimeSlot})`\n : `${event.position.offset}%`,\n height: adjustPosition\n ? `calc((100% - 22px) / ${maxEventsPerTimeSlot})`\n : `${event.position.width}%`,\n }}\n >\n <ScheduleEvent\n event={event}\n autoSize\n nowrap\n draggable={isDraggable}\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%', padding: 0 }}\n />\n {isResizable && mode !== 'static' && (\n <>\n <div\n {...getStyles('resourcesWeekViewResizeHandle')}\n data-edge=\"start\"\n data-active={activeEdge === 'start' || undefined}\n onPointerDown={(e) => {\n const container = rowSlotsContainersRef.current[resourceIndex];\n if (container) {\n eventResize.handleResizeStart({\n event,\n edge: 'start',\n container,\n originalLeft: event.position.top,\n originalWidth: event.position.height,\n eventDate,\n dayIndex,\n dayCount: weekdays.length,\n pointerEvent: e,\n });\n }\n }}\n />\n <div\n {...getStyles('resourcesWeekViewResizeHandle')}\n data-edge=\"end\"\n data-active={activeEdge === 'end' || undefined}\n onPointerDown={(e) => {\n const container = rowSlotsContainersRef.current[resourceIndex];\n if (container) {\n eventResize.handleResizeStart({\n event,\n edge: 'end',\n container,\n originalLeft: event.position.top,\n originalWidth: event.position.height,\n eventDate,\n dayIndex,\n dayCount: weekdays.length,\n pointerEvent: e,\n });\n }\n }}\n />\n </>\n )}\n </Box>\n );\n }\n\n if (maxEventsPerTimeSlot !== undefined) {\n const clusters = getOverlapClusters(allRegularEvents);\n for (const cluster of clusters) {\n const hiddenCount = cluster.filter(\n (e) => e.position.column >= maxEventsPerTimeSlot\n ).length;\n\n if (hiddenCount > 0 && mode !== 'static') {\n const leftPercent =\n dayOffsetPercent +\n (Math.min(...cluster.map((e) => e.position.top)) / 100) * dayWidthPercent;\n const rightPercent =\n dayOffsetPercent +\n (Math.max(...cluster.map((e) => e.position.top + e.position.height)) / 100) *\n dayWidthPercent;\n\n eventNodes.push(\n <MoreEvents\n key={`more-${resource.id}-${day}-${cluster[0].id}`}\n events={cluster}\n moreEventsCount={hiddenCount}\n mode={mode}\n labels={labels}\n renderEventBody={renderEventBody}\n renderEvent={renderEvent}\n onEventClick={onEventClick}\n style={{\n position: 'absolute',\n left: `calc(${leftPercent}% + 1px)`,\n width: `calc(${rightPercent - leftPercent}% - 2px)`,\n bottom: 0,\n height: '22px',\n paddingInline: 4,\n zIndex: 4,\n }}\n {...stylesApiProps}\n {...moreEventsProps}\n />\n );\n }\n }\n }\n });\n\n const stickyLabelOffset = hasGroups\n ? 'calc(var(--resources-week-view-group-label-width) + var(--resources-week-view-resource-label-width) + 5px)'\n : 'calc(var(--resources-week-view-resource-label-width) + 5px)';\n\n resourceAllDayBars.forEach((bar) => {\n const leftPercent = bar.startDayIndex * dayWidthPercent;\n const widthPercent = (bar.endDayIndex - bar.startDayIndex + 1) * dayWidthPercent;\n\n eventNodes.push(\n <div\n key={`all-day-${bar.event.id}-${bar.startDayIndex}`}\n {...getStyles('resourcesWeekViewAllDayEvent', {\n style: {\n left: `calc(${leftPercent}% + 1px)`,\n width: `calc(${widthPercent}% - 2px)`,\n top: `calc(${bar.row} * (var(--resources-week-view-all-day-height) + 2px) + 2px)`,\n },\n })}\n >\n <ScheduleEvent\n event={bar.event}\n autoSize\n nowrap\n renderEventBody={(barEvent) => (\n <span\n style={{\n position: 'sticky',\n insetInlineStart: stickyLabelOffset,\n display: 'inline-block',\n maxWidth: '100%',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n }}\n >\n {renderEventBody ? renderEventBody(barEvent) : barEvent.title}\n </span>\n )}\n renderEvent={renderEvent}\n radius={radius}\n mode={mode}\n onClick={onEventClick ? (e) => onEventClick(bar.event, e) : undefined}\n style={{ width: '100%', height: '100%', overflow: 'visible' }}\n styles={{\n eventInner: {\n display: 'block',\n overflow: 'visible',\n lineHeight: 'var(--resources-week-view-all-day-height)',\n },\n }}\n />\n </div>\n );\n });\n\n return (\n <ResourcesWeekViewRow\n key={resource.id}\n resource={resource}\n resourceIndex={resourceIndex}\n weekdays={weekdays}\n slots={slots}\n getStyles={getStyles}\n labels={labels}\n highlightBusinessHours={highlightBusinessHours}\n businessHours={businessHours}\n withEventsDragAndDrop={withDragHandlers}\n mode={mode}\n slotsRef={slotsRef}\n firstSlotIndex={firstSlotIndex}\n onSlotKeyDown={handleSlotKeyDown}\n onSlotClick={handleTimeSlotClick}\n onRowSlotsDragOver={(event, resourceId, resIdx) => {\n const slotIndex = getSlotIndexFromDragPoint(event, resIdx);\n if (slotIndex !== null) {\n dragDrop.handleDragOver(event, { resourceId, slotIndex });\n }\n }}\n onRowSlotsDragLeave={dragDrop.handleDragLeave}\n onRowSlotsDrop={(event, resourceId, resIdx) => {\n const slotIndex = getSlotIndexFromDragPoint(event, resIdx);\n if (slotIndex !== null) {\n dragDrop.handleDrop(event, { resourceId, slotIndex });\n }\n }}\n dropTargetSlotIndex={\n dragDrop.dropTarget?.resourceId === resource.id\n ? dragDrop.dropTarget.slotIndex\n : undefined\n }\n withDragSlotSelect={withDragSlotSelect}\n onSlotPointerDown={slotDragSelect.handleSlotPointerDown}\n isSlotDragSelected={slotDragSelect.isSlotSelected}\n rowSlotsContainerRef={(node) => {\n rowSlotsContainersRef.current[resourceIndex] = node;\n }}\n renderResourceLabel={renderResourceLabel}\n renderGroupLabel={renderGroupLabel}\n scrolledX={scrolledX}\n groupInfo={hasGroups ? resourceGroupMap[resourceIndex] : undefined}\n allDayCount={maxAllDayCount}\n >\n {eventNodes}\n </ResourcesWeekViewRow>\n );\n });\n\n const headerLabel = getWeekLabel({\n weekdays,\n locale: ctx.getLocale(locale),\n weekLabelFormat: weekLabelFormat!,\n renderWeekLabel,\n });\n\n const indicatorLeftPercent =\n todayDayIndex >= 0 ? ((todayDayIndex + timeIndicatorOffset / 100) / weekdays.length) * 100 : 0;\n\n const content = (\n <Box\n {...getStyles('resourcesWeekView')}\n mod={{\n static: mode === 'static',\n 'slot-dragging': slotDragSelect.isDragging,\n resizing: eventResize.isResizing,\n 'event-interaction': eventResize.isResizing || dragDrop.dragContextValue.isDragging,\n }}\n {...others}\n >\n {withHeader && (\n <ScheduleHeaderBase\n view=\"week\"\n navigationHandlers={{\n previous: () => previousWeek(date, ctx.getFirstDayOfWeek(firstDayOfWeek)),\n next: () => nextWeek(date, ctx.getFirstDayOfWeek(firstDayOfWeek)),\n today: () => toDateString(resolveNow()),\n }}\n control={{\n miw: 180,\n title: headerLabel,\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('resourcesWeekViewRoot')}>\n <ScrollArea\n scrollbarSize={4}\n {...scrollAreaProps}\n {...getStyles('resourcesWeekViewScrollArea', {\n className: scrollAreaProps?.className,\n style: scrollAreaProps?.style,\n })}\n onScrollPositionChange={(position) => {\n scrollAreaProps?.onScrollPositionChange?.(position);\n setScrolled(position.y !== 0);\n setScrolledX(position.x !== 0);\n }}\n viewportRef={mergedViewportRef}\n >\n <div {...getStyles('resourcesWeekViewInner')}>\n <div {...getStyles('resourcesWeekViewHeaderRows')}>\n <div\n {...getStyles('resourcesWeekViewCorner')}\n key=\"corner\"\n style={\n hasGroups\n ? {\n flexBasis:\n 'calc(var(--resources-week-view-resource-label-width) + var(--resources-week-view-group-label-width))',\n minWidth:\n 'calc(var(--resources-week-view-resource-label-width) + var(--resources-week-view-group-label-width))',\n }\n : undefined\n }\n >\n {getLabel('resources', labels)}\n </div>\n <div {...getStyles('resourcesWeekViewHeaderContent')}>\n <div {...getStyles('resourcesWeekViewDayLabelsRow')}>{dayLabels}</div>\n <Box {...getStyles('resourcesWeekViewTimeLabelsRow')} mod={{ scrolled }}>\n {timeLabels}\n </Box>\n </div>\n </div>\n\n {rows}\n\n {showTimeIndicator && (\n <Box\n {...getStyles('resourcesWeekViewCurrentTimeIndicator')}\n __vars={{\n '--indicator-left-offset': hasGroups\n ? `calc(var(--resources-week-view-resource-label-width) + var(--resources-week-view-group-label-width) + (100% - var(--resources-week-view-resource-label-width) - var(--resources-week-view-group-label-width)) * ${indicatorLeftPercent} / 100)`\n : `calc(var(--resources-week-view-resource-label-width) + (100% - var(--resources-week-view-resource-label-width)) * ${indicatorLeftPercent} / 100)`,\n '--_time-bubble-width': formattedCurrentTime\n ?.toString()\n .toLowerCase()\n .includes('m')\n ? '64px'\n : '46px',\n }}\n >\n {withCurrentTimeBubble && (\n <div {...getStyles('resourcesWeekViewCurrentTimeIndicatorTimeBubble')}>\n {formattedCurrentTime}\n </div>\n )}\n {!withCurrentTimeBubble && (\n <div {...getStyles('resourcesWeekViewCurrentTimeIndicatorThumb')} />\n )}\n <div {...getStyles('resourcesWeekViewCurrentTimeIndicatorLine')} />\n </Box>\n )}\n </div>\n </ScrollArea>\n </Box>\n </Box>\n );\n\n const dragContextValue = useMemo<DragContextValue>(\n () => dragDrop.dragContextValue,\n [dragDrop.dragContextValue]\n );\n\n if (withEventsDragAndDrop) {\n return <DragContext.Provider value={dragContextValue}>{content}</DragContext.Provider>;\n }\n\n return content;\n});\n\nResourcesWeekView.displayName = '@mantine/schedule/ResourcesWeekView';\nResourcesWeekView.classes = classes;\nResourcesWeekView.varsResolver = varsResolver;\n"],"mappings":"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"}
|
|
@@ -21,7 +21,7 @@ function assignAllDayRows(bars) {
|
|
|
21
21
|
bar.row = row;
|
|
22
22
|
}
|
|
23
23
|
}
|
|
24
|
-
function getResourcesWeekViewEvents({ events, resources, weekdays, startTime, endTime, expansionLimit }) {
|
|
24
|
+
function getResourcesWeekViewEvents({ events, resources, weekdays, startTime, endTime, intervalMinutes, expansionLimit }) {
|
|
25
25
|
const expandedEvents = expandRecurringEvents({
|
|
26
26
|
events,
|
|
27
27
|
rangeStart: dayjs(weekdays[0]).startOf("day").toDate(),
|
|
@@ -55,7 +55,8 @@ function getResourcesWeekViewEvents({ events, resources, weekdays, startTime, en
|
|
|
55
55
|
resources,
|
|
56
56
|
date: day,
|
|
57
57
|
startTime,
|
|
58
|
-
endTime
|
|
58
|
+
endTime,
|
|
59
|
+
intervalMinutes
|
|
59
60
|
});
|
|
60
61
|
}
|
|
61
62
|
const allDayBars = {};
|