@mantine/schedule 9.3.1 → 9.4.0

package/cjs/components/AgendaView/AgendaView.cjs

@@ -0,0 +1,133 @@
+"use client";
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+const require_labels = require("../../labels.cjs");
+const require_format_date = require("../../utils/format-date/format-date.cjs");
+const require_is_all_day_event = require("../../utils/is-all-day-event/is-all-day-event.cjs");
+const require_sort_events = require("../../utils/sort-events/sort-events.cjs");
+const require_is_multiday_event = require("../../utils/is-multiday-event/is-multiday-event.cjs");
+const require_expand_recurring_events = require("../../utils/expand-recurring-events/expand-recurring-events.cjs");
+const require_get_agenda_view_events = require("./get-agenda-view-events.cjs");
+const require_AgendaView_module = require("./AgendaView.module.cjs");
+let dayjs = require("dayjs");
+dayjs = require_runtime.__toESM(dayjs);
+let _mantine_core = require("@mantine/core");
+let react = require("react");
+react = require_runtime.__toESM(react);
+let _mantine_dates = require("@mantine/dates");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region packages/@mantine/schedule/src/components/AgendaView/AgendaView.tsx
+const defaultProps = {
+	__staticSelector: "AgendaView",
+	mode: "default",
+	dateHeaderFormat: "dddd, MMMM D",
+	headerFormat: "MMMM D, YYYY"
+};
+const varsResolver = (0, _mantine_core.createVarsResolver)((_theme, { radius }) => ({ agendaView: { "--agenda-view-radius": (0, _mantine_core.getRadius)(radius) } }));
+const AgendaView = (0, _mantine_core.factory)((_props) => {
+	const props = (0, _mantine_core.useProps)("AgendaView", defaultProps, _props);
+	const { classNames, className, style, styles, unstyled, vars, attributes, __staticSelector, rangeStart, rangeEnd, events, locale, radius, labels, mode, renderEvent, dateHeaderFormat, headerFormat, onEventClick, recurrenceExpansionLimit, ...others } = props;
+	const ctx = (0, _mantine_dates.useDatesContext)();
+	const theme = (0, _mantine_core.useMantineTheme)();
+	const getStyles = (0, _mantine_core.useStyles)({
+		name: __staticSelector,
+		classes: require_AgendaView_module.default,
+		props,
+		className,
+		style,
+		classNames,
+		styles,
+		unstyled,
+		attributes,
+		vars,
+		varsResolver,
+		rootSelector: "agendaView"
+	});
+	const groupedEvents = require_get_agenda_view_events.getAgendaViewEvents({
+		rangeStart,
+		rangeEnd,
+		events: require_expand_recurring_events.expandRecurringEvents({
+			events,
+			rangeStart: (0, dayjs.default)(rangeStart).startOf("day").toDate(),
+			rangeEnd: (0, dayjs.default)(rangeEnd).endOf("day").toDate(),
+			expansionLimit: recurrenceExpansionLimit
+		})
+	});
+	const sortedDates = Object.keys(groupedEvents).sort();
+	const headerLabel = `${require_format_date.formatDate({
+		locale: ctx.getLocale(locale),
+		date: rangeStart,
+		format: headerFormat
+	})} – ${require_format_date.formatDate({
+		locale: ctx.getLocale(locale),
+		date: rangeEnd,
+		format: headerFormat
+	})}`;
+	const dateGroups = sortedDates.map((dateStr) => {
+		const eventNodes = require_sort_events.sortEvents(groupedEvents[dateStr]).map((event) => {
+			const startTime = (0, dayjs.default)(event.start).format("HH:mm");
+			const endTime = (0, dayjs.default)(event.end).format("HH:mm");
+			const isAllDay = require_is_multiday_event.isMultidayEvent(event) || require_is_all_day_event.isAllDayEvent({
+				event,
+				date: dateStr
+			});
+			const eventChildren = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mantine_core.Box, {
+				...getStyles("agendaViewEventBody"),
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { ...getStyles("agendaViewEventColor", { style: { backgroundColor: (0, _mantine_core.getThemeColor)(event.color, theme) } }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Text, {
+					...getStyles("agendaViewEventTitle"),
+					children: event.title
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Text, {
+					...getStyles("agendaViewEventTime"),
+					children: isAllDay ? require_labels.getLabel("allDay", labels) : `${startTime} – ${endTime}`
+				})] })]
+			});
+			const rootProps = {
+				...getStyles("agendaViewEvent"),
+				onClick: mode === "static" ? void 0 : (e) => {
+					onEventClick?.(event, e);
+				},
+				tabIndex: mode === "static" ? -1 : 0,
+				children: eventChildren
+			};
+			if (typeof renderEvent === "function") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.default.Fragment, { children: renderEvent(event, rootProps) }, event.id);
+			return /* @__PURE__ */ (0, react.createElement)(_mantine_core.UnstyledButton, {
+				...rootProps,
+				key: event.id
+			});
+		});
+		return /* @__PURE__ */ (0, react.createElement)("div", {
+			...getStyles("agendaViewDateGroup"),
+			key: dateStr
+		}, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Text, {
+			...getStyles("agendaViewDateHeader"),
+			children: require_format_date.formatDate({
+				locale: ctx.getLocale(locale),
+				date: dateStr,
+				format: dateHeaderFormat
+			})
+		}), eventNodes);
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mantine_core.Box, {
+		...getStyles("agendaView"),
+		...others,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			...getStyles("agendaViewHeader"),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Text, {
+				...getStyles("agendaViewHeaderLabel"),
+				children: headerLabel
+			})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Box, {
+			...getStyles("agendaViewBody"),
+			children: dateGroups.length > 0 ? dateGroups : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Text, {
+				...getStyles("agendaViewNoEvents"),
+				children: require_labels.getLabel("noEvents", labels)
+			})
+		})]
+	});
+});
+AgendaView.displayName = "@mantine/schedule/AgendaView";
+AgendaView.classes = require_AgendaView_module.default;
+AgendaView.varsResolver = varsResolver;
+//#endregion
+exports.AgendaView = AgendaView;
+
+//# sourceMappingURL=AgendaView.cjs.map

