@mantine/schedule 9.0.2 → 9.1.1

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.
Files changed (61) hide show
  1. package/cjs/components/DayView/DayView.cjs +3 -0
  2. package/cjs/components/DayView/DayView.cjs.map +1 -1
  3. package/cjs/components/MonthView/MonthView.cjs +4 -0
  4. package/cjs/components/MonthView/MonthView.cjs.map +1 -1
  5. package/cjs/components/MonthView/get-month-view-events/get-month-positioned-events.cjs +2 -1
  6. package/cjs/components/MonthView/get-month-view-events/get-month-positioned-events.cjs.map +1 -1
  7. package/cjs/components/MoreEvents/MoreEvents.cjs +3 -1
  8. package/cjs/components/MoreEvents/MoreEvents.cjs.map +1 -1
  9. package/cjs/components/ScheduleHeader/HeaderControl/HeaderControl.cjs +7 -5
  10. package/cjs/components/ScheduleHeader/HeaderControl/HeaderControl.cjs.map +1 -1
  11. package/cjs/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.cjs +6 -4
  12. package/cjs/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.cjs.map +1 -1
  13. package/cjs/components/ScheduleHeader/ScheduleHeader.cjs +22 -17
  14. package/cjs/components/ScheduleHeader/ScheduleHeader.cjs.map +1 -1
  15. package/cjs/components/ScheduleHeader/ScheduleHeaderBase.cjs +1 -0
  16. package/cjs/components/ScheduleHeader/ScheduleHeaderBase.cjs.map +1 -1
  17. package/cjs/components/ScheduleHeader/ScheduleHeaderContext.cjs +20 -0
  18. package/cjs/components/ScheduleHeader/ScheduleHeaderContext.cjs.map +1 -0
  19. package/cjs/components/ScheduleHeader/ViewSelect/ViewSelect.cjs +5 -3
  20. package/cjs/components/ScheduleHeader/ViewSelect/ViewSelect.cjs.map +1 -1
  21. package/cjs/components/WeekView/WeekView.cjs +2 -2
  22. package/cjs/components/WeekView/WeekView.cjs.map +1 -1
  23. package/cjs/utils/is-all-day-event/is-all-day-event.cjs +3 -2
  24. package/cjs/utils/is-all-day-event/is-all-day-event.cjs.map +1 -1
  25. package/cjs/utils/is-event-in-time-range/is-event-in-time-range.cjs +8 -1
  26. package/cjs/utils/is-event-in-time-range/is-event-in-time-range.cjs.map +1 -1
  27. package/cjs/utils/is-multiday-event/is-multiday-event.cjs +2 -1
  28. package/cjs/utils/is-multiday-event/is-multiday-event.cjs.map +1 -1
  29. package/esm/components/DayView/DayView.mjs +3 -0
  30. package/esm/components/DayView/DayView.mjs.map +1 -1
  31. package/esm/components/MonthView/MonthView.mjs +4 -0
  32. package/esm/components/MonthView/MonthView.mjs.map +1 -1
  33. package/esm/components/MonthView/get-month-view-events/get-month-positioned-events.mjs +2 -1
  34. package/esm/components/MonthView/get-month-view-events/get-month-positioned-events.mjs.map +1 -1
  35. package/esm/components/MoreEvents/MoreEvents.mjs +3 -1
  36. package/esm/components/MoreEvents/MoreEvents.mjs.map +1 -1
  37. package/esm/components/ScheduleHeader/HeaderControl/HeaderControl.mjs +7 -5
  38. package/esm/components/ScheduleHeader/HeaderControl/HeaderControl.mjs.map +1 -1
  39. package/esm/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.mjs +6 -4
  40. package/esm/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.mjs.map +1 -1
  41. package/esm/components/ScheduleHeader/ScheduleHeader.mjs +22 -17
  42. package/esm/components/ScheduleHeader/ScheduleHeader.mjs.map +1 -1
  43. package/esm/components/ScheduleHeader/ScheduleHeaderBase.mjs +1 -0
  44. package/esm/components/ScheduleHeader/ScheduleHeaderBase.mjs.map +1 -1
  45. package/esm/components/ScheduleHeader/ScheduleHeaderContext.mjs +18 -0
  46. package/esm/components/ScheduleHeader/ScheduleHeaderContext.mjs.map +1 -0
  47. package/esm/components/ScheduleHeader/ViewSelect/ViewSelect.mjs +5 -3
  48. package/esm/components/ScheduleHeader/ViewSelect/ViewSelect.mjs.map +1 -1
  49. package/esm/components/WeekView/WeekView.mjs +2 -2
  50. package/esm/components/WeekView/WeekView.mjs.map +1 -1
  51. package/esm/utils/is-all-day-event/is-all-day-event.mjs +3 -2
  52. package/esm/utils/is-all-day-event/is-all-day-event.mjs.map +1 -1
  53. package/esm/utils/is-event-in-time-range/is-event-in-time-range.mjs +8 -1
  54. package/esm/utils/is-event-in-time-range/is-event-in-time-range.mjs.map +1 -1
  55. package/esm/utils/is-multiday-event/is-multiday-event.mjs +2 -1
  56. package/esm/utils/is-multiday-event/is-multiday-event.mjs.map +1 -1
  57. package/lib/components/MoreEvents/MoreEvents.d.ts +5 -1
  58. package/lib/components/ScheduleHeader/ScheduleHeader.d.ts +3 -0
  59. package/lib/components/ScheduleHeader/ScheduleHeaderContext.d.ts +3 -0
  60. package/lib/components/WeekView/WeekView.d.ts +2 -0
  61. package/package.json +4 -4