package/cjs/components/AgendaView/AgendaView.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AgendaView.cjs","names":["getAgendaViewEvents","expandRecurringEvents","formatDate","sortEvents","isMultidayEvent","isAllDayEvent","Box","Text","getLabel","React","UnstyledButton","classes"],"sources":["../../../src/components/AgendaView/AgendaView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport React from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  getThemeColor,\n  MantineRadius,\n  StylesApiProps,\n  Text,\n  UnstyledButton,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport { AnyDateValue, DateLabelFormat, ScheduleEventData, ScheduleMode } from '../../types';\nimport {\n  expandRecurringEvents,\n  formatDate,\n  isAllDayEvent,\n  isMultidayEvent,\n  sortEvents,\n} from '../../utils';\nimport { RenderEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { getAgendaViewEvents } from './get-agenda-view-events';\nimport classes from './AgendaView.module.css';\n\nexport type AgendaViewStylesNames =\n  | 'agendaView'\n  | 'agendaViewHeader'\n  | 'agendaViewHeaderLabel'\n  | 'agendaViewBody'\n  | 'agendaViewDateGroup'\n  | 'agendaViewDateHeader'\n  | 'agendaViewEvent'\n  | 'agendaViewEventBody'\n  | 'agendaViewEventColor'\n  | 'agendaViewEventTitle'\n  | 'agendaViewEventTime'\n  | 'agendaViewNoEvents';\n\nexport type AgendaViewCssVariables = {\n  agendaView: '--agenda-view-radius';\n};\n\nexport interface AgendaViewProps\n  extends BoxProps, StylesApiProps<AgendaViewFactory>, ElementProps<'div'> {\n  __staticSelector?: string;\n\n  /** Start of the date range to display events for */\n  rangeStart: AnyDateValue;\n\n  /** End of the date range to display events for */\n  rangeEnd: AnyDateValue;\n\n  /** Events to display */\n  events?: ScheduleEventData[];\n\n  /** Locale passed down to dayjs, overrides value defined on `DatesProvider` */\n  locale?: string;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n  radius?: MantineRadius;\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  /** Function to fully customize event rendering, receives all props that would be passed to the root element including children */\n  renderEvent?: RenderEvent;\n\n  /** Format for the date group headers @default 'dddd, MMMM D' */\n  dateHeaderFormat?: DateLabelFormat;\n\n  /** Format for the header label showing the date range @default 'MMMM D, YYYY' */\n  headerFormat?: DateLabelFormat;\n\n  /** Called when event is clicked */\n  onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n\n  /** Max number of generated recurring instances per recurring series @default 2000 */\n  recurrenceExpansionLimit?: number;\n}\n\nexport type AgendaViewFactory = Factory<{\n  props: AgendaViewProps;\n  ref: HTMLDivElement;\n  stylesNames: AgendaViewStylesNames;\n  vars: AgendaViewCssVariables;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'AgendaView',\n  mode: 'default',\n  dateHeaderFormat: 'dddd, MMMM D',\n  headerFormat: 'MMMM D, YYYY',\n} satisfies Partial<AgendaViewProps>;\n\nconst varsResolver = createVarsResolver<AgendaViewFactory>((_theme, { radius }) => ({\n  agendaView: {\n    '--agenda-view-radius': getRadius(radius),\n  },\n}));\n\nexport const AgendaView = factory<AgendaViewFactory>((_props) => {\n  const props = useProps('AgendaView', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    __staticSelector,\n    rangeStart,\n    rangeEnd,\n    events,\n    locale,\n    radius,\n    labels,\n    mode,\n    renderEvent,\n    dateHeaderFormat,\n    headerFormat,\n    onEventClick,\n    recurrenceExpansionLimit,\n    ...others\n  } = props;\n\n  const ctx = useDatesContext();\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<AgendaViewFactory>({\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: 'agendaView',\n  });\n\n  const expandedEvents = expandRecurringEvents({\n    events,\n    rangeStart: dayjs(rangeStart).startOf('day').toDate(),\n    rangeEnd: dayjs(rangeEnd).endOf('day').toDate(),\n    expansionLimit: recurrenceExpansionLimit,\n  });\n\n  const groupedEvents = getAgendaViewEvents({\n    rangeStart,\n    rangeEnd,\n    events: expandedEvents,\n  });\n\n  const sortedDates = Object.keys(groupedEvents).sort();\n\n  const headerLabel = `${formatDate({\n    locale: ctx.getLocale(locale),\n    date: rangeStart,\n    format: headerFormat,\n  })} – ${formatDate({\n    locale: ctx.getLocale(locale),\n    date: rangeEnd,\n    format: headerFormat,\n  })}`;\n\n  const dateGroups = sortedDates.map((dateStr) => {\n    const dateEvents = sortEvents(groupedEvents[dateStr]);\n\n    const eventNodes = dateEvents.map((event) => {\n      const startTime = dayjs(event.start).format('HH:mm');\n      const endTime = dayjs(event.end).format('HH:mm');\n      const isAllDay = isMultidayEvent(event) || isAllDayEvent({ event, date: dateStr });\n\n      const eventChildren = (\n        <Box {...getStyles('agendaViewEventBody')}>\n          <div\n            {...getStyles('agendaViewEventColor', {\n              style: { backgroundColor: getThemeColor(event.color, theme) },\n            })}\n          />\n          <div>\n            <Text {...getStyles('agendaViewEventTitle')}>{event.title}</Text>\n            <Text {...getStyles('agendaViewEventTime')}>\n              {isAllDay ? getLabel('allDay', labels) : `${startTime} – ${endTime}`}\n            </Text>\n          </div>\n        </Box>\n      );\n\n      const rootProps: React.ComponentPropsWithoutRef<'button'> & { children: React.ReactNode } = {\n        ...getStyles('agendaViewEvent'),\n        onClick:\n          mode === 'static'\n            ? undefined\n            : (e: React.MouseEvent<HTMLButtonElement>) => {\n                onEventClick?.(event, e);\n              },\n        tabIndex: mode === 'static' ? -1 : 0,\n        children: eventChildren,\n      };\n\n      if (typeof renderEvent === 'function') {\n        return <React.Fragment key={event.id}>{renderEvent(event, rootProps)}</React.Fragment>;\n      }\n\n      return <UnstyledButton {...rootProps} key={event.id} />;\n    });\n\n    return (\n      <div {...getStyles('agendaViewDateGroup')} key={dateStr}>\n        <Text {...getStyles('agendaViewDateHeader')}>\n          {formatDate({\n            locale: ctx.getLocale(locale),\n            date: dateStr,\n            format: dateHeaderFormat,\n          })}\n        </Text>\n        {eventNodes}\n      </div>\n    );\n  });\n\n  return (\n    <Box {...getStyles('agendaView')} {...others}>\n      <div {...getStyles('agendaViewHeader')}>\n        <Text {...getStyles('agendaViewHeaderLabel')}>{headerLabel}</Text>\n      </div>\n\n      <Box {...getStyles('agendaViewBody')}>\n        {dateGroups.length > 0 ? (\n          dateGroups\n        ) : (\n          <Text {...getStyles('agendaViewNoEvents')}>{getLabel('noEvents', labels)}</Text>\n        )}\n      </Box>\n    </Box>\n  );\n});\n\nAgendaView.displayName = '@mantine/schedule/AgendaView';\nAgendaView.classes = classes;\nAgendaView.varsResolver = varsResolver;\n\nexport namespace AgendaView {\n  export type Props = AgendaViewProps;\n  export type Factory = AgendaViewFactory;\n  export type StylesNames = AgendaViewStylesNames;\n  export type CssVariables = AgendaViewCssVariables;\n}\n"],"mappings":"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"}

package/cjs/components/AgendaView/AgendaView.module.cjs

@@ -0,0 +1,19 @@
+"use client";
+//#region packages/@mantine/schedule/src/components/AgendaView/AgendaView.module.css
+var AgendaView_module_default = {
+	"agendaView": "m_c5e63f2d",
+	"agendaViewHeader": "m_b70d381a",
+	"agendaViewHeaderLabel": "m_693056fa",
+	"agendaViewBody": "m_dd488e6f",
+	"agendaViewDateGroup": "m_e7e356c4",
+	"agendaViewDateHeader": "m_157e8ae8",
+	"agendaViewEvent": "m_cbf6b76d",
+	"agendaViewEventBody": "m_f9e2e6af",
+	"agendaViewEventColor": "m_428823f6",
+	"agendaViewEventTime": "m_f9eaffda",
+	"agendaViewNoEvents": "m_7a1aec87"
+};
+//#endregion
+exports.default = AgendaView_module_default;
+
+//# sourceMappingURL=AgendaView.module.cjs.map

package/cjs/components/AgendaView/AgendaView.module.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AgendaView.module.cjs","names":[],"sources":["../../../src/components/AgendaView/AgendaView.module.css"],"sourcesContent":[".agendaView {\n  --agenda-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n\n  display: flex;\n  flex-direction: column;\n\n  @mixin where-light {\n    --agenda-view-border-color: var(--mantine-color-gray-3);\n  }\n\n  @mixin where-dark {\n    --agenda-view-border-color: var(--mantine-color-dark-4);\n  }\n}\n\n.agendaViewHeader {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: var(--mantine-spacing-sm);\n  border-bottom: 1px solid var(--agenda-view-border-color);\n}\n\n.agendaViewHeaderLabel {\n  user-select: none;\n  font-weight: var(--mantine-font-weight-semibold);\n  font-size: var(--mantine-font-size-sm);\n  text-transform: capitalize;\n}\n\n.agendaViewBody {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n}\n\n.agendaViewDateGroup {\n  &:where(:not(:last-child)) {\n    border-bottom: 1px solid var(--agenda-view-border-color);\n  }\n}\n\n.agendaViewDateHeader {\n  padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);\n  font-weight: var(--mantine-font-weight-semibold);\n  font-size: var(--mantine-font-size-sm);\n  text-transform: capitalize;\n\n  @mixin where-light {\n    background-color: var(--mantine-color-gray-0);\n  }\n\n  @mixin where-dark {\n    background-color: var(--mantine-color-dark-6);\n  }\n}\n\n.agendaViewEvent {\n  display: block;\n  width: 100%;\n  text-align: start;\n  cursor: pointer;\n\n  &:where(:not(:last-child)) {\n    border-bottom: 1px solid var(--agenda-view-border-color);\n  }\n\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-0);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-6);\n    }\n  }\n}\n\n.agendaViewEventBody {\n  display: flex;\n  gap: var(--mantine-spacing-sm);\n  padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);\n}\n\n.agendaViewEventColor {\n  width: 4px;\n  border-radius: 2px;\n  flex-shrink: 0;\n}\n\n.agendaViewEventTime {\n  margin-top: 2px;\n  font-size: var(--mantine-font-size-xs);\n  color: var(--mantine-color-dimmed);\n}\n\n.agendaViewNoEvents {\n  padding: var(--mantine-spacing-xl) var(--mantine-spacing-sm);\n  color: var(--mantine-color-dimmed);\n  text-align: center;\n}\n"],"mappings":""}

package/cjs/components/AgendaView/get-agenda-view-events.cjs

@@ -0,0 +1,48 @@
+"use client";
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+const require_validate_event = require("../../utils/validate-event/validate-event.cjs");
+const require_is_multiday_event = require("../../utils/is-multiday-event/is-multiday-event.cjs");
+let dayjs = require("dayjs");
+dayjs = require_runtime.__toESM(dayjs);
+//#region packages/@mantine/schedule/src/components/AgendaView/get-agenda-view-events.ts
+function getEffectiveEndDate(event) {
+	const endDate = (0, dayjs.default)(event.end).startOf("day");
+	if ((0, dayjs.default)(event.end).hour() === 0 && (0, dayjs.default)(event.end).minute() === 0) return endDate.subtract(1, "day");
+	return endDate;
+}
+function groupEventByDate(event, groupedEvents, rangeStart, rangeEnd) {
+	if (require_is_multiday_event.isMultidayEvent(event)) {
+		const startDate = (0, dayjs.default)(event.start).startOf("day");
+		const endDate = getEffectiveEndDate(event);
+		for (let date = startDate; date.isBefore(endDate) || date.isSame(endDate); date = date.add(1, "day")) {
+			if (date.isBefore(rangeStart) || date.isAfter(rangeEnd)) continue;
+			const dateKey = date.format("YYYY-MM-DD");
+			if (!groupedEvents[dateKey]) groupedEvents[dateKey] = [];
+			groupedEvents[dateKey].push(event);
+		}
+		return;
+	}
+	const eventDate = (0, dayjs.default)(event.start).format("YYYY-MM-DD");
+	if (!groupedEvents[eventDate]) groupedEvents[eventDate] = [];
+	groupedEvents[eventDate].push(event);
+}
+function getAgendaViewEvents({ rangeStart, rangeEnd, events }) {
+	const groupedEvents = {};
+	if (events === void 0) return groupedEvents;
+	const start = (0, dayjs.default)(rangeStart).startOf("day");
+	const end = (0, dayjs.default)(rangeEnd).startOf("day");
+	const ids = /* @__PURE__ */ new Set();
+	for (const event of events) {
+		if (event.display === "background") continue;
+		const eventStart = (0, dayjs.default)(event.start).startOf("day");
+		if ((0, dayjs.default)(event.end).startOf("day").isBefore(start) || eventStart.isAfter(end)) continue;
+		if (!ids.has(event.id)) ids.add(event.id);
+		else throw new Error(`[@mantine/schedule] AgendaView: Duplicated event ids found: ${event.id}`);
+		groupEventByDate(require_validate_event.validateEvent(event), groupedEvents, start, end);
+	}
+	return groupedEvents;
+}
+//#endregion
+exports.getAgendaViewEvents = getAgendaViewEvents;
+
+//# sourceMappingURL=get-agenda-view-events.cjs.map