@@ -1 +1 @@
1
- {"version":3,"file":"MonthView.mjs","names":["classes"],"sources":["../../../src/components/MonthView/MonthView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport { useCallback, useRef } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n factory,\n Factory,\n getRadius,\n MantineRadius,\n ScrollArea,\n ScrollAreaProps,\n StylesApiProps,\n UnstyledButton,\n useMantineTheme,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useDragDropHandlers } from '../../hooks/use-drag-drop-handlers';\nimport { useSlotDragSelect } from '../../hooks/use-slot-drag-select';\nimport { ScheduleLabelsOverride } from '../../labels';\nimport {\n DateLabelFormat,\n DateStringValue,\n DateTimeStringValue,\n DayOfWeek,\n ScheduleEventData,\n ScheduleMode,\n ScheduleViewLevel,\n} from '../../types';\nimport {\n calculateMonthDropDate,\n expandRecurringEvents,\n getMonthDays,\n getMonthRange,\n getWeekdaysNames,\n getWeekNumber,\n isSameMonth,\n toDateString,\n} from '../../utils';\nimport { DragContext } from '../DragContext/DragContext';\nimport { MoreEvents, MoreEventsProps } from '../MoreEvents/MoreEvents';\nimport { RenderEvent, RenderEventBody, ScheduleEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { MonthYearSelectProps } from '../ScheduleHeader/MonthYearSelect/MonthYearSelect';\nimport { CombinedScheduleHeaderStylesNames } from '../ScheduleHeader/ScheduleHeader';\nimport { ScheduleHeaderBase } from '../ScheduleHeader/ScheduleHeaderBase';\nimport { ViewSelectProps } from '../ScheduleHeader/ViewSelect/ViewSelect';\nimport { getMonthViewEvents } from './get-month-view-events/get-month-view-events';\nimport { handleMonthViewKeyDown, MonthViewControlsRef } from './handle-month-view-key-down';\nimport classes from './MonthView.module.css';\n\nexport type MonthViewStylesNames =\n | 'monthView'\n | 'monthViewScrollArea'\n | 'monthViewInner'\n | 'monthViewWeek'\n | 'monthViewDay'\n | 'monthViewDayLabel'\n | 'monthViewWeekNumber'\n | 'monthViewWeekday'\n | 'monthViewWeekdays'\n | 'monthViewWeekdaysCorner'\n | 'monthViewEvents'\n | 'monthViewBackgroundEvent'\n | CombinedScheduleHeaderStylesNames;\n\nexport type MonthViewCssVariables = {\n monthView: '--month-view-radius' | '--month-view-max-events';\n};\n\nexport interface MonthViewProps\n extends BoxProps, StylesApiProps<MonthViewFactory>, ElementProps<'div'> {\n __staticSelector?: string;\n\n /** Date to display, Date object or date string in `YYYY-MM-DD 00:00:00` format */\n date: Date | string;\n\n /** Called with the new date value when a date is selected */\n onDateChange?: (value: DateStringValue) => void;\n\n /** If set, week numbers are displayed in the first column @default false */\n withWeekNumbers?: boolean;\n\n /** If set, weekdays names are displayed in the first row @default true */\n withWeekDays?: boolean;\n\n /** Locale passed down to dayjs, overrides value defined on `DatesProvider` */\n locale?: string;\n\n /** Number 0-6, where 0 – Sunday and 6 – Saturday. @default 1 – Monday */\n firstDayOfWeek?: DayOfWeek;\n\n /** `dayjs` format for weekdays names. By default, the first letter of the weekday. */\n weekdayFormat?: DateLabelFormat;\n\n /** Indices of weekend days, 0-6, where 0 is Sunday and 6 is Saturday. The default value is defined by `DatesProvider`. */\n weekendDays?: DayOfWeek[];\n\n /** Props passed down to the week number button */\n getWeekNumberProps?: (weekStartDate: DateStringValue) => Record<string, any>;\n\n /** Props passed down to the day button */\n getDayProps?: (date: DateStringValue) => Record<string, any>;\n\n /** Called when day is clicked */\n onDayClick?: (date: DateStringValue, event: React.MouseEvent<HTMLButtonElement>) => void;\n\n /** Called with first day of the week when week number is clicked */\n onWeekNumberClick?: (date: DateStringValue, event: React.MouseEvent<HTMLButtonElement>) => void;\n\n /** If set, always renders 6 weeks in the month view @default true */\n consistentWeeks?: boolean;\n\n /** If set, highlights the current day @default true */\n highlightToday?: boolean;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** If set, days from the previous and next months are displayed to fill the weeks @default true */\n withOutsideDays?: boolean;\n\n /** If set, the header is displayed @default true */\n withHeader?: boolean;\n\n /** Props passed down to `MonthYearSelect` component in the header */\n monthYearSelectProps?: Partial<MonthYearSelectProps>;\n\n /** Called when view level select button is clicked */\n onViewChange?: (view: ScheduleViewLevel) => void;\n\n /** Props passed to previous month control */\n previousControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n /** Props passed to next month control */\n nextControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n /** Props passed to today control */\n todayControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n /** Props passed to view level select */\n viewSelectProps?: Partial<ViewSelectProps> & DataAttributes;\n\n /** Events to display */\n events?: ScheduleEventData[];\n\n /** Props passed down to `MoreEvents` component */\n moreEventsProps?: Partial<MoreEventsProps>;\n\n /** Function to customize event body, `event` object is passed as first argument */\n renderEventBody?: RenderEventBody;\n\n /** Function to fully customize event rendering, receives all props that would be passed to the root element including children */\n renderEvent?: RenderEvent;\n\n /** If true, events can be dragged and dropped @default false */\n withEventsDragAndDrop?: boolean;\n\n /** Called when event is dropped on new date */\n onEventDrop?: (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 dragged */\n canDragEvent?: (event: ScheduleEventData) => boolean;\n\n /** Called when any event drag starts */\n onEventDragStart?: (event: ScheduleEventData) => void;\n\n /** Called when any event drag ends */\n onEventDragEnd?: () => void;\n\n /** Called when event is clicked */\n onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n\n /** If set, enables drag-to-select day ranges @default false */\n withDragSlotSelect?: boolean;\n\n /** Called when a day range is selected by dragging */\n onSlotDragEnd?: (rangeStart: DateTimeStringValue, rangeEnd: DateTimeStringValue) => void;\n\n /** Labels override for i18n */\n labels?: ScheduleLabelsOverride;\n\n /** Interaction mode: 'default' allows all interactions, 'static' disables event interactions @default default */\n mode?: ScheduleMode;\n\n /** Props passed down to `ScrollArea` component */\n scrollAreaProps?: Partial<ScrollAreaProps> & DataAttributes;\n\n /** Called when an external item is dropped onto the schedule. Receives the `DataTransfer` object and the drop target datetime. */\n onExternalEventDrop?: (dataTransfer: DataTransfer, dropDateTime: DateTimeStringValue) => void;\n\n /** Max number of generated recurring instances per recurring series @default 2000 */\n recurrenceExpansionLimit?: number;\n\n /** Maximum number of events visible per day before \"+more\" indicator shows, value is clamped between 1 and 10 @default 2 */\n maxEventsPerDay?: number;\n}\n\nexport type MonthViewFactory = Factory<{\n props: MonthViewProps;\n ref: HTMLDivElement;\n stylesNames: MonthViewStylesNames;\n vars: MonthViewCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<MonthViewFactory>(\n (_theme, { radius, maxEventsPerDay }) => ({\n monthView: {\n '--month-view-radius': radius !== undefined ? getRadius(radius) : undefined,\n '--month-view-max-events':\n maxEventsPerDay !== undefined ? `${Math.min(10, Math.max(1, maxEventsPerDay))}` : undefined,\n },\n })\n);\n\nconst defaultProps = {\n __staticSelector: 'MonthView',\n withWeekDays: true,\n consistentWeeks: true,\n highlightToday: true,\n withOutsideDays: true,\n withHeader: true,\n weekdayFormat: 'ddd',\n withEventsDragAndDrop: false,\n withDragSlotSelect: false,\n mode: 'default',\n} satisfies Partial<MonthViewProps>;\n\nexport const MonthView = factory<MonthViewFactory>((_props) => {\n const props = useProps('MonthView', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n attributes,\n vars,\n mod,\n date,\n onDateChange,\n withWeekNumbers,\n withWeekDays,\n locale,\n weekdayFormat,\n firstDayOfWeek,\n weekendDays,\n __staticSelector,\n getDayProps,\n getWeekNumberProps,\n onDayClick,\n onWeekNumberClick,\n consistentWeeks,\n highlightToday,\n radius,\n withOutsideDays,\n withHeader,\n monthYearSelectProps,\n onViewChange,\n todayControlProps,\n nextControlProps,\n previousControlProps,\n viewSelectProps,\n events,\n moreEventsProps,\n renderEventBody,\n renderEvent,\n withEventsDragAndDrop,\n onEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n onEventClick,\n withDragSlotSelect,\n onSlotDragEnd,\n labels,\n mode,\n scrollAreaProps,\n onExternalEventDrop,\n recurrenceExpansionLimit,\n maxEventsPerDay: _maxEventsPerDay,\n ...others\n } = props;\n\n const maxEventsPerDay = Math.min(10, Math.max(1, _maxEventsPerDay ?? 2));\n\n const getStyles = useStyles<MonthViewFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'monthView',\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MonthViewFactory>({\n classNames,\n styles,\n props,\n });\n\n const stylesApiProps = {\n classNames: resolvedClassNames,\n styles: resolvedStyles,\n attributes,\n __staticSelector,\n radius,\n };\n\n const theme = useMantineTheme();\n const ctx = useDatesContext();\n\n const range = getMonthRange({\n month: date,\n withOutsideDays,\n consistentWeeks,\n firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n });\n\n const expandedEvents = expandRecurringEvents({\n events,\n rangeStart: dayjs(range.start).startOf('day').toDate(),\n rangeEnd: dayjs(range.end).endOf('day').toDate(),\n expansionLimit: recurrenceExpansionLimit,\n });\n\n const monthEvents = getMonthViewEvents({\n date,\n events: expandedEvents,\n firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n withOutsideDays,\n consistentWeeks,\n });\n\n const handleExternalDrop = useCallback(\n (e: React.DragEvent, day: string) => {\n if (!onExternalEventDrop) {\n return;\n }\n onExternalEventDrop(e.dataTransfer, `${dayjs(day).format('YYYY-MM-DD')} 00:00:00`);\n },\n [onExternalEventDrop]\n );\n\n const dragDrop = useDragDropHandlers<string>({\n enabled: withEventsDragAndDrop,\n mode,\n onEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n calculateDropTarget: (targetDay: string, draggedEvent: ScheduleEventData) => {\n return calculateMonthDropDate({\n draggedEvent,\n targetDay,\n });\n },\n onExternalDrop: onExternalEventDrop ? handleExternalDrop : undefined,\n });\n\n const withDragHandlers = (withEventsDragAndDrop || !!onExternalEventDrop) && mode !== 'static';\n\n const flatDaysRef = useRef<string[]>([]);\n\n const slotDragSelect = useSlotDragSelect({\n enabled: withDragSlotSelect && mode !== 'static',\n onDragEnd: (startIndex, endIndex) => {\n if (!onSlotDragEnd) {\n return;\n }\n const startDay = flatDaysRef.current[startIndex];\n const endDay = flatDaysRef.current[endIndex];\n if (startDay && endDay) {\n onSlotDragEnd(\n dayjs(startDay).startOf('day').format('YYYY-MM-DD HH:mm:ss'),\n dayjs(endDay).endOf('day').format('YYYY-MM-DD HH:mm:ss')\n );\n }\n },\n });\n\n const daysRef: MonthViewControlsRef = useRef<HTMLButtonElement[][]>([]);\n\n const monthDays = getMonthDays({\n month: dayjs(date).format('YYYY-MM-DD 00:00:00'),\n firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n consistentWeeks: consistentWeeks && withOutsideDays,\n });\n\n const firstDayIndex = (() => {\n for (let weekIndex = 0; weekIndex < monthDays.length; weekIndex++) {\n const week = monthDays[weekIndex];\n for (let dayIndex = 0; dayIndex < week.length; dayIndex++) {\n const day = week[dayIndex];\n const outside = !isSameMonth(date, day);\n if (!outside || withOutsideDays) {\n return { weekIndex, dayIndex };\n }\n }\n }\n return { weekIndex: 0, dayIndex: 0 };\n })();\n\n const weekdays = withWeekDays\n ? getWeekdaysNames({\n locale: ctx.getLocale(locale),\n format: weekdayFormat,\n firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n }).map((day, index) => (\n <div {...getStyles('monthViewWeekday')} key={index}>\n {day}\n </div>\n ))\n : null;\n\n const monthGroup = 'month';\n flatDaysRef.current = monthDays.flat();\n\n const weeks = monthDays.map((week, weekIndex) => {\n if (!daysRef.current[weekIndex]) {\n daysRef.current[weekIndex] = [];\n }\n\n const days = week.map((day, dayIndex) => {\n const outside = !isSameMonth(date, day);\n const weekend = ctx.getWeekendDays(weekendDays).includes(dayjs(day).day());\n const ariaLabel = dayjs(day)\n .locale(locale || ctx.locale)\n .format('MMMM D, YYYY');\n\n const dayProps = getDayProps?.(dayjs(day).format('YYYY-MM-DD')) || {};\n const today = dayjs(day).isSame(dayjs(), 'day') && highlightToday;\n\n if (outside && !withOutsideDays) {\n return (\n <div key={day} data-static {...getStyles('monthViewDay', { style: dayProps.style })} />\n );\n }\n\n const isFirstDay =\n weekIndex === firstDayIndex.weekIndex && dayIndex === firstDayIndex.dayIndex;\n\n const isDropTarget = dragDrop.isDropTarget(day);\n const flatIndex = weekIndex * 7 + dayIndex;\n const isDragSelected = slotDragSelect.isSlotSelected(flatIndex, monthGroup);\n\n return (\n <UnstyledButton\n aria-label={ariaLabel}\n {...dayProps}\n {...getStyles('monthViewDay', { className: dayProps.className, style: dayProps.style })}\n key={day}\n ref={(node) => {\n if (node) {\n if (!daysRef.current[weekIndex]) {\n daysRef.current[weekIndex] = [];\n }\n daysRef.current[weekIndex][dayIndex] = node;\n }\n }}\n data-drag-slot-index={withDragSlotSelect && mode !== 'static' ? flatIndex : undefined}\n data-drag-slot-group={withDragSlotSelect && mode !== 'static' ? monthGroup : undefined}\n onClick={\n mode === 'static'\n ? undefined\n : (event) => {\n onDayClick?.(dayjs(day).format('YYYY-MM-DD'), event);\n dayProps.onClick?.(event);\n }\n }\n onPointerDown={\n withDragSlotSelect && mode !== 'static'\n ? (e) =>\n slotDragSelect.handleSlotPointerDown(\n e as React.PointerEvent<HTMLButtonElement>,\n flatIndex,\n monthGroup\n )\n : undefined\n }\n onKeyDown={(event) => {\n handleMonthViewKeyDown({\n controlsRef: daysRef,\n weekIndex,\n dayIndex,\n event,\n });\n dayProps.onKeyDown?.(event);\n }}\n mod={[\n {\n outside,\n weekend,\n today,\n 'drop-target': isDropTarget,\n 'drag-selected': isDragSelected,\n static: mode === 'static',\n },\n dayProps.mod,\n ]}\n data-outside={outside || undefined}\n tabIndex={mode === 'static' ? -1 : isFirstDay ? 0 : -1}\n onDragOver={withDragHandlers ? (e) => dragDrop.handleDragOver(e, day) : undefined}\n onDragLeave={withDragHandlers ? dragDrop.handleDragLeave : undefined}\n onDrop={withDragHandlers ? (e) => dragDrop.handleDrop(e, day) : undefined}\n >\n <span data-today={today || undefined} {...getStyles('monthViewDayLabel')}>\n {dayjs(day).format('D')}\n </span>\n </UnstyledButton>\n );\n });\n\n const weekNumberProps = getWeekNumberProps?.(dayjs(week[0]).format('YYYY-MM-DD')) || {};\n const weekNumber = getWeekNumber(week);\n\n const backgroundEventNodes = (monthEvents.backgroundByWeek[weekIndex] || []).map((event) => {\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}-${weekIndex}`,\n ...getStyles('monthViewBackgroundEvent', {\n style: {\n left: `calc(${event.position.startOffset}% + 2px)`,\n width: `calc(${event.position.width}% - 3px)`,\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 return renderEvent(event, bgEventProps as any);\n }\n\n const { key: bgEventKey, ...restBgEventProps } = bgEventProps;\n return <Box key={bgEventKey} {...restBgEventProps} />;\n });\n\n const rowHeightPercent = 100 / maxEventsPerDay;\n\n const events = (monthEvents.groupedByWeek[weekIndex] || [])\n .filter((event) => event.position.row < maxEventsPerDay)\n .map((event) => {\n const isDraggable = dragDrop.isDraggableEvent(event);\n\n return (\n <ScheduleEvent\n key={event.id}\n event={event}\n nowrap\n autoSize\n hanging={event.position.hanging}\n draggable={isDraggable}\n renderEventBody={renderEventBody}\n renderEvent={renderEvent}\n radius={radius}\n mode={mode}\n onClick={onEventClick ? (e) => onEventClick(event, e) : undefined}\n style={{\n position: 'absolute',\n top: `calc(${event.position.row * rowHeightPercent}% + 1px)`,\n left: `calc(${event.position.startOffset}% + 1px)`,\n width: `calc(${event.position.width}% - 2px)`,\n height: `calc(${rowHeightPercent}% - 2px)`,\n }}\n />\n );\n });\n\n const moreEventsNodes = week.map((day, dayIndex) => {\n const dayEvents = monthEvents.groupedByDay[day] || [];\n const hiddenEventsCount = Math.max(0, dayEvents.length - maxEventsPerDay);\n\n if (hiddenEventsCount <= 0) {\n return null;\n }\n\n // Calculate position based on day's position within the week (each day is 1/7 of the week)\n const dayStartOffset = (dayIndex / 7) * 100;\n const dayWidth = (1 / 7) * 100;\n\n return (\n <MoreEvents\n key={`more-${day}`}\n events={dayEvents}\n moreEventsCount={hiddenEventsCount}\n mode={mode}\n style={{\n position: 'absolute',\n top: `calc(100% - 2px)`,\n left: `calc(${dayStartOffset}% + 1px)`,\n width: `calc(${dayWidth}% - 1px)`,\n height: '22px',\n paddingInline: 4,\n }}\n {...moreEventsProps}\n />\n );\n });\n\n return (\n <div {...getStyles('monthViewWeek')} key={weekIndex}>\n {withWeekNumbers && (\n <UnstyledButton\n key={weekNumber}\n aria-label={`Week ${weekNumber}`}\n {...weekNumberProps}\n onClick={\n mode === 'static'\n ? undefined\n : (event) => {\n onViewChange?.('week');\n onDateChange?.(toDateString(week[0]));\n onWeekNumberClick?.(dayjs(week[0]).format('YYYY-MM-DD'), event);\n weekNumberProps.onClick?.(event);\n }\n }\n mod={{ static: mode === 'static' }}\n tabIndex={mode === 'static' ? -1 : 0}\n {...getStyles('monthViewWeekNumber', {\n className: weekNumberProps.className,\n style: weekNumberProps.style,\n })}\n >\n {weekNumber}\n </UnstyledButton>\n )}\n\n <div {...getStyles('monthViewEvents')} key=\"week-events\">\n {backgroundEventNodes}\n {events}\n {moreEventsNodes}\n </div>\n\n {days}\n </div>\n );\n });\n\n const content = (\n <Box\n mod={[\n {\n 'with-week-numbers': withWeekNumbers,\n 'with-weekdays': withWeekDays,\n static: mode === 'static',\n 'slot-dragging': slotDragSelect.isDragging,\n },\n mod,\n ]}\n {...getStyles('monthView')}\n {...others}\n >\n {withHeader && (\n <ScheduleHeaderBase\n view=\"month\"\n navigationHandlers={{\n previous: () => toDateString(dayjs(date).subtract(1, 'month').startOf('month')),\n next: () => toDateString(dayjs(date).add(1, 'month').startOf('month')),\n today: () => toDateString(dayjs()),\n }}\n control={{\n monthYearSelect: {\n locale,\n yearValue: dayjs(date).get('year'),\n monthValue: dayjs(date).get('month'),\n onYearChange: (year) =>\n onDateChange?.(toDateString(dayjs(date).set('year', year).startOf('month'))),\n onMonthChange: (month) =>\n onDateChange?.(toDateString(dayjs(date).set('month', month).startOf('month'))),\n ...monthYearSelectProps,\n },\n }}\n labels={labels}\n onDateChange={onDateChange}\n onViewChange={onViewChange}\n previousControlProps={previousControlProps}\n nextControlProps={nextControlProps}\n todayControlProps={todayControlProps}\n viewSelectProps={viewSelectProps}\n stylesApiProps={stylesApiProps}\n />\n )}\n\n <ScrollArea\n scrollbarSize={4}\n {...scrollAreaProps}\n {...getStyles('monthViewScrollArea', {\n className: scrollAreaProps?.className,\n style: scrollAreaProps?.style,\n })}\n >\n <div {...getStyles('monthViewInner')}>\n {weekdays && (\n <div {...getStyles('monthViewWeekdays')}>\n {withWeekNumbers && <div {...getStyles('monthViewWeekdaysCorner')} />}\n {weekdays}\n </div>\n )}\n\n {weeks}\n </div>\n </ScrollArea>\n </Box>\n );\n\n if (withEventsDragAndDrop) {\n return <DragContext.Provider value={dragDrop.dragContextValue}>{content}</DragContext.Provider>;\n }\n\n return content;\n});\n\nMonthView.displayName = '@mantine/schedule/MonthView';\nMonthView.classes = classes;\nMonthView.varsResolver = varsResolver;\n\nexport namespace MonthView {\n export type Props = MonthViewProps;\n export type Factory = MonthViewFactory;\n export type StylesNames = MonthViewStylesNames;\n export type CssVariables = MonthViewCssVariables;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAsNA,MAAM,eAAe,oBAClB,QAAQ,EAAE,QAAQ,uBAAuB,EACxC,WAAW;CACT,uBAAuB,WAAW,KAAA,IAAY,UAAU,OAAO,GAAG,KAAA;CAClE,2BACE,oBAAoB,KAAA,IAAY,GAAG,KAAK,IAAI,IAAI,KAAK,IAAI,GAAG,gBAAgB,CAAC,KAAK,KAAA;CACrF,EACF,EACF;AAED,MAAM,eAAe;CACnB,kBAAkB;CAClB,cAAc;CACd,iBAAiB;CACjB,gBAAgB;CAChB,iBAAiB;CACjB,YAAY;CACZ,eAAe;CACf,uBAAuB;CACvB,oBAAoB;CACpB,MAAM;CACP;AAED,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,OAAO;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,YACA,MACA,KACA,MACA,cACA,iBACA,cACA,QACA,eACA,gBACA,aACA,kBACA,aACA,oBACA,YACA,mBACA,iBACA,gBACA,QACA,iBACA,YACA,sBACA,cACA,mBACA,kBACA,sBACA,iBACA,QACA,iBACA,iBACA,aACA,uBACA,aACA,cACA,kBACA,gBACA,cACA,oBACA,eACA,QACA,MACA,iBACA,qBACA,0BACA,iBAAiB,kBACjB,GAAG,WACD;CAEJ,MAAM,kBAAkB,KAAK,IAAI,IAAI,KAAK,IAAI,GAAG,oBAAoB,EAAE,CAAC;CAExE,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACf,CAAC;CAEF,MAAM,EAAE,oBAAoB,mBAAmB,qBAAuC;EACpF;EACA;EACA;EACD,CAAC;CAEF,MAAM,iBAAiB;EACrB,YAAY;EACZ,QAAQ;EACR;EACA;EACA;EACD;CAED,MAAM,QAAQ,iBAAiB;CAC/B,MAAM,MAAM,iBAAiB;CAE7B,MAAM,QAAQ,cAAc;EAC1B,OAAO;EACP;EACA;EACA,gBAAgB,IAAI,kBAAkB,eAAe;EACtD,CAAC;CASF,MAAM,cAAc,mBAAmB;EACrC;EACA,QATqB,sBAAsB;GAC3C;GACA,YAAY,MAAM,MAAM,MAAM,CAAC,QAAQ,MAAM,CAAC,QAAQ;GACtD,UAAU,MAAM,MAAM,IAAI,CAAC,MAAM,MAAM,CAAC,QAAQ;GAChD,gBAAgB;GACjB,CAAC;EAKA,gBAAgB,IAAI,kBAAkB,eAAe;EACrD;EACA;EACD,CAAC;CAEF,MAAM,qBAAqB,aACxB,GAAoB,QAAgB;AACnC,MAAI,CAAC,oBACH;AAEF,sBAAoB,EAAE,cAAc,GAAG,MAAM,IAAI,CAAC,OAAO,aAAa,CAAC,WAAW;IAEpF,CAAC,oBAAoB,CACtB;CAED,MAAM,WAAW,oBAA4B;EAC3C,SAAS;EACT;EACA;EACA;EACA;EACA;EACA,sBAAsB,WAAmB,iBAAoC;AAC3E,UAAO,uBAAuB;IAC5B;IACA;IACD,CAAC;;EAEJ,gBAAgB,sBAAsB,qBAAqB,KAAA;EAC5D,CAAC;CAEF,MAAM,oBAAoB,yBAAyB,CAAC,CAAC,wBAAwB,SAAS;CAEtF,MAAM,cAAc,OAAiB,EAAE,CAAC;CAExC,MAAM,iBAAiB,kBAAkB;EACvC,SAAS,sBAAsB,SAAS;EACxC,YAAY,YAAY,aAAa;AACnC,OAAI,CAAC,cACH;GAEF,MAAM,WAAW,YAAY,QAAQ;GACrC,MAAM,SAAS,YAAY,QAAQ;AACnC,OAAI,YAAY,OACd,eACE,MAAM,SAAS,CAAC,QAAQ,MAAM,CAAC,OAAO,sBAAsB,EAC5D,MAAM,OAAO,CAAC,MAAM,MAAM,CAAC,OAAO,sBAAsB,CACzD;;EAGN,CAAC;CAEF,MAAM,UAAgC,OAA8B,EAAE,CAAC;CAEvE,MAAM,YAAY,aAAa;EAC7B,OAAO,MAAM,KAAK,CAAC,OAAO,sBAAsB;EAChD,gBAAgB,IAAI,kBAAkB,eAAe;EACrD,iBAAiB,mBAAmB;EACrC,CAAC;CAEF,MAAM,uBAAuB;AAC3B,OAAK,IAAI,YAAY,GAAG,YAAY,UAAU,QAAQ,aAAa;GACjE,MAAM,OAAO,UAAU;AACvB,QAAK,IAAI,WAAW,GAAG,WAAW,KAAK,QAAQ,YAAY;IACzD,MAAM,MAAM,KAAK;AAEjB,QAAI,CADY,CAAC,YAAY,MAAM,IAAI,IACvB,gBACd,QAAO;KAAE;KAAW;KAAU;;;AAIpC,SAAO;GAAE,WAAW;GAAG,UAAU;GAAG;KAClC;CAEJ,MAAM,WAAW,eACb,iBAAiB;EACf,QAAQ,IAAI,UAAU,OAAO;EAC7B,QAAQ;EACR,gBAAgB,IAAI,kBAAkB,eAAe;EACtD,CAAC,CAAC,KAAK,KAAK,UACX,8BAAC,OAAD;EAAK,GAAI,UAAU,mBAAmB;EAAE,KAAK;EAEvC,EADH,IACG,CACN,GACF;CAEJ,MAAM,aAAa;AACnB,aAAY,UAAU,UAAU,MAAM;CAEtC,MAAM,QAAQ,UAAU,KAAK,MAAM,cAAc;AAC/C,MAAI,CAAC,QAAQ,QAAQ,WACnB,SAAQ,QAAQ,aAAa,EAAE;EAGjC,MAAM,OAAO,KAAK,KAAK,KAAK,aAAa;GACvC,MAAM,UAAU,CAAC,YAAY,MAAM,IAAI;GACvC,MAAM,UAAU,IAAI,eAAe,YAAY,CAAC,SAAS,MAAM,IAAI,CAAC,KAAK,CAAC;GAC1E,MAAM,YAAY,MAAM,IAAI,CACzB,OAAO,UAAU,IAAI,OAAO,CAC5B,OAAO,eAAe;GAEzB,MAAM,WAAW,cAAc,MAAM,IAAI,CAAC,OAAO,aAAa,CAAC,IAAI,EAAE;GACrE,MAAM,QAAQ,MAAM,IAAI,CAAC,OAAO,OAAO,EAAE,MAAM,IAAI;AAEnD,OAAI,WAAW,CAAC,gBACd,QACE,oBAAC,OAAD;IAAe,eAAA;IAAY,GAAI,UAAU,gBAAgB,EAAE,OAAO,SAAS,OAAO,CAAC;IAAI,EAA7E,IAA6E;GAI3F,MAAM,aACJ,cAAc,cAAc,aAAa,aAAa,cAAc;GAEtE,MAAM,eAAe,SAAS,aAAa,IAAI;GAC/C,MAAM,YAAY,YAAY,IAAI;GAClC,MAAM,iBAAiB,eAAe,eAAe,WAAW,WAAW;AAE3E,UACE,8BAAC,gBAAD;IACE,cAAY;IACZ,GAAI;IACJ,GAAI,UAAU,gBAAgB;KAAE,WAAW,SAAS;KAAW,OAAO,SAAS;KAAO,CAAC;IACvF,KAAK;IACL,MAAM,SAAS;AACb,SAAI,MAAM;AACR,UAAI,CAAC,QAAQ,QAAQ,WACnB,SAAQ,QAAQ,aAAa,EAAE;AAEjC,cAAQ,QAAQ,WAAW,YAAY;;;IAG3C,wBAAsB,sBAAsB,SAAS,WAAW,YAAY,KAAA;IAC5E,wBAAsB,sBAAsB,SAAS,WAAW,aAAa,KAAA;IAC7E,SACE,SAAS,WACL,KAAA,KACC,UAAU;AACT,kBAAa,MAAM,IAAI,CAAC,OAAO,aAAa,EAAE,MAAM;AACpD,cAAS,UAAU,MAAM;;IAGjC,eACE,sBAAsB,SAAS,YAC1B,MACC,eAAe,sBACb,GACA,WACA,WACD,GACH,KAAA;IAEN,YAAY,UAAU;AACpB,4BAAuB;MACrB,aAAa;MACb;MACA;MACA;MACD,CAAC;AACF,cAAS,YAAY,MAAM;;IAE7B,KAAK,CACH;KACE;KACA;KACA;KACA,eAAe;KACf,iBAAiB;KACjB,QAAQ,SAAS;KAClB,EACD,SAAS,IACV;IACD,gBAAc,WAAW,KAAA;IACzB,UAAU,SAAS,WAAW,KAAK,aAAa,IAAI;IACpD,YAAY,oBAAoB,MAAM,SAAS,eAAe,GAAG,IAAI,GAAG,KAAA;IACxE,aAAa,mBAAmB,SAAS,kBAAkB,KAAA;IAC3D,QAAQ,oBAAoB,MAAM,SAAS,WAAW,GAAG,IAAI,GAAG,KAAA;IAKjD,EAHf,oBAAC,QAAD;IAAM,cAAY,SAAS,KAAA;IAAW,GAAI,UAAU,oBAAoB;cACrE,MAAM,IAAI,CAAC,OAAO,IAAI;IAClB,CAAA,CACQ;IAEnB;EAEF,MAAM,kBAAkB,qBAAqB,MAAM,KAAK,GAAG,CAAC,OAAO,aAAa,CAAC,IAAI,EAAE;EACvF,MAAM,aAAa,cAAc,KAAK;EAEtC,MAAM,wBAAwB,YAAY,iBAAiB,cAAc,EAAE,EAAE,KAAK,UAAU;GAC1F,MAAM,SAAS,MAAM,qBAAqB;IACxC,OAAO,MAAM,SAAS,MAAM;IAC5B;IACA,SAAS;IACT,cAAc;IACf,CAAC;GAEF,MAAM,cACJ,OAAO,oBAAoB,aAAa,gBAAgB,MAAM,GAAG,MAAM;GAEzE,MAAM,eAAe;IACnB,KAAK,MAAM,MAAM,GAAG,GAAG;IACvB,GAAG,UAAU,4BAA4B,EACvC,OAAO;KACL,MAAM,QAAQ,MAAM,SAAS,YAAY;KACzC,OAAO,QAAQ,MAAM,SAAS,MAAM;KACrC,EACF,CAAC;IACF,QAAQ;KACN,iBAAiB,OAAO;KACxB,oBAAoB,OAAO;KAC5B;IACD,UAAU;IACX;AAED,OAAI,OAAO,gBAAgB,WACzB,QAAO,YAAY,OAAO,aAAoB;GAGhD,MAAM,EAAE,KAAK,YAAY,GAAG,qBAAqB;AACjD,UAAO,oBAAC,KAAD,EAAsB,GAAI,kBAAoB,EAApC,WAAoC;IACrD;EAEF,MAAM,mBAAmB,MAAM;EAE/B,MAAM,UAAU,YAAY,cAAc,cAAc,EAAE,EACvD,QAAQ,UAAU,MAAM,SAAS,MAAM,gBAAgB,CACvD,KAAK,UAAU;GACd,MAAM,cAAc,SAAS,iBAAiB,MAAM;AAEpD,UACE,oBAAC,eAAD;IAES;IACP,QAAA;IACA,UAAA;IACA,SAAS,MAAM,SAAS;IACxB,WAAW;IACM;IACJ;IACL;IACF;IACN,SAAS,gBAAgB,MAAM,aAAa,OAAO,EAAE,GAAG,KAAA;IACxD,OAAO;KACL,UAAU;KACV,KAAK,QAAQ,MAAM,SAAS,MAAM,iBAAiB;KACnD,MAAM,QAAQ,MAAM,SAAS,YAAY;KACzC,OAAO,QAAQ,MAAM,SAAS,MAAM;KACpC,QAAQ,QAAQ,iBAAiB;KAClC;IACD,EAlBK,MAAM,GAkBX;IAEJ;EAEJ,MAAM,kBAAkB,KAAK,KAAK,KAAK,aAAa;GAClD,MAAM,YAAY,YAAY,aAAa,QAAQ,EAAE;GACrD,MAAM,oBAAoB,KAAK,IAAI,GAAG,UAAU,SAAS,gBAAgB;AAEzE,OAAI,qBAAqB,EACvB,QAAO;AAOT,UACE,oBAAC,YAAD;IAEE,QAAQ;IACR,iBAAiB;IACX;IACN,OAAO;KACL,UAAU;KACV,KAAK;KACL,MAAM,QAZY,WAAW,IAAK,IAYL;KAC7B,OAAO,QAZK,IAAI,IAAK,IAYG;KACxB,QAAQ;KACR,eAAe;KAChB;IACD,GAAI;IACJ,EAbK,QAAQ,MAab;IAEJ;AAEF,SACE,8BAAC,OAAD;GAAK,GAAI,UAAU,gBAAgB;GAAE,KAAK;GAkCpC,EAjCH,mBACC,oBAAC,gBAAD;GAEE,cAAY,QAAQ;GACpB,GAAI;GACJ,SACE,SAAS,WACL,KAAA,KACC,UAAU;AACT,mBAAe,OAAO;AACtB,mBAAe,aAAa,KAAK,GAAG,CAAC;AACrC,wBAAoB,MAAM,KAAK,GAAG,CAAC,OAAO,aAAa,EAAE,MAAM;AAC/D,oBAAgB,UAAU,MAAM;;GAGxC,KAAK,EAAE,QAAQ,SAAS,UAAU;GAClC,UAAU,SAAS,WAAW,KAAK;GACnC,GAAI,UAAU,uBAAuB;IACnC,WAAW,gBAAgB;IAC3B,OAAO,gBAAgB;IACxB,CAAC;aAED;GACc,EArBV,WAqBU,EAGnB,8BAAC,OAAD;GAAK,GAAI,UAAU,kBAAkB;GAAE,KAAI;GAIrC,EAHH,sBACA,QACA,gBACG,EAEL,KACG;GAER;CAEF,MAAM,UACJ,qBAAC,KAAD;EACE,KAAK,CACH;GACE,qBAAqB;GACrB,iBAAiB;GACjB,QAAQ,SAAS;GACjB,iBAAiB,eAAe;GACjC,EACD,IACD;EACD,GAAI,UAAU,YAAY;EAC1B,GAAI;YAXN,CAaG,cACC,oBAAC,oBAAD;GACE,MAAK;GACL,oBAAoB;IAClB,gBAAgB,aAAa,MAAM,KAAK,CAAC,SAAS,GAAG,QAAQ,CAAC,QAAQ,QAAQ,CAAC;IAC/E,YAAY,aAAa,MAAM,KAAK,CAAC,IAAI,GAAG,QAAQ,CAAC,QAAQ,QAAQ,CAAC;IACtE,aAAa,aAAa,OAAO,CAAC;IACnC;GACD,SAAS,EACP,iBAAiB;IACf;IACA,WAAW,MAAM,KAAK,CAAC,IAAI,OAAO;IAClC,YAAY,MAAM,KAAK,CAAC,IAAI,QAAQ;IACpC,eAAe,SACb,eAAe,aAAa,MAAM,KAAK,CAAC,IAAI,QAAQ,KAAK,CAAC,QAAQ,QAAQ,CAAC,CAAC;IAC9E,gBAAgB,UACd,eAAe,aAAa,MAAM,KAAK,CAAC,IAAI,SAAS,MAAM,CAAC,QAAQ,QAAQ,CAAC,CAAC;IAChF,GAAG;IACJ,EACF;GACO;GACM;GACA;GACQ;GACJ;GACC;GACF;GACD;GAChB,CAAA,EAGJ,oBAAC,YAAD;GACE,eAAe;GACf,GAAI;GACJ,GAAI,UAAU,uBAAuB;IACnC,WAAW,iBAAiB;IAC5B,OAAO,iBAAiB;IACzB,CAAC;aAEF,qBAAC,OAAD;IAAK,GAAI,UAAU,iBAAiB;cAApC,CACG,YACC,qBAAC,OAAD;KAAK,GAAI,UAAU,oBAAoB;eAAvC,CACG,mBAAmB,oBAAC,OAAD,EAAK,GAAI,UAAU,0BAA0B,EAAI,CAAA,EACpE,SACG;QAGP,MACG;;GACK,CAAA,CACT;;AAGR,KAAI,sBACF,QAAO,oBAAC,YAAY,UAAb;EAAsB,OAAO,SAAS;YAAmB;EAA+B,CAAA;AAGjG,QAAO;EACP;AAEF,UAAU,cAAc;AACxB,UAAU,UAAUA;AACpB,UAAU,eAAe"}
1
+ {"version":3,"file":"MonthView.mjs","names":["classes"],"sources":["../../../src/components/MonthView/MonthView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport { useCallback, useRef } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n factory,\n Factory,\n getRadius,\n MantineRadius,\n ScrollArea,\n ScrollAreaProps,\n StylesApiProps,\n UnstyledButton,\n useMantineTheme,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useDragDropHandlers } from '../../hooks/use-drag-drop-handlers';\nimport { useSlotDragSelect } from '../../hooks/use-slot-drag-select';\nimport { ScheduleLabelsOverride } from '../../labels';\nimport {\n DateLabelFormat,\n DateStringValue,\n DateTimeStringValue,\n DayOfWeek,\n ScheduleEventData,\n ScheduleMode,\n ScheduleViewLevel,\n} from '../../types';\nimport {\n calculateMonthDropDate,\n expandRecurringEvents,\n getMonthDays,\n getMonthRange,\n getWeekdaysNames,\n getWeekNumber,\n isSameMonth,\n toDateString,\n} from '../../utils';\nimport { DragContext } from '../DragContext/DragContext';\nimport { MoreEvents, MoreEventsProps } from '../MoreEvents/MoreEvents';\nimport { RenderEvent, RenderEventBody, ScheduleEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { MonthYearSelectProps } from '../ScheduleHeader/MonthYearSelect/MonthYearSelect';\nimport { CombinedScheduleHeaderStylesNames } from '../ScheduleHeader/ScheduleHeader';\nimport { ScheduleHeaderBase } from '../ScheduleHeader/ScheduleHeaderBase';\nimport { ViewSelectProps } from '../ScheduleHeader/ViewSelect/ViewSelect';\nimport { getMonthViewEvents } from './get-month-view-events/get-month-view-events';\nimport { handleMonthViewKeyDown, MonthViewControlsRef } from './handle-month-view-key-down';\nimport classes from './MonthView.module.css';\n\nexport type MonthViewStylesNames =\n | 'monthView'\n | 'monthViewScrollArea'\n | 'monthViewInner'\n | 'monthViewWeek'\n | 'monthViewDay'\n | 'monthViewDayLabel'\n | 'monthViewWeekNumber'\n | 'monthViewWeekday'\n | 'monthViewWeekdays'\n | 'monthViewWeekdaysCorner'\n | 'monthViewEvents'\n | 'monthViewBackgroundEvent'\n | CombinedScheduleHeaderStylesNames;\n\nexport type MonthViewCssVariables = {\n monthView: '--month-view-radius' | '--month-view-max-events';\n};\n\nexport interface MonthViewProps\n extends BoxProps, StylesApiProps<MonthViewFactory>, ElementProps<'div'> {\n __staticSelector?: string;\n\n /** Date to display, Date object or date string in `YYYY-MM-DD 00:00:00` format */\n date: Date | string;\n\n /** Called with the new date value when a date is selected */\n onDateChange?: (value: DateStringValue) => void;\n\n /** If set, week numbers are displayed in the first column @default false */\n withWeekNumbers?: boolean;\n\n /** If set, weekdays names are displayed in the first row @default true */\n withWeekDays?: boolean;\n\n /** Locale passed down to dayjs, overrides value defined on `DatesProvider` */\n locale?: string;\n\n /** Number 0-6, where 0 – Sunday and 6 – Saturday. @default 1 – Monday */\n firstDayOfWeek?: DayOfWeek;\n\n /** `dayjs` format for weekdays names. By default, the first letter of the weekday. */\n weekdayFormat?: DateLabelFormat;\n\n /** Indices of weekend days, 0-6, where 0 is Sunday and 6 is Saturday. The default value is defined by `DatesProvider`. */\n weekendDays?: DayOfWeek[];\n\n /** Props passed down to the week number button */\n getWeekNumberProps?: (weekStartDate: DateStringValue) => Record<string, any>;\n\n /** Props passed down to the day button */\n getDayProps?: (date: DateStringValue) => Record<string, any>;\n\n /** Called when day is clicked */\n onDayClick?: (date: DateStringValue, event: React.MouseEvent<HTMLButtonElement>) => void;\n\n /** Called with first day of the week when week number is clicked */\n onWeekNumberClick?: (date: DateStringValue, event: React.MouseEvent<HTMLButtonElement>) => void;\n\n /** If set, always renders 6 weeks in the month view @default true */\n consistentWeeks?: boolean;\n\n /** If set, highlights the current day @default true */\n highlightToday?: boolean;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** If set, days from the previous and next months are displayed to fill the weeks @default true */\n withOutsideDays?: boolean;\n\n /** If set, the header is displayed @default true */\n withHeader?: boolean;\n\n /** Props passed down to `MonthYearSelect` component in the header */\n monthYearSelectProps?: Partial<MonthYearSelectProps>;\n\n /** Called when view level select button is clicked */\n onViewChange?: (view: ScheduleViewLevel) => void;\n\n /** Props passed to previous month control */\n previousControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n /** Props passed to next month control */\n nextControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n /** Props passed to today control */\n todayControlProps?: React.ComponentProps<'button'> & DataAttributes;\n\n /** Props passed to view level select */\n viewSelectProps?: Partial<ViewSelectProps> & DataAttributes;\n\n /** Events to display */\n events?: ScheduleEventData[];\n\n /** Props passed down to `MoreEvents` component */\n moreEventsProps?: Partial<MoreEventsProps>;\n\n /** Function to customize event body, `event` object is passed as first argument */\n renderEventBody?: RenderEventBody;\n\n /** Function to fully customize event rendering, receives all props that would be passed to the root element including children */\n renderEvent?: RenderEvent;\n\n /** If true, events can be dragged and dropped @default false */\n withEventsDragAndDrop?: boolean;\n\n /** Called when event is dropped on new date */\n onEventDrop?: (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 dragged */\n canDragEvent?: (event: ScheduleEventData) => boolean;\n\n /** Called when any event drag starts */\n onEventDragStart?: (event: ScheduleEventData) => void;\n\n /** Called when any event drag ends */\n onEventDragEnd?: () => void;\n\n /** Called when event is clicked */\n onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n\n /** If set, enables drag-to-select day ranges @default false */\n withDragSlotSelect?: boolean;\n\n /** Called when a day range is selected by dragging */\n onSlotDragEnd?: (rangeStart: DateTimeStringValue, rangeEnd: DateTimeStringValue) => void;\n\n /** Labels override for i18n */\n labels?: ScheduleLabelsOverride;\n\n /** Interaction mode: 'default' allows all interactions, 'static' disables event interactions @default default */\n mode?: ScheduleMode;\n\n /** Props passed down to `ScrollArea` component */\n scrollAreaProps?: Partial<ScrollAreaProps> & DataAttributes;\n\n /** Called when an external item is dropped onto the schedule. Receives the `DataTransfer` object and the drop target datetime. */\n onExternalEventDrop?: (dataTransfer: DataTransfer, dropDateTime: DateTimeStringValue) => void;\n\n /** Max number of generated recurring instances per recurring series @default 2000 */\n recurrenceExpansionLimit?: number;\n\n /** Maximum number of events visible per day before \"+more\" indicator shows, value is clamped between 1 and 10 @default 2 */\n maxEventsPerDay?: number;\n}\n\nexport type MonthViewFactory = Factory<{\n props: MonthViewProps;\n ref: HTMLDivElement;\n stylesNames: MonthViewStylesNames;\n vars: MonthViewCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<MonthViewFactory>(\n (_theme, { radius, maxEventsPerDay }) => ({\n monthView: {\n '--month-view-radius': radius !== undefined ? getRadius(radius) : undefined,\n '--month-view-max-events':\n maxEventsPerDay !== undefined ? `${Math.min(10, Math.max(1, maxEventsPerDay))}` : undefined,\n },\n })\n);\n\nconst defaultProps = {\n __staticSelector: 'MonthView',\n withWeekDays: true,\n consistentWeeks: true,\n highlightToday: true,\n withOutsideDays: true,\n withHeader: true,\n weekdayFormat: 'ddd',\n withEventsDragAndDrop: false,\n withDragSlotSelect: false,\n mode: 'default',\n} satisfies Partial<MonthViewProps>;\n\nexport const MonthView = factory<MonthViewFactory>((_props) => {\n const props = useProps('MonthView', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n attributes,\n vars,\n mod,\n date,\n onDateChange,\n withWeekNumbers,\n withWeekDays,\n locale,\n weekdayFormat,\n firstDayOfWeek,\n weekendDays,\n __staticSelector,\n getDayProps,\n getWeekNumberProps,\n onDayClick,\n onWeekNumberClick,\n consistentWeeks,\n highlightToday,\n radius,\n withOutsideDays,\n withHeader,\n monthYearSelectProps,\n onViewChange,\n todayControlProps,\n nextControlProps,\n previousControlProps,\n viewSelectProps,\n events,\n moreEventsProps,\n renderEventBody,\n renderEvent,\n withEventsDragAndDrop,\n onEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n onEventClick,\n withDragSlotSelect,\n onSlotDragEnd,\n labels,\n mode,\n scrollAreaProps,\n onExternalEventDrop,\n recurrenceExpansionLimit,\n maxEventsPerDay: _maxEventsPerDay,\n ...others\n } = props;\n\n const maxEventsPerDay = Math.min(10, Math.max(1, _maxEventsPerDay ?? 2));\n\n const getStyles = useStyles<MonthViewFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'monthView',\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MonthViewFactory>({\n classNames,\n styles,\n props,\n });\n\n const stylesApiProps = {\n classNames: resolvedClassNames,\n styles: resolvedStyles,\n attributes,\n __staticSelector,\n radius,\n };\n\n const theme = useMantineTheme();\n const ctx = useDatesContext();\n\n const range = getMonthRange({\n month: date,\n withOutsideDays,\n consistentWeeks,\n firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n });\n\n const expandedEvents = expandRecurringEvents({\n events,\n rangeStart: dayjs(range.start).startOf('day').toDate(),\n rangeEnd: dayjs(range.end).endOf('day').toDate(),\n expansionLimit: recurrenceExpansionLimit,\n });\n\n const monthEvents = getMonthViewEvents({\n date,\n events: expandedEvents,\n firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n withOutsideDays,\n consistentWeeks,\n });\n\n const handleExternalDrop = useCallback(\n (e: React.DragEvent, day: string) => {\n if (!onExternalEventDrop) {\n return;\n }\n onExternalEventDrop(e.dataTransfer, `${dayjs(day).format('YYYY-MM-DD')} 00:00:00`);\n },\n [onExternalEventDrop]\n );\n\n const dragDrop = useDragDropHandlers<string>({\n enabled: withEventsDragAndDrop,\n mode,\n onEventDrop,\n canDragEvent,\n onEventDragStart,\n onEventDragEnd,\n calculateDropTarget: (targetDay: string, draggedEvent: ScheduleEventData) => {\n return calculateMonthDropDate({\n draggedEvent,\n targetDay,\n });\n },\n onExternalDrop: onExternalEventDrop ? handleExternalDrop : undefined,\n });\n\n const withDragHandlers = (withEventsDragAndDrop || !!onExternalEventDrop) && mode !== 'static';\n\n const flatDaysRef = useRef<string[]>([]);\n\n const slotDragSelect = useSlotDragSelect({\n enabled: withDragSlotSelect && mode !== 'static',\n onDragEnd: (startIndex, endIndex) => {\n if (!onSlotDragEnd) {\n return;\n }\n const startDay = flatDaysRef.current[startIndex];\n const endDay = flatDaysRef.current[endIndex];\n if (startDay && endDay) {\n onSlotDragEnd(\n dayjs(startDay).startOf('day').format('YYYY-MM-DD HH:mm:ss'),\n dayjs(endDay).endOf('day').format('YYYY-MM-DD HH:mm:ss')\n );\n }\n },\n });\n\n const daysRef: MonthViewControlsRef = useRef<HTMLButtonElement[][]>([]);\n\n const monthDays = getMonthDays({\n month: dayjs(date).format('YYYY-MM-DD 00:00:00'),\n firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n consistentWeeks: consistentWeeks && withOutsideDays,\n });\n\n const firstDayIndex = (() => {\n for (let weekIndex = 0; weekIndex < monthDays.length; weekIndex++) {\n const week = monthDays[weekIndex];\n for (let dayIndex = 0; dayIndex < week.length; dayIndex++) {\n const day = week[dayIndex];\n const outside = !isSameMonth(date, day);\n if (!outside || withOutsideDays) {\n return { weekIndex, dayIndex };\n }\n }\n }\n return { weekIndex: 0, dayIndex: 0 };\n })();\n\n const weekdays = withWeekDays\n ? getWeekdaysNames({\n locale: ctx.getLocale(locale),\n format: weekdayFormat,\n firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n }).map((day, index) => (\n <div {...getStyles('monthViewWeekday')} key={index}>\n {day}\n </div>\n ))\n : null;\n\n const monthGroup = 'month';\n flatDaysRef.current = monthDays.flat();\n\n const weeks = monthDays.map((week, weekIndex) => {\n if (!daysRef.current[weekIndex]) {\n daysRef.current[weekIndex] = [];\n }\n\n const days = week.map((day, dayIndex) => {\n const outside = !isSameMonth(date, day);\n const weekend = ctx.getWeekendDays(weekendDays).includes(dayjs(day).day());\n const ariaLabel = dayjs(day)\n .locale(locale || ctx.locale)\n .format('MMMM D, YYYY');\n\n const dayProps = getDayProps?.(dayjs(day).format('YYYY-MM-DD')) || {};\n const today = dayjs(day).isSame(dayjs(), 'day') && highlightToday;\n\n if (outside && !withOutsideDays) {\n return (\n <div key={day} data-static {...getStyles('monthViewDay', { style: dayProps.style })} />\n );\n }\n\n const isFirstDay =\n weekIndex === firstDayIndex.weekIndex && dayIndex === firstDayIndex.dayIndex;\n\n const isDropTarget = dragDrop.isDropTarget(day);\n const flatIndex = weekIndex * 7 + dayIndex;\n const isDragSelected = slotDragSelect.isSlotSelected(flatIndex, monthGroup);\n\n return (\n <UnstyledButton\n aria-label={ariaLabel}\n {...dayProps}\n {...getStyles('monthViewDay', { className: dayProps.className, style: dayProps.style })}\n key={day}\n ref={(node) => {\n if (node) {\n if (!daysRef.current[weekIndex]) {\n daysRef.current[weekIndex] = [];\n }\n daysRef.current[weekIndex][dayIndex] = node;\n }\n }}\n data-drag-slot-index={withDragSlotSelect && mode !== 'static' ? flatIndex : undefined}\n data-drag-slot-group={withDragSlotSelect && mode !== 'static' ? monthGroup : undefined}\n onClick={\n mode === 'static'\n ? undefined\n : (event) => {\n onDayClick?.(dayjs(day).format('YYYY-MM-DD'), event);\n dayProps.onClick?.(event);\n }\n }\n onPointerDown={\n withDragSlotSelect && mode !== 'static'\n ? (e) =>\n slotDragSelect.handleSlotPointerDown(\n e as React.PointerEvent<HTMLButtonElement>,\n flatIndex,\n monthGroup\n )\n : undefined\n }\n onKeyDown={(event) => {\n handleMonthViewKeyDown({\n controlsRef: daysRef,\n weekIndex,\n dayIndex,\n event,\n });\n dayProps.onKeyDown?.(event);\n }}\n mod={[\n {\n outside,\n weekend,\n today,\n 'drop-target': isDropTarget,\n 'drag-selected': isDragSelected,\n static: mode === 'static',\n },\n dayProps.mod,\n ]}\n data-outside={outside || undefined}\n tabIndex={mode === 'static' ? -1 : isFirstDay ? 0 : -1}\n onDragOver={withDragHandlers ? (e) => dragDrop.handleDragOver(e, day) : undefined}\n onDragLeave={withDragHandlers ? dragDrop.handleDragLeave : undefined}\n onDrop={withDragHandlers ? (e) => dragDrop.handleDrop(e, day) : undefined}\n >\n <span data-today={today || undefined} {...getStyles('monthViewDayLabel')}>\n {dayjs(day).format('D')}\n </span>\n </UnstyledButton>\n );\n });\n\n const weekNumberProps = getWeekNumberProps?.(dayjs(week[0]).format('YYYY-MM-DD')) || {};\n const weekNumber = getWeekNumber(week);\n\n const backgroundEventNodes = (monthEvents.backgroundByWeek[weekIndex] || []).map((event) => {\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}-${weekIndex}`,\n ...getStyles('monthViewBackgroundEvent', {\n style: {\n left: `calc(${event.position.startOffset}% + 2px)`,\n width: `calc(${event.position.width}% - 3px)`,\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 return renderEvent(event, bgEventProps as any);\n }\n\n const { key: bgEventKey, ...restBgEventProps } = bgEventProps;\n return <Box key={bgEventKey} {...restBgEventProps} />;\n });\n\n const rowHeightPercent = 100 / maxEventsPerDay;\n\n const events = (monthEvents.groupedByWeek[weekIndex] || [])\n .filter((event) => event.position.row < maxEventsPerDay)\n .map((event) => {\n const isDraggable = dragDrop.isDraggableEvent(event);\n\n return (\n <ScheduleEvent\n key={event.id}\n event={event}\n nowrap\n autoSize\n hanging={event.position.hanging}\n draggable={isDraggable}\n renderEventBody={renderEventBody}\n renderEvent={renderEvent}\n radius={radius}\n mode={mode}\n onClick={onEventClick ? (e) => onEventClick(event, e) : undefined}\n style={{\n position: 'absolute',\n top: `calc(${event.position.row * rowHeightPercent}% + 1px)`,\n left: `calc(${event.position.startOffset}% + 1px)`,\n width: `calc(${event.position.width}% - 2px)`,\n height: `calc(${rowHeightPercent}% - 2px)`,\n }}\n />\n );\n });\n\n const moreEventsNodes = week.map((day, dayIndex) => {\n const dayEvents = monthEvents.groupedByDay[day] || [];\n const hiddenEventsCount = Math.max(0, dayEvents.length - maxEventsPerDay);\n\n if (hiddenEventsCount <= 0) {\n return null;\n }\n\n // Calculate position based on day's position within the week (each day is 1/7 of the week)\n const dayStartOffset = (dayIndex / 7) * 100;\n const dayWidth = (1 / 7) * 100;\n\n return (\n <MoreEvents\n key={`more-${day}`}\n events={dayEvents}\n moreEventsCount={hiddenEventsCount}\n mode={mode}\n labels={labels}\n renderEventBody={renderEventBody}\n renderEvent={renderEvent}\n onEventClick={onEventClick}\n style={{\n position: 'absolute',\n top: `calc(100% - 2px)`,\n left: `calc(${dayStartOffset}% + 1px)`,\n width: `calc(${dayWidth}% - 1px)`,\n height: '22px',\n paddingInline: 4,\n }}\n {...moreEventsProps}\n />\n );\n });\n\n return (\n <div {...getStyles('monthViewWeek')} key={weekIndex}>\n {withWeekNumbers && (\n <UnstyledButton\n key={weekNumber}\n aria-label={`Week ${weekNumber}`}\n {...weekNumberProps}\n onClick={\n mode === 'static'\n ? undefined\n : (event) => {\n onViewChange?.('week');\n onDateChange?.(toDateString(week[0]));\n onWeekNumberClick?.(dayjs(week[0]).format('YYYY-MM-DD'), event);\n weekNumberProps.onClick?.(event);\n }\n }\n mod={{ static: mode === 'static' }}\n tabIndex={mode === 'static' ? -1 : 0}\n {...getStyles('monthViewWeekNumber', {\n className: weekNumberProps.className,\n style: weekNumberProps.style,\n })}\n >\n {weekNumber}\n </UnstyledButton>\n )}\n\n <div {...getStyles('monthViewEvents')} key=\"week-events\">\n {backgroundEventNodes}\n {events}\n {moreEventsNodes}\n </div>\n\n {days}\n </div>\n );\n });\n\n const content = (\n <Box\n mod={[\n {\n 'with-week-numbers': withWeekNumbers,\n 'with-weekdays': withWeekDays,\n static: mode === 'static',\n 'slot-dragging': slotDragSelect.isDragging,\n },\n mod,\n ]}\n {...getStyles('monthView')}\n {...others}\n >\n {withHeader && (\n <ScheduleHeaderBase\n view=\"month\"\n navigationHandlers={{\n previous: () => toDateString(dayjs(date).subtract(1, 'month').startOf('month')),\n next: () => toDateString(dayjs(date).add(1, 'month').startOf('month')),\n today: () => toDateString(dayjs()),\n }}\n control={{\n monthYearSelect: {\n locale,\n yearValue: dayjs(date).get('year'),\n monthValue: dayjs(date).get('month'),\n onYearChange: (year) =>\n onDateChange?.(toDateString(dayjs(date).set('year', year).startOf('month'))),\n onMonthChange: (month) =>\n onDateChange?.(toDateString(dayjs(date).set('month', month).startOf('month'))),\n ...monthYearSelectProps,\n },\n }}\n labels={labels}\n onDateChange={onDateChange}\n onViewChange={onViewChange}\n previousControlProps={previousControlProps}\n nextControlProps={nextControlProps}\n todayControlProps={todayControlProps}\n viewSelectProps={viewSelectProps}\n stylesApiProps={stylesApiProps}\n />\n )}\n\n <ScrollArea\n scrollbarSize={4}\n {...scrollAreaProps}\n {...getStyles('monthViewScrollArea', {\n className: scrollAreaProps?.className,\n style: scrollAreaProps?.style,\n })}\n >\n <div {...getStyles('monthViewInner')}>\n {weekdays && (\n <div {...getStyles('monthViewWeekdays')}>\n {withWeekNumbers && <div {...getStyles('monthViewWeekdaysCorner')} />}\n {weekdays}\n </div>\n )}\n\n {weeks}\n </div>\n </ScrollArea>\n </Box>\n );\n\n if (withEventsDragAndDrop) {\n return <DragContext.Provider value={dragDrop.dragContextValue}>{content}</DragContext.Provider>;\n }\n\n return content;\n});\n\nMonthView.displayName = '@mantine/schedule/MonthView';\nMonthView.classes = classes;\nMonthView.varsResolver = varsResolver;\n\nexport namespace MonthView {\n export type Props = MonthViewProps;\n export type Factory = MonthViewFactory;\n export type StylesNames = MonthViewStylesNames;\n export type CssVariables = MonthViewCssVariables;\n}\n"],"mappings":"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"}
@@ -20,7 +20,8 @@ function getMonthPositionedEvents({ date, events, firstDayOfWeek = 1, range }) {
20
20
  }
21
21
  for (const event of events) {
22
22
  const eventStart = dayjs(event.start).startOf("day");
23
- const eventEnd = dayjs(event.end).startOf("day");
23
+ const rawEnd = dayjs(event.end);
24
+ const eventEnd = rawEnd.hour() === 0 && rawEnd.minute() === 0 && rawEnd.second() === 0 ? rawEnd.startOf("day").subtract(1, "day") : rawEnd.startOf("day");
24
25
  const isMultiday = eventEnd.isAfter(eventStart);
25
26
  for (let weekIdx = 0; weekIdx < weeks.length; weekIdx++) {
26
27
  const week = weeks[weekIdx];
@@ -1 +1 @@
1
- {"version":3,"file":"get-month-positioned-events.mjs","names":[],"sources":["../../../../src/components/MonthView/get-month-view-events/get-month-positioned-events.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport {\n AnyDateValue,\n DateStringValue,\n DayOfWeek,\n MonthPositionedEventData,\n ScheduleEventData,\n} from '../../../types';\nimport { addEventToDayGroups } from './add-event-to-day-groups';\nimport { calculateEventPositionInWeek } from './calculate-event-position-in-week';\nimport { findAvailableRow } from './find-available-row';\nimport { getWeeksInRange } from './get-weeks-in-range';\n\ninterface GetMonthPositionedEventsInput {\n /** Date (month start) at which events are positioned */\n date: AnyDateValue;\n\n /** List of all events that belong to the given month, extra events must be filtered out before passing to the function */\n events: ScheduleEventData[];\n\n /** First day of the week, 0 - Sunday, 1 - Monday, etc., used to calculate events positions */\n firstDayOfWeek?: DayOfWeek;\n\n /** Range of dates for which events should be displayed (includes outside days if withOutsideDays is true) */\n range?: {\n start: DateStringValue;\n end: DateStringValue;\n };\n}\n\n/** Events grouped by week index and by day */\nexport interface GroupedMonthEvents {\n /** Events grouped by week index (index within month) */\n groupedByWeek: {\n [weekIndex: string]: MonthPositionedEventData[];\n };\n\n /** Events grouped by day (YYYY-MM-DD format) */\n groupedByDay: {\n [date: string]: MonthPositionedEventData[];\n };\n\n /** Background events grouped by week index */\n backgroundByWeek: {\n [weekIndex: string]: MonthPositionedEventData[];\n };\n}\n\nexport function getMonthPositionedEvents({\n date,\n events,\n firstDayOfWeek = 1,\n range,\n}: GetMonthPositionedEventsInput): GroupedMonthEvents {\n const groupedByWeek: GroupedMonthEvents['groupedByWeek'] = {};\n const backgroundByWeek: GroupedMonthEvents['backgroundByWeek'] = {};\n const eventsAddedToDay = new Set<string>();\n\n const rangeStart = range ? dayjs(range.start) : dayjs(date).startOf('month');\n const rangeEnd = range ? dayjs(range.end) : dayjs(date).startOf('month').endOf('month');\n\n const { weeks, groupedByDay } = getWeeksInRange({\n rangeStart,\n rangeEnd,\n firstDayOfWeek,\n });\n\n for (let i = 0; i < weeks.length; i++) {\n groupedByWeek[i.toString()] = [];\n backgroundByWeek[i.toString()] = [];\n }\n\n for (const event of events) {\n const eventStart = dayjs(event.start).startOf('day');\n const eventEnd = dayjs(event.end).startOf('day');\n const isMultiday = eventEnd.isAfter(eventStart);\n\n for (let weekIdx = 0; weekIdx < weeks.length; weekIdx++) {\n const week = weeks[weekIdx];\n const weekStart = dayjs(week[0]).startOf('day');\n const weekEnd = dayjs(week[6]).endOf('day');\n\n if (\n (eventStart.isBefore(weekEnd) || eventStart.isSame(weekEnd, 'day')) &&\n (eventEnd.isAfter(weekStart) || eventEnd.isSame(weekStart, 'day'))\n ) {\n const { startDayIndex, daysSpanned, startOffset, width, hanging } =\n calculateEventPositionInWeek({\n eventStart,\n eventEnd,\n weekStart,\n weekEnd,\n isMultiday,\n });\n\n if (event.display === 'background') {\n backgroundByWeek[weekIdx.toString()].push({\n ...event,\n position: {\n startOffset,\n width,\n weekIndex: weekIdx,\n row: 0,\n hanging,\n },\n });\n continue;\n }\n\n const row = findAvailableRow({\n existingEvents: groupedByWeek[weekIdx.toString()],\n startDayIndex,\n daysSpanned,\n weekStart,\n });\n\n const positionedEvent: MonthPositionedEventData = {\n ...event,\n position: {\n startOffset,\n width,\n weekIndex: weekIdx,\n row,\n hanging,\n },\n };\n\n groupedByWeek[weekIdx.toString()].push(positionedEvent);\n\n addEventToDayGroups({\n positionedEvent,\n eventStart,\n eventEnd,\n groupedByDay,\n eventsAddedToDay,\n weekIdx,\n });\n }\n }\n }\n\n return {\n groupedByWeek,\n groupedByDay,\n backgroundByWeek,\n };\n}\n"],"mappings":";;;;;;;AAgDA,SAAgB,yBAAyB,EACvC,MACA,QACA,iBAAiB,GACjB,SACoD;CACpD,MAAM,gBAAqD,EAAE;CAC7D,MAAM,mBAA2D,EAAE;CACnE,MAAM,mCAAmB,IAAI,KAAa;CAK1C,MAAM,EAAE,OAAO,iBAAiB,gBAAgB;EAC9C,YAJiB,QAAQ,MAAM,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,QAAQ,QAAQ;EAK1E,UAJe,QAAQ,MAAM,MAAM,IAAI,GAAG,MAAM,KAAK,CAAC,QAAQ,QAAQ,CAAC,MAAM,QAAQ;EAKrF;EACD,CAAC;AAEF,MAAK,IAAI,IAAI,GAAG,IAAI,MAAM,QAAQ,KAAK;AACrC,gBAAc,EAAE,UAAU,IAAI,EAAE;AAChC,mBAAiB,EAAE,UAAU,IAAI,EAAE;;AAGrC,MAAK,MAAM,SAAS,QAAQ;EAC1B,MAAM,aAAa,MAAM,MAAM,MAAM,CAAC,QAAQ,MAAM;EACpD,MAAM,WAAW,MAAM,MAAM,IAAI,CAAC,QAAQ,MAAM;EAChD,MAAM,aAAa,SAAS,QAAQ,WAAW;AAE/C,OAAK,IAAI,UAAU,GAAG,UAAU,MAAM,QAAQ,WAAW;GACvD,MAAM,OAAO,MAAM;GACnB,MAAM,YAAY,MAAM,KAAK,GAAG,CAAC,QAAQ,MAAM;GAC/C,MAAM,UAAU,MAAM,KAAK,GAAG,CAAC,MAAM,MAAM;AAE3C,QACG,WAAW,SAAS,QAAQ,IAAI,WAAW,OAAO,SAAS,MAAM,MACjE,SAAS,QAAQ,UAAU,IAAI,SAAS,OAAO,WAAW,MAAM,GACjE;IACA,MAAM,EAAE,eAAe,aAAa,aAAa,OAAO,YACtD,6BAA6B;KAC3B;KACA;KACA;KACA;KACA;KACD,CAAC;AAEJ,QAAI,MAAM,YAAY,cAAc;AAClC,sBAAiB,QAAQ,UAAU,EAAE,KAAK;MACxC,GAAG;MACH,UAAU;OACR;OACA;OACA,WAAW;OACX,KAAK;OACL;OACD;MACF,CAAC;AACF;;IAGF,MAAM,MAAM,iBAAiB;KAC3B,gBAAgB,cAAc,QAAQ,UAAU;KAChD;KACA;KACA;KACD,CAAC;IAEF,MAAM,kBAA4C;KAChD,GAAG;KACH,UAAU;MACR;MACA;MACA,WAAW;MACX;MACA;MACD;KACF;AAED,kBAAc,QAAQ,UAAU,EAAE,KAAK,gBAAgB;AAEvD,wBAAoB;KAClB;KACA;KACA;KACA;KACA;KACA;KACD,CAAC;;;;AAKR,QAAO;EACL;EACA;EACA;EACD"}
1
+ {"version":3,"file":"get-month-positioned-events.mjs","names":[],"sources":["../../../../src/components/MonthView/get-month-view-events/get-month-positioned-events.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport {\n AnyDateValue,\n DateStringValue,\n DayOfWeek,\n MonthPositionedEventData,\n ScheduleEventData,\n} from '../../../types';\nimport { addEventToDayGroups } from './add-event-to-day-groups';\nimport { calculateEventPositionInWeek } from './calculate-event-position-in-week';\nimport { findAvailableRow } from './find-available-row';\nimport { getWeeksInRange } from './get-weeks-in-range';\n\ninterface GetMonthPositionedEventsInput {\n /** Date (month start) at which events are positioned */\n date: AnyDateValue;\n\n /** List of all events that belong to the given month, extra events must be filtered out before passing to the function */\n events: ScheduleEventData[];\n\n /** First day of the week, 0 - Sunday, 1 - Monday, etc., used to calculate events positions */\n firstDayOfWeek?: DayOfWeek;\n\n /** Range of dates for which events should be displayed (includes outside days if withOutsideDays is true) */\n range?: {\n start: DateStringValue;\n end: DateStringValue;\n };\n}\n\n/** Events grouped by week index and by day */\nexport interface GroupedMonthEvents {\n /** Events grouped by week index (index within month) */\n groupedByWeek: {\n [weekIndex: string]: MonthPositionedEventData[];\n };\n\n /** Events grouped by day (YYYY-MM-DD format) */\n groupedByDay: {\n [date: string]: MonthPositionedEventData[];\n };\n\n /** Background events grouped by week index */\n backgroundByWeek: {\n [weekIndex: string]: MonthPositionedEventData[];\n };\n}\n\nexport function getMonthPositionedEvents({\n date,\n events,\n firstDayOfWeek = 1,\n range,\n}: GetMonthPositionedEventsInput): GroupedMonthEvents {\n const groupedByWeek: GroupedMonthEvents['groupedByWeek'] = {};\n const backgroundByWeek: GroupedMonthEvents['backgroundByWeek'] = {};\n const eventsAddedToDay = new Set<string>();\n\n const rangeStart = range ? dayjs(range.start) : dayjs(date).startOf('month');\n const rangeEnd = range ? dayjs(range.end) : dayjs(date).startOf('month').endOf('month');\n\n const { weeks, groupedByDay } = getWeeksInRange({\n rangeStart,\n rangeEnd,\n firstDayOfWeek,\n });\n\n for (let i = 0; i < weeks.length; i++) {\n groupedByWeek[i.toString()] = [];\n backgroundByWeek[i.toString()] = [];\n }\n\n for (const event of events) {\n const eventStart = dayjs(event.start).startOf('day');\n const rawEnd = dayjs(event.end);\n const endAtMidnight = rawEnd.hour() === 0 && rawEnd.minute() === 0 && rawEnd.second() === 0;\n const eventEnd = endAtMidnight\n ? rawEnd.startOf('day').subtract(1, 'day')\n : rawEnd.startOf('day');\n const isMultiday = eventEnd.isAfter(eventStart);\n\n for (let weekIdx = 0; weekIdx < weeks.length; weekIdx++) {\n const week = weeks[weekIdx];\n const weekStart = dayjs(week[0]).startOf('day');\n const weekEnd = dayjs(week[6]).endOf('day');\n\n if (\n (eventStart.isBefore(weekEnd) || eventStart.isSame(weekEnd, 'day')) &&\n (eventEnd.isAfter(weekStart) || eventEnd.isSame(weekStart, 'day'))\n ) {\n const { startDayIndex, daysSpanned, startOffset, width, hanging } =\n calculateEventPositionInWeek({\n eventStart,\n eventEnd,\n weekStart,\n weekEnd,\n isMultiday,\n });\n\n if (event.display === 'background') {\n backgroundByWeek[weekIdx.toString()].push({\n ...event,\n position: {\n startOffset,\n width,\n weekIndex: weekIdx,\n row: 0,\n hanging,\n },\n });\n continue;\n }\n\n const row = findAvailableRow({\n existingEvents: groupedByWeek[weekIdx.toString()],\n startDayIndex,\n daysSpanned,\n weekStart,\n });\n\n const positionedEvent: MonthPositionedEventData = {\n ...event,\n position: {\n startOffset,\n width,\n weekIndex: weekIdx,\n row,\n hanging,\n },\n };\n\n groupedByWeek[weekIdx.toString()].push(positionedEvent);\n\n addEventToDayGroups({\n positionedEvent,\n eventStart,\n eventEnd,\n groupedByDay,\n eventsAddedToDay,\n weekIdx,\n });\n }\n }\n }\n\n return {\n groupedByWeek,\n groupedByDay,\n backgroundByWeek,\n };\n}\n"],"mappings":";;;;;;;AAgDA,SAAgB,yBAAyB,EACvC,MACA,QACA,iBAAiB,GACjB,SACoD;CACpD,MAAM,gBAAqD,EAAE;CAC7D,MAAM,mBAA2D,EAAE;CACnE,MAAM,mCAAmB,IAAI,KAAa;CAK1C,MAAM,EAAE,OAAO,iBAAiB,gBAAgB;EAC9C,YAJiB,QAAQ,MAAM,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,QAAQ,QAAQ;EAK1E,UAJe,QAAQ,MAAM,MAAM,IAAI,GAAG,MAAM,KAAK,CAAC,QAAQ,QAAQ,CAAC,MAAM,QAAQ;EAKrF;EACD,CAAC;AAEF,MAAK,IAAI,IAAI,GAAG,IAAI,MAAM,QAAQ,KAAK;AACrC,gBAAc,EAAE,UAAU,IAAI,EAAE;AAChC,mBAAiB,EAAE,UAAU,IAAI,EAAE;;AAGrC,MAAK,MAAM,SAAS,QAAQ;EAC1B,MAAM,aAAa,MAAM,MAAM,MAAM,CAAC,QAAQ,MAAM;EACpD,MAAM,SAAS,MAAM,MAAM,IAAI;EAE/B,MAAM,WADgB,OAAO,MAAM,KAAK,KAAK,OAAO,QAAQ,KAAK,KAAK,OAAO,QAAQ,KAAK,IAEtF,OAAO,QAAQ,MAAM,CAAC,SAAS,GAAG,MAAM,GACxC,OAAO,QAAQ,MAAM;EACzB,MAAM,aAAa,SAAS,QAAQ,WAAW;AAE/C,OAAK,IAAI,UAAU,GAAG,UAAU,MAAM,QAAQ,WAAW;GACvD,MAAM,OAAO,MAAM;GACnB,MAAM,YAAY,MAAM,KAAK,GAAG,CAAC,QAAQ,MAAM;GAC/C,MAAM,UAAU,MAAM,KAAK,GAAG,CAAC,MAAM,MAAM;AAE3C,QACG,WAAW,SAAS,QAAQ,IAAI,WAAW,OAAO,SAAS,MAAM,MACjE,SAAS,QAAQ,UAAU,IAAI,SAAS,OAAO,WAAW,MAAM,GACjE;IACA,MAAM,EAAE,eAAe,aAAa,aAAa,OAAO,YACtD,6BAA6B;KAC3B;KACA;KACA;KACA;KACA;KACD,CAAC;AAEJ,QAAI,MAAM,YAAY,cAAc;AAClC,sBAAiB,QAAQ,UAAU,EAAE,KAAK;MACxC,GAAG;MACH,UAAU;OACR;OACA;OACA,WAAW;OACX,KAAK;OACL;OACD;MACF,CAAC;AACF;;IAGF,MAAM,MAAM,iBAAiB;KAC3B,gBAAgB,cAAc,QAAQ,UAAU;KAChD;KACA;KACA;KACD,CAAC;IAEF,MAAM,kBAA4C;KAChD,GAAG;KACH,UAAU;MACR;MACA;MACA,WAAW;MACX;MACA;MACD;KACF;AAED,kBAAc,QAAQ,UAAU,EAAE,KAAK,gBAAgB;AAEvD,wBAAoB;KAClB;KACA;KACA;KACA;KACA;KACA;KACD,CAAC;;;;AAKR,QAAO;EACL;EACA;EACA;EACD"}
@@ -9,7 +9,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
9
9
  const defaultProps = { dropdownType: "popover" };
10
10
  const MoreEvents = factory((_props) => {
11
11
  const props = useProps("MoreEvents", defaultProps, _props);
12
- const { classNames, className, style, styles, unstyled, vars, attributes, radius, dropdownType, events, moreEventsCount, popoverProps, modalProps, onDropdownClose, children, modalTitle, renderEventBody, id, labels, mode, ...others } = props;
12
+ const { classNames, className, style, styles, unstyled, vars, attributes, radius, dropdownType, events, moreEventsCount, popoverProps, modalProps, onDropdownClose, children, modalTitle, renderEventBody, renderEvent, id, labels, mode, onEventClick, ...others } = props;
13
13
  const [dropdownOpened, dropdownHandlers] = useDisclosure();
14
14
  const getStyles = useStyles({
15
15
  name: "MoreEvents",
@@ -35,7 +35,9 @@ const MoreEvents = factory((_props) => {
35
35
  event,
36
36
  size: "md",
37
37
  renderEventBody,
38
+ renderEvent,
38
39
  mode,
40
+ onClick: onEventClick ? (e) => onEventClick(event, e) : void 0,
39
41
  children: event.title
40
42
  }, event.id))
41
43
  });
@@ -1 +1 @@
1
- {"version":3,"file":"MoreEvents.mjs","names":["classes"],"sources":["../../../src/components/MoreEvents/MoreEvents.tsx"],"sourcesContent":["import {\n BoxProps,\n ElementProps,\n factory,\n Factory,\n MantineRadius,\n Modal,\n ModalProps,\n Popover,\n PopoverProps,\n StylesApiProps,\n UnstyledButton,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport { ScheduleEventData, ScheduleMode } from '../../types';\nimport { RenderEventBody, ScheduleEvent } from '../ScheduleEvent/ScheduleEvent';\nimport classes from './MoreEvents.module.css';\n\nexport type MoreEventsDropdownType = 'popover' | 'modal';\n\nexport type MoreEventsStylesNames = 'moreEventsButton' | 'moreEventsList' | 'moreEventsDropdown';\n\nexport interface MoreEventsProps\n extends BoxProps, StylesApiProps<MoreEventsFactory>, ElementProps<'button'> {\n /** List of events to display */\n events: ScheduleEventData[];\n\n /** Events count to use for `+X more` label */\n moreEventsCount: number;\n\n /** Key of `theme.radius` or any valid CSS value to set border-radius @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Title for the Modal component, ignored if `dropdownType` is not 'modal' */\n modalTitle?: string;\n\n /** Type of dropdown to use for displaying more events @default 'popover' */\n dropdownType?: MoreEventsDropdownType;\n\n /** Props passed down to `Popover` component */\n popoverProps?: Partial<Omit<PopoverProps, 'children'>>;\n\n /** Props passed down to `Modal` component */\n modalProps?: Partial<Omit<ModalProps, 'children'>>;\n\n /** Called when the dropdown is closed */\n onDropdownClose?: () => void;\n\n /** Function to customize event body, `event` object is passed as first argument */\n renderEventBody?: RenderEventBody;\n\n /** Labels override */\n labels?: ScheduleLabelsOverride;\n\n /** Interaction mode: 'default' allows all interactions, 'static' disables event interactions @default default */\n mode?: ScheduleMode;\n}\n\nexport type MoreEventsFactory = Factory<{\n props: MoreEventsProps;\n ref: HTMLButtonElement;\n stylesNames: MoreEventsStylesNames;\n}>;\n\nconst defaultProps = {\n dropdownType: 'popover',\n} satisfies Partial<MoreEventsProps>;\n\nexport const MoreEvents = factory<MoreEventsFactory>((_props) => {\n const props = useProps('MoreEvents', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n attributes,\n radius,\n dropdownType,\n events,\n moreEventsCount,\n popoverProps,\n modalProps,\n onDropdownClose,\n children,\n modalTitle,\n renderEventBody,\n id,\n labels,\n mode,\n ...others\n } = props;\n const [dropdownOpened, dropdownHandlers] = useDisclosure();\n\n const getStyles = useStyles<MoreEventsFactory>({\n name: 'MoreEvents',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n rootSelector: 'moreEventsButton',\n });\n\n const handleClose = () => {\n dropdownHandlers.close();\n onDropdownClose?.();\n };\n\n const eventsList = (\n <div {...getStyles('moreEventsList')}>\n {events.map((event) => (\n <ScheduleEvent\n key={event.id}\n radius={radius}\n event={event}\n size=\"md\"\n renderEventBody={renderEventBody}\n mode={mode}\n >\n {event.title}\n </ScheduleEvent>\n ))}\n </div>\n );\n\n return (\n <>\n {dropdownType === 'modal' && (\n <Modal\n opened={dropdownOpened}\n onClose={handleClose}\n unstyled={unstyled}\n radius={radius}\n title={modalTitle}\n {...modalProps}\n >\n {eventsList}\n </Modal>\n )}\n\n <Popover\n position=\"bottom-start\"\n width={260}\n opened={dropdownOpened}\n trapFocus\n returnFocus={false}\n unstyled={unstyled}\n disabled={popoverProps?.disabled || dropdownType === 'modal'}\n radius={radius}\n transitionProps={{ transition: 'pop', duration: 120 }}\n offset={-46}\n id={id}\n {...popoverProps}\n onChange={(_opened) => {\n if (!_opened) {\n popoverProps?.onChange?.(_opened);\n handleClose();\n }\n }}\n >\n <Popover.Target>\n <UnstyledButton\n {...getStyles('moreEventsButton')}\n mod={{ static: mode === 'static' }}\n onClick={() => dropdownHandlers.toggle()}\n {...others}\n >\n {getLabel('moreLabel', labels)(moreEventsCount)}\n </UnstyledButton>\n </Popover.Target>\n\n <Popover.Dropdown {...getStyles('moreEventsDropdown')}>{eventsList}</Popover.Dropdown>\n </Popover>\n </>\n );\n});\n\nMoreEvents.displayName = '@mantine/schedule/MoreEvents';\nMoreEvents.classes = classes;\n"],"mappings":";;;;;;;;AAmEA,MAAM,eAAe,EACnB,cAAc,WACf;AAED,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,cAAc,OAAO;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,QACA,cACA,QACA,iBACA,cACA,YACA,iBACA,UACA,YACA,iBACA,IACA,QACA,MACA,GAAG,WACD;CACJ,MAAM,CAAC,gBAAgB,oBAAoB,eAAe;CAE1D,MAAM,YAAY,UAA6B;EAC7C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACf,CAAC;CAEF,MAAM,oBAAoB;AACxB,mBAAiB,OAAO;AACxB,qBAAmB;;CAGrB,MAAM,aACJ,oBAAC,OAAD;EAAK,GAAI,UAAU,iBAAiB;YACjC,OAAO,KAAK,UACX,oBAAC,eAAD;GAEU;GACD;GACP,MAAK;GACY;GACX;aAEL,MAAM;GACO,EART,MAAM,GAQG,CAChB;EACE,CAAA;AAGR,QACE,qBAAA,UAAA,EAAA,UAAA,CACG,iBAAiB,WAChB,oBAAC,OAAD;EACE,QAAQ;EACR,SAAS;EACC;EACF;EACR,OAAO;EACP,GAAI;YAEH;EACK,CAAA,EAGV,qBAAC,SAAD;EACE,UAAS;EACT,OAAO;EACP,QAAQ;EACR,WAAA;EACA,aAAa;EACH;EACV,UAAU,cAAc,YAAY,iBAAiB;EAC7C;EACR,iBAAiB;GAAE,YAAY;GAAO,UAAU;GAAK;EACrD,QAAQ;EACJ;EACJ,GAAI;EACJ,WAAW,YAAY;AACrB,OAAI,CAAC,SAAS;AACZ,kBAAc,WAAW,QAAQ;AACjC,iBAAa;;;YAhBnB,CAoBE,oBAAC,QAAQ,QAAT,EAAA,UACE,oBAAC,gBAAD;GACE,GAAI,UAAU,mBAAmB;GACjC,KAAK,EAAE,QAAQ,SAAS,UAAU;GAClC,eAAe,iBAAiB,QAAQ;GACxC,GAAI;aAEH,SAAS,aAAa,OAAO,CAAC,gBAAgB;GAChC,CAAA,EACF,CAAA,EAEjB,oBAAC,QAAQ,UAAT;GAAkB,GAAI,UAAU,qBAAqB;aAAG;GAA8B,CAAA,CAC9E;IACT,EAAA,CAAA;EAEL;AAEF,WAAW,cAAc;AACzB,WAAW,UAAUA"}
1
+ {"version":3,"file":"MoreEvents.mjs","names":["classes"],"sources":["../../../src/components/MoreEvents/MoreEvents.tsx"],"sourcesContent":["import {\n BoxProps,\n ElementProps,\n factory,\n Factory,\n MantineRadius,\n Modal,\n ModalProps,\n Popover,\n PopoverProps,\n StylesApiProps,\n UnstyledButton,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport { ScheduleEventData, ScheduleMode } from '../../types';\nimport { RenderEvent, RenderEventBody, ScheduleEvent } from '../ScheduleEvent/ScheduleEvent';\nimport classes from './MoreEvents.module.css';\n\nexport type MoreEventsDropdownType = 'popover' | 'modal';\n\nexport type MoreEventsStylesNames = 'moreEventsButton' | 'moreEventsList' | 'moreEventsDropdown';\n\nexport interface MoreEventsProps\n extends BoxProps, StylesApiProps<MoreEventsFactory>, ElementProps<'button'> {\n /** List of events to display */\n events: ScheduleEventData[];\n\n /** Events count to use for `+X more` label */\n moreEventsCount: number;\n\n /** Key of `theme.radius` or any valid CSS value to set border-radius @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Title for the Modal component, ignored if `dropdownType` is not 'modal' */\n modalTitle?: string;\n\n /** Type of dropdown to use for displaying more events @default 'popover' */\n dropdownType?: MoreEventsDropdownType;\n\n /** Props passed down to `Popover` component */\n popoverProps?: Partial<Omit<PopoverProps, 'children'>>;\n\n /** Props passed down to `Modal` component */\n modalProps?: Partial<Omit<ModalProps, 'children'>>;\n\n /** Called when the dropdown is closed */\n onDropdownClose?: () => void;\n\n /** Function to customize event body, `event` object is passed as first argument */\n renderEventBody?: RenderEventBody;\n\n /** Function to fully customize event rendering, receives all props that would be passed to the root element including children */\n renderEvent?: RenderEvent;\n\n /** Labels override */\n labels?: ScheduleLabelsOverride;\n\n /** Interaction mode: 'default' allows all interactions, 'static' disables event interactions @default default */\n mode?: ScheduleMode;\n\n /** Called when an event inside the dropdown is clicked */\n onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport type MoreEventsFactory = Factory<{\n props: MoreEventsProps;\n ref: HTMLButtonElement;\n stylesNames: MoreEventsStylesNames;\n}>;\n\nconst defaultProps = {\n dropdownType: 'popover',\n} satisfies Partial<MoreEventsProps>;\n\nexport const MoreEvents = factory<MoreEventsFactory>((_props) => {\n const props = useProps('MoreEvents', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n attributes,\n radius,\n dropdownType,\n events,\n moreEventsCount,\n popoverProps,\n modalProps,\n onDropdownClose,\n children,\n modalTitle,\n renderEventBody,\n renderEvent,\n id,\n labels,\n mode,\n onEventClick,\n ...others\n } = props;\n const [dropdownOpened, dropdownHandlers] = useDisclosure();\n\n const getStyles = useStyles<MoreEventsFactory>({\n name: 'MoreEvents',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n rootSelector: 'moreEventsButton',\n });\n\n const handleClose = () => {\n dropdownHandlers.close();\n onDropdownClose?.();\n };\n\n const eventsList = (\n <div {...getStyles('moreEventsList')}>\n {events.map((event) => (\n <ScheduleEvent\n key={event.id}\n radius={radius}\n event={event}\n size=\"md\"\n renderEventBody={renderEventBody}\n renderEvent={renderEvent}\n mode={mode}\n onClick={onEventClick ? (e) => onEventClick(event, e) : undefined}\n >\n {event.title}\n </ScheduleEvent>\n ))}\n </div>\n );\n\n return (\n <>\n {dropdownType === 'modal' && (\n <Modal\n opened={dropdownOpened}\n onClose={handleClose}\n unstyled={unstyled}\n radius={radius}\n title={modalTitle}\n {...modalProps}\n >\n {eventsList}\n </Modal>\n )}\n\n <Popover\n position=\"bottom-start\"\n width={260}\n opened={dropdownOpened}\n trapFocus\n returnFocus={false}\n unstyled={unstyled}\n disabled={popoverProps?.disabled || dropdownType === 'modal'}\n radius={radius}\n transitionProps={{ transition: 'pop', duration: 120 }}\n offset={-46}\n id={id}\n {...popoverProps}\n onChange={(_opened) => {\n if (!_opened) {\n popoverProps?.onChange?.(_opened);\n handleClose();\n }\n }}\n >\n <Popover.Target>\n <UnstyledButton\n {...getStyles('moreEventsButton')}\n mod={{ static: mode === 'static' }}\n onClick={() => dropdownHandlers.toggle()}\n {...others}\n >\n {getLabel('moreLabel', labels)(moreEventsCount)}\n </UnstyledButton>\n </Popover.Target>\n\n <Popover.Dropdown {...getStyles('moreEventsDropdown')}>{eventsList}</Popover.Dropdown>\n </Popover>\n </>\n );\n});\n\nMoreEvents.displayName = '@mantine/schedule/MoreEvents';\nMoreEvents.classes = classes;\n"],"mappings":";;;;;;;;AAyEA,MAAM,eAAe,EACnB,cAAc,WACf;AAED,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,cAAc,OAAO;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,QACA,cACA,QACA,iBACA,cACA,YACA,iBACA,UACA,YACA,iBACA,aACA,IACA,QACA,MACA,cACA,GAAG,WACD;CACJ,MAAM,CAAC,gBAAgB,oBAAoB,eAAe;CAE1D,MAAM,YAAY,UAA6B;EAC7C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACf,CAAC;CAEF,MAAM,oBAAoB;AACxB,mBAAiB,OAAO;AACxB,qBAAmB;;CAGrB,MAAM,aACJ,oBAAC,OAAD;EAAK,GAAI,UAAU,iBAAiB;YACjC,OAAO,KAAK,UACX,oBAAC,eAAD;GAEU;GACD;GACP,MAAK;GACY;GACJ;GACP;GACN,SAAS,gBAAgB,MAAM,aAAa,OAAO,EAAE,GAAG,KAAA;aAEvD,MAAM;GACO,EAVT,MAAM,GAUG,CAChB;EACE,CAAA;AAGR,QACE,qBAAA,UAAA,EAAA,UAAA,CACG,iBAAiB,WAChB,oBAAC,OAAD;EACE,QAAQ;EACR,SAAS;EACC;EACF;EACR,OAAO;EACP,GAAI;YAEH;EACK,CAAA,EAGV,qBAAC,SAAD;EACE,UAAS;EACT,OAAO;EACP,QAAQ;EACR,WAAA;EACA,aAAa;EACH;EACV,UAAU,cAAc,YAAY,iBAAiB;EAC7C;EACR,iBAAiB;GAAE,YAAY;GAAO,UAAU;GAAK;EACrD,QAAQ;EACJ;EACJ,GAAI;EACJ,WAAW,YAAY;AACrB,OAAI,CAAC,SAAS;AACZ,kBAAc,WAAW,QAAQ;AACjC,iBAAa;;;YAhBnB,CAoBE,oBAAC,QAAQ,QAAT,EAAA,UACE,oBAAC,gBAAD;GACE,GAAI,UAAU,mBAAmB;GACjC,KAAK,EAAE,QAAQ,SAAS,UAAU;GAClC,eAAe,iBAAiB,QAAQ;GACxC,GAAI;aAEH,SAAS,aAAa,OAAO,CAAC,gBAAgB;GAChC,CAAA,EACF,CAAA,EAEjB,oBAAC,QAAQ,UAAT;GAAkB,GAAI,UAAU,qBAAqB;aAAG;GAA8B,CAAA,CAC9E;IACT,EAAA,CAAA;EAEL;AAEF,WAAW,cAAc;AACzB,WAAW,UAAUA"}
@@ -1,5 +1,6 @@
1
1
  "use client";
2
2
  import { getLabel } from "../../../labels.mjs";
3
+ import { useScheduleHeaderLabels } from "../ScheduleHeaderContext.mjs";
3
4
  import HeaderControl_module_default from "./HeaderControl.module.mjs";
4
5
  import { AccordionChevron, UnstyledButton, createVarsResolver, factory, getRadius, useDirection, useProps, useStyles } from "@mantine/core";
5
6
  import { jsx } from "react/jsx-runtime";
@@ -11,7 +12,7 @@ const defaultProps = {
11
12
  const varsResolver = createVarsResolver((_theme, { radius }) => ({ headerControl: { "--control-radius": radius === void 0 ? void 0 : getRadius(radius) } }));
12
13
  const HeaderControl = factory((_props) => {
13
14
  const props = useProps("HeaderControl", defaultProps, _props);
14
- const { classNames, className, style, styles, unstyled, vars, __staticSelector, mod, attributes, active, square, radius, interactive, ...others } = props;
15
+ const { classNames, className, style, styles, unstyled, vars, __staticSelector, mod, attributes, active, square, radius, interactive, labels, ...others } = props;
15
16
  return /* @__PURE__ */ jsx(UnstyledButton, {
16
17
  ...useStyles({
17
18
  name: __staticSelector,
@@ -43,7 +44,7 @@ function ScheduleHeaderNext(props) {
43
44
  const { dir } = useDirection();
44
45
  return /* @__PURE__ */ jsx(HeaderControl, {
45
46
  "data-type": "next",
46
- "aria-label": getLabel("next", props.labels),
47
+ "aria-label": getLabel("next", useScheduleHeaderLabels(props.labels)),
47
48
  square: true,
48
49
  ...props,
49
50
  children: /* @__PURE__ */ jsx(AccordionChevron, { style: { transform: `rotate(${dir === "rtl" ? 90 : -90}deg)` } })
@@ -53,18 +54,19 @@ function ScheduleHeaderPrevious(props) {
53
54
  const { dir } = useDirection();
54
55
  return /* @__PURE__ */ jsx(HeaderControl, {
55
56
  "data-type": "previous",
56
- "aria-label": getLabel("previous", props.labels),
57
+ "aria-label": getLabel("previous", useScheduleHeaderLabels(props.labels)),
57
58
  square: true,
58
59
  ...props,
59
60
  children: /* @__PURE__ */ jsx(AccordionChevron, { style: { transform: `rotate(${dir === "rtl" ? -90 : 90}deg)` } })
60
61
  });
61
62
  }
62
63
  function ScheduleHeaderToday(props) {
64
+ const resolvedLabels = useScheduleHeaderLabels(props.labels);
63
65
  return /* @__PURE__ */ jsx(HeaderControl, {
64
66
  "data-type": "today",
65
- "aria-label": getLabel("today", props.labels),
67
+ "aria-label": getLabel("today", resolvedLabels),
66
68
  ...props,
67
- children: getLabel("today", props.labels)
69
+ children: getLabel("today", resolvedLabels)
68
70
  });
69
71
  }
70
72
  ScheduleHeaderNext.displayName = "@mantine/schedule/ScheduleHeaderNext";
@@ -1 +1 @@
1
- {"version":3,"file":"HeaderControl.mjs","names":["classes"],"sources":["../../../../src/components/ScheduleHeader/HeaderControl/HeaderControl.tsx"],"sourcesContent":["import {\n AccordionChevron,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n MantineRadius,\n StylesApiProps,\n UnstyledButton,\n useDirection,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { getLabel, ScheduleLabelsOverride } from '../../../labels';\nimport classes from './HeaderControl.module.css';\n\nexport type HeaderControlStylesNames = 'headerControl';\nexport type HeaderControlCssVariables = {\n headerControl: '--control-radius';\n};\n\nexport interface HeaderControlProps\n extends BoxProps, StylesApiProps<HeaderControlFactory>, ElementProps<'button'> {\n __staticSelector?: string;\n\n /** Applies active styles */\n active?: boolean;\n\n /** Removes inline padding */\n square?: boolean;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** If set to `false`, the control will not be clickable */\n interactive?: boolean;\n\n /** Labels override */\n labels?: ScheduleLabelsOverride;\n}\n\nexport type HeaderControlFactory = Factory<{\n props: HeaderControlProps;\n ref: HTMLButtonElement;\n stylesNames: HeaderControlStylesNames;\n vars: HeaderControlCssVariables;\n}>;\n\nconst defaultProps = {\n __staticSelector: 'HeaderControl',\n interactive: true,\n} satisfies Partial<HeaderControlProps>;\n\nconst varsResolver = createVarsResolver<HeaderControlFactory>((_theme, { radius }) => ({\n headerControl: {\n '--control-radius': radius === undefined ? undefined : getRadius(radius),\n },\n}));\n\nexport const HeaderControl = factory<HeaderControlFactory>((_props) => {\n const props = useProps('HeaderControl', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n __staticSelector,\n mod,\n attributes,\n active,\n square,\n radius,\n interactive,\n ...others\n } = props;\n\n const getStyles = useStyles<HeaderControlFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'headerControl',\n });\n\n return (\n <UnstyledButton\n {...getStyles('headerControl', { active: interactive })}\n mod={[{ active, square, interactive }, mod]}\n tabIndex={interactive ? undefined : -1}\n {...others}\n />\n );\n});\n\nHeaderControl.displayName = '@mantine/schedule/HeaderControl';\nHeaderControl.classes = classes;\nHeaderControl.varsResolver = varsResolver;\n\nexport function ScheduleHeaderNext(props: HeaderControlProps) {\n const { dir } = useDirection();\n\n return (\n <HeaderControl data-type=\"next\" aria-label={getLabel('next', props.labels)} square {...props}>\n <AccordionChevron style={{ transform: `rotate(${dir === 'rtl' ? 90 : -90}deg)` }} />\n </HeaderControl>\n );\n}\n\nexport function ScheduleHeaderPrevious(props: HeaderControlProps) {\n const { dir } = useDirection();\n\n return (\n <HeaderControl\n data-type=\"previous\"\n aria-label={getLabel('previous', props.labels)}\n square\n {...props}\n >\n <AccordionChevron style={{ transform: `rotate(${dir === 'rtl' ? -90 : 90}deg)` }} />\n </HeaderControl>\n );\n}\n\nexport function ScheduleHeaderToday(props: HeaderControlProps) {\n return (\n <HeaderControl data-type=\"today\" aria-label={getLabel('today', props.labels)} {...props}>\n {getLabel('today', props.labels)}\n </HeaderControl>\n );\n}\n\nScheduleHeaderNext.displayName = '@mantine/schedule/ScheduleHeaderNext';\nScheduleHeaderPrevious.displayName = '@mantine/schedule/ScheduleHeaderPrevious';\nScheduleHeaderToday.displayName = '@mantine/schedule/ScheduleHeaderToday';\n"],"mappings":";;;;;;AAkDA,MAAM,eAAe;CACnB,kBAAkB;CAClB,aAAa;CACd;AAED,MAAM,eAAe,oBAA0C,QAAQ,EAAE,cAAc,EACrF,eAAe,EACb,oBAAoB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO,EACzE,EACF,EAAE;AAEH,MAAa,gBAAgB,SAA+B,WAAW;CACrE,MAAM,QAAQ,SAAS,iBAAiB,cAAc,OAAO;CAC7D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,kBACA,KACA,YACA,QACA,QACA,QACA,aACA,GAAG,WACD;AAiBJ,QACE,oBAAC,gBAAD;EACE,GAjBc,UAAgC;GAChD,MAAM;GACN,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;GACf,CAAC,CAIgB,iBAAiB,EAAE,QAAQ,aAAa,CAAC;EACvD,KAAK,CAAC;GAAE;GAAQ;GAAQ;GAAa,EAAE,IAAI;EAC3C,UAAU,cAAc,KAAA,IAAY;EACpC,GAAI;EACJ,CAAA;EAEJ;AAEF,cAAc,cAAc;AAC5B,cAAc,UAAUA;AACxB,cAAc,eAAe;AAE7B,SAAgB,mBAAmB,OAA2B;CAC5D,MAAM,EAAE,QAAQ,cAAc;AAE9B,QACE,oBAAC,eAAD;EAAe,aAAU;EAAO,cAAY,SAAS,QAAQ,MAAM,OAAO;EAAE,QAAA;EAAO,GAAI;YACrF,oBAAC,kBAAD,EAAkB,OAAO,EAAE,WAAW,UAAU,QAAQ,QAAQ,KAAK,IAAI,OAAO,EAAI,CAAA;EACtE,CAAA;;AAIpB,SAAgB,uBAAuB,OAA2B;CAChE,MAAM,EAAE,QAAQ,cAAc;AAE9B,QACE,oBAAC,eAAD;EACE,aAAU;EACV,cAAY,SAAS,YAAY,MAAM,OAAO;EAC9C,QAAA;EACA,GAAI;YAEJ,oBAAC,kBAAD,EAAkB,OAAO,EAAE,WAAW,UAAU,QAAQ,QAAQ,MAAM,GAAG,OAAO,EAAI,CAAA;EACtE,CAAA;;AAIpB,SAAgB,oBAAoB,OAA2B;AAC7D,QACE,oBAAC,eAAD;EAAe,aAAU;EAAQ,cAAY,SAAS,SAAS,MAAM,OAAO;EAAE,GAAI;YAC/E,SAAS,SAAS,MAAM,OAAO;EAClB,CAAA;;AAIpB,mBAAmB,cAAc;AACjC,uBAAuB,cAAc;AACrC,oBAAoB,cAAc"}
1
+ {"version":3,"file":"HeaderControl.mjs","names":["classes"],"sources":["../../../../src/components/ScheduleHeader/HeaderControl/HeaderControl.tsx"],"sourcesContent":["import {\n AccordionChevron,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n MantineRadius,\n StylesApiProps,\n UnstyledButton,\n useDirection,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { getLabel, ScheduleLabelsOverride } from '../../../labels';\nimport { useScheduleHeaderLabels } from '../ScheduleHeaderContext';\nimport classes from './HeaderControl.module.css';\n\nexport type HeaderControlStylesNames = 'headerControl';\nexport type HeaderControlCssVariables = {\n headerControl: '--control-radius';\n};\n\nexport interface HeaderControlProps\n extends BoxProps, StylesApiProps<HeaderControlFactory>, ElementProps<'button'> {\n __staticSelector?: string;\n\n /** Applies active styles */\n active?: boolean;\n\n /** Removes inline padding */\n square?: boolean;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** If set to `false`, the control will not be clickable */\n interactive?: boolean;\n\n /** Labels override */\n labels?: ScheduleLabelsOverride;\n}\n\nexport type HeaderControlFactory = Factory<{\n props: HeaderControlProps;\n ref: HTMLButtonElement;\n stylesNames: HeaderControlStylesNames;\n vars: HeaderControlCssVariables;\n}>;\n\nconst defaultProps = {\n __staticSelector: 'HeaderControl',\n interactive: true,\n} satisfies Partial<HeaderControlProps>;\n\nconst varsResolver = createVarsResolver<HeaderControlFactory>((_theme, { radius }) => ({\n headerControl: {\n '--control-radius': radius === undefined ? undefined : getRadius(radius),\n },\n}));\n\nexport const HeaderControl = factory<HeaderControlFactory>((_props) => {\n const props = useProps('HeaderControl', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n __staticSelector,\n mod,\n attributes,\n active,\n square,\n radius,\n interactive,\n labels,\n ...others\n } = props;\n\n const getStyles = useStyles<HeaderControlFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'headerControl',\n });\n\n return (\n <UnstyledButton\n {...getStyles('headerControl', { active: interactive })}\n mod={[{ active, square, interactive }, mod]}\n tabIndex={interactive ? undefined : -1}\n {...others}\n />\n );\n});\n\nHeaderControl.displayName = '@mantine/schedule/HeaderControl';\nHeaderControl.classes = classes;\nHeaderControl.varsResolver = varsResolver;\n\nexport function ScheduleHeaderNext(props: HeaderControlProps) {\n const { dir } = useDirection();\n const resolvedLabels = useScheduleHeaderLabels(props.labels);\n\n return (\n <HeaderControl data-type=\"next\" aria-label={getLabel('next', resolvedLabels)} square {...props}>\n <AccordionChevron style={{ transform: `rotate(${dir === 'rtl' ? 90 : -90}deg)` }} />\n </HeaderControl>\n );\n}\n\nexport function ScheduleHeaderPrevious(props: HeaderControlProps) {\n const { dir } = useDirection();\n const resolvedLabels = useScheduleHeaderLabels(props.labels);\n\n return (\n <HeaderControl\n data-type=\"previous\"\n aria-label={getLabel('previous', resolvedLabels)}\n square\n {...props}\n >\n <AccordionChevron style={{ transform: `rotate(${dir === 'rtl' ? -90 : 90}deg)` }} />\n </HeaderControl>\n );\n}\n\nexport function ScheduleHeaderToday(props: HeaderControlProps) {\n const resolvedLabels = useScheduleHeaderLabels(props.labels);\n\n return (\n <HeaderControl data-type=\"today\" aria-label={getLabel('today', resolvedLabels)} {...props}>\n {getLabel('today', resolvedLabels)}\n </HeaderControl>\n );\n}\n\nScheduleHeaderNext.displayName = '@mantine/schedule/ScheduleHeaderNext';\nScheduleHeaderPrevious.displayName = '@mantine/schedule/ScheduleHeaderPrevious';\nScheduleHeaderToday.displayName = '@mantine/schedule/ScheduleHeaderToday';\n"],"mappings":";;;;;;;AAmDA,MAAM,eAAe;CACnB,kBAAkB;CAClB,aAAa;CACd;AAED,MAAM,eAAe,oBAA0C,QAAQ,EAAE,cAAc,EACrF,eAAe,EACb,oBAAoB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,OAAO,EACzE,EACF,EAAE;AAEH,MAAa,gBAAgB,SAA+B,WAAW;CACrE,MAAM,QAAQ,SAAS,iBAAiB,cAAc,OAAO;CAC7D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,kBACA,KACA,YACA,QACA,QACA,QACA,aACA,QACA,GAAG,WACD;AAiBJ,QACE,oBAAC,gBAAD;EACE,GAjBc,UAAgC;GAChD,MAAM;GACN,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;GACf,CAAC,CAIgB,iBAAiB,EAAE,QAAQ,aAAa,CAAC;EACvD,KAAK,CAAC;GAAE;GAAQ;GAAQ;GAAa,EAAE,IAAI;EAC3C,UAAU,cAAc,KAAA,IAAY;EACpC,GAAI;EACJ,CAAA;EAEJ;AAEF,cAAc,cAAc;AAC5B,cAAc,UAAUA;AACxB,cAAc,eAAe;AAE7B,SAAgB,mBAAmB,OAA2B;CAC5D,MAAM,EAAE,QAAQ,cAAc;AAG9B,QACE,oBAAC,eAAD;EAAe,aAAU;EAAO,cAAY,SAAS,QAHhC,wBAAwB,MAAM,OAAO,CAGkB;EAAE,QAAA;EAAO,GAAI;YACvF,oBAAC,kBAAD,EAAkB,OAAO,EAAE,WAAW,UAAU,QAAQ,QAAQ,KAAK,IAAI,OAAO,EAAI,CAAA;EACtE,CAAA;;AAIpB,SAAgB,uBAAuB,OAA2B;CAChE,MAAM,EAAE,QAAQ,cAAc;AAG9B,QACE,oBAAC,eAAD;EACE,aAAU;EACV,cAAY,SAAS,YALF,wBAAwB,MAAM,OAAO,CAKR;EAChD,QAAA;EACA,GAAI;YAEJ,oBAAC,kBAAD,EAAkB,OAAO,EAAE,WAAW,UAAU,QAAQ,QAAQ,MAAM,GAAG,OAAO,EAAI,CAAA;EACtE,CAAA;;AAIpB,SAAgB,oBAAoB,OAA2B;CAC7D,MAAM,iBAAiB,wBAAwB,MAAM,OAAO;AAE5D,QACE,oBAAC,eAAD;EAAe,aAAU;EAAQ,cAAY,SAAS,SAAS,eAAe;EAAE,GAAI;YACjF,SAAS,SAAS,eAAe;EACpB,CAAA;;AAIpB,mBAAmB,cAAc;AACjC,uBAAuB,cAAc;AACrC,oBAAoB,cAAc"}
@@ -3,6 +3,7 @@ import { getLabel } from "../../../labels.mjs";
3
3
  import { formatDate } from "../../../utils/format-date/format-date.mjs";
4
4
  import { getMonthsList } from "../../../utils/get-months-list/get-months-list.mjs";
5
5
  import { getYearsList } from "../../../utils/get-years-list/get-years-list.mjs";
6
+ import { useScheduleHeaderLabels } from "../ScheduleHeaderContext.mjs";
6
7
  import { HeaderControl } from "../HeaderControl/HeaderControl.mjs";
7
8
  import MonthYearSelect_module_default from "./MonthYearSelect.module.mjs";
8
9
  import { Popover, UnstyledButton, createScopedKeydownHandler, createVarsResolver, factory, getRadius, useProps, useStyles } from "@mantine/core";
@@ -33,6 +34,7 @@ const MonthYearSelect = factory((_props) => {
33
34
  rootSelector: "monthYearSelectTarget"
34
35
  });
35
36
  const [opened, handlers] = useDisclosure(false);
37
+ const resolvedLabels = useScheduleHeaderLabels(labels);
36
38
  const today = /* @__PURE__ */ new Date();
37
39
  const ctx = useDatesContext();
38
40
  const _startYear = startYear ?? today.getFullYear() - 5;
@@ -52,7 +54,7 @@ const MonthYearSelect = factory((_props) => {
52
54
  type: "year",
53
55
  active: year === yearValue
54
56
  },
55
- "aria-label": `${getLabel("selectYear", labels)} ${year}`,
57
+ "aria-label": `${getLabel("selectYear", resolvedLabels)} ${year}`,
56
58
  tabIndex: hasActiveYear ? year === yearValue ? 0 : -1 : index === 0 ? 0 : -1,
57
59
  ...controlProps,
58
60
  onKeyDown: createScopedKeydownHandler({
@@ -95,7 +97,7 @@ const MonthYearSelect = factory((_props) => {
95
97
  className: controlProps?.className,
96
98
  style: controlProps?.style
97
99
  }),
98
- "aria-label": `${getLabel("selectMonth", labels)} ${month.name}`,
100
+ "aria-label": `${getLabel("selectMonth", resolvedLabels)} ${month.name}`,
99
101
  children: month.name
100
102
  }, month.name);
101
103
  }) : null;
@@ -135,14 +137,14 @@ const MonthYearSelect = factory((_props) => {
135
137
  ...getStyles("monthYearSelectList"),
136
138
  children: [/* @__PURE__ */ jsx("div", {
137
139
  ...getStyles("monthYearSelectLabel"),
138
- children: getLabel("month", labels)
140
+ children: getLabel("month", resolvedLabels)
139
141
  }), months]
140
142
  }), /* @__PURE__ */ jsxs("div", {
141
143
  "data-list": true,
142
144
  ...getStyles("monthYearSelectList"),
143
145
  children: [withMonths && /* @__PURE__ */ jsx("div", {
144
146
  ...getStyles("monthYearSelectLabel"),
145
- children: getLabel("year", labels)
147
+ children: getLabel("year", resolvedLabels)
146
148
  }), years]
147
149
  })]
148
150
  })]
@@ -1 +1 @@
1
- {"version":3,"file":"MonthYearSelect.mjs","names":["classes"],"sources":["../../../../src/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.tsx"],"sourcesContent":["import {\n BoxProps,\n createScopedKeydownHandler,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n factory,\n Factory,\n getRadius,\n MantineRadius,\n Popover,\n PopoverProps,\n StylesApiProps,\n UnstyledButton,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useDisclosure } from '@mantine/hooks';\nimport { getLabel, ScheduleLabelsOverride } from '../../../labels';\nimport { DateLabelFormat } from '../../../types';\nimport { formatDate, getMonthsList, getYearsList } from '../../../utils';\nimport { HeaderControl } from '../HeaderControl/HeaderControl';\nimport classes from './MonthYearSelect.module.css';\n\nexport type MonthYearSelectStylesNames =\n | 'monthYearSelectTarget'\n | 'monthYearSelectDropdown'\n | 'monthYearSelectControl'\n | 'monthYearSelectList'\n | 'monthYearSelectLabel';\n\nexport type MonthYearSelectCssVariables = {\n monthYearSelectDropdown: '--control-radius';\n};\n\nexport interface MonthYearSelectProps\n extends BoxProps, StylesApiProps<MonthYearSelectFactory>, ElementProps<'button'> {\n __staticSelector?: string;\n\n /** Locale passed down to dayjs, overrides value defined on `DatesProvider` */\n locale?: string;\n\n /** Props passed down to the underlying Popover component */\n popoverProps?: PopoverProps;\n\n /** Start year for year selection, calculated from the current date by default */\n startYear?: number;\n\n /** End year for year selection, calculated from the current date by default */\n endYear?: number;\n\n /** Current year value (e.g. `2025`) */\n yearValue?: number;\n\n /** Current month value (0-11) */\n monthValue?: number;\n\n /** Called with year value (e.g. `2025`) when year is selected in the dropdown */\n onYearChange?: (year: number) => void;\n\n /** Called with month value (0-11) when month is selected in the dropdown */\n onMonthChange?: (month: number) => void;\n\n /** Format for displaying months in the dropdown, dayjs format or custom formatter function @default 'MMM' */\n monthsListFormat?: DateLabelFormat;\n\n /** Format for displaying month label in the control, dayjs format @default 'MMMM YYYY' */\n labelFormat?: DateLabelFormat;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Props passed down to year controls */\n getYearControlProps?: (year: number) => React.ComponentProps<'button'> & DataAttributes;\n\n /** Props passed down to month controls */\n getMonthControlProps?: (month: number) => React.ComponentProps<'button'> & DataAttributes;\n\n /** If set to false, months are not displayed in the dropdown @default true */\n withMonths?: boolean;\n\n /** Labels override */\n labels?: ScheduleLabelsOverride;\n}\n\nexport type MonthYearSelectFactory = Factory<{\n props: MonthYearSelectProps;\n ref: HTMLButtonElement;\n stylesNames: MonthYearSelectStylesNames;\n vars: MonthYearSelectCssVariables;\n}>;\n\nconst defaultProps = {\n __staticSelector: 'MonthYearSelect',\n withMonths: true,\n} satisfies Partial<MonthYearSelectProps>;\n\nconst varsResolver = createVarsResolver<MonthYearSelectFactory>((_theme, { radius }) => ({\n monthYearSelectDropdown: {\n '--control-radius': radius === undefined ? undefined : getRadius(radius),\n },\n}));\n\nexport const MonthYearSelect = factory<MonthYearSelectFactory>((_props) => {\n const props = useProps('MonthYearSelect', defaultProps, _props);\n const {\n __staticSelector,\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n attributes,\n popoverProps,\n startYear,\n endYear,\n onYearChange,\n onMonthChange,\n locale,\n monthsListFormat,\n monthValue,\n yearValue,\n labelFormat,\n radius,\n getMonthControlProps,\n getYearControlProps,\n withMonths,\n id,\n labels,\n ...others\n } = props;\n\n const getStyles = useStyles<MonthYearSelectFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'monthYearSelectTarget',\n });\n\n const [opened, handlers] = useDisclosure(false);\n\n const today = new Date();\n const ctx = useDatesContext();\n const _startYear = startYear ?? today.getFullYear() - 5;\n const _endYear = endYear ?? today.getFullYear() + 5;\n const hasActiveYear = yearValue !== undefined && yearValue >= _startYear && yearValue <= _endYear;\n\n const years = getYearsList({ startYear: _startYear, endYear: _endYear }).map((year, index) => {\n const controlProps = getYearControlProps?.(year);\n return (\n <UnstyledButton\n key={year}\n onClick={() => {\n onYearChange?.(year);\n if (!withMonths) {\n handlers.close();\n }\n }}\n mod={{ type: 'year', active: year === yearValue }}\n aria-label={`${getLabel('selectYear', labels)} ${year}`}\n tabIndex={hasActiveYear ? (year === yearValue ? 0 : -1) : index === 0 ? 0 : -1}\n {...controlProps}\n onKeyDown={createScopedKeydownHandler({\n siblingSelector: '[data-type=\"year\"]:not(:disabled)',\n parentSelector: '[data-list]',\n activateOnFocus: false,\n loop: true,\n orientation: 'vertical',\n onKeyDown: controlProps?.onKeyDown,\n })}\n {...getStyles('monthYearSelectControl', {\n className: controlProps?.className,\n style: controlProps?.style,\n })}\n >\n {year}\n </UnstyledButton>\n );\n });\n\n const months = withMonths\n ? getMonthsList({\n locale: ctx.getLocale(locale),\n format: monthsListFormat || 'MMMM',\n }).map((month) => {\n const controlProps = getMonthControlProps?.(month.month);\n return (\n <UnstyledButton\n key={month.name}\n onClick={() => onMonthChange?.(month.month)}\n mod={{ type: 'month', active: month.month === monthValue }}\n tabIndex={month.month === monthValue ? 0 : -1}\n onKeyDown={createScopedKeydownHandler({\n siblingSelector: '[data-type=\"month\"]:not(:disabled)',\n parentSelector: '[data-list]',\n activateOnFocus: false,\n loop: true,\n orientation: 'vertical',\n onKeyDown: controlProps?.onKeyDown,\n })}\n {...controlProps}\n {...getStyles('monthYearSelectControl', {\n className: controlProps?.className,\n style: controlProps?.style,\n })}\n aria-label={`${getLabel('selectMonth', labels)} ${month.name}`}\n >\n {month.name}\n </UnstyledButton>\n );\n })\n : null;\n\n return (\n <Popover\n position=\"bottom-start\"\n __staticSelector={__staticSelector}\n trapFocus\n transitionProps={{ transition: 'pop', duration: 120 }}\n radius={radius || 'var(--schedule-radius, var(--mantine-radius-default))'}\n shadow=\"md\"\n offset={3}\n width={withMonths ? undefined : 'target'}\n opened={opened}\n onChange={handlers.set}\n id={id}\n {...popoverProps}\n >\n <Popover.Target>\n <HeaderControl\n {...getStyles('monthYearSelectTarget')}\n __staticSelector={__staticSelector}\n radius={radius}\n data-with-months={withMonths || undefined}\n onClick={handlers.toggle}\n {...others}\n >\n {formatDate({\n locale: ctx.getLocale(locale),\n date: new Date(yearValue ?? today.getFullYear(), monthValue ?? today.getMonth()),\n format: labelFormat || (withMonths ? 'MMMM YYYY' : 'YYYY'),\n })}\n </HeaderControl>\n </Popover.Target>\n\n <Popover.Dropdown\n data-with-months={withMonths || undefined}\n {...getStyles('monthYearSelectDropdown')}\n >\n {withMonths && (\n <div data-list {...getStyles('monthYearSelectList')}>\n <div {...getStyles('monthYearSelectLabel')}>{getLabel('month', labels)}</div>\n {months}\n </div>\n )}\n <div data-list {...getStyles('monthYearSelectList')}>\n {withMonths && (\n <div {...getStyles('monthYearSelectLabel')}>{getLabel('year', labels)}</div>\n )}\n {years}\n </div>\n </Popover.Dropdown>\n </Popover>\n );\n});\n\nMonthYearSelect.displayName = '@mantine/schedule/MonthYearSelect';\nMonthYearSelect.classes = classes;\nMonthYearSelect.varsResolver = varsResolver;\n"],"mappings":"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"}
1
+ {"version":3,"file":"MonthYearSelect.mjs","names":["classes"],"sources":["../../../../src/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.tsx"],"sourcesContent":["import {\n BoxProps,\n createScopedKeydownHandler,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n factory,\n Factory,\n getRadius,\n MantineRadius,\n Popover,\n PopoverProps,\n StylesApiProps,\n UnstyledButton,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useDisclosure } from '@mantine/hooks';\nimport { getLabel, ScheduleLabelsOverride } from '../../../labels';\nimport { DateLabelFormat } from '../../../types';\nimport { formatDate, getMonthsList, getYearsList } from '../../../utils';\nimport { HeaderControl } from '../HeaderControl/HeaderControl';\nimport { useScheduleHeaderLabels } from '../ScheduleHeaderContext';\nimport classes from './MonthYearSelect.module.css';\n\nexport type MonthYearSelectStylesNames =\n | 'monthYearSelectTarget'\n | 'monthYearSelectDropdown'\n | 'monthYearSelectControl'\n | 'monthYearSelectList'\n | 'monthYearSelectLabel';\n\nexport type MonthYearSelectCssVariables = {\n monthYearSelectDropdown: '--control-radius';\n};\n\nexport interface MonthYearSelectProps\n extends BoxProps, StylesApiProps<MonthYearSelectFactory>, ElementProps<'button'> {\n __staticSelector?: string;\n\n /** Locale passed down to dayjs, overrides value defined on `DatesProvider` */\n locale?: string;\n\n /** Props passed down to the underlying Popover component */\n popoverProps?: PopoverProps;\n\n /** Start year for year selection, calculated from the current date by default */\n startYear?: number;\n\n /** End year for year selection, calculated from the current date by default */\n endYear?: number;\n\n /** Current year value (e.g. `2025`) */\n yearValue?: number;\n\n /** Current month value (0-11) */\n monthValue?: number;\n\n /** Called with year value (e.g. `2025`) when year is selected in the dropdown */\n onYearChange?: (year: number) => void;\n\n /** Called with month value (0-11) when month is selected in the dropdown */\n onMonthChange?: (month: number) => void;\n\n /** Format for displaying months in the dropdown, dayjs format or custom formatter function @default 'MMM' */\n monthsListFormat?: DateLabelFormat;\n\n /** Format for displaying month label in the control, dayjs format @default 'MMMM YYYY' */\n labelFormat?: DateLabelFormat;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Props passed down to year controls */\n getYearControlProps?: (year: number) => React.ComponentProps<'button'> & DataAttributes;\n\n /** Props passed down to month controls */\n getMonthControlProps?: (month: number) => React.ComponentProps<'button'> & DataAttributes;\n\n /** If set to false, months are not displayed in the dropdown @default true */\n withMonths?: boolean;\n\n /** Labels override */\n labels?: ScheduleLabelsOverride;\n}\n\nexport type MonthYearSelectFactory = Factory<{\n props: MonthYearSelectProps;\n ref: HTMLButtonElement;\n stylesNames: MonthYearSelectStylesNames;\n vars: MonthYearSelectCssVariables;\n}>;\n\nconst defaultProps = {\n __staticSelector: 'MonthYearSelect',\n withMonths: true,\n} satisfies Partial<MonthYearSelectProps>;\n\nconst varsResolver = createVarsResolver<MonthYearSelectFactory>((_theme, { radius }) => ({\n monthYearSelectDropdown: {\n '--control-radius': radius === undefined ? undefined : getRadius(radius),\n },\n}));\n\nexport const MonthYearSelect = factory<MonthYearSelectFactory>((_props) => {\n const props = useProps('MonthYearSelect', defaultProps, _props);\n const {\n __staticSelector,\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n attributes,\n popoverProps,\n startYear,\n endYear,\n onYearChange,\n onMonthChange,\n locale,\n monthsListFormat,\n monthValue,\n yearValue,\n labelFormat,\n radius,\n getMonthControlProps,\n getYearControlProps,\n withMonths,\n id,\n labels,\n ...others\n } = props;\n\n const getStyles = useStyles<MonthYearSelectFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'monthYearSelectTarget',\n });\n\n const [opened, handlers] = useDisclosure(false);\n const resolvedLabels = useScheduleHeaderLabels(labels);\n\n const today = new Date();\n const ctx = useDatesContext();\n const _startYear = startYear ?? today.getFullYear() - 5;\n const _endYear = endYear ?? today.getFullYear() + 5;\n const hasActiveYear = yearValue !== undefined && yearValue >= _startYear && yearValue <= _endYear;\n\n const years = getYearsList({ startYear: _startYear, endYear: _endYear }).map((year, index) => {\n const controlProps = getYearControlProps?.(year);\n return (\n <UnstyledButton\n key={year}\n onClick={() => {\n onYearChange?.(year);\n if (!withMonths) {\n handlers.close();\n }\n }}\n mod={{ type: 'year', active: year === yearValue }}\n aria-label={`${getLabel('selectYear', resolvedLabels)} ${year}`}\n tabIndex={hasActiveYear ? (year === yearValue ? 0 : -1) : index === 0 ? 0 : -1}\n {...controlProps}\n onKeyDown={createScopedKeydownHandler({\n siblingSelector: '[data-type=\"year\"]:not(:disabled)',\n parentSelector: '[data-list]',\n activateOnFocus: false,\n loop: true,\n orientation: 'vertical',\n onKeyDown: controlProps?.onKeyDown,\n })}\n {...getStyles('monthYearSelectControl', {\n className: controlProps?.className,\n style: controlProps?.style,\n })}\n >\n {year}\n </UnstyledButton>\n );\n });\n\n const months = withMonths\n ? getMonthsList({\n locale: ctx.getLocale(locale),\n format: monthsListFormat || 'MMMM',\n }).map((month) => {\n const controlProps = getMonthControlProps?.(month.month);\n return (\n <UnstyledButton\n key={month.name}\n onClick={() => onMonthChange?.(month.month)}\n mod={{ type: 'month', active: month.month === monthValue }}\n tabIndex={month.month === monthValue ? 0 : -1}\n onKeyDown={createScopedKeydownHandler({\n siblingSelector: '[data-type=\"month\"]:not(:disabled)',\n parentSelector: '[data-list]',\n activateOnFocus: false,\n loop: true,\n orientation: 'vertical',\n onKeyDown: controlProps?.onKeyDown,\n })}\n {...controlProps}\n {...getStyles('monthYearSelectControl', {\n className: controlProps?.className,\n style: controlProps?.style,\n })}\n aria-label={`${getLabel('selectMonth', resolvedLabels)} ${month.name}`}\n >\n {month.name}\n </UnstyledButton>\n );\n })\n : null;\n\n return (\n <Popover\n position=\"bottom-start\"\n __staticSelector={__staticSelector}\n trapFocus\n transitionProps={{ transition: 'pop', duration: 120 }}\n radius={radius || 'var(--schedule-radius, var(--mantine-radius-default))'}\n shadow=\"md\"\n offset={3}\n width={withMonths ? undefined : 'target'}\n opened={opened}\n onChange={handlers.set}\n id={id}\n {...popoverProps}\n >\n <Popover.Target>\n <HeaderControl\n {...getStyles('monthYearSelectTarget')}\n __staticSelector={__staticSelector}\n radius={radius}\n data-with-months={withMonths || undefined}\n onClick={handlers.toggle}\n {...others}\n >\n {formatDate({\n locale: ctx.getLocale(locale),\n date: new Date(yearValue ?? today.getFullYear(), monthValue ?? today.getMonth()),\n format: labelFormat || (withMonths ? 'MMMM YYYY' : 'YYYY'),\n })}\n </HeaderControl>\n </Popover.Target>\n\n <Popover.Dropdown\n data-with-months={withMonths || undefined}\n {...getStyles('monthYearSelectDropdown')}\n >\n {withMonths && (\n <div data-list {...getStyles('monthYearSelectList')}>\n <div {...getStyles('monthYearSelectLabel')}>{getLabel('month', resolvedLabels)}</div>\n {months}\n </div>\n )}\n <div data-list {...getStyles('monthYearSelectList')}>\n {withMonths && (\n <div {...getStyles('monthYearSelectLabel')}>{getLabel('year', resolvedLabels)}</div>\n )}\n {years}\n </div>\n </Popover.Dropdown>\n </Popover>\n );\n});\n\nMonthYearSelect.displayName = '@mantine/schedule/MonthYearSelect';\nMonthYearSelect.classes = classes;\nMonthYearSelect.varsResolver = varsResolver;\n"],"mappings":"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"}
@@ -1,4 +1,5 @@
1
1
  "use client";
2
+ import { ScheduleHeaderLabelsContext } from "./ScheduleHeaderContext.mjs";
2
3
  import { HeaderControl, ScheduleHeaderNext, ScheduleHeaderPrevious, ScheduleHeaderToday } from "./HeaderControl/HeaderControl.mjs";
3
4
  import { MonthYearSelect } from "./MonthYearSelect/MonthYearSelect.mjs";
4
5
  import { ViewSelect } from "./ViewSelect/ViewSelect.mjs";
@@ -10,23 +11,27 @@ const defaultProps = { __staticSelector: "ScheduleHeader" };
10
11
  const varsResolver = createVarsResolver(() => ({ scheduleHeader: { "--test": "test" } }));
11
12
  const ScheduleHeader = factory((_props) => {
12
13
  const props = useProps("ScheduleHeader", defaultProps, _props);
13
- const { classNames, className, style, styles, unstyled, vars, attributes, __staticSelector, ...others } = props;
14
- return /* @__PURE__ */ jsx(Box, {
15
- ...useStyles({
16
- name: __staticSelector,
17
- classes: ScheduleHeader_module_default,
18
- props,
19
- className,
20
- style,
21
- classNames,
22
- styles,
23
- unstyled,
24
- vars,
25
- varsResolver,
26
- attributes,
27
- rootSelector: "header"
28
- })("header"),
29
- ...others
14
+ const { classNames, className, style, styles, unstyled, vars, attributes, __staticSelector, labels, ...others } = props;
15
+ const getStyles = useStyles({
16
+ name: __staticSelector,
17
+ classes: ScheduleHeader_module_default,
18
+ props,
19
+ className,
20
+ style,
21
+ classNames,
22
+ styles,
23
+ unstyled,
24
+ vars,
25
+ varsResolver,
26
+ attributes,
27
+ rootSelector: "header"
28
+ });
29
+ return /* @__PURE__ */ jsx(ScheduleHeaderLabelsContext.Provider, {
30
+ value: labels,
31
+ children: /* @__PURE__ */ jsx(Box, {
32
+ ...getStyles("header"),
33
+ ...others
34
+ })
30
35
  });
31
36
  });
32
37
  ScheduleHeader.displayName = "@mantine/schedule/ScheduleHeader";
@@ -1 +1 @@
1
- {"version":3,"file":"ScheduleHeader.mjs","names":["classes"],"sources":["../../../src/components/ScheduleHeader/ScheduleHeader.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport {\n HeaderControl,\n HeaderControlStylesNames,\n ScheduleHeaderNext,\n ScheduleHeaderPrevious,\n ScheduleHeaderToday,\n} from './HeaderControl/HeaderControl';\nimport { MonthYearSelect, MonthYearSelectStylesNames } from './MonthYearSelect/MonthYearSelect';\nimport { ViewSelect, ViewSelectStylesNames } from './ViewSelect/ViewSelect';\nimport classes from './ScheduleHeader.module.css';\n\nexport type CombinedScheduleHeaderStylesNames =\n | ScheduleHeaderStylesNames\n | ViewSelectStylesNames\n | HeaderControlStylesNames\n | MonthYearSelectStylesNames;\n\nexport type ScheduleHeaderStylesNames = 'header';\nexport type ScheduleHeaderCssVariables = {\n scheduleHeader: '--test';\n};\n\nexport interface ScheduleHeaderProps\n extends BoxProps, StylesApiProps<ScheduleHeaderFactory>, ElementProps<'div'> {\n __staticSelector?: string;\n}\n\nexport type ScheduleHeaderFactory = Factory<{\n props: ScheduleHeaderProps;\n ref: HTMLDivElement;\n stylesNames: ScheduleHeaderStylesNames;\n vars: ScheduleHeaderCssVariables;\n staticComponents: {\n Control: typeof HeaderControl;\n Previous: typeof ScheduleHeaderPrevious;\n Next: typeof ScheduleHeaderNext;\n Today: typeof ScheduleHeaderToday;\n ViewSelect: typeof ViewSelect;\n MonthYearSelect: typeof MonthYearSelect;\n };\n}>;\n\nconst defaultProps = {\n __staticSelector: 'ScheduleHeader',\n} satisfies Partial<ScheduleHeaderProps>;\n\nconst varsResolver = createVarsResolver<ScheduleHeaderFactory>(() => ({\n scheduleHeader: {\n '--test': 'test',\n },\n}));\n\nexport const ScheduleHeader = factory<ScheduleHeaderFactory>((_props) => {\n const props = useProps('ScheduleHeader', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n attributes,\n __staticSelector,\n ...others\n } = props;\n\n const getStyles = useStyles<ScheduleHeaderFactory>({\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: 'header',\n });\n\n return <Box {...getStyles('header')} {...others} />;\n});\n\nScheduleHeader.displayName = '@mantine/schedule/ScheduleHeader';\nScheduleHeader.classes = classes;\nScheduleHeader.varsResolver = varsResolver;\nScheduleHeader.Control = HeaderControl;\nScheduleHeader.Next = ScheduleHeaderNext;\nScheduleHeader.Previous = ScheduleHeaderPrevious;\nScheduleHeader.Today = ScheduleHeaderToday;\nScheduleHeader.ViewSelect = ViewSelect;\nScheduleHeader.MonthYearSelect = MonthYearSelect;\n"],"mappings":";;;;;;;;AAqDA,MAAM,eAAe,EACnB,kBAAkB,kBACnB;AAED,MAAM,eAAe,0BAAiD,EACpE,gBAAgB,EACd,UAAU,QACX,EACF,EAAE;AAEH,MAAa,iBAAiB,SAAgC,WAAW;CACvE,MAAM,QAAQ,SAAS,kBAAkB,cAAc,OAAO;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,kBACA,GAAG,WACD;AAiBJ,QAAO,oBAAC,KAAD;EAAK,GAfM,UAAiC;GACjD,MAAM;GACN,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;GACf,CAAC,CAEwB,SAAS;EAAE,GAAI;EAAU,CAAA;EACnD;AAEF,eAAe,cAAc;AAC7B,eAAe,UAAUA;AACzB,eAAe,eAAe;AAC9B,eAAe,UAAU;AACzB,eAAe,OAAO;AACtB,eAAe,WAAW;AAC1B,eAAe,QAAQ;AACvB,eAAe,aAAa;AAC5B,eAAe,kBAAkB"}
1
+ {"version":3,"file":"ScheduleHeader.mjs","names":["classes"],"sources":["../../../src/components/ScheduleHeader/ScheduleHeader.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { ScheduleLabelsOverride } from '../../labels';\nimport {\n HeaderControl,\n HeaderControlStylesNames,\n ScheduleHeaderNext,\n ScheduleHeaderPrevious,\n ScheduleHeaderToday,\n} from './HeaderControl/HeaderControl';\nimport { MonthYearSelect, MonthYearSelectStylesNames } from './MonthYearSelect/MonthYearSelect';\nimport { ScheduleHeaderLabelsContext } from './ScheduleHeaderContext';\nimport { ViewSelect, ViewSelectStylesNames } from './ViewSelect/ViewSelect';\nimport classes from './ScheduleHeader.module.css';\n\nexport type CombinedScheduleHeaderStylesNames =\n | ScheduleHeaderStylesNames\n | ViewSelectStylesNames\n | HeaderControlStylesNames\n | MonthYearSelectStylesNames;\n\nexport type ScheduleHeaderStylesNames = 'header';\nexport type ScheduleHeaderCssVariables = {\n scheduleHeader: '--test';\n};\n\nexport interface ScheduleHeaderProps\n extends BoxProps, StylesApiProps<ScheduleHeaderFactory>, ElementProps<'div'> {\n __staticSelector?: string;\n\n /** Labels override shared with compound components rendered inside */\n labels?: ScheduleLabelsOverride;\n}\n\nexport type ScheduleHeaderFactory = Factory<{\n props: ScheduleHeaderProps;\n ref: HTMLDivElement;\n stylesNames: ScheduleHeaderStylesNames;\n vars: ScheduleHeaderCssVariables;\n staticComponents: {\n Control: typeof HeaderControl;\n Previous: typeof ScheduleHeaderPrevious;\n Next: typeof ScheduleHeaderNext;\n Today: typeof ScheduleHeaderToday;\n ViewSelect: typeof ViewSelect;\n MonthYearSelect: typeof MonthYearSelect;\n };\n}>;\n\nconst defaultProps = {\n __staticSelector: 'ScheduleHeader',\n} satisfies Partial<ScheduleHeaderProps>;\n\nconst varsResolver = createVarsResolver<ScheduleHeaderFactory>(() => ({\n scheduleHeader: {\n '--test': 'test',\n },\n}));\n\nexport const ScheduleHeader = factory<ScheduleHeaderFactory>((_props) => {\n const props = useProps('ScheduleHeader', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n attributes,\n __staticSelector,\n labels,\n ...others\n } = props;\n\n const getStyles = useStyles<ScheduleHeaderFactory>({\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: 'header',\n });\n\n return (\n <ScheduleHeaderLabelsContext.Provider value={labels}>\n <Box {...getStyles('header')} {...others} />\n </ScheduleHeaderLabelsContext.Provider>\n );\n});\n\nScheduleHeader.displayName = '@mantine/schedule/ScheduleHeader';\nScheduleHeader.classes = classes;\nScheduleHeader.varsResolver = varsResolver;\nScheduleHeader.Control = HeaderControl;\nScheduleHeader.Next = ScheduleHeaderNext;\nScheduleHeader.Previous = ScheduleHeaderPrevious;\nScheduleHeader.Today = ScheduleHeaderToday;\nScheduleHeader.ViewSelect = ViewSelect;\nScheduleHeader.MonthYearSelect = MonthYearSelect;\n"],"mappings":";;;;;;;;;AA0DA,MAAM,eAAe,EACnB,kBAAkB,kBACnB;AAED,MAAM,eAAe,0BAAiD,EACpE,gBAAgB,EACd,UAAU,QACX,EACF,EAAE;AAEH,MAAa,iBAAiB,SAAgC,WAAW;CACvE,MAAM,QAAQ,SAAS,kBAAkB,cAAc,OAAO;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,kBACA,QACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAiC;EACjD,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACf,CAAC;AAEF,QACE,oBAAC,4BAA4B,UAA7B;EAAsC,OAAO;YAC3C,oBAAC,KAAD;GAAK,GAAI,UAAU,SAAS;GAAE,GAAI;GAAU,CAAA;EACP,CAAA;EAEzC;AAEF,eAAe,cAAc;AAC7B,eAAe,UAAUA;AACzB,eAAe,eAAe;AAC9B,eAAe,UAAU;AACzB,eAAe,OAAO;AACtB,eAAe,WAAW;AAC1B,eAAe,QAAQ;AACvB,eAAe,aAAa;AAC5B,eAAe,kBAAkB"}
@@ -28,6 +28,7 @@ function ScheduleHeaderBase({ view, navigationHandlers, control, labels, onDateC
28
28
  }));
29
29
  return /* @__PURE__ */ jsxs(ScheduleHeader, {
30
30
  ...stylesApiProps,
31
+ labels,
31
32
  children: [
32
33
  /* @__PURE__ */ jsxs("div", {
33
34
  className: ScheduleHeader_module_default.navigationGroup,
@@ -1 +1 @@
1
- {"version":3,"file":"ScheduleHeaderBase.mjs","names":["classes"],"sources":["../../../src/components/ScheduleHeader/ScheduleHeaderBase.tsx"],"sourcesContent":["import { NativeSelect, StylesApiProps } from '@mantine/core';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport { DateStringValue, ScheduleViewLevel } from '../../types';\nimport { MonthYearSelectProps } from './MonthYearSelect/MonthYearSelect';\nimport { ScheduleHeader } from './ScheduleHeader';\nimport { ViewSelectProps } from './ViewSelect/ViewSelect';\nimport classes from './ScheduleHeader.module.css';\n\ninterface NavigationHandlers {\n /** Handler for previous button click, returns new date */\n previous: () => DateStringValue;\n\n /** Handler for next button click, returns new date */\n next: () => DateStringValue;\n\n /** Handler for today button click, returns new date */\n today: () => DateStringValue;\n}\n\ninterface HeaderControlOptions {\n /** Title to render in a simple control (used by DayView, WeekView) */\n title?: React.ReactNode;\n /** MonthYearSelect props (used by MonthView, YearView) */\n monthYearSelect?: {\n yearValue: number;\n monthValue: number;\n onYearChange?: (year: number) => void;\n onMonthChange?: (month: number) => void;\n withMonths?: boolean;\n } & Partial<MonthYearSelectProps>;\n /** Minimum width for control */\n miw?: React.CSSProperties['minWidth'];\n}\n\nexport interface ScheduleHeaderBaseProps {\n /** Current view level */\n view: ScheduleViewLevel;\n\n /** Navigation handlers for previous, next, and today */\n navigationHandlers: NavigationHandlers;\n\n /** Central control configuration (either title or monthYearSelect) */\n control: HeaderControlOptions;\n\n /** Label overrides */\n labels?: ScheduleLabelsOverride;\n\n /** Called when date is changed */\n onDateChange?: (date: DateStringValue) => void;\n\n /** Called when view is changed */\n onViewChange?: (view: ScheduleViewLevel) => void;\n\n /** Props passed to previous control button */\n previousControlProps?: React.ComponentProps<'button'>;\n\n /** Props passed to next control button */\n nextControlProps?: React.ComponentProps<'button'>;\n\n /** Props passed to today control button */\n todayControlProps?: React.ComponentProps<'button'>;\n\n /** Props passed to view select */\n viewSelectProps?: Partial<ViewSelectProps>;\n\n /** Styles API props to pass through */\n stylesApiProps?: StylesApiProps<any>;\n}\n\nconst VIEW_LEVELS: ScheduleViewLevel[] = ['day', 'week', 'month', 'year'];\n\nexport function ScheduleHeaderBase({\n view,\n navigationHandlers,\n control,\n labels,\n onDateChange,\n onViewChange,\n previousControlProps,\n nextControlProps,\n todayControlProps,\n viewSelectProps,\n stylesApiProps,\n}: ScheduleHeaderBaseProps) {\n const centralControl = control.monthYearSelect ? (\n <ScheduleHeader.MonthYearSelect\n {...stylesApiProps}\n labels={labels}\n {...control.monthYearSelect}\n />\n ) : (\n <ScheduleHeader.Control {...stylesApiProps} interactive={false} miw={control.miw}>\n {control.title}\n </ScheduleHeader.Control>\n );\n\n const views = viewSelectProps?.views || VIEW_LEVELS;\n const compactViewSelectData = views.map((v) => ({\n value: v,\n label: getLabel(v, labels) as string,\n }));\n\n return (\n <ScheduleHeader {...stylesApiProps}>\n <div className={classes.navigationGroup}>\n <ScheduleHeader.Previous\n {...stylesApiProps}\n onClick={() => onDateChange?.(navigationHandlers.previous())}\n labels={labels}\n {...previousControlProps}\n />\n\n {centralControl}\n\n <ScheduleHeader.Next\n {...stylesApiProps}\n onClick={() => onDateChange?.(navigationHandlers.next())}\n labels={labels}\n {...nextControlProps}\n />\n </div>\n\n <div className={classes.todayControl}>\n <ScheduleHeader.Today\n {...stylesApiProps}\n onClick={() => onDateChange?.(navigationHandlers.today())}\n labels={labels}\n {...todayControlProps}\n />\n </div>\n\n <NativeSelect\n className={classes.compactViewSelect}\n data={compactViewSelectData}\n value={view}\n onChange={(event) => onViewChange?.(event.currentTarget.value as ScheduleViewLevel)}\n aria-label={getLabel('viewSelectLabel', labels) as string}\n size=\"sm\"\n />\n\n <div className={classes.viewSelect} style={{ marginInlineStart: 'auto' }}>\n <ScheduleHeader.ViewSelect\n value={view}\n onChange={onViewChange}\n labels={labels}\n {...stylesApiProps}\n {...viewSelectProps}\n />\n </div>\n </ScheduleHeader>\n );\n}\n"],"mappings":";;;;;;;AAqEA,MAAM,cAAmC;CAAC;CAAO;CAAQ;CAAS;CAAO;AAEzE,SAAgB,mBAAmB,EACjC,MACA,oBACA,SACA,QACA,cACA,cACA,sBACA,kBACA,mBACA,iBACA,kBAC0B;CAC1B,MAAM,iBAAiB,QAAQ,kBAC7B,oBAAC,eAAe,iBAAhB;EACE,GAAI;EACI;EACR,GAAI,QAAQ;EACZ,CAAA,GAEF,oBAAC,eAAe,SAAhB;EAAwB,GAAI;EAAgB,aAAa;EAAO,KAAK,QAAQ;YAC1E,QAAQ;EACc,CAAA;CAI3B,MAAM,yBADQ,iBAAiB,SAAS,aACJ,KAAK,OAAO;EAC9C,OAAO;EACP,OAAO,SAAS,GAAG,OAAO;EAC3B,EAAE;AAEH,QACE,qBAAC,gBAAD;EAAgB,GAAI;YAApB;GACE,qBAAC,OAAD;IAAK,WAAWA,8BAAQ;cAAxB;KACE,oBAAC,eAAe,UAAhB;MACE,GAAI;MACJ,eAAe,eAAe,mBAAmB,UAAU,CAAC;MACpD;MACR,GAAI;MACJ,CAAA;KAED;KAED,oBAAC,eAAe,MAAhB;MACE,GAAI;MACJ,eAAe,eAAe,mBAAmB,MAAM,CAAC;MAChD;MACR,GAAI;MACJ,CAAA;KACE;;GAEN,oBAAC,OAAD;IAAK,WAAWA,8BAAQ;cACtB,oBAAC,eAAe,OAAhB;KACE,GAAI;KACJ,eAAe,eAAe,mBAAmB,OAAO,CAAC;KACjD;KACR,GAAI;KACJ,CAAA;IACE,CAAA;GAEN,oBAAC,cAAD;IACE,WAAWA,8BAAQ;IACnB,MAAM;IACN,OAAO;IACP,WAAW,UAAU,eAAe,MAAM,cAAc,MAA2B;IACnF,cAAY,SAAS,mBAAmB,OAAO;IAC/C,MAAK;IACL,CAAA;GAEF,oBAAC,OAAD;IAAK,WAAWA,8BAAQ;IAAY,OAAO,EAAE,mBAAmB,QAAQ;cACtE,oBAAC,eAAe,YAAhB;KACE,OAAO;KACP,UAAU;KACF;KACR,GAAI;KACJ,GAAI;KACJ,CAAA;IACE,CAAA;GACS"}
1
+ {"version":3,"file":"ScheduleHeaderBase.mjs","names":["classes"],"sources":["../../../src/components/ScheduleHeader/ScheduleHeaderBase.tsx"],"sourcesContent":["import { NativeSelect, StylesApiProps } from '@mantine/core';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport { DateStringValue, ScheduleViewLevel } from '../../types';\nimport { MonthYearSelectProps } from './MonthYearSelect/MonthYearSelect';\nimport { ScheduleHeader } from './ScheduleHeader';\nimport { ViewSelectProps } from './ViewSelect/ViewSelect';\nimport classes from './ScheduleHeader.module.css';\n\ninterface NavigationHandlers {\n /** Handler for previous button click, returns new date */\n previous: () => DateStringValue;\n\n /** Handler for next button click, returns new date */\n next: () => DateStringValue;\n\n /** Handler for today button click, returns new date */\n today: () => DateStringValue;\n}\n\ninterface HeaderControlOptions {\n /** Title to render in a simple control (used by DayView, WeekView) */\n title?: React.ReactNode;\n /** MonthYearSelect props (used by MonthView, YearView) */\n monthYearSelect?: {\n yearValue: number;\n monthValue: number;\n onYearChange?: (year: number) => void;\n onMonthChange?: (month: number) => void;\n withMonths?: boolean;\n } & Partial<MonthYearSelectProps>;\n /** Minimum width for control */\n miw?: React.CSSProperties['minWidth'];\n}\n\nexport interface ScheduleHeaderBaseProps {\n /** Current view level */\n view: ScheduleViewLevel;\n\n /** Navigation handlers for previous, next, and today */\n navigationHandlers: NavigationHandlers;\n\n /** Central control configuration (either title or monthYearSelect) */\n control: HeaderControlOptions;\n\n /** Label overrides */\n labels?: ScheduleLabelsOverride;\n\n /** Called when date is changed */\n onDateChange?: (date: DateStringValue) => void;\n\n /** Called when view is changed */\n onViewChange?: (view: ScheduleViewLevel) => void;\n\n /** Props passed to previous control button */\n previousControlProps?: React.ComponentProps<'button'>;\n\n /** Props passed to next control button */\n nextControlProps?: React.ComponentProps<'button'>;\n\n /** Props passed to today control button */\n todayControlProps?: React.ComponentProps<'button'>;\n\n /** Props passed to view select */\n viewSelectProps?: Partial<ViewSelectProps>;\n\n /** Styles API props to pass through */\n stylesApiProps?: StylesApiProps<any>;\n}\n\nconst VIEW_LEVELS: ScheduleViewLevel[] = ['day', 'week', 'month', 'year'];\n\nexport function ScheduleHeaderBase({\n view,\n navigationHandlers,\n control,\n labels,\n onDateChange,\n onViewChange,\n previousControlProps,\n nextControlProps,\n todayControlProps,\n viewSelectProps,\n stylesApiProps,\n}: ScheduleHeaderBaseProps) {\n const centralControl = control.monthYearSelect ? (\n <ScheduleHeader.MonthYearSelect\n {...stylesApiProps}\n labels={labels}\n {...control.monthYearSelect}\n />\n ) : (\n <ScheduleHeader.Control {...stylesApiProps} interactive={false} miw={control.miw}>\n {control.title}\n </ScheduleHeader.Control>\n );\n\n const views = viewSelectProps?.views || VIEW_LEVELS;\n const compactViewSelectData = views.map((v) => ({\n value: v,\n label: getLabel(v, labels) as string,\n }));\n\n return (\n <ScheduleHeader {...stylesApiProps} labels={labels}>\n <div className={classes.navigationGroup}>\n <ScheduleHeader.Previous\n {...stylesApiProps}\n onClick={() => onDateChange?.(navigationHandlers.previous())}\n labels={labels}\n {...previousControlProps}\n />\n\n {centralControl}\n\n <ScheduleHeader.Next\n {...stylesApiProps}\n onClick={() => onDateChange?.(navigationHandlers.next())}\n labels={labels}\n {...nextControlProps}\n />\n </div>\n\n <div className={classes.todayControl}>\n <ScheduleHeader.Today\n {...stylesApiProps}\n onClick={() => onDateChange?.(navigationHandlers.today())}\n labels={labels}\n {...todayControlProps}\n />\n </div>\n\n <NativeSelect\n className={classes.compactViewSelect}\n data={compactViewSelectData}\n value={view}\n onChange={(event) => onViewChange?.(event.currentTarget.value as ScheduleViewLevel)}\n aria-label={getLabel('viewSelectLabel', labels) as string}\n size=\"sm\"\n />\n\n <div className={classes.viewSelect} style={{ marginInlineStart: 'auto' }}>\n <ScheduleHeader.ViewSelect\n value={view}\n onChange={onViewChange}\n labels={labels}\n {...stylesApiProps}\n {...viewSelectProps}\n />\n </div>\n </ScheduleHeader>\n );\n}\n"],"mappings":";;;;;;;AAqEA,MAAM,cAAmC;CAAC;CAAO;CAAQ;CAAS;CAAO;AAEzE,SAAgB,mBAAmB,EACjC,MACA,oBACA,SACA,QACA,cACA,cACA,sBACA,kBACA,mBACA,iBACA,kBAC0B;CAC1B,MAAM,iBAAiB,QAAQ,kBAC7B,oBAAC,eAAe,iBAAhB;EACE,GAAI;EACI;EACR,GAAI,QAAQ;EACZ,CAAA,GAEF,oBAAC,eAAe,SAAhB;EAAwB,GAAI;EAAgB,aAAa;EAAO,KAAK,QAAQ;YAC1E,QAAQ;EACc,CAAA;CAI3B,MAAM,yBADQ,iBAAiB,SAAS,aACJ,KAAK,OAAO;EAC9C,OAAO;EACP,OAAO,SAAS,GAAG,OAAO;EAC3B,EAAE;AAEH,QACE,qBAAC,gBAAD;EAAgB,GAAI;EAAwB;YAA5C;GACE,qBAAC,OAAD;IAAK,WAAWA,8BAAQ;cAAxB;KACE,oBAAC,eAAe,UAAhB;MACE,GAAI;MACJ,eAAe,eAAe,mBAAmB,UAAU,CAAC;MACpD;MACR,GAAI;MACJ,CAAA;KAED;KAED,oBAAC,eAAe,MAAhB;MACE,GAAI;MACJ,eAAe,eAAe,mBAAmB,MAAM,CAAC;MAChD;MACR,GAAI;MACJ,CAAA;KACE;;GAEN,oBAAC,OAAD;IAAK,WAAWA,8BAAQ;cACtB,oBAAC,eAAe,OAAhB;KACE,GAAI;KACJ,eAAe,eAAe,mBAAmB,OAAO,CAAC;KACjD;KACR,GAAI;KACJ,CAAA;IACE,CAAA;GAEN,oBAAC,cAAD;IACE,WAAWA,8BAAQ;IACnB,MAAM;IACN,OAAO;IACP,WAAW,UAAU,eAAe,MAAM,cAAc,MAA2B;IACnF,cAAY,SAAS,mBAAmB,OAAO;IAC/C,MAAK;IACL,CAAA;GAEF,oBAAC,OAAD;IAAK,WAAWA,8BAAQ;IAAY,OAAO,EAAE,mBAAmB,QAAQ;cACtE,oBAAC,eAAe,YAAhB;KACE,OAAO;KACP,UAAU;KACF;KACR,GAAI;KACJ,GAAI;KACJ,CAAA;IACE,CAAA;GACS"}
@@ -0,0 +1,18 @@
1
+ "use client";
2
+ import { createContext, useContext } from "react";
3
+ //#region packages/@mantine/schedule/src/components/ScheduleHeader/ScheduleHeaderContext.ts
4
+ const ScheduleHeaderLabelsContext = createContext(void 0);
5
+ ScheduleHeaderLabelsContext.displayName = "@mantine/schedule/ScheduleHeaderLabelsContext";
6
+ function useScheduleHeaderLabels(override) {
7
+ const contextLabels = useContext(ScheduleHeaderLabelsContext);
8
+ if (!override) return contextLabels;
9
+ if (!contextLabels) return override;
10
+ return {
11
+ ...contextLabels,
12
+ ...override
13
+ };
14
+ }
15
+ //#endregion
16
+ export { ScheduleHeaderLabelsContext, useScheduleHeaderLabels };
17
+
18
+ //# sourceMappingURL=ScheduleHeaderContext.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ScheduleHeaderContext.mjs","names":[],"sources":["../../../src/components/ScheduleHeader/ScheduleHeaderContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport type { ScheduleLabelsOverride } from '../../labels';\n\nexport const ScheduleHeaderLabelsContext = createContext<ScheduleLabelsOverride | undefined>(\n undefined\n);\nScheduleHeaderLabelsContext.displayName = '@mantine/schedule/ScheduleHeaderLabelsContext';\n\nexport function useScheduleHeaderLabels(\n override?: ScheduleLabelsOverride\n): ScheduleLabelsOverride | undefined {\n const contextLabels = useContext(ScheduleHeaderLabelsContext);\n if (!override) {\n return contextLabels;\n }\n if (!contextLabels) {\n return override;\n }\n return { ...contextLabels, ...override };\n}\n"],"mappings":";;;AAGA,MAAa,8BAA8B,cACzC,KAAA,EACD;AACD,4BAA4B,cAAc;AAE1C,SAAgB,wBACd,UACoC;CACpC,MAAM,gBAAgB,WAAW,4BAA4B;AAC7D,KAAI,CAAC,SACH,QAAO;AAET,KAAI,CAAC,cACH,QAAO;AAET,QAAO;EAAE,GAAG;EAAe,GAAG;EAAU"}