package/cjs/components/AgendaView/get-agenda-view-events.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"get-agenda-view-events.cjs","names":["isMultidayEvent","validateEvent"],"sources":["../../../src/components/AgendaView/get-agenda-view-events.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport { AnyDateValue, DateStringValue, ScheduleEventData } from '../../types';\nimport { isMultidayEvent, validateEvent } from '../../utils';\n\nfunction getEffectiveEndDate(event: ScheduleEventData) {\n  const endDate = dayjs(event.end).startOf('day');\n  if (dayjs(event.end).hour() === 0 && dayjs(event.end).minute() === 0) {\n    return endDate.subtract(1, 'day');\n  }\n  return endDate;\n}\n\nexport type AgendaGroupedEvents = Record<DateStringValue, ScheduleEventData[]>;\n\nfunction groupEventByDate(\n  event: ScheduleEventData,\n  groupedEvents: AgendaGroupedEvents,\n  rangeStart: dayjs.Dayjs,\n  rangeEnd: dayjs.Dayjs\n) {\n  if (isMultidayEvent(event)) {\n    const startDate = dayjs(event.start).startOf('day');\n    const endDate = getEffectiveEndDate(event);\n\n    for (\n      let date = startDate;\n      date.isBefore(endDate) || date.isSame(endDate);\n      date = date.add(1, 'day')\n    ) {\n      if (date.isBefore(rangeStart) || date.isAfter(rangeEnd)) {\n        continue;\n      }\n      const dateKey = date.format('YYYY-MM-DD');\n      if (!groupedEvents[dateKey]) {\n        groupedEvents[dateKey] = [];\n      }\n      groupedEvents[dateKey].push(event);\n    }\n\n    return;\n  }\n\n  const eventDate = dayjs(event.start).format('YYYY-MM-DD');\n  if (!groupedEvents[eventDate]) {\n    groupedEvents[eventDate] = [];\n  }\n  groupedEvents[eventDate].push(event);\n}\n\ninterface GetAgendaViewEventsInput {\n  rangeStart: AnyDateValue;\n  rangeEnd: AnyDateValue;\n  events: ScheduleEventData[] | undefined;\n}\n\nexport function getAgendaViewEvents({ rangeStart, rangeEnd, events }: GetAgendaViewEventsInput) {\n  const groupedEvents: AgendaGroupedEvents = {};\n\n  if (events === undefined) {\n    return groupedEvents;\n  }\n\n  const start = dayjs(rangeStart).startOf('day');\n  const end = dayjs(rangeEnd).startOf('day');\n  const ids = new Set<string | number>();\n\n  for (const event of events) {\n    if (event.display === 'background') {\n      continue;\n    }\n\n    const eventStart = dayjs(event.start).startOf('day');\n    const eventEnd = dayjs(event.end).startOf('day');\n\n    if (eventEnd.isBefore(start) || eventStart.isAfter(end)) {\n      continue;\n    }\n\n    if (!ids.has(event.id)) {\n      ids.add(event.id);\n    } else {\n      throw new Error(`[@mantine/schedule] AgendaView: Duplicated event ids found: ${event.id}`);\n    }\n\n    groupEventByDate(validateEvent(event), groupedEvents, start, end);\n  }\n\n  return groupedEvents;\n}\n"],"mappings":";;;;;;;AAIA,SAAS,oBAAoB,OAA0B;CACrD,MAAM,WAAA,GAAA,MAAA,QAAA,CAAgB,MAAM,GAAG,CAAC,CAAC,QAAQ,KAAK;CAC9C,KAAA,GAAA,MAAA,QAAA,CAAU,MAAM,GAAG,CAAC,CAAC,KAAK,MAAM,MAAA,GAAA,MAAA,QAAA,CAAW,MAAM,GAAG,CAAC,CAAC,OAAO,MAAM,GACjE,OAAO,QAAQ,SAAS,GAAG,KAAK;CAElC,OAAO;AACT;AAIA,SAAS,iBACP,OACA,eACA,YACA,UACA;CACA,IAAIA,0BAAAA,gBAAgB,KAAK,GAAG;EAC1B,MAAM,aAAA,GAAA,MAAA,QAAA,CAAkB,MAAM,KAAK,CAAC,CAAC,QAAQ,KAAK;EAClD,MAAM,UAAU,oBAAoB,KAAK;EAEzC,KACE,IAAI,OAAO,WACX,KAAK,SAAS,OAAO,KAAK,KAAK,OAAO,OAAO,GAC7C,OAAO,KAAK,IAAI,GAAG,KAAK,GACxB;GACA,IAAI,KAAK,SAAS,UAAU,KAAK,KAAK,QAAQ,QAAQ,GACpD;GAEF,MAAM,UAAU,KAAK,OAAO,YAAY;GACxC,IAAI,CAAC,cAAc,UACjB,cAAc,WAAW,CAAC;GAE5B,cAAc,QAAQ,CAAC,KAAK,KAAK;EACnC;EAEA;CACF;CAEA,MAAM,aAAA,GAAA,MAAA,QAAA,CAAkB,MAAM,KAAK,CAAC,CAAC,OAAO,YAAY;CACxD,IAAI,CAAC,cAAc,YACjB,cAAc,aAAa,CAAC;CAE9B,cAAc,UAAU,CAAC,KAAK,KAAK;AACrC;AAQA,SAAgB,oBAAoB,EAAE,YAAY,UAAU,UAAoC;CAC9F,MAAM,gBAAqC,CAAC;CAE5C,IAAI,WAAW,KAAA,GACb,OAAO;CAGT,MAAM,SAAA,GAAA,MAAA,QAAA,CAAc,UAAU,CAAC,CAAC,QAAQ,KAAK;CAC7C,MAAM,OAAA,GAAA,MAAA,QAAA,CAAY,QAAQ,CAAC,CAAC,QAAQ,KAAK;CACzC,MAAM,sBAAM,IAAI,IAAqB;CAErC,KAAK,MAAM,SAAS,QAAQ;EAC1B,IAAI,MAAM,YAAY,cACpB;EAGF,MAAM,cAAA,GAAA,MAAA,QAAA,CAAmB,MAAM,KAAK,CAAC,CAAC,QAAQ,KAAK;EAGnD,KAAA,GAAA,MAAA,QAAA,CAFuB,MAAM,GAAG,CAAC,CAAC,QAAQ,KAE/B,CAAC,CAAC,SAAS,KAAK,KAAK,WAAW,QAAQ,GAAG,GACpD;EAGF,IAAI,CAAC,IAAI,IAAI,MAAM,EAAE,GACnB,IAAI,IAAI,MAAM,EAAE;OAEhB,MAAM,IAAI,MAAM,+DAA+D,MAAM,IAAI;EAG3F,iBAAiBC,uBAAAA,cAAc,KAAK,GAAG,eAAe,OAAO,GAAG;CAClE;CAEA,OAAO;AACT"}

package/cjs/components/CurrentTimeIndicator/CurrentTimeIndicator.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"CurrentTimeIndicator.cjs","names":["getCurrentTimePosition","formatDate","isInTimeRange","Box","classes"],"sources":["../../../src/components/CurrentTimeIndicator/CurrentTimeIndicator.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport { useState } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useInterval } from '@mantine/hooks';\nimport { AnyDateValue, DateLabelFormat } from '../../types';\nimport { formatDate, getCurrentTimePosition, isInTimeRange } from '../../utils';\nimport classes from './CurrentTimeIndicator.module.css';\n\nexport type CurrentTimeIndicatorStylesNames =\n  | 'currentTimeIndicator'\n  | 'currentTimeIndicatorLine'\n  | 'currentTimeIndicatorThumb'\n  | 'currentTimeIndicatorTimeBubble';\n\nexport type CurrentTimeIndicatorCssVariables = {\n  currentTimeIndicator: '--indicator-color';\n};\n\nexport interface CurrentTimeIndicatorProps\n  extends BoxProps, StylesApiProps<CurrentTimeIndicatorFactory>, ElementProps<'div'> {\n  __staticSelector?: string;\n\n  /** Key of `theme.colors` or any valid CSS color value @default 'red' */\n  color?: MantineColor;\n\n  /** Offset from the left side */\n  startOffset?: string;\n\n  /** Offset from the right side */\n  endOffset?: string;\n\n  /** Extra configurable offset from the top */\n  topOffset?: string;\n\n  /** Offset for the time bubble */\n  timeBubbleStartOffset?: string;\n\n  /** If set, displays a bubble with the current time @default @true */\n  withTimeBubble?: boolean;\n\n  /** If set, displays thumb next to the line @default true */\n  withThumb?: boolean;\n\n  /** Format of the time displayed in the time bubble @default 'HH:mm' */\n  currentTimeFormat?: DateLabelFormat;\n\n  /** Locale passed down to dayjs during formatting */\n  locale?: string;\n\n  /** Start time of the day */\n  startTime?: string;\n\n  /** End time of the day */\n  endTime?: string;\n\n  /** Number of minutes per time slot. Used to align the indicator to whole slots when `endTime` does not divide evenly. */\n  intervalMinutes?: number;\n\n  /** A function to get the current time, called on every tick. Can be used to display the indicator in a different timezone. @default () => dayjs() */\n  getCurrentTime?: () => AnyDateValue;\n}\n\nexport type CurrentTimeIndicatorFactory = Factory<{\n  props: CurrentTimeIndicatorProps;\n  ref: HTMLDivElement;\n  stylesNames: CurrentTimeIndicatorStylesNames;\n  vars: CurrentTimeIndicatorCssVariables;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'CurrentTimeIndicator',\n  withTimeBubble: true,\n  withThumb: true,\n  currentTimeFormat: 'HH:mm',\n  topOffset: '0rem',\n} satisfies Partial<CurrentTimeIndicatorProps>;\n\nconst varsResolver = createVarsResolver<CurrentTimeIndicatorFactory>((theme, { color }) => ({\n  currentTimeIndicator: {\n    '--indicator-color': color ? getThemeColor(color, theme) : undefined,\n  },\n}));\n\nexport const CurrentTimeIndicator = factory<CurrentTimeIndicatorFactory>((_props) => {\n  const props = useProps('CurrentTimeIndicator', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    startOffset,\n    endOffset,\n    color,\n    withTimeBubble,\n    withThumb,\n    currentTimeFormat,\n    locale,\n    timeBubbleStartOffset,\n    __staticSelector,\n    topOffset,\n    startTime,\n    endTime,\n    intervalMinutes,\n    getCurrentTime,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<CurrentTimeIndicatorFactory>({\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: 'currentTimeIndicator',\n  });\n\n  const ctx = useDatesContext();\n  const [, setTick] = useState(0);\n  useInterval(() => setTick((tick) => tick + 1), 1000 * 60, {\n    autoInvoke: true,\n  });\n\n  const now = getCurrentTime ? dayjs(getCurrentTime()) : dayjs();\n  const offsetPercent = getCurrentTimePosition({ startTime, endTime, intervalMinutes, now });\n  const formattedTime = withTimeBubble\n    ? formatDate({ locale: ctx.getLocale(locale), date: now, format: currentTimeFormat })\n    : '';\n\n  if (!isInTimeRange({ date: now, startTime, endTime })) {\n    return null;\n  }\n\n  return (\n    <Box\n      {...getStyles('currentTimeIndicator')}\n      __vars={{\n        '--top-offset': `calc(${offsetPercent}% + ${topOffset})`,\n        '--start-offset': startOffset,\n        '--end-offset': endOffset,\n        '--time-bubble-start-offset': timeBubbleStartOffset,\n\n        // Adjust time bubble width for formats including AM/PM\n        '--time-bubble-width': formattedTime?.toString().toLowerCase().includes('m')\n          ? '64px'\n          : '46px',\n      }}\n      {...others}\n    >\n      {withTimeBubble && (\n        <div {...getStyles('currentTimeIndicatorTimeBubble')}>{formattedTime}</div>\n      )}\n\n      {withThumb && <div {...getStyles('currentTimeIndicatorThumb')} />}\n\n      <div {...getStyles('currentTimeIndicatorLine')} />\n    </Box>\n  );\n});\n\nCurrentTimeIndicator.displayName = '@mantine/schedule/CurrentTimeIndicator';\nCurrentTimeIndicator.classes = classes;\nCurrentTimeIndicator.varsResolver = varsResolver;\n"],"mappings":";;;;;;;;;;;;;;AAkFA,MAAM,eAAe;CACnB,kBAAkB;CAClB,gBAAgB;CAChB,WAAW;CACX,mBAAmB;CACnB,WAAW;AACb;AAEA,MAAM,gBAAA,GAAA,cAAA,qBAAgE,OAAO,EAAE,aAAa,EAC1F,sBAAsB,EACpB,qBAAqB,SAAA,GAAA,cAAA,eAAsB,OAAO,KAAK,IAAI,KAAA,EAC7D,EACF,EAAE;AAEF,MAAa,wBAAA,GAAA,cAAA,UAA6D,WAAW;CACnF,MAAM,SAAA,GAAA,cAAA,UAAiB,wBAAwB,cAAc,MAAM;CACnE,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,aACA,WACA,OACA,gBACA,WACA,mBACA,QACA,uBACA,kBACA,WACA,WACA,SACA,iBACA,gBACA,GAAG,WACD;CAEJ,MAAM,aAAA,GAAA,cAAA,WAAmD;EACvD,MAAM;EACN,SAAA,oCAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,MAAM,OAAA,GAAA,eAAA,iBAAsB;CAC5B,MAAM,GAAG,YAAA,GAAA,MAAA,UAAoB,CAAC;CAC9B,CAAA,GAAA,eAAA,mBAAkB,SAAS,SAAS,OAAO,CAAC,GAAG,MAAO,IAAI,EACxD,YAAY,KACd,CAAC;CAED,MAAM,MAAM,kBAAA,GAAA,MAAA,SAAuB,eAAe,CAAC,KAAA,GAAA,MAAA,SAAU;CAC7D,MAAM,gBAAgBA,kCAAAA,uBAAuB;EAAE;EAAW;EAAS;EAAiB;CAAI,CAAC;CACzF,MAAM,gBAAgB,iBAClBC,oBAAAA,WAAW;EAAE,QAAQ,IAAI,UAAU,MAAM;EAAG,MAAM;EAAK,QAAQ;CAAkB,CAAC,IAClF;CAEJ,IAAI,CAACC,yBAAAA,cAAc;EAAE,MAAM;EAAK;EAAW;CAAQ,CAAC,GAClD,OAAO;CAGT,OACE,iBAAA,GAAA,kBAAA,MAACC,cAAAA,KAAD;EACE,GAAI,UAAU,sBAAsB;EACpC,QAAQ;GACN,gBAAgB,QAAQ,cAAc,MAAM,UAAU;GACtD,kBAAkB;GAClB,gBAAgB;GAChB,8BAA8B;GAG9B,uBAAuB,eAAe,SAAS,EAAE,YAAY,EAAE,SAAS,GAAG,IACvE,SACA;EACN;EACA,GAAI;YAbN;GAeG,kBACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,GAAI,UAAU,gCAAgC;cAAI;GAAmB,CAAA;GAG3E,aAAa,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAK,GAAI,UAAU,2BAA2B,EAAI,CAAA;GAEhE,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAK,GAAI,UAAU,0BAA0B,EAAI,CAAA;EAC9C;;AAET,CAAC;AAED,qBAAqB,cAAc;AACnC,qBAAqB,UAAUC,oCAAAA;AAC/B,qBAAqB,eAAe"}
+{"version":3,"file":"CurrentTimeIndicator.cjs","names":["getCurrentTimePosition","formatDate","isInTimeRange","Box","classes"],"sources":["../../../src/components/CurrentTimeIndicator/CurrentTimeIndicator.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport { useState } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useInterval } from '@mantine/hooks';\nimport { AnyDateValue, DateLabelFormat } from '../../types';\nimport { formatDate, getCurrentTimePosition, isInTimeRange } from '../../utils';\nimport classes from './CurrentTimeIndicator.module.css';\n\nexport type CurrentTimeIndicatorStylesNames =\n  | 'currentTimeIndicator'\n  | 'currentTimeIndicatorLine'\n  | 'currentTimeIndicatorThumb'\n  | 'currentTimeIndicatorTimeBubble';\n\nexport type CurrentTimeIndicatorCssVariables = {\n  currentTimeIndicator: '--indicator-color';\n};\n\nexport interface CurrentTimeIndicatorProps\n  extends BoxProps, StylesApiProps<CurrentTimeIndicatorFactory>, ElementProps<'div'> {\n  __staticSelector?: string;\n\n  /** Key of `theme.colors` or any valid CSS color value @default 'red' */\n  color?: MantineColor;\n\n  /** Offset from the left side */\n  startOffset?: string;\n\n  /** Offset from the right side */\n  endOffset?: string;\n\n  /** Extra configurable offset from the top */\n  topOffset?: string;\n\n  /** Offset for the time bubble */\n  timeBubbleStartOffset?: string;\n\n  /** If set, displays a bubble with the current time @default @true */\n  withTimeBubble?: boolean;\n\n  /** If set, displays thumb next to the line @default true */\n  withThumb?: boolean;\n\n  /** Format of the time displayed in the time bubble @default 'HH:mm' */\n  currentTimeFormat?: DateLabelFormat;\n\n  /** Locale passed down to dayjs during formatting */\n  locale?: string;\n\n  /** Start time of the day */\n  startTime?: string;\n\n  /** End time of the day */\n  endTime?: string;\n\n  /** Number of minutes per time slot. Used to align the indicator to whole slots when `endTime` does not divide evenly. */\n  intervalMinutes?: number;\n\n  /** A function to get the current time, called on every tick. Can be used to display the indicator in a different timezone. @default () => dayjs() */\n  getCurrentTime?: () => AnyDateValue;\n}\n\nexport type CurrentTimeIndicatorFactory = Factory<{\n  props: CurrentTimeIndicatorProps;\n  ref: HTMLDivElement;\n  stylesNames: CurrentTimeIndicatorStylesNames;\n  vars: CurrentTimeIndicatorCssVariables;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'CurrentTimeIndicator',\n  withTimeBubble: true,\n  withThumb: true,\n  currentTimeFormat: 'HH:mm',\n  topOffset: '0rem',\n} satisfies Partial<CurrentTimeIndicatorProps>;\n\nconst varsResolver = createVarsResolver<CurrentTimeIndicatorFactory>((theme, { color }) => ({\n  currentTimeIndicator: {\n    '--indicator-color': color ? getThemeColor(color, theme) : undefined,\n  },\n}));\n\nexport const CurrentTimeIndicator = factory<CurrentTimeIndicatorFactory>((_props) => {\n  const props = useProps('CurrentTimeIndicator', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    startOffset,\n    endOffset,\n    color,\n    withTimeBubble,\n    withThumb,\n    currentTimeFormat,\n    locale,\n    timeBubbleStartOffset,\n    __staticSelector,\n    topOffset,\n    startTime,\n    endTime,\n    intervalMinutes,\n    getCurrentTime,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<CurrentTimeIndicatorFactory>({\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: 'currentTimeIndicator',\n  });\n\n  const ctx = useDatesContext();\n  const [, setTick] = useState(0);\n  useInterval(() => setTick((tick) => tick + 1), 1000 * 60, {\n    autoInvoke: true,\n  });\n\n  const now = getCurrentTime ? dayjs(getCurrentTime()) : dayjs();\n  const offsetPercent = getCurrentTimePosition({ startTime, endTime, intervalMinutes, now });\n  const formattedTime = withTimeBubble\n    ? formatDate({ locale: ctx.getLocale(locale), date: now, format: currentTimeFormat })\n    : '';\n\n  if (!isInTimeRange({ date: now, startTime, endTime })) {\n    return null;\n  }\n\n  return (\n    <Box\n      {...getStyles('currentTimeIndicator')}\n      __vars={{\n        '--top-offset': `calc(${offsetPercent}% + ${topOffset})`,\n        '--start-offset': startOffset,\n        '--end-offset': endOffset,\n        '--time-bubble-start-offset': timeBubbleStartOffset,\n\n        // Adjust time bubble width for formats including AM/PM\n        '--time-bubble-width': formattedTime?.toString().toLowerCase().includes('m')\n          ? '64px'\n          : '46px',\n      }}\n      {...others}\n    >\n      {withTimeBubble && (\n        <div {...getStyles('currentTimeIndicatorTimeBubble')}>{formattedTime}</div>\n      )}\n\n      {withThumb && <div {...getStyles('currentTimeIndicatorThumb')} />}\n\n      <div {...getStyles('currentTimeIndicatorLine')} />\n    </Box>\n  );\n});\n\nCurrentTimeIndicator.displayName = '@mantine/schedule/CurrentTimeIndicator';\nCurrentTimeIndicator.classes = classes;\nCurrentTimeIndicator.varsResolver = varsResolver;\n"],"mappings":";;;;;;;;;;;;;;AAkFA,MAAM,eAAe;CACnB,kBAAkB;CAClB,gBAAgB;CAChB,WAAW;CACX,mBAAmB;CACnB,WAAW;AACb;AAEA,MAAM,gBAAA,GAAA,cAAA,mBAAA,EAAgE,OAAO,EAAE,aAAa,EAC1F,sBAAsB,EACpB,qBAAqB,SAAA,GAAA,cAAA,cAAA,CAAsB,OAAO,KAAK,IAAI,KAAA,EAC7D,EACF,EAAE;AAEF,MAAa,wBAAA,GAAA,cAAA,QAAA,EAA6D,WAAW;CACnF,MAAM,SAAA,GAAA,cAAA,SAAA,CAAiB,wBAAwB,cAAc,MAAM;CACnE,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,aACA,WACA,OACA,gBACA,WACA,mBACA,QACA,uBACA,kBACA,WACA,WACA,SACA,iBACA,gBACA,GAAG,WACD;CAEJ,MAAM,aAAA,GAAA,cAAA,UAAA,CAAmD;EACvD,MAAM;EACN,SAAA,oCAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,MAAM,OAAA,GAAA,eAAA,gBAAA,CAAsB;CAC5B,MAAM,GAAG,YAAA,GAAA,MAAA,SAAA,CAAoB,CAAC;CAC9B,CAAA,GAAA,eAAA,YAAA,OAAkB,SAAS,SAAS,OAAO,CAAC,GAAG,MAAO,IAAI,EACxD,YAAY,KACd,CAAC;CAED,MAAM,MAAM,kBAAA,GAAA,MAAA,QAAA,CAAuB,eAAe,CAAC,KAAA,GAAA,MAAA,QAAA,CAAU;CAC7D,MAAM,gBAAgBA,kCAAAA,uBAAuB;EAAE;EAAW;EAAS;EAAiB;CAAI,CAAC;CACzF,MAAM,gBAAgB,iBAClBC,oBAAAA,WAAW;EAAE,QAAQ,IAAI,UAAU,MAAM;EAAG,MAAM;EAAK,QAAQ;CAAkB,CAAC,IAClF;CAEJ,IAAI,CAACC,yBAAAA,cAAc;EAAE,MAAM;EAAK;EAAW;CAAQ,CAAC,GAClD,OAAO;CAGT,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACC,cAAAA,KAAD;EACE,GAAI,UAAU,sBAAsB;EACpC,QAAQ;GACN,gBAAgB,QAAQ,cAAc,MAAM,UAAU;GACtD,kBAAkB;GAClB,gBAAgB;GAChB,8BAA8B;GAG9B,uBAAuB,eAAe,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC,SAAS,GAAG,IACvE,SACA;EACN;EACA,GAAI;YAbN;GAeG,kBACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IAAK,GAAI,UAAU,gCAAgC;cAAI;GAAmB,CAAA;GAG3E,aAAa,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD,EAAK,GAAI,UAAU,2BAA2B,EAAI,CAAA;GAEhE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD,EAAK,GAAI,UAAU,0BAA0B,EAAI,CAAA;EAC9C;;AAET,CAAC;AAED,qBAAqB,cAAc;AACnC,qBAAqB,UAAUC,oCAAAA;AAC/B,qBAAqB,eAAe"}

package/cjs/components/DayView/DayView.cjs

@@ -14,6 +14,7 @@ const require_use_auto_scroll_on_drag = require("../../hooks/use-auto-scroll-on-
 const require_use_drag_drop_handlers = require("../../hooks/use-drag-drop-handlers.cjs");
 const require_use_event_resize = require("../../hooks/use-event-resize.cjs");
 const require_use_slot_drag_select = require("../../hooks/use-slot-drag-select.cjs");
+const require_AgendaView = require("../AgendaView/AgendaView.cjs");
 const require_CurrentTimeIndicator = require("../CurrentTimeIndicator/CurrentTimeIndicator.cjs");
 const require_DragContext = require("../DragContext/DragContext.cjs");
 const require_ScheduleEvent = require("../ScheduleEvent/ScheduleEvent.cjs");
@@ -34,6 +35,7 @@ const defaultProps = {
 	startTime: "00:00:00",
 	endTime: "23:59:59",
 	intervalMinutes: 15,
+	withSubHourGridLines: true,
 	withAllDaySlot: true,
 	slotLabelFormat: "HH:mm",
 	headerFormat: "MMMM D, YYYY",
@@ -53,7 +55,8 @@ const varsResolver = (0, _mantine_core.createVarsResolver)((_theme, { radius, sl
 } }));
 const DayView = (0, _mantine_core.factory)((_props) => {
 	const props = (0, _mantine_core.useProps)("DayView", defaultProps, _props);
-	const { classNames, className, style, styles, unstyled, attributes, vars, __staticSelector, startTime, endTime, intervalMinutes, withAllDaySlot, date, locale, slotLabelFormat, headerFormat, getCurrentTime, withCurrentTimeIndicator, withCurrentTimeBubble, withHeader, radius, onDateChange, onViewChange, previousControlProps, nextControlProps, todayControlProps, viewSelectProps, slotHeight, allDaySlotHeight, scrollAreaProps, events, moreEventsProps, renderEventBody, renderEvent, labels, highlightBusinessHours, businessHours, withEventsDragAndDrop, onEventDrop, canDragEvent, onEventDragStart, onEventDragEnd, onTimeSlotClick, onAllDaySlotClick, onEventClick, withDragSlotSelect, onSlotDragEnd, mode, startScrollTime, onExternalEventDrop, withEventResize, onEventResize, canResizeEvent, recurrenceExpansionLimit, getTimeSlotProps, ...others } = props;
+	const { classNames, className, style, styles, unstyled, attributes, vars, __staticSelector, startTime, endTime, intervalMinutes, withSubHourGridLines, withAllDaySlot, date, locale, slotLabelFormat, headerFormat, getCurrentTime, withCurrentTimeIndicator, withCurrentTimeBubble, withHeader, radius, onDateChange, onViewChange, previousControlProps, nextControlProps, todayControlProps, viewSelectProps, slotHeight, allDaySlotHeight, scrollAreaProps, events, moreEventsProps, renderEventBody, renderEvent, labels, highlightBusinessHours, businessHours, withEventsDragAndDrop, onEventDrop, canDragEvent, onEventDragStart, onEventDragEnd, onTimeSlotClick, onAllDaySlotClick, onEventClick, withDragSlotSelect, onSlotDragEnd, mode, startScrollTime, onExternalEventDrop, withEventResize, onEventResize, canResizeEvent, recurrenceExpansionLimit, getTimeSlotProps, withAgenda, ...others } = props;
+	const [agendaOpen, setAgendaOpen] = (0, react.useState)(false);
 	const getStyles = (0, _mantine_core.useStyles)({
 		name: __staticSelector,
 		classes: require_DayView_module.default,
@@ -277,6 +280,7 @@ const DayView = (0, _mantine_core.factory)((_props) => {
 				slotsRef.current[index] = node;
 			},
 			mod: {
+				first: index === 0,
 				"hour-start": slot.isHourStart,
 				...require_get_business_hours_mod.getBusinessHoursMod({
 					time: slot.startTime,
@@ -373,117 +377,135 @@ const DayView = (0, _mantine_core.factory)((_props) => {
 		...getStyles("dayView"),
 		mod: {
 			static: mode === "static",
-			"slot-dragging": slotDragSelect.isDragging
+			"slot-dragging": slotDragSelect.isDragging,
+			"hide-sub-hour-grid-lines": !withSubHourGridLines,
+			"event-interaction": eventResize.isResizing || dragDrop.dragContextValue.isDragging
 		},
 		...others,
-		children: [withHeader && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ScheduleHeaderBase.ScheduleHeaderBase, {
-			view: "day",
-			navigationHandlers: {
-				previous: () => require_to_date_string.toDateString((0, dayjs.default)(date).subtract(1, "day")),
-				next: () => require_to_date_string.toDateString((0, dayjs.default)(date).add(1, "day")),
-				today: () => require_to_date_string.toDateString(resolveNow())
-			},
-			control: {
-				title: require_format_date.formatDate({
-					locale: ctx.getLocale(locale),
-					date,
-					format: headerFormat
-				}),
-				miw: 140
-			},
-			labels,
-			onDateChange,
-			onViewChange,
-			previousControlProps,
-			nextControlProps,
-			todayControlProps,
-			viewSelectProps,
-			stylesApiProps
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.ScrollArea.Autosize, {
-			scrollbarSize: 4,
-			...scrollAreaProps,
-			...getStyles("dayViewScrollArea", {
-				className: scrollAreaProps?.className,
-				style: scrollAreaProps?.style
+		children: [
+			withHeader && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ScheduleHeaderBase.ScheduleHeaderBase, {
+				view: "day",
+				navigationHandlers: {
+					previous: () => require_to_date_string.toDateString((0, dayjs.default)(date).subtract(1, "day")),
+					next: () => require_to_date_string.toDateString((0, dayjs.default)(date).add(1, "day")),
+					today: () => require_to_date_string.toDateString(resolveNow())
+				},
+				control: {
+					title: require_format_date.formatDate({
+						locale: ctx.getLocale(locale),
+						date,
+						format: headerFormat
+					}),
+					miw: 140
+				},
+				labels,
+				onDateChange,
+				onViewChange,
+				previousControlProps,
+				nextControlProps,
+				todayControlProps,
+				viewSelectProps,
+				stylesApiProps,
+				onAgendaClick: withAgenda ? () => setAgendaOpen((v) => !v) : void 0,
+				agendaActive: agendaOpen
 			}),
-			viewportRef: mergedViewportRef,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mantine_core.Box, {
-				...getStyles("dayViewInner"),
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					...getStyles("dayViewSlotLabels"),
-					children: [withAllDaySlot && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Box, {
-						...getStyles("dayViewSlotLabel"),
-						mod: { "all-day": true },
-						children: require_labels.getLabel("allDay", labels)
-					}), slotsLabels]
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					...getStyles("dayViewSlots"),
-					children: [withAllDaySlot && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						...getStyles("dayViewAllDay"),
-						children: [
-							backgroundAllDayEventNodes,
-							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-								...getStyles("dayViewAllDayEvents"),
-								children: [allDayEventsNodes, allDayEventsCount.hiddenEventsCount > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MoreEvents.MoreEvents, {
-									events: eventsData.allDayEvents,
-									moreEventsCount: allDayEventsCount.hiddenEventsCount,
-									renderEventBody,
-									renderEvent,
-									mode,
-									labels,
-									onEventClick,
-									...stylesApiProps,
-									...moreEventsProps
-								})]
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.UnstyledButton, {
-								...getStyles("dayViewSlot"),
-								mod: {
-									"all-day": true,
-									static: mode === "static"
-								},
-								"aria-label": `${require_labels.getLabel("timeSlot", labels)} ${require_labels.getLabel("allDay", labels)}`,
-								onClick: mode === "static" || !onAllDaySlotClick ? void 0 : (e) => {
-									onAllDaySlotClick((0, dayjs.default)(date).format("YYYY-MM-DD"), e);
-								}
-							})
-						]
+			agendaOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AgendaView.AgendaView, {
+				rangeStart: (0, dayjs.default)(date).startOf("day").format("YYYY-MM-DD"),
+				rangeEnd: (0, dayjs.default)(date).endOf("day").format("YYYY-MM-DD"),
+				events,
+				locale,
+				labels,
+				mode,
+				onEventClick,
+				recurrenceExpansionLimit,
+				...stylesApiProps
+			}),
+			!agendaOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.ScrollArea.Autosize, {
+				scrollbarSize: 4,
+				...scrollAreaProps,
+				...getStyles("dayViewScrollArea", {
+					className: scrollAreaProps?.className,
+					style: scrollAreaProps?.style
+				}),
+				viewportRef: mergedViewportRef,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mantine_core.Box, {
+					...getStyles("dayViewInner"),
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						...getStyles("dayViewSlotLabels"),
+						children: [withAllDaySlot && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Box, {
+							...getStyles("dayViewSlotLabel"),
+							mod: { "all-day": true },
+							children: require_labels.getLabel("allDay", labels)
+						}), slotsLabels]
 					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						ref: timeSlotsContainerRef,
-						...getStyles("dayViewTimeSlots"),
-						onDragOver: withDragHandlers ? (event) => {
-							const slotIndex = getSlotIndexFromDragPoint(event);
-							if (slotIndex !== null) dragDrop.handleDragOver(event, slotIndex);
-						} : void 0,
-						onDragLeave: withDragHandlers ? dragDrop.handleDragLeave : void 0,
-						onDrop: withDragHandlers ? (event) => {
-							const slotIndex = getSlotIndexFromDragPoint(event);
-							if (slotIndex !== null) dragDrop.handleDrop(event, slotIndex);
-						} : void 0,
-						children: [
-							backgroundTimedEventNodes,
-							eventsNodes,
-							showCurrentTimeIndicator && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_CurrentTimeIndicator.CurrentTimeIndicator, {
-								startOffset: "calc(var(--day-view-slot-labels-width) * -1)",
-								endOffset: "0rem",
-								topOffset: "0rem",
-								timeBubbleStartOffset: "calc(var(--day-view-slot-labels-width) * -1 + 30px)",
-								currentTimeFormat: slotLabelFormat,
-								withTimeBubble: withCurrentTimeBubble,
-								withThumb: !withCurrentTimeBubble,
-								locale,
-								startTime,
-								endTime,
-								intervalMinutes,
-								getCurrentTime,
-								...stylesApiProps
-							}),
-							items
-						]
+						...getStyles("dayViewSlots"),
+						children: [withAllDaySlot && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							...getStyles("dayViewAllDay"),
+							children: [
+								backgroundAllDayEventNodes,
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									...getStyles("dayViewAllDayEvents"),
+									children: [allDayEventsNodes, allDayEventsCount.hiddenEventsCount > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MoreEvents.MoreEvents, {
+										events: eventsData.allDayEvents,
+										moreEventsCount: allDayEventsCount.hiddenEventsCount,
+										renderEventBody,
+										renderEvent,
+										mode,
+										labels,
+										onEventClick,
+										...stylesApiProps,
+										...moreEventsProps
+									})]
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.UnstyledButton, {
+									...getStyles("dayViewSlot"),
+									mod: {
+										"all-day": true,
+										static: mode === "static"
+									},
+									"aria-label": `${require_labels.getLabel("timeSlot", labels)} ${require_labels.getLabel("allDay", labels)}`,
+									onClick: mode === "static" || !onAllDaySlotClick ? void 0 : (e) => {
+										onAllDaySlotClick((0, dayjs.default)(date).format("YYYY-MM-DD"), e);
+									}
+								})
+							]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							ref: timeSlotsContainerRef,
+							...getStyles("dayViewTimeSlots"),
+							onDragOver: withDragHandlers ? (event) => {
+								const slotIndex = getSlotIndexFromDragPoint(event);
+								if (slotIndex !== null) dragDrop.handleDragOver(event, slotIndex);
+							} : void 0,
+							onDragLeave: withDragHandlers ? dragDrop.handleDragLeave : void 0,
+							onDrop: withDragHandlers ? (event) => {
+								const slotIndex = getSlotIndexFromDragPoint(event);
+								if (slotIndex !== null) dragDrop.handleDrop(event, slotIndex);
+							} : void 0,
+							children: [
+								backgroundTimedEventNodes,
+								eventsNodes,
+								showCurrentTimeIndicator && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_CurrentTimeIndicator.CurrentTimeIndicator, {
+									startOffset: "calc(var(--day-view-slot-labels-width) * -1)",
+									endOffset: "0rem",
+									topOffset: "0rem",
+									timeBubbleStartOffset: "calc(var(--day-view-slot-labels-width) * -1 + 30px)",
+									currentTimeFormat: slotLabelFormat,
+									withTimeBubble: withCurrentTimeBubble,
+									withThumb: !withCurrentTimeBubble,
+									locale,
+									startTime,
+									endTime,
+									intervalMinutes,
+									getCurrentTime,
+									...stylesApiProps
+								}),
+								items
+							]
+						})]
 					})]
-				})]
+				})
 			})
-		})]
+		]
 	});
 	if (withEventsDragAndDrop) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_DragContext.DragContext.Provider, {
 		value: dragDrop.dragContextValue,