@mantine/schedule 9.7.1 → 9.7.2

package/cjs/components/MobileMonthView/MobileMonthView.cjs

@@ -7,7 +7,9 @@ const require_get_week_number = require("../../utils/get-week-number/get-week-nu
 const require_get_month_days = require("../../utils/get-month-days/get-month-days.cjs");
 const require_is_same_month = require("../../utils/is-same-month/is-same-month.cjs");
 const require_to_date_string = require("../../utils/to-date-string/to-date-string.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_handle_month_view_key_down = require("../MonthView/handle-month-view-key-down.cjs");
 const require_get_mobile_month_view_events = require("./get-mobile-month-view-events.cjs");
@@ -167,7 +169,10 @@ const MobileMonthView = (0, _mantine_core.factory)((_props) => {
 	const eventsList = (_selectedDate ? require_sort_events.sortEvents(groupedEvents[(0, dayjs.default)(_selectedDate).format("YYYY-MM-DD")] || []) : []).map((event) => {
 		const startTime = (0, dayjs.default)(event.start).format("HH:mm");
 		const endTime = (0, dayjs.default)(event.end).format("HH:mm");
-		const isAllDay = startTime === "00:00" && endTime === "00:00";
+		const isAllDay = require_is_multiday_event.isMultidayEvent(event) || require_is_all_day_event.isAllDayEvent({
+			event,
+			date: _selectedDate
+		});
 		const eventChildren = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mantine_core.Box, {
 			...getStyles("mobileMonthViewEventBody"),
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { ...getStyles("mobileMonthViewEventColor", { 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, {

package/cjs/components/MobileMonthView/MobileMonthView.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MobileMonthView.cjs","names":["createVarsResolver","getRadius","factory","useProps","useDatesContext","useMantineTheme","useUncontrolled","toDateString","useStyles","useRef","expandRecurringEvents","getMobileMonthViewEvents","getWeekdaysNames","getMonthDays","isSameMonth","getThemeColor","UnstyledButton","getWeekNumber","sortEvents","Box","Text","getLabel","React","formatDate","useDirection","AccordionChevron","classes"],"sources":["../../../src/components/MobileMonthView/MobileMonthView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport React, { useRef } from 'react';\nimport {\n  AccordionChevron,\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  useDirection,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport {\n  DateLabelFormat,\n  DateStringValue,\n  DayOfWeek,\n  ScheduleEventData,\n  ScheduleMode,\n} from '../../types';\nimport {\n  expandRecurringEvents,\n  formatDate,\n  getMonthDays,\n  getWeekdaysNames,\n  getWeekNumber,\n  isSameMonth,\n  sortEvents,\n  toDateString,\n} from '../../utils';\nimport {\n  handleMonthViewKeyDown,\n  MonthViewControlsRef,\n} from '../MonthView/handle-month-view-key-down';\nimport { RenderEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { getMobileMonthViewEvents } from './get-mobile-month-view-events';\nimport classes from './MobileMonthView.module.css';\n\nexport type MobileMonthViewStylesNames =\n  | 'mobileMonthView'\n  | 'mobileMonthViewHeader'\n  | 'mobileMonthViewHeaderBackButton'\n  | 'mobileMonthViewHeaderLabel'\n  | 'mobileMonthViewCalendar'\n  | 'mobileMonthViewWeekdays'\n  | 'mobileMonthViewWeekday'\n  | 'mobileMonthViewWeekdaysCorner'\n  | 'mobileMonthViewWeek'\n  | 'mobileMonthViewWeekNumber'\n  | 'mobileMonthViewDay'\n  | 'mobileMonthViewDayIndicators'\n  | 'mobileMonthViewDayIndicator'\n  | 'mobileMonthViewEventsList'\n  | 'mobileMonthViewEventsHeader'\n  | 'mobileMonthViewEvent'\n  | 'mobileMonthViewEventColor'\n  | 'mobileMonthViewEventBody'\n  | 'mobileMonthViewEventTitle'\n  | 'mobileMonthViewEventTime'\n  | 'mobileMonthViewNoEvents';\n\nexport type MobileMonthViewCssVariables = {\n  mobileMonthView: '--mobile-month-view-radius';\n};\n\nexport interface MobileMonthViewRenderHeaderInput {\n  /** Current interaction mode */\n  mode: ScheduleMode;\n  /** Current date displayed in the view */\n  date: Date | string;\n  /** Default header element */\n  defaultHeader: React.ReactNode;\n}\n\nexport interface MobileMonthViewProps\n  extends BoxProps, StylesApiProps<MobileMonthViewFactory>, 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  /** Currently selected date (controlled) */\n  selectedDate?: Date | string | null;\n\n  /** Default selected date (uncontrolled) */\n  defaultSelectedDate?: Date | string | null;\n\n  /** Called when selected date changes */\n  onSelectedDateChange?: (value: DateStringValue | null) => 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 false */\n  withOutsideDays?: boolean;\n\n  /** Events to display */\n  events?: ScheduleEventData[];\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 events list header date @default 'dddd, MMMM D' */\n  eventsHeaderFormat?: DateLabelFormat;\n\n  /** Called when the year back button in the header is clicked */\n  onYearClick?: () => void;\n\n  /** Called when event is clicked */\n  onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n\n  /** Custom header renderer, receives object with mode, date, and default header element */\n  renderHeader?: (input: MobileMonthViewRenderHeaderInput) => React.ReactNode;\n\n  /** Max number of generated recurring instances per recurring series @default 2000 */\n  recurrenceExpansionLimit?: number;\n}\n\nexport type MobileMonthViewFactory = Factory<{\n  props: MobileMonthViewProps;\n  ref: HTMLDivElement;\n  stylesNames: MobileMonthViewStylesNames;\n  vars: MobileMonthViewCssVariables;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'MobileMonthView',\n  withWeekDays: true,\n  consistentWeeks: true,\n  highlightToday: true,\n  mode: 'default',\n  eventsHeaderFormat: 'dddd, MMMM D',\n} satisfies Partial<MobileMonthViewProps>;\n\nconst varsResolver = createVarsResolver<MobileMonthViewFactory>((_theme, { radius }) => ({\n  mobileMonthView: {\n    '--mobile-month-view-radius': getRadius(radius),\n  },\n}));\n\nexport const MobileMonthView = factory<MobileMonthViewFactory>((_props) => {\n  const props = useProps('MobileMonthView', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    __staticSelector,\n    date,\n    onDateChange,\n    selectedDate,\n    defaultSelectedDate,\n    onSelectedDateChange,\n    withWeekNumbers,\n    withWeekDays,\n    locale,\n    firstDayOfWeek,\n    weekdayFormat,\n    weekendDays,\n    getWeekNumberProps,\n    getDayProps,\n    onDayClick,\n    onWeekNumberClick,\n    consistentWeeks,\n    highlightToday,\n    radius,\n    withOutsideDays,\n    events,\n    labels,\n    mode,\n    renderEvent,\n    eventsHeaderFormat,\n    onYearClick,\n    onEventClick,\n    renderHeader,\n    recurrenceExpansionLimit,\n    ...others\n  } = props;\n\n  const ctx = useDatesContext();\n  const theme = useMantineTheme();\n  const today = dayjs();\n\n  const [_selectedDate, _setSelectedDate] = useUncontrolled<Date | string | null>({\n    value: selectedDate,\n    defaultValue: defaultSelectedDate ?? toDateString(today),\n    onChange: (value) => onSelectedDateChange?.(value ? toDateString(dayjs(value)) : null),\n  });\n\n  const getStyles = useStyles<MobileMonthViewFactory>({\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: 'mobileMonthView',\n  });\n\n  const daysRef: MonthViewControlsRef = useRef<HTMLButtonElement[][]>([]);\n  const firstDayPosition = useRef<{ weekIndex: number; dayIndex: number } | null>(null);\n\n  const expandedEvents = expandRecurringEvents({\n    events,\n    rangeStart: dayjs(date).startOf('month').toDate(),\n    rangeEnd: dayjs(date).endOf('month').toDate(),\n    expansionLimit: recurrenceExpansionLimit,\n  });\n\n  const groupedEvents = getMobileMonthViewEvents({ date, events: expandedEvents });\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('mobileMonthViewWeekday')} key={index}>\n          {day}\n        </div>\n      ))\n    : null;\n\n  const weeks = getMonthDays({\n    month: dayjs(date).format('YYYY-MM-DD'),\n    firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n    consistentWeeks,\n  }).map((week, weekIndex) => {\n    const days = week.map((dayDate, dayIndex) => {\n      const outside = !isSameMonth(dayDate, date);\n      const weekend = ctx.getWeekendDays(weekendDays).includes(dayjs(dayDate).day());\n      const ariaLabel = dayjs(dayDate)\n        .locale(locale || ctx.locale)\n        .format('MMMM D, YYYY');\n\n      const dayProps = getDayProps?.(dayjs(dayDate).format('YYYY-MM-DD')) || {};\n      const isToday = dayjs(dayDate).isSame(today, 'day') && highlightToday;\n      const isSelected = _selectedDate && dayjs(dayDate).isSame(dayjs(_selectedDate), 'day');\n      const dayEvents = groupedEvents[dayjs(dayDate).format('YYYY-MM-DD')] || [];\n\n      const shouldRender = withOutsideDays || !outside;\n\n      if (shouldRender && firstDayPosition.current === null) {\n        firstDayPosition.current = { weekIndex, dayIndex };\n      }\n\n      const isFirstDay =\n        firstDayPosition.current?.weekIndex === weekIndex &&\n        firstDayPosition.current?.dayIndex === dayIndex;\n\n      const indicators = dayEvents.slice(0, 3).map((event) => (\n        <div\n          {...getStyles('mobileMonthViewDayIndicator', {\n            style: { backgroundColor: getThemeColor(event.color, theme) },\n          })}\n          key={event.id}\n        />\n      ));\n\n      const handleDayClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        const dateStr = dayjs(dayDate).format('YYYY-MM-DD');\n        _setSelectedDate(dateStr);\n        onDayClick?.(dateStr, event);\n        dayProps.onClick?.(event);\n      };\n\n      const handleDayKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n        handleMonthViewKeyDown({\n          controlsRef: daysRef,\n          weekIndex,\n          dayIndex,\n          event,\n        });\n      };\n\n      return (\n        <UnstyledButton\n          aria-label={ariaLabel}\n          aria-selected={isSelected || undefined}\n          {...dayProps}\n          {...getStyles('mobileMonthViewDay', {\n            className: dayProps.className,\n            style: dayProps.style,\n          })}\n          key={dayDate}\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          mod={[\n            {\n              outside,\n              weekend,\n              today: isToday,\n              selected: isSelected,\n              static: mode === 'static',\n              hidden: !shouldRender,\n            },\n            dayProps.mod,\n          ]}\n          tabIndex={mode === 'static' || !shouldRender ? -1 : isFirstDay ? 0 : -1}\n          onClick={mode === 'static' || !shouldRender ? undefined : handleDayClick}\n          onKeyDown={mode === 'static' || !shouldRender ? undefined : handleDayKeyDown}\n        >\n          {shouldRender ? dayjs(dayDate).format('D') : null}\n          {shouldRender && <div {...getStyles('mobileMonthViewDayIndicators')}>{indicators}</div>}\n        </UnstyledButton>\n      );\n    });\n\n    const weekNumberProps = getWeekNumberProps?.(dayjs(week[0]).format('YYYY-MM-DD')) || {};\n    const weekNumber = getWeekNumber(week);\n\n    return (\n      <div {...getStyles('mobileMonthViewWeek')} 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                    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('mobileMonthViewWeekNumber', {\n              className: weekNumberProps.className,\n              style: weekNumberProps.style,\n            })}\n          >\n            {weekNumber}\n          </UnstyledButton>\n        )}\n        {days}\n      </div>\n    );\n  });\n\n  const selectedDateEvents = _selectedDate\n    ? sortEvents(groupedEvents[dayjs(_selectedDate).format('YYYY-MM-DD')] || [])\n    : [];\n\n  const eventsList = selectedDateEvents.map((event) => {\n    const startTime = dayjs(event.start).format('HH:mm');\n    const endTime = dayjs(event.end).format('HH:mm');\n    const isAllDay = startTime === '00:00' && endTime === '00:00';\n\n    const eventChildren = (\n      <Box {...getStyles('mobileMonthViewEventBody')}>\n        <div\n          {...getStyles('mobileMonthViewEventColor', {\n            style: { backgroundColor: getThemeColor(event.color, theme) },\n          })}\n        />\n        <div>\n          <Text {...getStyles('mobileMonthViewEventTitle')}>{event.title}</Text>\n          <Text {...getStyles('mobileMonthViewEventTime')}>\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('mobileMonthViewEvent'),\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  const eventsHeader = _selectedDate\n    ? formatDate({\n        locale: ctx.getLocale(locale),\n        date: _selectedDate,\n        format: eventsHeaderFormat,\n      })\n    : '';\n\n  const { dir } = useDirection();\n\n  const headerLabel = formatDate({ locale: ctx.getLocale(locale), date, format: 'MMMM YYYY' });\n\n  const defaultHeader = (\n    <>\n      <UnstyledButton\n        {...getStyles('mobileMonthViewHeaderBackButton')}\n        onClick={onYearClick}\n        mod={{ static: mode === 'static' }}\n        tabIndex={mode === 'static' ? -1 : 0}\n      >\n        <AccordionChevron\n          style={{ transform: `rotate(${dir === 'rtl' ? -90 : 90}deg)` }}\n          size={20}\n        />\n        {dayjs(date).format('YYYY')}\n      </UnstyledButton>\n      <Text {...getStyles('mobileMonthViewHeaderLabel')}>{headerLabel}</Text>\n    </>\n  );\n\n  return (\n    <Box\n      {...getStyles('mobileMonthView')}\n      mod={{ 'with-week-numbers': withWeekNumbers }}\n      {...others}\n    >\n      <div {...getStyles('mobileMonthViewHeader')}>\n        {typeof renderHeader === 'function'\n          ? renderHeader({ mode: mode!, date, defaultHeader })\n          : defaultHeader}\n      </div>\n\n      <Box {...getStyles('mobileMonthViewCalendar')} mod={{ 'with-weekdays': withWeekDays }}>\n        {weekdays && (\n          <div {...getStyles('mobileMonthViewWeekdays')}>\n            {withWeekNumbers && <div {...getStyles('mobileMonthViewWeekdaysCorner')} />}\n            {weekdays}\n          </div>\n        )}\n        {weeks}\n      </Box>\n\n      <Box {...getStyles('mobileMonthViewEventsList')}>\n        <Text {...getStyles('mobileMonthViewEventsHeader')}>{eventsHeader}</Text>\n\n        {eventsList.length > 0 ? (\n          eventsList\n        ) : (\n          <Text {...getStyles('mobileMonthViewNoEvents')}>{getLabel('noEvents', labels)}</Text>\n        )}\n      </Box>\n    </Box>\n  );\n});\n\nMobileMonthView.displayName = '@mantine/schedule/MobileMonthView';\nMobileMonthView.classes = classes;\nMobileMonthView.varsResolver = varsResolver;\n\nexport namespace MobileMonthView {\n  export type Props = MobileMonthViewProps;\n  export type Factory = MobileMonthViewFactory;\n  export type StylesNames = MobileMonthViewStylesNames;\n  export type CssVariables = MobileMonthViewCssVariables;\n}\n"],"mappings":"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"}
+{"version":3,"file":"MobileMonthView.cjs","names":["createVarsResolver","getRadius","factory","useProps","useDatesContext","useMantineTheme","useUncontrolled","toDateString","useStyles","useRef","expandRecurringEvents","getMobileMonthViewEvents","getWeekdaysNames","getMonthDays","isSameMonth","getThemeColor","UnstyledButton","getWeekNumber","sortEvents","isMultidayEvent","isAllDayEvent","Box","Text","getLabel","React","formatDate","useDirection","AccordionChevron","classes"],"sources":["../../../src/components/MobileMonthView/MobileMonthView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport React, { useRef } from 'react';\nimport {\n  AccordionChevron,\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  useDirection,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport {\n  DateLabelFormat,\n  DateStringValue,\n  DayOfWeek,\n  ScheduleEventData,\n  ScheduleMode,\n} from '../../types';\nimport {\n  expandRecurringEvents,\n  formatDate,\n  getMonthDays,\n  getWeekdaysNames,\n  getWeekNumber,\n  isAllDayEvent,\n  isMultidayEvent,\n  isSameMonth,\n  sortEvents,\n  toDateString,\n} from '../../utils';\nimport {\n  handleMonthViewKeyDown,\n  MonthViewControlsRef,\n} from '../MonthView/handle-month-view-key-down';\nimport { RenderEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { getMobileMonthViewEvents } from './get-mobile-month-view-events';\nimport classes from './MobileMonthView.module.css';\n\nexport type MobileMonthViewStylesNames =\n  | 'mobileMonthView'\n  | 'mobileMonthViewHeader'\n  | 'mobileMonthViewHeaderBackButton'\n  | 'mobileMonthViewHeaderLabel'\n  | 'mobileMonthViewCalendar'\n  | 'mobileMonthViewWeekdays'\n  | 'mobileMonthViewWeekday'\n  | 'mobileMonthViewWeekdaysCorner'\n  | 'mobileMonthViewWeek'\n  | 'mobileMonthViewWeekNumber'\n  | 'mobileMonthViewDay'\n  | 'mobileMonthViewDayIndicators'\n  | 'mobileMonthViewDayIndicator'\n  | 'mobileMonthViewEventsList'\n  | 'mobileMonthViewEventsHeader'\n  | 'mobileMonthViewEvent'\n  | 'mobileMonthViewEventColor'\n  | 'mobileMonthViewEventBody'\n  | 'mobileMonthViewEventTitle'\n  | 'mobileMonthViewEventTime'\n  | 'mobileMonthViewNoEvents';\n\nexport type MobileMonthViewCssVariables = {\n  mobileMonthView: '--mobile-month-view-radius';\n};\n\nexport interface MobileMonthViewRenderHeaderInput {\n  /** Current interaction mode */\n  mode: ScheduleMode;\n  /** Current date displayed in the view */\n  date: Date | string;\n  /** Default header element */\n  defaultHeader: React.ReactNode;\n}\n\nexport interface MobileMonthViewProps\n  extends BoxProps, StylesApiProps<MobileMonthViewFactory>, 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  /** Currently selected date (controlled) */\n  selectedDate?: Date | string | null;\n\n  /** Default selected date (uncontrolled) */\n  defaultSelectedDate?: Date | string | null;\n\n  /** Called when selected date changes */\n  onSelectedDateChange?: (value: DateStringValue | null) => 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 false */\n  withOutsideDays?: boolean;\n\n  /** Events to display */\n  events?: ScheduleEventData[];\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 events list header date @default 'dddd, MMMM D' */\n  eventsHeaderFormat?: DateLabelFormat;\n\n  /** Called when the year back button in the header is clicked */\n  onYearClick?: () => void;\n\n  /** Called when event is clicked */\n  onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n\n  /** Custom header renderer, receives object with mode, date, and default header element */\n  renderHeader?: (input: MobileMonthViewRenderHeaderInput) => React.ReactNode;\n\n  /** Max number of generated recurring instances per recurring series @default 2000 */\n  recurrenceExpansionLimit?: number;\n}\n\nexport type MobileMonthViewFactory = Factory<{\n  props: MobileMonthViewProps;\n  ref: HTMLDivElement;\n  stylesNames: MobileMonthViewStylesNames;\n  vars: MobileMonthViewCssVariables;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'MobileMonthView',\n  withWeekDays: true,\n  consistentWeeks: true,\n  highlightToday: true,\n  mode: 'default',\n  eventsHeaderFormat: 'dddd, MMMM D',\n} satisfies Partial<MobileMonthViewProps>;\n\nconst varsResolver = createVarsResolver<MobileMonthViewFactory>((_theme, { radius }) => ({\n  mobileMonthView: {\n    '--mobile-month-view-radius': getRadius(radius),\n  },\n}));\n\nexport const MobileMonthView = factory<MobileMonthViewFactory>((_props) => {\n  const props = useProps('MobileMonthView', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    __staticSelector,\n    date,\n    onDateChange,\n    selectedDate,\n    defaultSelectedDate,\n    onSelectedDateChange,\n    withWeekNumbers,\n    withWeekDays,\n    locale,\n    firstDayOfWeek,\n    weekdayFormat,\n    weekendDays,\n    getWeekNumberProps,\n    getDayProps,\n    onDayClick,\n    onWeekNumberClick,\n    consistentWeeks,\n    highlightToday,\n    radius,\n    withOutsideDays,\n    events,\n    labels,\n    mode,\n    renderEvent,\n    eventsHeaderFormat,\n    onYearClick,\n    onEventClick,\n    renderHeader,\n    recurrenceExpansionLimit,\n    ...others\n  } = props;\n\n  const ctx = useDatesContext();\n  const theme = useMantineTheme();\n  const today = dayjs();\n\n  const [_selectedDate, _setSelectedDate] = useUncontrolled<Date | string | null>({\n    value: selectedDate,\n    defaultValue: defaultSelectedDate ?? toDateString(today),\n    onChange: (value) => onSelectedDateChange?.(value ? toDateString(dayjs(value)) : null),\n  });\n\n  const getStyles = useStyles<MobileMonthViewFactory>({\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: 'mobileMonthView',\n  });\n\n  const daysRef: MonthViewControlsRef = useRef<HTMLButtonElement[][]>([]);\n  const firstDayPosition = useRef<{ weekIndex: number; dayIndex: number } | null>(null);\n\n  const expandedEvents = expandRecurringEvents({\n    events,\n    rangeStart: dayjs(date).startOf('month').toDate(),\n    rangeEnd: dayjs(date).endOf('month').toDate(),\n    expansionLimit: recurrenceExpansionLimit,\n  });\n\n  const groupedEvents = getMobileMonthViewEvents({ date, events: expandedEvents });\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('mobileMonthViewWeekday')} key={index}>\n          {day}\n        </div>\n      ))\n    : null;\n\n  const weeks = getMonthDays({\n    month: dayjs(date).format('YYYY-MM-DD'),\n    firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n    consistentWeeks,\n  }).map((week, weekIndex) => {\n    const days = week.map((dayDate, dayIndex) => {\n      const outside = !isSameMonth(dayDate, date);\n      const weekend = ctx.getWeekendDays(weekendDays).includes(dayjs(dayDate).day());\n      const ariaLabel = dayjs(dayDate)\n        .locale(locale || ctx.locale)\n        .format('MMMM D, YYYY');\n\n      const dayProps = getDayProps?.(dayjs(dayDate).format('YYYY-MM-DD')) || {};\n      const isToday = dayjs(dayDate).isSame(today, 'day') && highlightToday;\n      const isSelected = _selectedDate && dayjs(dayDate).isSame(dayjs(_selectedDate), 'day');\n      const dayEvents = groupedEvents[dayjs(dayDate).format('YYYY-MM-DD')] || [];\n\n      const shouldRender = withOutsideDays || !outside;\n\n      if (shouldRender && firstDayPosition.current === null) {\n        firstDayPosition.current = { weekIndex, dayIndex };\n      }\n\n      const isFirstDay =\n        firstDayPosition.current?.weekIndex === weekIndex &&\n        firstDayPosition.current?.dayIndex === dayIndex;\n\n      const indicators = dayEvents.slice(0, 3).map((event) => (\n        <div\n          {...getStyles('mobileMonthViewDayIndicator', {\n            style: { backgroundColor: getThemeColor(event.color, theme) },\n          })}\n          key={event.id}\n        />\n      ));\n\n      const handleDayClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        const dateStr = dayjs(dayDate).format('YYYY-MM-DD');\n        _setSelectedDate(dateStr);\n        onDayClick?.(dateStr, event);\n        dayProps.onClick?.(event);\n      };\n\n      const handleDayKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n        handleMonthViewKeyDown({\n          controlsRef: daysRef,\n          weekIndex,\n          dayIndex,\n          event,\n        });\n      };\n\n      return (\n        <UnstyledButton\n          aria-label={ariaLabel}\n          aria-selected={isSelected || undefined}\n          {...dayProps}\n          {...getStyles('mobileMonthViewDay', {\n            className: dayProps.className,\n            style: dayProps.style,\n          })}\n          key={dayDate}\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          mod={[\n            {\n              outside,\n              weekend,\n              today: isToday,\n              selected: isSelected,\n              static: mode === 'static',\n              hidden: !shouldRender,\n            },\n            dayProps.mod,\n          ]}\n          tabIndex={mode === 'static' || !shouldRender ? -1 : isFirstDay ? 0 : -1}\n          onClick={mode === 'static' || !shouldRender ? undefined : handleDayClick}\n          onKeyDown={mode === 'static' || !shouldRender ? undefined : handleDayKeyDown}\n        >\n          {shouldRender ? dayjs(dayDate).format('D') : null}\n          {shouldRender && <div {...getStyles('mobileMonthViewDayIndicators')}>{indicators}</div>}\n        </UnstyledButton>\n      );\n    });\n\n    const weekNumberProps = getWeekNumberProps?.(dayjs(week[0]).format('YYYY-MM-DD')) || {};\n    const weekNumber = getWeekNumber(week);\n\n    return (\n      <div {...getStyles('mobileMonthViewWeek')} 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                    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('mobileMonthViewWeekNumber', {\n              className: weekNumberProps.className,\n              style: weekNumberProps.style,\n            })}\n          >\n            {weekNumber}\n          </UnstyledButton>\n        )}\n        {days}\n      </div>\n    );\n  });\n\n  const selectedDateEvents = _selectedDate\n    ? sortEvents(groupedEvents[dayjs(_selectedDate).format('YYYY-MM-DD')] || [])\n    : [];\n\n  const eventsList = selectedDateEvents.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: _selectedDate! });\n\n    const eventChildren = (\n      <Box {...getStyles('mobileMonthViewEventBody')}>\n        <div\n          {...getStyles('mobileMonthViewEventColor', {\n            style: { backgroundColor: getThemeColor(event.color, theme) },\n          })}\n        />\n        <div>\n          <Text {...getStyles('mobileMonthViewEventTitle')}>{event.title}</Text>\n          <Text {...getStyles('mobileMonthViewEventTime')}>\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('mobileMonthViewEvent'),\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  const eventsHeader = _selectedDate\n    ? formatDate({\n        locale: ctx.getLocale(locale),\n        date: _selectedDate,\n        format: eventsHeaderFormat,\n      })\n    : '';\n\n  const { dir } = useDirection();\n\n  const headerLabel = formatDate({ locale: ctx.getLocale(locale), date, format: 'MMMM YYYY' });\n\n  const defaultHeader = (\n    <>\n      <UnstyledButton\n        {...getStyles('mobileMonthViewHeaderBackButton')}\n        onClick={onYearClick}\n        mod={{ static: mode === 'static' }}\n        tabIndex={mode === 'static' ? -1 : 0}\n      >\n        <AccordionChevron\n          style={{ transform: `rotate(${dir === 'rtl' ? -90 : 90}deg)` }}\n          size={20}\n        />\n        {dayjs(date).format('YYYY')}\n      </UnstyledButton>\n      <Text {...getStyles('mobileMonthViewHeaderLabel')}>{headerLabel}</Text>\n    </>\n  );\n\n  return (\n    <Box\n      {...getStyles('mobileMonthView')}\n      mod={{ 'with-week-numbers': withWeekNumbers }}\n      {...others}\n    >\n      <div {...getStyles('mobileMonthViewHeader')}>\n        {typeof renderHeader === 'function'\n          ? renderHeader({ mode: mode!, date, defaultHeader })\n          : defaultHeader}\n      </div>\n\n      <Box {...getStyles('mobileMonthViewCalendar')} mod={{ 'with-weekdays': withWeekDays }}>\n        {weekdays && (\n          <div {...getStyles('mobileMonthViewWeekdays')}>\n            {withWeekNumbers && <div {...getStyles('mobileMonthViewWeekdaysCorner')} />}\n            {weekdays}\n          </div>\n        )}\n        {weeks}\n      </Box>\n\n      <Box {...getStyles('mobileMonthViewEventsList')}>\n        <Text {...getStyles('mobileMonthViewEventsHeader')}>{eventsHeader}</Text>\n\n        {eventsList.length > 0 ? (\n          eventsList\n        ) : (\n          <Text {...getStyles('mobileMonthViewNoEvents')}>{getLabel('noEvents', labels)}</Text>\n        )}\n      </Box>\n    </Box>\n  );\n});\n\nMobileMonthView.displayName = '@mantine/schedule/MobileMonthView';\nMobileMonthView.classes = classes;\nMobileMonthView.varsResolver = varsResolver;\n\nexport namespace MobileMonthView {\n  export type Props = MobileMonthViewProps;\n  export type Factory = MobileMonthViewFactory;\n  export type StylesNames = MobileMonthViewStylesNames;\n  export type CssVariables = MobileMonthViewCssVariables;\n}\n"],"mappings":"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"}

package/cjs/components/ResourcesDayView/ResourcesDayView.module.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ResourcesDayView.module.cjs","names":[],"sources":["../../../src/components/ResourcesDayView/ResourcesDayView.module.css"],"sourcesContent":[".resourcesDayView {\n  --resources-day-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n  --resources-day-view-resource-label-width: 120px;\n  --resources-day-view-slot-width: 80px;\n  --resources-day-view-row-height: 64px;\n  --resources-day-view-group-label-width: 80px;\n  --resources-day-view-all-day-height: 20px;\n\n  @mixin where-light {\n    --resources-day-view-border-color: var(--mantine-color-gray-3);\n    --resources-day-view-business-hours-bg: var(--mantine-color-white);\n    --resources-day-view-non-business-hours-bg: var(--mantine-color-gray-0);\n  }\n\n  @mixin where-dark {\n    --resources-day-view-border-color: var(--mantine-color-dark-4);\n    --resources-day-view-business-hours-bg: var(--mantine-color-dark-7);\n    --resources-day-view-non-business-hours-bg: var(--mantine-color-dark-6);\n  }\n}\n\n.resourcesDayViewRoot {\n  border: 1px solid var(--resources-day-view-border-color);\n  border-radius: var(--resources-day-view-radius);\n  overflow: hidden;\n  max-width: fit-content;\n  position: relative;\n}\n\n.resourcesDayViewScrollArea {\n  :where([data-mantine-scrollbar]) {\n    z-index: 20;\n  }\n\n  :where([data-scrollarea-viewport]) {\n    overscroll-behavior-x: none;\n  }\n}\n\n.resourcesDayViewInner {\n  display: inline-flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.resourcesDayViewTimeLabelsRow {\n  display: flex;\n  position: sticky;\n  top: 0;\n  z-index: 5;\n  background-color: var(--mantine-color-body);\n  border-bottom: 1px solid var(--resources-day-view-border-color);\n  margin-bottom: -1px;\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n}\n\n.resourcesDayViewCorner {\n  flex: 0 0 var(--resources-day-view-resource-label-width);\n  min-width: var(--resources-day-view-resource-label-width);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  position: sticky;\n  left: 0;\n  z-index: 11;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n}\n\n.resourcesDayViewTimeLabel {\n  flex: 0 0 var(--resources-day-view-slot-width);\n  min-width: var(--resources-day-view-slot-width);\n  max-width: var(--resources-day-view-slot-width);\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  user-select: none;\n  cursor: default;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-day-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-day-view-non-business-hours-bg);\n  }\n}\n\n.resourcesDayViewRow {\n  display: flex;\n  border-top: 1px solid var(--resources-day-view-border-color);\n}\n\n.resourcesDayViewResourceLabel {\n  flex: 0 0 var(--resources-day-view-resource-label-width);\n  min-width: var(--resources-day-view-resource-label-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 4px 8px;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 11;\n  background-color: var(--mantine-color-body);\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled-x]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n\n  &:where([data-has-groups]) {\n    left: var(--resources-day-view-group-label-width);\n  }\n}\n\n.resourcesDayViewGroupColumn {\n  flex: 0 0 var(--resources-day-view-group-label-width);\n  min-width: var(--resources-day-view-group-label-width);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  overflow-wrap: break-word;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  overflow: visible;\n\n  &:where([data-group-position='first']),\n  &:where([data-group-position='only']) {\n    z-index: 13;\n  }\n\n  &:where([data-group-position='middle']),\n  &:where([data-group-position='last']) {\n    margin-top: -1px;\n    min-height: calc(var(--resources-day-view-row-height) + 1px);\n  }\n}\n\n.resourcesDayViewGroupColumnEmpty {\n  flex: 0 0 var(--resources-day-view-group-label-width);\n  min-width: var(--resources-day-view-group-label-width);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n}\n\n.resourcesDayViewRowSlots {\n  display: flex;\n  position: relative;\n  min-height: var(--resources-day-view-row-height);\n}\n\n.resourcesDayViewRowSlot {\n  flex: 0 0 var(--resources-day-view-slot-width);\n  min-width: var(--resources-day-view-slot-width);\n  max-width: var(--resources-day-view-slot-width);\n  min-height: var(--resources-day-view-row-height);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  cursor: pointer;\n  position: relative;\n\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n  }\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where(:focus) {\n    z-index: 1;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-day-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-day-view-non-business-hours-bg);\n  }\n\n  &:where([data-drop-target]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-blue-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n      border-radius: 2px;\n\n      @mixin where-light {\n        border-color: var(--mantine-color-blue-4);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-color-blue-6);\n      }\n    }\n  }\n\n  &:where([data-drag-selected]) {\n    &,\n    &:hover {\n      background-color: var(--mantine-primary-color-light);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n\n      @mixin where-light {\n        border-color: var(--mantine-primary-color-2);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-primary-color-9);\n      }\n    }\n  }\n\n  &:where([data-drag-slot-index]) {\n    touch-action: none;\n  }\n\n  &:where([data-static]) {\n    cursor: default;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayViewCurrentTimeIndicator {\n  --_indicator-color: var(--resources-day-view-indicator-color, var(--mantine-color-red-7));\n  --_time-bubble-height: 18px;\n  --_thumb-size: 12px;\n\n  position: absolute;\n  pointer-events: none;\n  top: 37px;\n  bottom: 0;\n  left: var(--indicator-left-offset);\n  width: 2px;\n  z-index: 3;\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background-color: var(--_indicator-color);\n    opacity: 0.2;\n  }\n}\n\n.resourcesDayViewCurrentTimeIndicatorLine {\n  width: 100%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  background-color: var(--_indicator-color);\n}\n\n.resourcesDayViewCurrentTimeIndicatorThumb {\n  position: absolute;\n  top: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n  width: var(--_thumb-size);\n  height: var(--_thumb-size);\n  border-radius: 50%;\n  border: 1px solid var(--mantine-color-body);\n  background-color: var(--_indicator-color);\n  left: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n}\n\n.resourcesDayViewCurrentTimeIndicatorTimeBubble {\n  position: absolute;\n  height: var(--_time-bubble-height);\n  width: var(--_time-bubble-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 1000px;\n  background-color: var(--_indicator-color);\n  color: var(--mantine-color-white);\n  font-size: var(--mantine-font-size-xs);\n  font-weight: var(--mantine-font-weight-bold);\n  box-shadow: var(--mantine-shadow-sm);\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  top: 0;\n  left: calc(-1 * (var(--_time-bubble-width) / 2 - 1px));\n  z-index: 3;\n}\n\n.resourcesDayViewBackgroundEvent {\n  position: absolute;\n  pointer-events: none;\n  z-index: 2;\n  border-radius: var(--resources-day-view-radius);\n  background-color: var(--bg-event-bg);\n  overflow: hidden;\n  font-size: 12px;\n  font-weight: var(--mantine-font-weight-medium);\n  padding: 3px 4px;\n  color: var(--bg-event-color);\n\n  &:where([data-interactive]) {\n    pointer-events: auto;\n    cursor: pointer;\n    user-select: none;\n\n    @mixin hover {\n      background-color: var(--bg-event-hover);\n    }\n  }\n\n  /* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */\n  &:where([data-resizing]) {\n    @mixin hover {\n      background-color: var(--bg-event-bg);\n    }\n  }\n}\n\n.resourcesDayViewAllDayEvent {\n  position: absolute;\n  inset-inline: 1px;\n  height: var(--resources-day-view-all-day-height);\n  z-index: 3;\n}\n\n.resourcesDayViewResizeHandle {\n  position: absolute;\n  top: 20%;\n  width: 4px;\n  height: 60%;\n  cursor: ew-resize;\n  z-index: 5;\n  border-radius: 2px;\n  opacity: 0;\n  transition: opacity 100ms ease;\n  pointer-events: all;\n  background-color: var(--event-color);\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: -4px -6px;\n  }\n\n  &:where([data-edge='start']) {\n    left: -2px;\n  }\n\n  &:where([data-edge='end']) {\n    right: -2px;\n  }\n}\n\n.resourcesDayViewEventWrapper {\n  position: absolute;\n  z-index: 3;\n\n  &:hover .resourcesDayViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesDayViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayView:where([data-event-interaction]) .resourcesDayViewRowSlot {\n  pointer-events: none;\n}\n\n/* The resizing background event is the one that set `data-event-interaction`, so it must\n   keep capturing pointer events. */\n.resourcesDayView:where([data-event-interaction], [data-slot-dragging])\n  .resourcesDayViewBackgroundEvent:not([data-resizing]) {\n  pointer-events: none;\n\n  & .resourcesDayViewResizeHandle {\n    pointer-events: none;\n    opacity: 0;\n  }\n}\n\n.resourcesDayViewBackgroundEvent {\n  & .resourcesDayViewResizeHandle {\n    background-color: var(--bg-event-color);\n\n    &:where([data-edge='start']) {\n      left: 0;\n    }\n\n    &:where([data-edge='end']) {\n      right: 0;\n    }\n  }\n\n  &:hover .resourcesDayViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesDayViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayView:where([data-resizing]) {\n  & * {\n    cursor: ew-resize !important;\n  }\n\n  & .resourcesDayViewEventWrapper:not([data-resizing]) {\n    pointer-events: none;\n\n    & .resourcesDayViewResizeHandle {\n      opacity: 0;\n    }\n  }\n}\n\n.resourcesDayViewDragPreview {\n  pointer-events: none;\n  z-index: 3;\n  border-radius: var(--resources-day-view-radius);\n  border: 1px dashed var(--mantine-color-blue-filled);\n  background-color: var(--mantine-color-blue-light);\n  opacity: 0.6;\n\n  &:where([data-invalid]) {\n    border-color: var(--mantine-color-error);\n    background-color: transparent;\n    opacity: 0.4;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"ResourcesDayView.module.cjs","names":[],"sources":["../../../src/components/ResourcesDayView/ResourcesDayView.module.css"],"sourcesContent":[".resourcesDayView {\n  --resources-day-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n  --resources-day-view-resource-label-width: 120px;\n  --resources-day-view-slot-width: 80px;\n  --resources-day-view-row-height: 64px;\n  --resources-day-view-group-label-width: 80px;\n  --resources-day-view-all-day-height: 20px;\n\n  @mixin where-light {\n    --resources-day-view-border-color: var(--mantine-color-gray-3);\n    --resources-day-view-business-hours-bg: var(--mantine-color-white);\n    --resources-day-view-non-business-hours-bg: var(--mantine-color-gray-0);\n  }\n\n  @mixin where-dark {\n    --resources-day-view-border-color: var(--mantine-color-dark-4);\n    --resources-day-view-business-hours-bg: var(--mantine-color-dark-7);\n    --resources-day-view-non-business-hours-bg: var(--mantine-color-dark-6);\n  }\n}\n\n.resourcesDayViewRoot {\n  border: 1px solid var(--resources-day-view-border-color);\n  border-radius: var(--resources-day-view-radius);\n  overflow: hidden;\n  max-width: fit-content;\n  position: relative;\n}\n\n.resourcesDayViewScrollArea {\n  :where([data-mantine-scrollbar]) {\n    z-index: 20;\n  }\n\n  :where([data-scrollarea-viewport]) {\n    overscroll-behavior-x: none;\n  }\n}\n\n.resourcesDayViewInner {\n  display: inline-flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.resourcesDayViewTimeLabelsRow {\n  display: flex;\n  position: sticky;\n  top: 0;\n  z-index: 14;\n  background-color: var(--mantine-color-body);\n  border-bottom: 1px solid var(--resources-day-view-border-color);\n  margin-bottom: -1px;\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n}\n\n.resourcesDayViewCorner {\n  flex: 0 0 var(--resources-day-view-resource-label-width);\n  min-width: var(--resources-day-view-resource-label-width);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  position: sticky;\n  left: 0;\n  z-index: 11;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n}\n\n.resourcesDayViewTimeLabel {\n  flex: 0 0 var(--resources-day-view-slot-width);\n  min-width: var(--resources-day-view-slot-width);\n  max-width: var(--resources-day-view-slot-width);\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  user-select: none;\n  cursor: default;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-day-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-day-view-non-business-hours-bg);\n  }\n}\n\n.resourcesDayViewRow {\n  display: flex;\n  border-top: 1px solid var(--resources-day-view-border-color);\n}\n\n.resourcesDayViewResourceLabel {\n  flex: 0 0 var(--resources-day-view-resource-label-width);\n  min-width: var(--resources-day-view-resource-label-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 4px 8px;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 11;\n  background-color: var(--mantine-color-body);\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled-x]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n\n  &:where([data-has-groups]) {\n    left: var(--resources-day-view-group-label-width);\n  }\n}\n\n.resourcesDayViewGroupColumn {\n  flex: 0 0 var(--resources-day-view-group-label-width);\n  min-width: var(--resources-day-view-group-label-width);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  overflow-wrap: break-word;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  overflow: visible;\n\n  &:where([data-group-position='first']),\n  &:where([data-group-position='only']) {\n    z-index: 13;\n  }\n\n  &:where([data-group-position='middle']),\n  &:where([data-group-position='last']) {\n    margin-top: -1px;\n    min-height: calc(var(--resources-day-view-row-height) + 1px);\n  }\n}\n\n.resourcesDayViewGroupColumnEmpty {\n  flex: 0 0 var(--resources-day-view-group-label-width);\n  min-width: var(--resources-day-view-group-label-width);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n}\n\n.resourcesDayViewRowSlots {\n  display: flex;\n  position: relative;\n  min-height: var(--resources-day-view-row-height);\n}\n\n.resourcesDayViewRowSlot {\n  flex: 0 0 var(--resources-day-view-slot-width);\n  min-width: var(--resources-day-view-slot-width);\n  max-width: var(--resources-day-view-slot-width);\n  min-height: var(--resources-day-view-row-height);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  cursor: pointer;\n  position: relative;\n\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n  }\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where(:focus) {\n    z-index: 1;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-day-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-day-view-non-business-hours-bg);\n  }\n\n  &:where([data-drop-target]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-blue-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n      border-radius: 2px;\n\n      @mixin where-light {\n        border-color: var(--mantine-color-blue-4);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-color-blue-6);\n      }\n    }\n  }\n\n  &:where([data-drag-selected]) {\n    &,\n    &:hover {\n      background-color: var(--mantine-primary-color-light);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n\n      @mixin where-light {\n        border-color: var(--mantine-primary-color-2);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-primary-color-9);\n      }\n    }\n  }\n\n  &:where([data-drag-slot-index]) {\n    touch-action: none;\n  }\n\n  &:where([data-static]) {\n    cursor: default;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayViewCurrentTimeIndicator {\n  --_indicator-color: var(--resources-day-view-indicator-color, var(--mantine-color-red-7));\n  --_time-bubble-height: 18px;\n  --_thumb-size: 12px;\n\n  position: absolute;\n  pointer-events: none;\n  top: 37px;\n  bottom: 0;\n  left: var(--indicator-left-offset);\n  width: 2px;\n  z-index: 3;\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background-color: var(--_indicator-color);\n    opacity: 0.2;\n  }\n}\n\n.resourcesDayViewCurrentTimeIndicatorLine {\n  width: 100%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  background-color: var(--_indicator-color);\n}\n\n.resourcesDayViewCurrentTimeIndicatorThumb {\n  position: absolute;\n  top: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n  width: var(--_thumb-size);\n  height: var(--_thumb-size);\n  border-radius: 50%;\n  border: 1px solid var(--mantine-color-body);\n  background-color: var(--_indicator-color);\n  left: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n}\n\n.resourcesDayViewCurrentTimeIndicatorTimeBubble {\n  position: absolute;\n  height: var(--_time-bubble-height);\n  width: var(--_time-bubble-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 1000px;\n  background-color: var(--_indicator-color);\n  color: var(--mantine-color-white);\n  font-size: var(--mantine-font-size-xs);\n  font-weight: var(--mantine-font-weight-bold);\n  box-shadow: var(--mantine-shadow-sm);\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  top: 0;\n  left: calc(-1 * (var(--_time-bubble-width) / 2 - 1px));\n  z-index: 3;\n}\n\n.resourcesDayViewBackgroundEvent {\n  position: absolute;\n  pointer-events: none;\n  z-index: 2;\n  border-radius: var(--resources-day-view-radius);\n  background-color: var(--bg-event-bg);\n  overflow: hidden;\n  font-size: 12px;\n  font-weight: var(--mantine-font-weight-medium);\n  padding: 3px 4px;\n  color: var(--bg-event-color);\n\n  &:where([data-interactive]) {\n    pointer-events: auto;\n    cursor: pointer;\n    user-select: none;\n\n    @mixin hover {\n      background-color: var(--bg-event-hover);\n    }\n  }\n\n  /* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */\n  &:where([data-resizing]) {\n    @mixin hover {\n      background-color: var(--bg-event-bg);\n    }\n  }\n}\n\n.resourcesDayViewAllDayEvent {\n  position: absolute;\n  inset-inline: 1px;\n  height: var(--resources-day-view-all-day-height);\n  z-index: 3;\n}\n\n.resourcesDayViewResizeHandle {\n  position: absolute;\n  top: 20%;\n  width: 4px;\n  height: 60%;\n  cursor: ew-resize;\n  z-index: 5;\n  border-radius: 2px;\n  opacity: 0;\n  transition: opacity 100ms ease;\n  pointer-events: all;\n  background-color: var(--event-color);\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: -4px -6px;\n  }\n\n  &:where([data-edge='start']) {\n    left: -2px;\n  }\n\n  &:where([data-edge='end']) {\n    right: -2px;\n  }\n}\n\n.resourcesDayViewEventWrapper {\n  position: absolute;\n  z-index: 3;\n\n  &:hover .resourcesDayViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesDayViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayView:where([data-event-interaction]) .resourcesDayViewRowSlot {\n  pointer-events: none;\n}\n\n/* The resizing background event is the one that set `data-event-interaction`, so it must\n   keep capturing pointer events. */\n.resourcesDayView:where([data-event-interaction], [data-slot-dragging])\n  .resourcesDayViewBackgroundEvent:not([data-resizing]) {\n  pointer-events: none;\n\n  & .resourcesDayViewResizeHandle {\n    pointer-events: none;\n    opacity: 0;\n  }\n}\n\n.resourcesDayViewBackgroundEvent {\n  & .resourcesDayViewResizeHandle {\n    background-color: var(--bg-event-color);\n\n    &:where([data-edge='start']) {\n      left: 0;\n    }\n\n    &:where([data-edge='end']) {\n      right: 0;\n    }\n  }\n\n  &:hover .resourcesDayViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesDayViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayView:where([data-resizing]) {\n  & * {\n    cursor: ew-resize !important;\n  }\n\n  & .resourcesDayViewEventWrapper:not([data-resizing]) {\n    pointer-events: none;\n\n    & .resourcesDayViewResizeHandle {\n      opacity: 0;\n    }\n  }\n}\n\n.resourcesDayViewDragPreview {\n  pointer-events: none;\n  z-index: 3;\n  border-radius: var(--resources-day-view-radius);\n  border: 1px dashed var(--mantine-color-blue-filled);\n  background-color: var(--mantine-color-blue-light);\n  opacity: 0.6;\n\n  &:where([data-invalid]) {\n    border-color: var(--mantine-color-error);\n    background-color: transparent;\n    opacity: 0.4;\n  }\n}\n"],"mappings":""}

package/cjs/components/ResourcesMonthView/ResourcesMonthView.module.cjs.map

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

package/cjs/components/ResourcesWeekView/ResourcesWeekView.module.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ResourcesWeekView.module.cjs","names":[],"sources":["../../../src/components/ResourcesWeekView/ResourcesWeekView.module.css"],"sourcesContent":[".resourcesWeekView {\n  --resources-week-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n  --resources-week-view-resource-label-width: 120px;\n  --resources-week-view-slot-width: 60px;\n  --resources-week-view-row-height: 64px;\n  --resources-week-view-group-label-width: 80px;\n  --resources-week-view-all-day-height: 20px;\n\n  @mixin where-light {\n    --resources-week-view-border-color: var(--mantine-color-gray-3);\n    --resources-week-view-business-hours-bg: var(--mantine-color-white);\n    --resources-week-view-non-business-hours-bg: var(--mantine-color-gray-0);\n  }\n\n  @mixin where-dark {\n    --resources-week-view-border-color: var(--mantine-color-dark-4);\n    --resources-week-view-business-hours-bg: var(--mantine-color-dark-7);\n    --resources-week-view-non-business-hours-bg: var(--mantine-color-dark-6);\n  }\n}\n\n.resourcesWeekViewRoot {\n  border: 1px solid var(--resources-week-view-border-color);\n  border-radius: var(--resources-week-view-radius);\n  overflow: hidden;\n  max-width: fit-content;\n  position: relative;\n}\n\n.resourcesWeekViewScrollArea {\n  :where([data-mantine-scrollbar]) {\n    z-index: 20;\n  }\n\n  :where([data-scrollarea-viewport]) {\n    overscroll-behavior-x: none;\n  }\n}\n\n.resourcesWeekViewInner {\n  display: inline-flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.resourcesWeekViewHeaderRows {\n  display: flex;\n  position: sticky;\n  top: 0;\n  z-index: 5;\n  background-color: var(--mantine-color-body);\n  border-bottom: 1px solid var(--resources-week-view-border-color);\n  margin-bottom: -1px;\n}\n\n.resourcesWeekViewCorner {\n  flex: 0 0 var(--resources-week-view-resource-label-width);\n  min-width: var(--resources-week-view-resource-label-width);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  position: sticky;\n  left: 0;\n  z-index: 6;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n}\n\n.resourcesWeekViewHeaderContent {\n  display: flex;\n  flex-direction: column;\n}\n\n.resourcesWeekViewDayLabelsRow {\n  display: flex;\n  border-bottom: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewDayLabel {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  cursor: default;\n  height: 32px;\n  text-transform: capitalize;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-weekend]) {\n    color: var(--mantine-color-red-6);\n  }\n\n  &:where([data-today]) {\n    color: var(--mantine-primary-color-contrast);\n    background-color: var(--mantine-primary-color-filled);\n    font-weight: var(--mantine-font-weight-bold);\n  }\n}\n\n.resourcesWeekViewTimeLabelsRow {\n  display: flex;\n}\n\n.resourcesWeekViewTimeLabel {\n  flex: 0 0 var(--resources-week-view-slot-width);\n  min-width: var(--resources-week-view-slot-width);\n  max-width: var(--resources-week-view-slot-width);\n  height: 28px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-xs);\n  user-select: none;\n  cursor: default;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-week-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-week-view-non-business-hours-bg);\n  }\n}\n\n.resourcesWeekViewRow {\n  display: flex;\n  border-top: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewResourceLabel {\n  flex: 0 0 var(--resources-week-view-resource-label-width);\n  min-width: var(--resources-week-view-resource-label-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 4px 8px;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 4;\n  background-color: var(--mantine-color-body);\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled-x]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n\n  &:where([data-has-groups]) {\n    left: var(--resources-week-view-group-label-width);\n  }\n}\n\n.resourcesWeekViewGroupColumn {\n  flex: 0 0 var(--resources-week-view-group-label-width);\n  min-width: var(--resources-week-view-group-label-width);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  overflow-wrap: break-word;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  overflow: visible;\n\n  &:where([data-group-position='first']),\n  &:where([data-group-position='only']) {\n    z-index: 13;\n  }\n\n  &:where([data-group-position='middle']),\n  &:where([data-group-position='last']) {\n    margin-top: -1px;\n    min-height: calc(var(--resources-week-view-row-height) + 1px);\n  }\n}\n\n.resourcesWeekViewGroupColumnEmpty {\n  flex: 0 0 var(--resources-week-view-group-label-width);\n  min-width: var(--resources-week-view-group-label-width);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewRowSlots {\n  display: flex;\n  position: relative;\n  min-height: var(--resources-week-view-row-height);\n}\n\n.resourcesWeekViewRowSlot {\n  flex: 0 0 var(--resources-week-view-slot-width);\n  min-width: var(--resources-week-view-slot-width);\n  max-width: var(--resources-week-view-slot-width);\n  min-height: var(--resources-week-view-row-height);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  cursor: pointer;\n  position: relative;\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n  }\n\n  &:where(:focus) {\n    z-index: 1;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-week-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-week-view-non-business-hours-bg);\n  }\n\n  &:where([data-drop-target]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-blue-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n      border-radius: 2px;\n\n      @mixin where-light {\n        border-color: var(--mantine-color-blue-4);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-color-blue-6);\n      }\n    }\n  }\n\n  &:where([data-drag-selected]) {\n    &,\n    &:hover {\n      background-color: var(--mantine-primary-color-light);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n\n      @mixin where-light {\n        border-color: var(--mantine-primary-color-2);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-primary-color-9);\n      }\n    }\n  }\n\n  &:where([data-drag-slot-index]) {\n    touch-action: none;\n  }\n\n  &:where([data-static]) {\n    cursor: default;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekViewBackgroundEvent {\n  position: absolute;\n  pointer-events: none;\n  z-index: 2;\n  border-radius: var(--resources-week-view-radius);\n  background-color: var(--bg-event-bg);\n  overflow: hidden;\n  font-size: 12px;\n  font-weight: var(--mantine-font-weight-medium);\n  padding: 3px 4px;\n  color: var(--bg-event-color);\n\n  &:where([data-interactive]) {\n    pointer-events: auto;\n    cursor: pointer;\n    user-select: none;\n\n    @mixin hover {\n      background-color: var(--bg-event-hover);\n    }\n  }\n\n  /* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */\n  &:where([data-resizing]) {\n    @mixin hover {\n      background-color: var(--bg-event-bg);\n    }\n  }\n}\n\n.resourcesWeekViewAllDayEvent {\n  position: absolute;\n  height: var(--resources-week-view-all-day-height);\n  z-index: 2;\n}\n\n.resourcesWeekViewResizeHandle {\n  position: absolute;\n  top: 20%;\n  width: 4px;\n  height: 60%;\n  cursor: ew-resize;\n  z-index: 5;\n  border-radius: 2px;\n  opacity: 0;\n  transition: opacity 100ms ease;\n  pointer-events: all;\n  background-color: var(--event-color);\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: -4px -6px;\n  }\n\n  &:where([data-edge='start']) {\n    left: -2px;\n  }\n\n  &:where([data-edge='end']) {\n    right: -2px;\n  }\n}\n\n.resourcesWeekViewEventWrapper {\n  position: absolute;\n  z-index: 3;\n\n  &:hover .resourcesWeekViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesWeekViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekView:where([data-event-interaction]) .resourcesWeekViewRowSlot {\n  pointer-events: none;\n}\n\n/* The resizing background event is the one that set `data-event-interaction`, so it must\n   keep capturing pointer events. */\n.resourcesWeekView:where([data-event-interaction], [data-slot-dragging])\n  .resourcesWeekViewBackgroundEvent:not([data-resizing]) {\n  pointer-events: none;\n\n  & .resourcesWeekViewResizeHandle {\n    pointer-events: none;\n    opacity: 0;\n  }\n}\n\n.resourcesWeekViewBackgroundEvent {\n  & .resourcesWeekViewResizeHandle {\n    background-color: var(--bg-event-color);\n\n    &:where([data-edge='start']) {\n      left: 0;\n    }\n\n    &:where([data-edge='end']) {\n      right: 0;\n    }\n  }\n\n  &:hover .resourcesWeekViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesWeekViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekView:where([data-resizing]) {\n  & * {\n    cursor: ew-resize !important;\n  }\n\n  & .resourcesWeekViewEventWrapper:not([data-resizing]) {\n    pointer-events: none;\n\n    & .resourcesWeekViewResizeHandle {\n      opacity: 0;\n    }\n  }\n}\n\n.resourcesWeekViewCurrentTimeIndicator {\n  --_indicator-color: var(--resources-week-view-indicator-color, var(--mantine-color-red-7));\n  --_time-bubble-height: 18px;\n  --_thumb-size: 12px;\n\n  position: absolute;\n  pointer-events: none;\n  top: 62px;\n  bottom: 0;\n  left: var(--indicator-left-offset);\n  width: 2px;\n  z-index: 3;\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background-color: var(--_indicator-color);\n    opacity: 0.2;\n  }\n}\n\n.resourcesWeekViewCurrentTimeIndicatorLine {\n  width: 100%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  background-color: var(--_indicator-color);\n}\n\n.resourcesWeekViewCurrentTimeIndicatorThumb {\n  position: absolute;\n  top: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n  width: var(--_thumb-size);\n  height: var(--_thumb-size);\n  border-radius: 50%;\n  border: 1px solid var(--mantine-color-body);\n  background-color: var(--_indicator-color);\n  left: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n}\n\n.resourcesWeekViewCurrentTimeIndicatorTimeBubble {\n  position: absolute;\n  top: 0;\n  height: var(--_time-bubble-height);\n  width: var(--_time-bubble-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 1000px;\n  background-color: var(--_indicator-color);\n  color: var(--mantine-color-white);\n  font-size: var(--mantine-font-size-xs);\n  font-weight: var(--mantine-font-weight-bold);\n  box-shadow: var(--mantine-shadow-sm);\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  left: calc(-1 * (var(--_time-bubble-width) / 2 - 1px));\n  z-index: 3;\n}\n\n.resourcesWeekViewDragPreview {\n  pointer-events: none;\n  z-index: 3;\n  border-radius: var(--resources-week-view-radius);\n  border: 1px dashed var(--mantine-color-blue-filled);\n  background-color: var(--mantine-color-blue-light);\n  opacity: 0.6;\n\n  &:where([data-invalid]) {\n    border-color: var(--mantine-color-error);\n    background-color: transparent;\n    opacity: 0.4;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"ResourcesWeekView.module.cjs","names":[],"sources":["../../../src/components/ResourcesWeekView/ResourcesWeekView.module.css"],"sourcesContent":[".resourcesWeekView {\n  --resources-week-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n  --resources-week-view-resource-label-width: 120px;\n  --resources-week-view-slot-width: 60px;\n  --resources-week-view-row-height: 64px;\n  --resources-week-view-group-label-width: 80px;\n  --resources-week-view-all-day-height: 20px;\n\n  @mixin where-light {\n    --resources-week-view-border-color: var(--mantine-color-gray-3);\n    --resources-week-view-business-hours-bg: var(--mantine-color-white);\n    --resources-week-view-non-business-hours-bg: var(--mantine-color-gray-0);\n  }\n\n  @mixin where-dark {\n    --resources-week-view-border-color: var(--mantine-color-dark-4);\n    --resources-week-view-business-hours-bg: var(--mantine-color-dark-7);\n    --resources-week-view-non-business-hours-bg: var(--mantine-color-dark-6);\n  }\n}\n\n.resourcesWeekViewRoot {\n  border: 1px solid var(--resources-week-view-border-color);\n  border-radius: var(--resources-week-view-radius);\n  overflow: hidden;\n  max-width: fit-content;\n  position: relative;\n}\n\n.resourcesWeekViewScrollArea {\n  :where([data-mantine-scrollbar]) {\n    z-index: 20;\n  }\n\n  :where([data-scrollarea-viewport]) {\n    overscroll-behavior-x: none;\n  }\n}\n\n.resourcesWeekViewInner {\n  display: inline-flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.resourcesWeekViewHeaderRows {\n  display: flex;\n  position: sticky;\n  top: 0;\n  z-index: 14;\n  background-color: var(--mantine-color-body);\n  border-bottom: 1px solid var(--resources-week-view-border-color);\n  margin-bottom: -1px;\n}\n\n.resourcesWeekViewCorner {\n  flex: 0 0 var(--resources-week-view-resource-label-width);\n  min-width: var(--resources-week-view-resource-label-width);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  position: sticky;\n  left: 0;\n  z-index: 6;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n}\n\n.resourcesWeekViewHeaderContent {\n  display: flex;\n  flex-direction: column;\n}\n\n.resourcesWeekViewDayLabelsRow {\n  display: flex;\n  border-bottom: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewDayLabel {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  cursor: default;\n  height: 32px;\n  text-transform: capitalize;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-weekend]) {\n    color: var(--mantine-color-red-6);\n  }\n\n  &:where([data-today]) {\n    color: var(--mantine-primary-color-contrast);\n    background-color: var(--mantine-primary-color-filled);\n    font-weight: var(--mantine-font-weight-bold);\n  }\n}\n\n.resourcesWeekViewTimeLabelsRow {\n  display: flex;\n}\n\n.resourcesWeekViewTimeLabel {\n  flex: 0 0 var(--resources-week-view-slot-width);\n  min-width: var(--resources-week-view-slot-width);\n  max-width: var(--resources-week-view-slot-width);\n  height: 28px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-xs);\n  user-select: none;\n  cursor: default;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-week-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-week-view-non-business-hours-bg);\n  }\n}\n\n.resourcesWeekViewRow {\n  display: flex;\n  border-top: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewResourceLabel {\n  flex: 0 0 var(--resources-week-view-resource-label-width);\n  min-width: var(--resources-week-view-resource-label-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 4px 8px;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 4;\n  background-color: var(--mantine-color-body);\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled-x]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n\n  &:where([data-has-groups]) {\n    left: var(--resources-week-view-group-label-width);\n  }\n}\n\n.resourcesWeekViewGroupColumn {\n  flex: 0 0 var(--resources-week-view-group-label-width);\n  min-width: var(--resources-week-view-group-label-width);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  overflow-wrap: break-word;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  overflow: visible;\n\n  &:where([data-group-position='first']),\n  &:where([data-group-position='only']) {\n    z-index: 13;\n  }\n\n  &:where([data-group-position='middle']),\n  &:where([data-group-position='last']) {\n    margin-top: -1px;\n    min-height: calc(var(--resources-week-view-row-height) + 1px);\n  }\n}\n\n.resourcesWeekViewGroupColumnEmpty {\n  flex: 0 0 var(--resources-week-view-group-label-width);\n  min-width: var(--resources-week-view-group-label-width);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewRowSlots {\n  display: flex;\n  position: relative;\n  min-height: var(--resources-week-view-row-height);\n}\n\n.resourcesWeekViewRowSlot {\n  flex: 0 0 var(--resources-week-view-slot-width);\n  min-width: var(--resources-week-view-slot-width);\n  max-width: var(--resources-week-view-slot-width);\n  min-height: var(--resources-week-view-row-height);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  cursor: pointer;\n  position: relative;\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n  }\n\n  &:where(:focus) {\n    z-index: 1;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-week-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-week-view-non-business-hours-bg);\n  }\n\n  &:where([data-drop-target]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-blue-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n      border-radius: 2px;\n\n      @mixin where-light {\n        border-color: var(--mantine-color-blue-4);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-color-blue-6);\n      }\n    }\n  }\n\n  &:where([data-drag-selected]) {\n    &,\n    &:hover {\n      background-color: var(--mantine-primary-color-light);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n\n      @mixin where-light {\n        border-color: var(--mantine-primary-color-2);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-primary-color-9);\n      }\n    }\n  }\n\n  &:where([data-drag-slot-index]) {\n    touch-action: none;\n  }\n\n  &:where([data-static]) {\n    cursor: default;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekViewBackgroundEvent {\n  position: absolute;\n  pointer-events: none;\n  z-index: 2;\n  border-radius: var(--resources-week-view-radius);\n  background-color: var(--bg-event-bg);\n  overflow: hidden;\n  font-size: 12px;\n  font-weight: var(--mantine-font-weight-medium);\n  padding: 3px 4px;\n  color: var(--bg-event-color);\n\n  &:where([data-interactive]) {\n    pointer-events: auto;\n    cursor: pointer;\n    user-select: none;\n\n    @mixin hover {\n      background-color: var(--bg-event-hover);\n    }\n  }\n\n  /* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */\n  &:where([data-resizing]) {\n    @mixin hover {\n      background-color: var(--bg-event-bg);\n    }\n  }\n}\n\n.resourcesWeekViewAllDayEvent {\n  position: absolute;\n  height: var(--resources-week-view-all-day-height);\n  z-index: 2;\n}\n\n.resourcesWeekViewResizeHandle {\n  position: absolute;\n  top: 20%;\n  width: 4px;\n  height: 60%;\n  cursor: ew-resize;\n  z-index: 5;\n  border-radius: 2px;\n  opacity: 0;\n  transition: opacity 100ms ease;\n  pointer-events: all;\n  background-color: var(--event-color);\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: -4px -6px;\n  }\n\n  &:where([data-edge='start']) {\n    left: -2px;\n  }\n\n  &:where([data-edge='end']) {\n    right: -2px;\n  }\n}\n\n.resourcesWeekViewEventWrapper {\n  position: absolute;\n  z-index: 3;\n\n  &:hover .resourcesWeekViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesWeekViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekView:where([data-event-interaction]) .resourcesWeekViewRowSlot {\n  pointer-events: none;\n}\n\n/* The resizing background event is the one that set `data-event-interaction`, so it must\n   keep capturing pointer events. */\n.resourcesWeekView:where([data-event-interaction], [data-slot-dragging])\n  .resourcesWeekViewBackgroundEvent:not([data-resizing]) {\n  pointer-events: none;\n\n  & .resourcesWeekViewResizeHandle {\n    pointer-events: none;\n    opacity: 0;\n  }\n}\n\n.resourcesWeekViewBackgroundEvent {\n  & .resourcesWeekViewResizeHandle {\n    background-color: var(--bg-event-color);\n\n    &:where([data-edge='start']) {\n      left: 0;\n    }\n\n    &:where([data-edge='end']) {\n      right: 0;\n    }\n  }\n\n  &:hover .resourcesWeekViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesWeekViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekView:where([data-resizing]) {\n  & * {\n    cursor: ew-resize !important;\n  }\n\n  & .resourcesWeekViewEventWrapper:not([data-resizing]) {\n    pointer-events: none;\n\n    & .resourcesWeekViewResizeHandle {\n      opacity: 0;\n    }\n  }\n}\n\n.resourcesWeekViewCurrentTimeIndicator {\n  --_indicator-color: var(--resources-week-view-indicator-color, var(--mantine-color-red-7));\n  --_time-bubble-height: 18px;\n  --_thumb-size: 12px;\n\n  position: absolute;\n  pointer-events: none;\n  top: 62px;\n  bottom: 0;\n  left: var(--indicator-left-offset);\n  width: 2px;\n  z-index: 3;\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background-color: var(--_indicator-color);\n    opacity: 0.2;\n  }\n}\n\n.resourcesWeekViewCurrentTimeIndicatorLine {\n  width: 100%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  background-color: var(--_indicator-color);\n}\n\n.resourcesWeekViewCurrentTimeIndicatorThumb {\n  position: absolute;\n  top: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n  width: var(--_thumb-size);\n  height: var(--_thumb-size);\n  border-radius: 50%;\n  border: 1px solid var(--mantine-color-body);\n  background-color: var(--_indicator-color);\n  left: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n}\n\n.resourcesWeekViewCurrentTimeIndicatorTimeBubble {\n  position: absolute;\n  top: 0;\n  height: var(--_time-bubble-height);\n  width: var(--_time-bubble-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 1000px;\n  background-color: var(--_indicator-color);\n  color: var(--mantine-color-white);\n  font-size: var(--mantine-font-size-xs);\n  font-weight: var(--mantine-font-weight-bold);\n  box-shadow: var(--mantine-shadow-sm);\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  left: calc(-1 * (var(--_time-bubble-width) / 2 - 1px));\n  z-index: 3;\n}\n\n.resourcesWeekViewDragPreview {\n  pointer-events: none;\n  z-index: 3;\n  border-radius: var(--resources-week-view-radius);\n  border: 1px dashed var(--mantine-color-blue-filled);\n  background-color: var(--mantine-color-blue-light);\n  opacity: 0.6;\n\n  &:where([data-invalid]) {\n    border-color: var(--mantine-color-error);\n    background-color: transparent;\n    opacity: 0.4;\n  }\n}\n"],"mappings":""}

package/esm/components/MobileMonthView/MobileMonthView.mjs

@@ -6,7 +6,9 @@ import { getWeekNumber } from "../../utils/get-week-number/get-week-number.mjs";
 import { getMonthDays } from "../../utils/get-month-days/get-month-days.mjs";
 import { isSameMonth } from "../../utils/is-same-month/is-same-month.mjs";
 import { toDateString } from "../../utils/to-date-string/to-date-string.mjs";
+import { isAllDayEvent } from "../../utils/is-all-day-event/is-all-day-event.mjs";
 import { sortEvents } from "../../utils/sort-events/sort-events.mjs";
+import { isMultidayEvent } from "../../utils/is-multiday-event/is-multiday-event.mjs";
 import { expandRecurringEvents } from "../../utils/expand-recurring-events/expand-recurring-events.mjs";
 import { handleMonthViewKeyDown } from "../MonthView/handle-month-view-key-down.mjs";
 import { getMobileMonthViewEvents } from "./get-mobile-month-view-events.mjs";
@@ -164,7 +166,10 @@ const MobileMonthView = factory((_props) => {
 	const eventsList = (_selectedDate ? sortEvents(groupedEvents[dayjs(_selectedDate).format("YYYY-MM-DD")] || []) : []).map((event) => {
 		const startTime = dayjs(event.start).format("HH:mm");
 		const endTime = dayjs(event.end).format("HH:mm");
-		const isAllDay = startTime === "00:00" && endTime === "00:00";
+		const isAllDay = isMultidayEvent(event) || isAllDayEvent({
+			event,
+			date: _selectedDate
+		});
 		const eventChildren = /* @__PURE__ */ jsxs(Box, {
 			...getStyles("mobileMonthViewEventBody"),
 			children: [/* @__PURE__ */ jsx("div", { ...getStyles("mobileMonthViewEventColor", { style: { backgroundColor: getThemeColor(event.color, theme) } }) }), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Text, {

package/esm/components/MobileMonthView/MobileMonthView.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MobileMonthView.mjs","names":["classes"],"sources":["../../../src/components/MobileMonthView/MobileMonthView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport React, { useRef } from 'react';\nimport {\n  AccordionChevron,\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  useDirection,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport {\n  DateLabelFormat,\n  DateStringValue,\n  DayOfWeek,\n  ScheduleEventData,\n  ScheduleMode,\n} from '../../types';\nimport {\n  expandRecurringEvents,\n  formatDate,\n  getMonthDays,\n  getWeekdaysNames,\n  getWeekNumber,\n  isSameMonth,\n  sortEvents,\n  toDateString,\n} from '../../utils';\nimport {\n  handleMonthViewKeyDown,\n  MonthViewControlsRef,\n} from '../MonthView/handle-month-view-key-down';\nimport { RenderEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { getMobileMonthViewEvents } from './get-mobile-month-view-events';\nimport classes from './MobileMonthView.module.css';\n\nexport type MobileMonthViewStylesNames =\n  | 'mobileMonthView'\n  | 'mobileMonthViewHeader'\n  | 'mobileMonthViewHeaderBackButton'\n  | 'mobileMonthViewHeaderLabel'\n  | 'mobileMonthViewCalendar'\n  | 'mobileMonthViewWeekdays'\n  | 'mobileMonthViewWeekday'\n  | 'mobileMonthViewWeekdaysCorner'\n  | 'mobileMonthViewWeek'\n  | 'mobileMonthViewWeekNumber'\n  | 'mobileMonthViewDay'\n  | 'mobileMonthViewDayIndicators'\n  | 'mobileMonthViewDayIndicator'\n  | 'mobileMonthViewEventsList'\n  | 'mobileMonthViewEventsHeader'\n  | 'mobileMonthViewEvent'\n  | 'mobileMonthViewEventColor'\n  | 'mobileMonthViewEventBody'\n  | 'mobileMonthViewEventTitle'\n  | 'mobileMonthViewEventTime'\n  | 'mobileMonthViewNoEvents';\n\nexport type MobileMonthViewCssVariables = {\n  mobileMonthView: '--mobile-month-view-radius';\n};\n\nexport interface MobileMonthViewRenderHeaderInput {\n  /** Current interaction mode */\n  mode: ScheduleMode;\n  /** Current date displayed in the view */\n  date: Date | string;\n  /** Default header element */\n  defaultHeader: React.ReactNode;\n}\n\nexport interface MobileMonthViewProps\n  extends BoxProps, StylesApiProps<MobileMonthViewFactory>, 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  /** Currently selected date (controlled) */\n  selectedDate?: Date | string | null;\n\n  /** Default selected date (uncontrolled) */\n  defaultSelectedDate?: Date | string | null;\n\n  /** Called when selected date changes */\n  onSelectedDateChange?: (value: DateStringValue | null) => 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 false */\n  withOutsideDays?: boolean;\n\n  /** Events to display */\n  events?: ScheduleEventData[];\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 events list header date @default 'dddd, MMMM D' */\n  eventsHeaderFormat?: DateLabelFormat;\n\n  /** Called when the year back button in the header is clicked */\n  onYearClick?: () => void;\n\n  /** Called when event is clicked */\n  onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n\n  /** Custom header renderer, receives object with mode, date, and default header element */\n  renderHeader?: (input: MobileMonthViewRenderHeaderInput) => React.ReactNode;\n\n  /** Max number of generated recurring instances per recurring series @default 2000 */\n  recurrenceExpansionLimit?: number;\n}\n\nexport type MobileMonthViewFactory = Factory<{\n  props: MobileMonthViewProps;\n  ref: HTMLDivElement;\n  stylesNames: MobileMonthViewStylesNames;\n  vars: MobileMonthViewCssVariables;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'MobileMonthView',\n  withWeekDays: true,\n  consistentWeeks: true,\n  highlightToday: true,\n  mode: 'default',\n  eventsHeaderFormat: 'dddd, MMMM D',\n} satisfies Partial<MobileMonthViewProps>;\n\nconst varsResolver = createVarsResolver<MobileMonthViewFactory>((_theme, { radius }) => ({\n  mobileMonthView: {\n    '--mobile-month-view-radius': getRadius(radius),\n  },\n}));\n\nexport const MobileMonthView = factory<MobileMonthViewFactory>((_props) => {\n  const props = useProps('MobileMonthView', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    __staticSelector,\n    date,\n    onDateChange,\n    selectedDate,\n    defaultSelectedDate,\n    onSelectedDateChange,\n    withWeekNumbers,\n    withWeekDays,\n    locale,\n    firstDayOfWeek,\n    weekdayFormat,\n    weekendDays,\n    getWeekNumberProps,\n    getDayProps,\n    onDayClick,\n    onWeekNumberClick,\n    consistentWeeks,\n    highlightToday,\n    radius,\n    withOutsideDays,\n    events,\n    labels,\n    mode,\n    renderEvent,\n    eventsHeaderFormat,\n    onYearClick,\n    onEventClick,\n    renderHeader,\n    recurrenceExpansionLimit,\n    ...others\n  } = props;\n\n  const ctx = useDatesContext();\n  const theme = useMantineTheme();\n  const today = dayjs();\n\n  const [_selectedDate, _setSelectedDate] = useUncontrolled<Date | string | null>({\n    value: selectedDate,\n    defaultValue: defaultSelectedDate ?? toDateString(today),\n    onChange: (value) => onSelectedDateChange?.(value ? toDateString(dayjs(value)) : null),\n  });\n\n  const getStyles = useStyles<MobileMonthViewFactory>({\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: 'mobileMonthView',\n  });\n\n  const daysRef: MonthViewControlsRef = useRef<HTMLButtonElement[][]>([]);\n  const firstDayPosition = useRef<{ weekIndex: number; dayIndex: number } | null>(null);\n\n  const expandedEvents = expandRecurringEvents({\n    events,\n    rangeStart: dayjs(date).startOf('month').toDate(),\n    rangeEnd: dayjs(date).endOf('month').toDate(),\n    expansionLimit: recurrenceExpansionLimit,\n  });\n\n  const groupedEvents = getMobileMonthViewEvents({ date, events: expandedEvents });\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('mobileMonthViewWeekday')} key={index}>\n          {day}\n        </div>\n      ))\n    : null;\n\n  const weeks = getMonthDays({\n    month: dayjs(date).format('YYYY-MM-DD'),\n    firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n    consistentWeeks,\n  }).map((week, weekIndex) => {\n    const days = week.map((dayDate, dayIndex) => {\n      const outside = !isSameMonth(dayDate, date);\n      const weekend = ctx.getWeekendDays(weekendDays).includes(dayjs(dayDate).day());\n      const ariaLabel = dayjs(dayDate)\n        .locale(locale || ctx.locale)\n        .format('MMMM D, YYYY');\n\n      const dayProps = getDayProps?.(dayjs(dayDate).format('YYYY-MM-DD')) || {};\n      const isToday = dayjs(dayDate).isSame(today, 'day') && highlightToday;\n      const isSelected = _selectedDate && dayjs(dayDate).isSame(dayjs(_selectedDate), 'day');\n      const dayEvents = groupedEvents[dayjs(dayDate).format('YYYY-MM-DD')] || [];\n\n      const shouldRender = withOutsideDays || !outside;\n\n      if (shouldRender && firstDayPosition.current === null) {\n        firstDayPosition.current = { weekIndex, dayIndex };\n      }\n\n      const isFirstDay =\n        firstDayPosition.current?.weekIndex === weekIndex &&\n        firstDayPosition.current?.dayIndex === dayIndex;\n\n      const indicators = dayEvents.slice(0, 3).map((event) => (\n        <div\n          {...getStyles('mobileMonthViewDayIndicator', {\n            style: { backgroundColor: getThemeColor(event.color, theme) },\n          })}\n          key={event.id}\n        />\n      ));\n\n      const handleDayClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        const dateStr = dayjs(dayDate).format('YYYY-MM-DD');\n        _setSelectedDate(dateStr);\n        onDayClick?.(dateStr, event);\n        dayProps.onClick?.(event);\n      };\n\n      const handleDayKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n        handleMonthViewKeyDown({\n          controlsRef: daysRef,\n          weekIndex,\n          dayIndex,\n          event,\n        });\n      };\n\n      return (\n        <UnstyledButton\n          aria-label={ariaLabel}\n          aria-selected={isSelected || undefined}\n          {...dayProps}\n          {...getStyles('mobileMonthViewDay', {\n            className: dayProps.className,\n            style: dayProps.style,\n          })}\n          key={dayDate}\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          mod={[\n            {\n              outside,\n              weekend,\n              today: isToday,\n              selected: isSelected,\n              static: mode === 'static',\n              hidden: !shouldRender,\n            },\n            dayProps.mod,\n          ]}\n          tabIndex={mode === 'static' || !shouldRender ? -1 : isFirstDay ? 0 : -1}\n          onClick={mode === 'static' || !shouldRender ? undefined : handleDayClick}\n          onKeyDown={mode === 'static' || !shouldRender ? undefined : handleDayKeyDown}\n        >\n          {shouldRender ? dayjs(dayDate).format('D') : null}\n          {shouldRender && <div {...getStyles('mobileMonthViewDayIndicators')}>{indicators}</div>}\n        </UnstyledButton>\n      );\n    });\n\n    const weekNumberProps = getWeekNumberProps?.(dayjs(week[0]).format('YYYY-MM-DD')) || {};\n    const weekNumber = getWeekNumber(week);\n\n    return (\n      <div {...getStyles('mobileMonthViewWeek')} 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                    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('mobileMonthViewWeekNumber', {\n              className: weekNumberProps.className,\n              style: weekNumberProps.style,\n            })}\n          >\n            {weekNumber}\n          </UnstyledButton>\n        )}\n        {days}\n      </div>\n    );\n  });\n\n  const selectedDateEvents = _selectedDate\n    ? sortEvents(groupedEvents[dayjs(_selectedDate).format('YYYY-MM-DD')] || [])\n    : [];\n\n  const eventsList = selectedDateEvents.map((event) => {\n    const startTime = dayjs(event.start).format('HH:mm');\n    const endTime = dayjs(event.end).format('HH:mm');\n    const isAllDay = startTime === '00:00' && endTime === '00:00';\n\n    const eventChildren = (\n      <Box {...getStyles('mobileMonthViewEventBody')}>\n        <div\n          {...getStyles('mobileMonthViewEventColor', {\n            style: { backgroundColor: getThemeColor(event.color, theme) },\n          })}\n        />\n        <div>\n          <Text {...getStyles('mobileMonthViewEventTitle')}>{event.title}</Text>\n          <Text {...getStyles('mobileMonthViewEventTime')}>\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('mobileMonthViewEvent'),\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  const eventsHeader = _selectedDate\n    ? formatDate({\n        locale: ctx.getLocale(locale),\n        date: _selectedDate,\n        format: eventsHeaderFormat,\n      })\n    : '';\n\n  const { dir } = useDirection();\n\n  const headerLabel = formatDate({ locale: ctx.getLocale(locale), date, format: 'MMMM YYYY' });\n\n  const defaultHeader = (\n    <>\n      <UnstyledButton\n        {...getStyles('mobileMonthViewHeaderBackButton')}\n        onClick={onYearClick}\n        mod={{ static: mode === 'static' }}\n        tabIndex={mode === 'static' ? -1 : 0}\n      >\n        <AccordionChevron\n          style={{ transform: `rotate(${dir === 'rtl' ? -90 : 90}deg)` }}\n          size={20}\n        />\n        {dayjs(date).format('YYYY')}\n      </UnstyledButton>\n      <Text {...getStyles('mobileMonthViewHeaderLabel')}>{headerLabel}</Text>\n    </>\n  );\n\n  return (\n    <Box\n      {...getStyles('mobileMonthView')}\n      mod={{ 'with-week-numbers': withWeekNumbers }}\n      {...others}\n    >\n      <div {...getStyles('mobileMonthViewHeader')}>\n        {typeof renderHeader === 'function'\n          ? renderHeader({ mode: mode!, date, defaultHeader })\n          : defaultHeader}\n      </div>\n\n      <Box {...getStyles('mobileMonthViewCalendar')} mod={{ 'with-weekdays': withWeekDays }}>\n        {weekdays && (\n          <div {...getStyles('mobileMonthViewWeekdays')}>\n            {withWeekNumbers && <div {...getStyles('mobileMonthViewWeekdaysCorner')} />}\n            {weekdays}\n          </div>\n        )}\n        {weeks}\n      </Box>\n\n      <Box {...getStyles('mobileMonthViewEventsList')}>\n        <Text {...getStyles('mobileMonthViewEventsHeader')}>{eventsHeader}</Text>\n\n        {eventsList.length > 0 ? (\n          eventsList\n        ) : (\n          <Text {...getStyles('mobileMonthViewNoEvents')}>{getLabel('noEvents', labels)}</Text>\n        )}\n      </Box>\n    </Box>\n  );\n});\n\nMobileMonthView.displayName = '@mantine/schedule/MobileMonthView';\nMobileMonthView.classes = classes;\nMobileMonthView.varsResolver = varsResolver;\n\nexport namespace MobileMonthView {\n  export type Props = MobileMonthViewProps;\n  export type Factory = MobileMonthViewFactory;\n  export type StylesNames = MobileMonthViewStylesNames;\n  export type CssVariables = MobileMonthViewCssVariables;\n}\n"],"mappings":"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"}
+{"version":3,"file":"MobileMonthView.mjs","names":["classes"],"sources":["../../../src/components/MobileMonthView/MobileMonthView.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport React, { useRef } from 'react';\nimport {\n  AccordionChevron,\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  useDirection,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { useDatesContext } from '@mantine/dates';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport {\n  DateLabelFormat,\n  DateStringValue,\n  DayOfWeek,\n  ScheduleEventData,\n  ScheduleMode,\n} from '../../types';\nimport {\n  expandRecurringEvents,\n  formatDate,\n  getMonthDays,\n  getWeekdaysNames,\n  getWeekNumber,\n  isAllDayEvent,\n  isMultidayEvent,\n  isSameMonth,\n  sortEvents,\n  toDateString,\n} from '../../utils';\nimport {\n  handleMonthViewKeyDown,\n  MonthViewControlsRef,\n} from '../MonthView/handle-month-view-key-down';\nimport { RenderEvent } from '../ScheduleEvent/ScheduleEvent';\nimport { getMobileMonthViewEvents } from './get-mobile-month-view-events';\nimport classes from './MobileMonthView.module.css';\n\nexport type MobileMonthViewStylesNames =\n  | 'mobileMonthView'\n  | 'mobileMonthViewHeader'\n  | 'mobileMonthViewHeaderBackButton'\n  | 'mobileMonthViewHeaderLabel'\n  | 'mobileMonthViewCalendar'\n  | 'mobileMonthViewWeekdays'\n  | 'mobileMonthViewWeekday'\n  | 'mobileMonthViewWeekdaysCorner'\n  | 'mobileMonthViewWeek'\n  | 'mobileMonthViewWeekNumber'\n  | 'mobileMonthViewDay'\n  | 'mobileMonthViewDayIndicators'\n  | 'mobileMonthViewDayIndicator'\n  | 'mobileMonthViewEventsList'\n  | 'mobileMonthViewEventsHeader'\n  | 'mobileMonthViewEvent'\n  | 'mobileMonthViewEventColor'\n  | 'mobileMonthViewEventBody'\n  | 'mobileMonthViewEventTitle'\n  | 'mobileMonthViewEventTime'\n  | 'mobileMonthViewNoEvents';\n\nexport type MobileMonthViewCssVariables = {\n  mobileMonthView: '--mobile-month-view-radius';\n};\n\nexport interface MobileMonthViewRenderHeaderInput {\n  /** Current interaction mode */\n  mode: ScheduleMode;\n  /** Current date displayed in the view */\n  date: Date | string;\n  /** Default header element */\n  defaultHeader: React.ReactNode;\n}\n\nexport interface MobileMonthViewProps\n  extends BoxProps, StylesApiProps<MobileMonthViewFactory>, 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  /** Currently selected date (controlled) */\n  selectedDate?: Date | string | null;\n\n  /** Default selected date (uncontrolled) */\n  defaultSelectedDate?: Date | string | null;\n\n  /** Called when selected date changes */\n  onSelectedDateChange?: (value: DateStringValue | null) => 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 false */\n  withOutsideDays?: boolean;\n\n  /** Events to display */\n  events?: ScheduleEventData[];\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 events list header date @default 'dddd, MMMM D' */\n  eventsHeaderFormat?: DateLabelFormat;\n\n  /** Called when the year back button in the header is clicked */\n  onYearClick?: () => void;\n\n  /** Called when event is clicked */\n  onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n\n  /** Custom header renderer, receives object with mode, date, and default header element */\n  renderHeader?: (input: MobileMonthViewRenderHeaderInput) => React.ReactNode;\n\n  /** Max number of generated recurring instances per recurring series @default 2000 */\n  recurrenceExpansionLimit?: number;\n}\n\nexport type MobileMonthViewFactory = Factory<{\n  props: MobileMonthViewProps;\n  ref: HTMLDivElement;\n  stylesNames: MobileMonthViewStylesNames;\n  vars: MobileMonthViewCssVariables;\n}>;\n\nconst defaultProps = {\n  __staticSelector: 'MobileMonthView',\n  withWeekDays: true,\n  consistentWeeks: true,\n  highlightToday: true,\n  mode: 'default',\n  eventsHeaderFormat: 'dddd, MMMM D',\n} satisfies Partial<MobileMonthViewProps>;\n\nconst varsResolver = createVarsResolver<MobileMonthViewFactory>((_theme, { radius }) => ({\n  mobileMonthView: {\n    '--mobile-month-view-radius': getRadius(radius),\n  },\n}));\n\nexport const MobileMonthView = factory<MobileMonthViewFactory>((_props) => {\n  const props = useProps('MobileMonthView', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    __staticSelector,\n    date,\n    onDateChange,\n    selectedDate,\n    defaultSelectedDate,\n    onSelectedDateChange,\n    withWeekNumbers,\n    withWeekDays,\n    locale,\n    firstDayOfWeek,\n    weekdayFormat,\n    weekendDays,\n    getWeekNumberProps,\n    getDayProps,\n    onDayClick,\n    onWeekNumberClick,\n    consistentWeeks,\n    highlightToday,\n    radius,\n    withOutsideDays,\n    events,\n    labels,\n    mode,\n    renderEvent,\n    eventsHeaderFormat,\n    onYearClick,\n    onEventClick,\n    renderHeader,\n    recurrenceExpansionLimit,\n    ...others\n  } = props;\n\n  const ctx = useDatesContext();\n  const theme = useMantineTheme();\n  const today = dayjs();\n\n  const [_selectedDate, _setSelectedDate] = useUncontrolled<Date | string | null>({\n    value: selectedDate,\n    defaultValue: defaultSelectedDate ?? toDateString(today),\n    onChange: (value) => onSelectedDateChange?.(value ? toDateString(dayjs(value)) : null),\n  });\n\n  const getStyles = useStyles<MobileMonthViewFactory>({\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: 'mobileMonthView',\n  });\n\n  const daysRef: MonthViewControlsRef = useRef<HTMLButtonElement[][]>([]);\n  const firstDayPosition = useRef<{ weekIndex: number; dayIndex: number } | null>(null);\n\n  const expandedEvents = expandRecurringEvents({\n    events,\n    rangeStart: dayjs(date).startOf('month').toDate(),\n    rangeEnd: dayjs(date).endOf('month').toDate(),\n    expansionLimit: recurrenceExpansionLimit,\n  });\n\n  const groupedEvents = getMobileMonthViewEvents({ date, events: expandedEvents });\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('mobileMonthViewWeekday')} key={index}>\n          {day}\n        </div>\n      ))\n    : null;\n\n  const weeks = getMonthDays({\n    month: dayjs(date).format('YYYY-MM-DD'),\n    firstDayOfWeek: ctx.getFirstDayOfWeek(firstDayOfWeek),\n    consistentWeeks,\n  }).map((week, weekIndex) => {\n    const days = week.map((dayDate, dayIndex) => {\n      const outside = !isSameMonth(dayDate, date);\n      const weekend = ctx.getWeekendDays(weekendDays).includes(dayjs(dayDate).day());\n      const ariaLabel = dayjs(dayDate)\n        .locale(locale || ctx.locale)\n        .format('MMMM D, YYYY');\n\n      const dayProps = getDayProps?.(dayjs(dayDate).format('YYYY-MM-DD')) || {};\n      const isToday = dayjs(dayDate).isSame(today, 'day') && highlightToday;\n      const isSelected = _selectedDate && dayjs(dayDate).isSame(dayjs(_selectedDate), 'day');\n      const dayEvents = groupedEvents[dayjs(dayDate).format('YYYY-MM-DD')] || [];\n\n      const shouldRender = withOutsideDays || !outside;\n\n      if (shouldRender && firstDayPosition.current === null) {\n        firstDayPosition.current = { weekIndex, dayIndex };\n      }\n\n      const isFirstDay =\n        firstDayPosition.current?.weekIndex === weekIndex &&\n        firstDayPosition.current?.dayIndex === dayIndex;\n\n      const indicators = dayEvents.slice(0, 3).map((event) => (\n        <div\n          {...getStyles('mobileMonthViewDayIndicator', {\n            style: { backgroundColor: getThemeColor(event.color, theme) },\n          })}\n          key={event.id}\n        />\n      ));\n\n      const handleDayClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        const dateStr = dayjs(dayDate).format('YYYY-MM-DD');\n        _setSelectedDate(dateStr);\n        onDayClick?.(dateStr, event);\n        dayProps.onClick?.(event);\n      };\n\n      const handleDayKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n        handleMonthViewKeyDown({\n          controlsRef: daysRef,\n          weekIndex,\n          dayIndex,\n          event,\n        });\n      };\n\n      return (\n        <UnstyledButton\n          aria-label={ariaLabel}\n          aria-selected={isSelected || undefined}\n          {...dayProps}\n          {...getStyles('mobileMonthViewDay', {\n            className: dayProps.className,\n            style: dayProps.style,\n          })}\n          key={dayDate}\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          mod={[\n            {\n              outside,\n              weekend,\n              today: isToday,\n              selected: isSelected,\n              static: mode === 'static',\n              hidden: !shouldRender,\n            },\n            dayProps.mod,\n          ]}\n          tabIndex={mode === 'static' || !shouldRender ? -1 : isFirstDay ? 0 : -1}\n          onClick={mode === 'static' || !shouldRender ? undefined : handleDayClick}\n          onKeyDown={mode === 'static' || !shouldRender ? undefined : handleDayKeyDown}\n        >\n          {shouldRender ? dayjs(dayDate).format('D') : null}\n          {shouldRender && <div {...getStyles('mobileMonthViewDayIndicators')}>{indicators}</div>}\n        </UnstyledButton>\n      );\n    });\n\n    const weekNumberProps = getWeekNumberProps?.(dayjs(week[0]).format('YYYY-MM-DD')) || {};\n    const weekNumber = getWeekNumber(week);\n\n    return (\n      <div {...getStyles('mobileMonthViewWeek')} 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                    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('mobileMonthViewWeekNumber', {\n              className: weekNumberProps.className,\n              style: weekNumberProps.style,\n            })}\n          >\n            {weekNumber}\n          </UnstyledButton>\n        )}\n        {days}\n      </div>\n    );\n  });\n\n  const selectedDateEvents = _selectedDate\n    ? sortEvents(groupedEvents[dayjs(_selectedDate).format('YYYY-MM-DD')] || [])\n    : [];\n\n  const eventsList = selectedDateEvents.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: _selectedDate! });\n\n    const eventChildren = (\n      <Box {...getStyles('mobileMonthViewEventBody')}>\n        <div\n          {...getStyles('mobileMonthViewEventColor', {\n            style: { backgroundColor: getThemeColor(event.color, theme) },\n          })}\n        />\n        <div>\n          <Text {...getStyles('mobileMonthViewEventTitle')}>{event.title}</Text>\n          <Text {...getStyles('mobileMonthViewEventTime')}>\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('mobileMonthViewEvent'),\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  const eventsHeader = _selectedDate\n    ? formatDate({\n        locale: ctx.getLocale(locale),\n        date: _selectedDate,\n        format: eventsHeaderFormat,\n      })\n    : '';\n\n  const { dir } = useDirection();\n\n  const headerLabel = formatDate({ locale: ctx.getLocale(locale), date, format: 'MMMM YYYY' });\n\n  const defaultHeader = (\n    <>\n      <UnstyledButton\n        {...getStyles('mobileMonthViewHeaderBackButton')}\n        onClick={onYearClick}\n        mod={{ static: mode === 'static' }}\n        tabIndex={mode === 'static' ? -1 : 0}\n      >\n        <AccordionChevron\n          style={{ transform: `rotate(${dir === 'rtl' ? -90 : 90}deg)` }}\n          size={20}\n        />\n        {dayjs(date).format('YYYY')}\n      </UnstyledButton>\n      <Text {...getStyles('mobileMonthViewHeaderLabel')}>{headerLabel}</Text>\n    </>\n  );\n\n  return (\n    <Box\n      {...getStyles('mobileMonthView')}\n      mod={{ 'with-week-numbers': withWeekNumbers }}\n      {...others}\n    >\n      <div {...getStyles('mobileMonthViewHeader')}>\n        {typeof renderHeader === 'function'\n          ? renderHeader({ mode: mode!, date, defaultHeader })\n          : defaultHeader}\n      </div>\n\n      <Box {...getStyles('mobileMonthViewCalendar')} mod={{ 'with-weekdays': withWeekDays }}>\n        {weekdays && (\n          <div {...getStyles('mobileMonthViewWeekdays')}>\n            {withWeekNumbers && <div {...getStyles('mobileMonthViewWeekdaysCorner')} />}\n            {weekdays}\n          </div>\n        )}\n        {weeks}\n      </Box>\n\n      <Box {...getStyles('mobileMonthViewEventsList')}>\n        <Text {...getStyles('mobileMonthViewEventsHeader')}>{eventsHeader}</Text>\n\n        {eventsList.length > 0 ? (\n          eventsList\n        ) : (\n          <Text {...getStyles('mobileMonthViewNoEvents')}>{getLabel('noEvents', labels)}</Text>\n        )}\n      </Box>\n    </Box>\n  );\n});\n\nMobileMonthView.displayName = '@mantine/schedule/MobileMonthView';\nMobileMonthView.classes = classes;\nMobileMonthView.varsResolver = varsResolver;\n\nexport namespace MobileMonthView {\n  export type Props = MobileMonthViewProps;\n  export type Factory = MobileMonthViewFactory;\n  export type StylesNames = MobileMonthViewStylesNames;\n  export type CssVariables = MobileMonthViewCssVariables;\n}\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"ResourcesDayView.module.mjs","names":[],"sources":["../../../src/components/ResourcesDayView/ResourcesDayView.module.css"],"sourcesContent":[".resourcesDayView {\n  --resources-day-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n  --resources-day-view-resource-label-width: 120px;\n  --resources-day-view-slot-width: 80px;\n  --resources-day-view-row-height: 64px;\n  --resources-day-view-group-label-width: 80px;\n  --resources-day-view-all-day-height: 20px;\n\n  @mixin where-light {\n    --resources-day-view-border-color: var(--mantine-color-gray-3);\n    --resources-day-view-business-hours-bg: var(--mantine-color-white);\n    --resources-day-view-non-business-hours-bg: var(--mantine-color-gray-0);\n  }\n\n  @mixin where-dark {\n    --resources-day-view-border-color: var(--mantine-color-dark-4);\n    --resources-day-view-business-hours-bg: var(--mantine-color-dark-7);\n    --resources-day-view-non-business-hours-bg: var(--mantine-color-dark-6);\n  }\n}\n\n.resourcesDayViewRoot {\n  border: 1px solid var(--resources-day-view-border-color);\n  border-radius: var(--resources-day-view-radius);\n  overflow: hidden;\n  max-width: fit-content;\n  position: relative;\n}\n\n.resourcesDayViewScrollArea {\n  :where([data-mantine-scrollbar]) {\n    z-index: 20;\n  }\n\n  :where([data-scrollarea-viewport]) {\n    overscroll-behavior-x: none;\n  }\n}\n\n.resourcesDayViewInner {\n  display: inline-flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.resourcesDayViewTimeLabelsRow {\n  display: flex;\n  position: sticky;\n  top: 0;\n  z-index: 5;\n  background-color: var(--mantine-color-body);\n  border-bottom: 1px solid var(--resources-day-view-border-color);\n  margin-bottom: -1px;\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n}\n\n.resourcesDayViewCorner {\n  flex: 0 0 var(--resources-day-view-resource-label-width);\n  min-width: var(--resources-day-view-resource-label-width);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  position: sticky;\n  left: 0;\n  z-index: 11;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n}\n\n.resourcesDayViewTimeLabel {\n  flex: 0 0 var(--resources-day-view-slot-width);\n  min-width: var(--resources-day-view-slot-width);\n  max-width: var(--resources-day-view-slot-width);\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  user-select: none;\n  cursor: default;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-day-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-day-view-non-business-hours-bg);\n  }\n}\n\n.resourcesDayViewRow {\n  display: flex;\n  border-top: 1px solid var(--resources-day-view-border-color);\n}\n\n.resourcesDayViewResourceLabel {\n  flex: 0 0 var(--resources-day-view-resource-label-width);\n  min-width: var(--resources-day-view-resource-label-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 4px 8px;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 11;\n  background-color: var(--mantine-color-body);\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled-x]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n\n  &:where([data-has-groups]) {\n    left: var(--resources-day-view-group-label-width);\n  }\n}\n\n.resourcesDayViewGroupColumn {\n  flex: 0 0 var(--resources-day-view-group-label-width);\n  min-width: var(--resources-day-view-group-label-width);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  overflow-wrap: break-word;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  overflow: visible;\n\n  &:where([data-group-position='first']),\n  &:where([data-group-position='only']) {\n    z-index: 13;\n  }\n\n  &:where([data-group-position='middle']),\n  &:where([data-group-position='last']) {\n    margin-top: -1px;\n    min-height: calc(var(--resources-day-view-row-height) + 1px);\n  }\n}\n\n.resourcesDayViewGroupColumnEmpty {\n  flex: 0 0 var(--resources-day-view-group-label-width);\n  min-width: var(--resources-day-view-group-label-width);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n}\n\n.resourcesDayViewRowSlots {\n  display: flex;\n  position: relative;\n  min-height: var(--resources-day-view-row-height);\n}\n\n.resourcesDayViewRowSlot {\n  flex: 0 0 var(--resources-day-view-slot-width);\n  min-width: var(--resources-day-view-slot-width);\n  max-width: var(--resources-day-view-slot-width);\n  min-height: var(--resources-day-view-row-height);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  cursor: pointer;\n  position: relative;\n\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n  }\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where(:focus) {\n    z-index: 1;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-day-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-day-view-non-business-hours-bg);\n  }\n\n  &:where([data-drop-target]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-blue-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n      border-radius: 2px;\n\n      @mixin where-light {\n        border-color: var(--mantine-color-blue-4);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-color-blue-6);\n      }\n    }\n  }\n\n  &:where([data-drag-selected]) {\n    &,\n    &:hover {\n      background-color: var(--mantine-primary-color-light);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n\n      @mixin where-light {\n        border-color: var(--mantine-primary-color-2);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-primary-color-9);\n      }\n    }\n  }\n\n  &:where([data-drag-slot-index]) {\n    touch-action: none;\n  }\n\n  &:where([data-static]) {\n    cursor: default;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayViewCurrentTimeIndicator {\n  --_indicator-color: var(--resources-day-view-indicator-color, var(--mantine-color-red-7));\n  --_time-bubble-height: 18px;\n  --_thumb-size: 12px;\n\n  position: absolute;\n  pointer-events: none;\n  top: 37px;\n  bottom: 0;\n  left: var(--indicator-left-offset);\n  width: 2px;\n  z-index: 3;\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background-color: var(--_indicator-color);\n    opacity: 0.2;\n  }\n}\n\n.resourcesDayViewCurrentTimeIndicatorLine {\n  width: 100%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  background-color: var(--_indicator-color);\n}\n\n.resourcesDayViewCurrentTimeIndicatorThumb {\n  position: absolute;\n  top: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n  width: var(--_thumb-size);\n  height: var(--_thumb-size);\n  border-radius: 50%;\n  border: 1px solid var(--mantine-color-body);\n  background-color: var(--_indicator-color);\n  left: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n}\n\n.resourcesDayViewCurrentTimeIndicatorTimeBubble {\n  position: absolute;\n  height: var(--_time-bubble-height);\n  width: var(--_time-bubble-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 1000px;\n  background-color: var(--_indicator-color);\n  color: var(--mantine-color-white);\n  font-size: var(--mantine-font-size-xs);\n  font-weight: var(--mantine-font-weight-bold);\n  box-shadow: var(--mantine-shadow-sm);\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  top: 0;\n  left: calc(-1 * (var(--_time-bubble-width) / 2 - 1px));\n  z-index: 3;\n}\n\n.resourcesDayViewBackgroundEvent {\n  position: absolute;\n  pointer-events: none;\n  z-index: 2;\n  border-radius: var(--resources-day-view-radius);\n  background-color: var(--bg-event-bg);\n  overflow: hidden;\n  font-size: 12px;\n  font-weight: var(--mantine-font-weight-medium);\n  padding: 3px 4px;\n  color: var(--bg-event-color);\n\n  &:where([data-interactive]) {\n    pointer-events: auto;\n    cursor: pointer;\n    user-select: none;\n\n    @mixin hover {\n      background-color: var(--bg-event-hover);\n    }\n  }\n\n  /* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */\n  &:where([data-resizing]) {\n    @mixin hover {\n      background-color: var(--bg-event-bg);\n    }\n  }\n}\n\n.resourcesDayViewAllDayEvent {\n  position: absolute;\n  inset-inline: 1px;\n  height: var(--resources-day-view-all-day-height);\n  z-index: 3;\n}\n\n.resourcesDayViewResizeHandle {\n  position: absolute;\n  top: 20%;\n  width: 4px;\n  height: 60%;\n  cursor: ew-resize;\n  z-index: 5;\n  border-radius: 2px;\n  opacity: 0;\n  transition: opacity 100ms ease;\n  pointer-events: all;\n  background-color: var(--event-color);\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: -4px -6px;\n  }\n\n  &:where([data-edge='start']) {\n    left: -2px;\n  }\n\n  &:where([data-edge='end']) {\n    right: -2px;\n  }\n}\n\n.resourcesDayViewEventWrapper {\n  position: absolute;\n  z-index: 3;\n\n  &:hover .resourcesDayViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesDayViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayView:where([data-event-interaction]) .resourcesDayViewRowSlot {\n  pointer-events: none;\n}\n\n/* The resizing background event is the one that set `data-event-interaction`, so it must\n   keep capturing pointer events. */\n.resourcesDayView:where([data-event-interaction], [data-slot-dragging])\n  .resourcesDayViewBackgroundEvent:not([data-resizing]) {\n  pointer-events: none;\n\n  & .resourcesDayViewResizeHandle {\n    pointer-events: none;\n    opacity: 0;\n  }\n}\n\n.resourcesDayViewBackgroundEvent {\n  & .resourcesDayViewResizeHandle {\n    background-color: var(--bg-event-color);\n\n    &:where([data-edge='start']) {\n      left: 0;\n    }\n\n    &:where([data-edge='end']) {\n      right: 0;\n    }\n  }\n\n  &:hover .resourcesDayViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesDayViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayView:where([data-resizing]) {\n  & * {\n    cursor: ew-resize !important;\n  }\n\n  & .resourcesDayViewEventWrapper:not([data-resizing]) {\n    pointer-events: none;\n\n    & .resourcesDayViewResizeHandle {\n      opacity: 0;\n    }\n  }\n}\n\n.resourcesDayViewDragPreview {\n  pointer-events: none;\n  z-index: 3;\n  border-radius: var(--resources-day-view-radius);\n  border: 1px dashed var(--mantine-color-blue-filled);\n  background-color: var(--mantine-color-blue-light);\n  opacity: 0.6;\n\n  &:where([data-invalid]) {\n    border-color: var(--mantine-color-error);\n    background-color: transparent;\n    opacity: 0.4;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"ResourcesDayView.module.mjs","names":[],"sources":["../../../src/components/ResourcesDayView/ResourcesDayView.module.css"],"sourcesContent":[".resourcesDayView {\n  --resources-day-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n  --resources-day-view-resource-label-width: 120px;\n  --resources-day-view-slot-width: 80px;\n  --resources-day-view-row-height: 64px;\n  --resources-day-view-group-label-width: 80px;\n  --resources-day-view-all-day-height: 20px;\n\n  @mixin where-light {\n    --resources-day-view-border-color: var(--mantine-color-gray-3);\n    --resources-day-view-business-hours-bg: var(--mantine-color-white);\n    --resources-day-view-non-business-hours-bg: var(--mantine-color-gray-0);\n  }\n\n  @mixin where-dark {\n    --resources-day-view-border-color: var(--mantine-color-dark-4);\n    --resources-day-view-business-hours-bg: var(--mantine-color-dark-7);\n    --resources-day-view-non-business-hours-bg: var(--mantine-color-dark-6);\n  }\n}\n\n.resourcesDayViewRoot {\n  border: 1px solid var(--resources-day-view-border-color);\n  border-radius: var(--resources-day-view-radius);\n  overflow: hidden;\n  max-width: fit-content;\n  position: relative;\n}\n\n.resourcesDayViewScrollArea {\n  :where([data-mantine-scrollbar]) {\n    z-index: 20;\n  }\n\n  :where([data-scrollarea-viewport]) {\n    overscroll-behavior-x: none;\n  }\n}\n\n.resourcesDayViewInner {\n  display: inline-flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.resourcesDayViewTimeLabelsRow {\n  display: flex;\n  position: sticky;\n  top: 0;\n  z-index: 14;\n  background-color: var(--mantine-color-body);\n  border-bottom: 1px solid var(--resources-day-view-border-color);\n  margin-bottom: -1px;\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n}\n\n.resourcesDayViewCorner {\n  flex: 0 0 var(--resources-day-view-resource-label-width);\n  min-width: var(--resources-day-view-resource-label-width);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  position: sticky;\n  left: 0;\n  z-index: 11;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n}\n\n.resourcesDayViewTimeLabel {\n  flex: 0 0 var(--resources-day-view-slot-width);\n  min-width: var(--resources-day-view-slot-width);\n  max-width: var(--resources-day-view-slot-width);\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  user-select: none;\n  cursor: default;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-day-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-day-view-non-business-hours-bg);\n  }\n}\n\n.resourcesDayViewRow {\n  display: flex;\n  border-top: 1px solid var(--resources-day-view-border-color);\n}\n\n.resourcesDayViewResourceLabel {\n  flex: 0 0 var(--resources-day-view-resource-label-width);\n  min-width: var(--resources-day-view-resource-label-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 4px 8px;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 11;\n  background-color: var(--mantine-color-body);\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled-x]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n\n  &:where([data-has-groups]) {\n    left: var(--resources-day-view-group-label-width);\n  }\n}\n\n.resourcesDayViewGroupColumn {\n  flex: 0 0 var(--resources-day-view-group-label-width);\n  min-width: var(--resources-day-view-group-label-width);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  overflow-wrap: break-word;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  overflow: visible;\n\n  &:where([data-group-position='first']),\n  &:where([data-group-position='only']) {\n    z-index: 13;\n  }\n\n  &:where([data-group-position='middle']),\n  &:where([data-group-position='last']) {\n    margin-top: -1px;\n    min-height: calc(var(--resources-day-view-row-height) + 1px);\n  }\n}\n\n.resourcesDayViewGroupColumnEmpty {\n  flex: 0 0 var(--resources-day-view-group-label-width);\n  min-width: var(--resources-day-view-group-label-width);\n  min-height: var(--resources-day-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n}\n\n.resourcesDayViewRowSlots {\n  display: flex;\n  position: relative;\n  min-height: var(--resources-day-view-row-height);\n}\n\n.resourcesDayViewRowSlot {\n  flex: 0 0 var(--resources-day-view-slot-width);\n  min-width: var(--resources-day-view-slot-width);\n  max-width: var(--resources-day-view-slot-width);\n  min-height: var(--resources-day-view-row-height);\n  border-inline-end: 1px solid var(--resources-day-view-border-color);\n  cursor: pointer;\n  position: relative;\n\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n  }\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where(:focus) {\n    z-index: 1;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-day-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-day-view-non-business-hours-bg);\n  }\n\n  &:where([data-drop-target]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-blue-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n      border-radius: 2px;\n\n      @mixin where-light {\n        border-color: var(--mantine-color-blue-4);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-color-blue-6);\n      }\n    }\n  }\n\n  &:where([data-drag-selected]) {\n    &,\n    &:hover {\n      background-color: var(--mantine-primary-color-light);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n\n      @mixin where-light {\n        border-color: var(--mantine-primary-color-2);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-primary-color-9);\n      }\n    }\n  }\n\n  &:where([data-drag-slot-index]) {\n    touch-action: none;\n  }\n\n  &:where([data-static]) {\n    cursor: default;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayViewCurrentTimeIndicator {\n  --_indicator-color: var(--resources-day-view-indicator-color, var(--mantine-color-red-7));\n  --_time-bubble-height: 18px;\n  --_thumb-size: 12px;\n\n  position: absolute;\n  pointer-events: none;\n  top: 37px;\n  bottom: 0;\n  left: var(--indicator-left-offset);\n  width: 2px;\n  z-index: 3;\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background-color: var(--_indicator-color);\n    opacity: 0.2;\n  }\n}\n\n.resourcesDayViewCurrentTimeIndicatorLine {\n  width: 100%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  background-color: var(--_indicator-color);\n}\n\n.resourcesDayViewCurrentTimeIndicatorThumb {\n  position: absolute;\n  top: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n  width: var(--_thumb-size);\n  height: var(--_thumb-size);\n  border-radius: 50%;\n  border: 1px solid var(--mantine-color-body);\n  background-color: var(--_indicator-color);\n  left: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n}\n\n.resourcesDayViewCurrentTimeIndicatorTimeBubble {\n  position: absolute;\n  height: var(--_time-bubble-height);\n  width: var(--_time-bubble-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 1000px;\n  background-color: var(--_indicator-color);\n  color: var(--mantine-color-white);\n  font-size: var(--mantine-font-size-xs);\n  font-weight: var(--mantine-font-weight-bold);\n  box-shadow: var(--mantine-shadow-sm);\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  top: 0;\n  left: calc(-1 * (var(--_time-bubble-width) / 2 - 1px));\n  z-index: 3;\n}\n\n.resourcesDayViewBackgroundEvent {\n  position: absolute;\n  pointer-events: none;\n  z-index: 2;\n  border-radius: var(--resources-day-view-radius);\n  background-color: var(--bg-event-bg);\n  overflow: hidden;\n  font-size: 12px;\n  font-weight: var(--mantine-font-weight-medium);\n  padding: 3px 4px;\n  color: var(--bg-event-color);\n\n  &:where([data-interactive]) {\n    pointer-events: auto;\n    cursor: pointer;\n    user-select: none;\n\n    @mixin hover {\n      background-color: var(--bg-event-hover);\n    }\n  }\n\n  /* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */\n  &:where([data-resizing]) {\n    @mixin hover {\n      background-color: var(--bg-event-bg);\n    }\n  }\n}\n\n.resourcesDayViewAllDayEvent {\n  position: absolute;\n  inset-inline: 1px;\n  height: var(--resources-day-view-all-day-height);\n  z-index: 3;\n}\n\n.resourcesDayViewResizeHandle {\n  position: absolute;\n  top: 20%;\n  width: 4px;\n  height: 60%;\n  cursor: ew-resize;\n  z-index: 5;\n  border-radius: 2px;\n  opacity: 0;\n  transition: opacity 100ms ease;\n  pointer-events: all;\n  background-color: var(--event-color);\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: -4px -6px;\n  }\n\n  &:where([data-edge='start']) {\n    left: -2px;\n  }\n\n  &:where([data-edge='end']) {\n    right: -2px;\n  }\n}\n\n.resourcesDayViewEventWrapper {\n  position: absolute;\n  z-index: 3;\n\n  &:hover .resourcesDayViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesDayViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayView:where([data-event-interaction]) .resourcesDayViewRowSlot {\n  pointer-events: none;\n}\n\n/* The resizing background event is the one that set `data-event-interaction`, so it must\n   keep capturing pointer events. */\n.resourcesDayView:where([data-event-interaction], [data-slot-dragging])\n  .resourcesDayViewBackgroundEvent:not([data-resizing]) {\n  pointer-events: none;\n\n  & .resourcesDayViewResizeHandle {\n    pointer-events: none;\n    opacity: 0;\n  }\n}\n\n.resourcesDayViewBackgroundEvent {\n  & .resourcesDayViewResizeHandle {\n    background-color: var(--bg-event-color);\n\n    &:where([data-edge='start']) {\n      left: 0;\n    }\n\n    &:where([data-edge='end']) {\n      right: 0;\n    }\n  }\n\n  &:hover .resourcesDayViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesDayViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesDayViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesDayView:where([data-resizing]) {\n  & * {\n    cursor: ew-resize !important;\n  }\n\n  & .resourcesDayViewEventWrapper:not([data-resizing]) {\n    pointer-events: none;\n\n    & .resourcesDayViewResizeHandle {\n      opacity: 0;\n    }\n  }\n}\n\n.resourcesDayViewDragPreview {\n  pointer-events: none;\n  z-index: 3;\n  border-radius: var(--resources-day-view-radius);\n  border: 1px dashed var(--mantine-color-blue-filled);\n  background-color: var(--mantine-color-blue-light);\n  opacity: 0.6;\n\n  &:where([data-invalid]) {\n    border-color: var(--mantine-color-error);\n    background-color: transparent;\n    opacity: 0.4;\n  }\n}\n"],"mappings":""}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"ResourcesWeekView.module.mjs","names":[],"sources":["../../../src/components/ResourcesWeekView/ResourcesWeekView.module.css"],"sourcesContent":[".resourcesWeekView {\n  --resources-week-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n  --resources-week-view-resource-label-width: 120px;\n  --resources-week-view-slot-width: 60px;\n  --resources-week-view-row-height: 64px;\n  --resources-week-view-group-label-width: 80px;\n  --resources-week-view-all-day-height: 20px;\n\n  @mixin where-light {\n    --resources-week-view-border-color: var(--mantine-color-gray-3);\n    --resources-week-view-business-hours-bg: var(--mantine-color-white);\n    --resources-week-view-non-business-hours-bg: var(--mantine-color-gray-0);\n  }\n\n  @mixin where-dark {\n    --resources-week-view-border-color: var(--mantine-color-dark-4);\n    --resources-week-view-business-hours-bg: var(--mantine-color-dark-7);\n    --resources-week-view-non-business-hours-bg: var(--mantine-color-dark-6);\n  }\n}\n\n.resourcesWeekViewRoot {\n  border: 1px solid var(--resources-week-view-border-color);\n  border-radius: var(--resources-week-view-radius);\n  overflow: hidden;\n  max-width: fit-content;\n  position: relative;\n}\n\n.resourcesWeekViewScrollArea {\n  :where([data-mantine-scrollbar]) {\n    z-index: 20;\n  }\n\n  :where([data-scrollarea-viewport]) {\n    overscroll-behavior-x: none;\n  }\n}\n\n.resourcesWeekViewInner {\n  display: inline-flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.resourcesWeekViewHeaderRows {\n  display: flex;\n  position: sticky;\n  top: 0;\n  z-index: 5;\n  background-color: var(--mantine-color-body);\n  border-bottom: 1px solid var(--resources-week-view-border-color);\n  margin-bottom: -1px;\n}\n\n.resourcesWeekViewCorner {\n  flex: 0 0 var(--resources-week-view-resource-label-width);\n  min-width: var(--resources-week-view-resource-label-width);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  position: sticky;\n  left: 0;\n  z-index: 6;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n}\n\n.resourcesWeekViewHeaderContent {\n  display: flex;\n  flex-direction: column;\n}\n\n.resourcesWeekViewDayLabelsRow {\n  display: flex;\n  border-bottom: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewDayLabel {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  cursor: default;\n  height: 32px;\n  text-transform: capitalize;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-weekend]) {\n    color: var(--mantine-color-red-6);\n  }\n\n  &:where([data-today]) {\n    color: var(--mantine-primary-color-contrast);\n    background-color: var(--mantine-primary-color-filled);\n    font-weight: var(--mantine-font-weight-bold);\n  }\n}\n\n.resourcesWeekViewTimeLabelsRow {\n  display: flex;\n}\n\n.resourcesWeekViewTimeLabel {\n  flex: 0 0 var(--resources-week-view-slot-width);\n  min-width: var(--resources-week-view-slot-width);\n  max-width: var(--resources-week-view-slot-width);\n  height: 28px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-xs);\n  user-select: none;\n  cursor: default;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-week-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-week-view-non-business-hours-bg);\n  }\n}\n\n.resourcesWeekViewRow {\n  display: flex;\n  border-top: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewResourceLabel {\n  flex: 0 0 var(--resources-week-view-resource-label-width);\n  min-width: var(--resources-week-view-resource-label-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 4px 8px;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 4;\n  background-color: var(--mantine-color-body);\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled-x]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n\n  &:where([data-has-groups]) {\n    left: var(--resources-week-view-group-label-width);\n  }\n}\n\n.resourcesWeekViewGroupColumn {\n  flex: 0 0 var(--resources-week-view-group-label-width);\n  min-width: var(--resources-week-view-group-label-width);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  overflow-wrap: break-word;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  overflow: visible;\n\n  &:where([data-group-position='first']),\n  &:where([data-group-position='only']) {\n    z-index: 13;\n  }\n\n  &:where([data-group-position='middle']),\n  &:where([data-group-position='last']) {\n    margin-top: -1px;\n    min-height: calc(var(--resources-week-view-row-height) + 1px);\n  }\n}\n\n.resourcesWeekViewGroupColumnEmpty {\n  flex: 0 0 var(--resources-week-view-group-label-width);\n  min-width: var(--resources-week-view-group-label-width);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewRowSlots {\n  display: flex;\n  position: relative;\n  min-height: var(--resources-week-view-row-height);\n}\n\n.resourcesWeekViewRowSlot {\n  flex: 0 0 var(--resources-week-view-slot-width);\n  min-width: var(--resources-week-view-slot-width);\n  max-width: var(--resources-week-view-slot-width);\n  min-height: var(--resources-week-view-row-height);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  cursor: pointer;\n  position: relative;\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n  }\n\n  &:where(:focus) {\n    z-index: 1;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-week-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-week-view-non-business-hours-bg);\n  }\n\n  &:where([data-drop-target]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-blue-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n      border-radius: 2px;\n\n      @mixin where-light {\n        border-color: var(--mantine-color-blue-4);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-color-blue-6);\n      }\n    }\n  }\n\n  &:where([data-drag-selected]) {\n    &,\n    &:hover {\n      background-color: var(--mantine-primary-color-light);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n\n      @mixin where-light {\n        border-color: var(--mantine-primary-color-2);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-primary-color-9);\n      }\n    }\n  }\n\n  &:where([data-drag-slot-index]) {\n    touch-action: none;\n  }\n\n  &:where([data-static]) {\n    cursor: default;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekViewBackgroundEvent {\n  position: absolute;\n  pointer-events: none;\n  z-index: 2;\n  border-radius: var(--resources-week-view-radius);\n  background-color: var(--bg-event-bg);\n  overflow: hidden;\n  font-size: 12px;\n  font-weight: var(--mantine-font-weight-medium);\n  padding: 3px 4px;\n  color: var(--bg-event-color);\n\n  &:where([data-interactive]) {\n    pointer-events: auto;\n    cursor: pointer;\n    user-select: none;\n\n    @mixin hover {\n      background-color: var(--bg-event-hover);\n    }\n  }\n\n  /* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */\n  &:where([data-resizing]) {\n    @mixin hover {\n      background-color: var(--bg-event-bg);\n    }\n  }\n}\n\n.resourcesWeekViewAllDayEvent {\n  position: absolute;\n  height: var(--resources-week-view-all-day-height);\n  z-index: 2;\n}\n\n.resourcesWeekViewResizeHandle {\n  position: absolute;\n  top: 20%;\n  width: 4px;\n  height: 60%;\n  cursor: ew-resize;\n  z-index: 5;\n  border-radius: 2px;\n  opacity: 0;\n  transition: opacity 100ms ease;\n  pointer-events: all;\n  background-color: var(--event-color);\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: -4px -6px;\n  }\n\n  &:where([data-edge='start']) {\n    left: -2px;\n  }\n\n  &:where([data-edge='end']) {\n    right: -2px;\n  }\n}\n\n.resourcesWeekViewEventWrapper {\n  position: absolute;\n  z-index: 3;\n\n  &:hover .resourcesWeekViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesWeekViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekView:where([data-event-interaction]) .resourcesWeekViewRowSlot {\n  pointer-events: none;\n}\n\n/* The resizing background event is the one that set `data-event-interaction`, so it must\n   keep capturing pointer events. */\n.resourcesWeekView:where([data-event-interaction], [data-slot-dragging])\n  .resourcesWeekViewBackgroundEvent:not([data-resizing]) {\n  pointer-events: none;\n\n  & .resourcesWeekViewResizeHandle {\n    pointer-events: none;\n    opacity: 0;\n  }\n}\n\n.resourcesWeekViewBackgroundEvent {\n  & .resourcesWeekViewResizeHandle {\n    background-color: var(--bg-event-color);\n\n    &:where([data-edge='start']) {\n      left: 0;\n    }\n\n    &:where([data-edge='end']) {\n      right: 0;\n    }\n  }\n\n  &:hover .resourcesWeekViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesWeekViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekView:where([data-resizing]) {\n  & * {\n    cursor: ew-resize !important;\n  }\n\n  & .resourcesWeekViewEventWrapper:not([data-resizing]) {\n    pointer-events: none;\n\n    & .resourcesWeekViewResizeHandle {\n      opacity: 0;\n    }\n  }\n}\n\n.resourcesWeekViewCurrentTimeIndicator {\n  --_indicator-color: var(--resources-week-view-indicator-color, var(--mantine-color-red-7));\n  --_time-bubble-height: 18px;\n  --_thumb-size: 12px;\n\n  position: absolute;\n  pointer-events: none;\n  top: 62px;\n  bottom: 0;\n  left: var(--indicator-left-offset);\n  width: 2px;\n  z-index: 3;\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background-color: var(--_indicator-color);\n    opacity: 0.2;\n  }\n}\n\n.resourcesWeekViewCurrentTimeIndicatorLine {\n  width: 100%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  background-color: var(--_indicator-color);\n}\n\n.resourcesWeekViewCurrentTimeIndicatorThumb {\n  position: absolute;\n  top: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n  width: var(--_thumb-size);\n  height: var(--_thumb-size);\n  border-radius: 50%;\n  border: 1px solid var(--mantine-color-body);\n  background-color: var(--_indicator-color);\n  left: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n}\n\n.resourcesWeekViewCurrentTimeIndicatorTimeBubble {\n  position: absolute;\n  top: 0;\n  height: var(--_time-bubble-height);\n  width: var(--_time-bubble-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 1000px;\n  background-color: var(--_indicator-color);\n  color: var(--mantine-color-white);\n  font-size: var(--mantine-font-size-xs);\n  font-weight: var(--mantine-font-weight-bold);\n  box-shadow: var(--mantine-shadow-sm);\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  left: calc(-1 * (var(--_time-bubble-width) / 2 - 1px));\n  z-index: 3;\n}\n\n.resourcesWeekViewDragPreview {\n  pointer-events: none;\n  z-index: 3;\n  border-radius: var(--resources-week-view-radius);\n  border: 1px dashed var(--mantine-color-blue-filled);\n  background-color: var(--mantine-color-blue-light);\n  opacity: 0.6;\n\n  &:where([data-invalid]) {\n    border-color: var(--mantine-color-error);\n    background-color: transparent;\n    opacity: 0.4;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"ResourcesWeekView.module.mjs","names":[],"sources":["../../../src/components/ResourcesWeekView/ResourcesWeekView.module.css"],"sourcesContent":[".resourcesWeekView {\n  --resources-week-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n  --resources-week-view-resource-label-width: 120px;\n  --resources-week-view-slot-width: 60px;\n  --resources-week-view-row-height: 64px;\n  --resources-week-view-group-label-width: 80px;\n  --resources-week-view-all-day-height: 20px;\n\n  @mixin where-light {\n    --resources-week-view-border-color: var(--mantine-color-gray-3);\n    --resources-week-view-business-hours-bg: var(--mantine-color-white);\n    --resources-week-view-non-business-hours-bg: var(--mantine-color-gray-0);\n  }\n\n  @mixin where-dark {\n    --resources-week-view-border-color: var(--mantine-color-dark-4);\n    --resources-week-view-business-hours-bg: var(--mantine-color-dark-7);\n    --resources-week-view-non-business-hours-bg: var(--mantine-color-dark-6);\n  }\n}\n\n.resourcesWeekViewRoot {\n  border: 1px solid var(--resources-week-view-border-color);\n  border-radius: var(--resources-week-view-radius);\n  overflow: hidden;\n  max-width: fit-content;\n  position: relative;\n}\n\n.resourcesWeekViewScrollArea {\n  :where([data-mantine-scrollbar]) {\n    z-index: 20;\n  }\n\n  :where([data-scrollarea-viewport]) {\n    overscroll-behavior-x: none;\n  }\n}\n\n.resourcesWeekViewInner {\n  display: inline-flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.resourcesWeekViewHeaderRows {\n  display: flex;\n  position: sticky;\n  top: 0;\n  z-index: 14;\n  background-color: var(--mantine-color-body);\n  border-bottom: 1px solid var(--resources-week-view-border-color);\n  margin-bottom: -1px;\n}\n\n.resourcesWeekViewCorner {\n  flex: 0 0 var(--resources-week-view-resource-label-width);\n  min-width: var(--resources-week-view-resource-label-width);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  position: sticky;\n  left: 0;\n  z-index: 6;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n}\n\n.resourcesWeekViewHeaderContent {\n  display: flex;\n  flex-direction: column;\n}\n\n.resourcesWeekViewDayLabelsRow {\n  display: flex;\n  border-bottom: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewDayLabel {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  cursor: default;\n  height: 32px;\n  text-transform: capitalize;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-weekend]) {\n    color: var(--mantine-color-red-6);\n  }\n\n  &:where([data-today]) {\n    color: var(--mantine-primary-color-contrast);\n    background-color: var(--mantine-primary-color-filled);\n    font-weight: var(--mantine-font-weight-bold);\n  }\n}\n\n.resourcesWeekViewTimeLabelsRow {\n  display: flex;\n}\n\n.resourcesWeekViewTimeLabel {\n  flex: 0 0 var(--resources-week-view-slot-width);\n  min-width: var(--resources-week-view-slot-width);\n  max-width: var(--resources-week-view-slot-width);\n  height: 28px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--mantine-font-size-xs);\n  user-select: none;\n  cursor: default;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-week-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-week-view-non-business-hours-bg);\n  }\n}\n\n.resourcesWeekViewRow {\n  display: flex;\n  border-top: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewResourceLabel {\n  flex: 0 0 var(--resources-week-view-resource-label-width);\n  min-width: var(--resources-week-view-resource-label-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 4px 8px;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 4;\n  background-color: var(--mantine-color-body);\n  transition: box-shadow 100ms ease;\n\n  &:where([data-scrolled-x]) {\n    box-shadow: var(--mantine-shadow-sm);\n  }\n\n  &:where([data-has-groups]) {\n    left: var(--resources-week-view-group-label-width);\n  }\n}\n\n.resourcesWeekViewGroupColumn {\n  flex: 0 0 var(--resources-week-view-group-label-width);\n  min-width: var(--resources-week-view-group-label-width);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  overflow-wrap: break-word;\n  font-size: var(--mantine-font-size-sm);\n  font-weight: var(--mantine-font-weight-medium);\n  user-select: none;\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  overflow: visible;\n\n  &:where([data-group-position='first']),\n  &:where([data-group-position='only']) {\n    z-index: 13;\n  }\n\n  &:where([data-group-position='middle']),\n  &:where([data-group-position='last']) {\n    margin-top: -1px;\n    min-height: calc(var(--resources-week-view-row-height) + 1px);\n  }\n}\n\n.resourcesWeekViewGroupColumnEmpty {\n  flex: 0 0 var(--resources-week-view-group-label-width);\n  min-width: var(--resources-week-view-group-label-width);\n  min-height: var(--resources-week-view-row-height);\n  position: sticky;\n  left: 0;\n  z-index: 12;\n  background-color: var(--mantine-color-body);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n}\n\n.resourcesWeekViewRowSlots {\n  display: flex;\n  position: relative;\n  min-height: var(--resources-week-view-row-height);\n}\n\n.resourcesWeekViewRowSlot {\n  flex: 0 0 var(--resources-week-view-slot-width);\n  min-width: var(--resources-week-view-slot-width);\n  max-width: var(--resources-week-view-slot-width);\n  min-height: var(--resources-week-view-row-height);\n  border-inline-end: 1px solid var(--resources-week-view-border-color);\n  cursor: pointer;\n  position: relative;\n\n  &:where(:last-of-type) {\n    border-inline-end: none;\n  }\n\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n  }\n\n  &:where(:focus) {\n    z-index: 1;\n  }\n\n  &:where([data-business-hours]) {\n    background-color: var(--resources-week-view-business-hours-bg);\n  }\n\n  &:where([data-non-business-hours]) {\n    background-color: var(--resources-week-view-non-business-hours-bg);\n  }\n\n  &:where([data-drop-target]) {\n    @mixin where-light {\n      background-color: var(--mantine-color-blue-1);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-5);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n      border-radius: 2px;\n\n      @mixin where-light {\n        border-color: var(--mantine-color-blue-4);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-color-blue-6);\n      }\n    }\n  }\n\n  &:where([data-drag-selected]) {\n    &,\n    &:hover {\n      background-color: var(--mantine-primary-color-light);\n    }\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      pointer-events: none;\n      z-index: 2;\n      border: 1px solid;\n\n      @mixin where-light {\n        border-color: var(--mantine-primary-color-2);\n      }\n\n      @mixin where-dark {\n        border-color: var(--mantine-primary-color-9);\n      }\n    }\n  }\n\n  &:where([data-drag-slot-index]) {\n    touch-action: none;\n  }\n\n  &:where([data-static]) {\n    cursor: default;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekViewBackgroundEvent {\n  position: absolute;\n  pointer-events: none;\n  z-index: 2;\n  border-radius: var(--resources-week-view-radius);\n  background-color: var(--bg-event-bg);\n  overflow: hidden;\n  font-size: 12px;\n  font-weight: var(--mantine-font-weight-medium);\n  padding: 3px 4px;\n  color: var(--bg-event-color);\n\n  &:where([data-interactive]) {\n    pointer-events: auto;\n    cursor: pointer;\n    user-select: none;\n\n    @mixin hover {\n      background-color: var(--bg-event-hover);\n    }\n  }\n\n  /* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */\n  &:where([data-resizing]) {\n    @mixin hover {\n      background-color: var(--bg-event-bg);\n    }\n  }\n}\n\n.resourcesWeekViewAllDayEvent {\n  position: absolute;\n  height: var(--resources-week-view-all-day-height);\n  z-index: 2;\n}\n\n.resourcesWeekViewResizeHandle {\n  position: absolute;\n  top: 20%;\n  width: 4px;\n  height: 60%;\n  cursor: ew-resize;\n  z-index: 5;\n  border-radius: 2px;\n  opacity: 0;\n  transition: opacity 100ms ease;\n  pointer-events: all;\n  background-color: var(--event-color);\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: -4px -6px;\n  }\n\n  &:where([data-edge='start']) {\n    left: -2px;\n  }\n\n  &:where([data-edge='end']) {\n    right: -2px;\n  }\n}\n\n.resourcesWeekViewEventWrapper {\n  position: absolute;\n  z-index: 3;\n\n  &:hover .resourcesWeekViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesWeekViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekView:where([data-event-interaction]) .resourcesWeekViewRowSlot {\n  pointer-events: none;\n}\n\n/* The resizing background event is the one that set `data-event-interaction`, so it must\n   keep capturing pointer events. */\n.resourcesWeekView:where([data-event-interaction], [data-slot-dragging])\n  .resourcesWeekViewBackgroundEvent:not([data-resizing]) {\n  pointer-events: none;\n\n  & .resourcesWeekViewResizeHandle {\n    pointer-events: none;\n    opacity: 0;\n  }\n}\n\n.resourcesWeekViewBackgroundEvent {\n  & .resourcesWeekViewResizeHandle {\n    background-color: var(--bg-event-color);\n\n    &:where([data-edge='start']) {\n      left: 0;\n    }\n\n    &:where([data-edge='end']) {\n      right: 0;\n    }\n  }\n\n  &:hover .resourcesWeekViewResizeHandle {\n    opacity: 0.5;\n  }\n\n  & .resourcesWeekViewResizeHandle:hover {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:where([data-active]) {\n    opacity: 0.8;\n  }\n\n  &:where([data-resizing]) .resourcesWeekViewResizeHandle:not([data-active]) {\n    opacity: 0;\n    pointer-events: none;\n  }\n}\n\n.resourcesWeekView:where([data-resizing]) {\n  & * {\n    cursor: ew-resize !important;\n  }\n\n  & .resourcesWeekViewEventWrapper:not([data-resizing]) {\n    pointer-events: none;\n\n    & .resourcesWeekViewResizeHandle {\n      opacity: 0;\n    }\n  }\n}\n\n.resourcesWeekViewCurrentTimeIndicator {\n  --_indicator-color: var(--resources-week-view-indicator-color, var(--mantine-color-red-7));\n  --_time-bubble-height: 18px;\n  --_thumb-size: 12px;\n\n  position: absolute;\n  pointer-events: none;\n  top: 62px;\n  bottom: 0;\n  left: var(--indicator-left-offset);\n  width: 2px;\n  z-index: 3;\n\n  &::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background-color: var(--_indicator-color);\n    opacity: 0.2;\n  }\n}\n\n.resourcesWeekViewCurrentTimeIndicatorLine {\n  width: 100%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  background-color: var(--_indicator-color);\n}\n\n.resourcesWeekViewCurrentTimeIndicatorThumb {\n  position: absolute;\n  top: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n  width: var(--_thumb-size);\n  height: var(--_thumb-size);\n  border-radius: 50%;\n  border: 1px solid var(--mantine-color-body);\n  background-color: var(--_indicator-color);\n  left: calc(-1 * (var(--_thumb-size) / 2 - 1px));\n}\n\n.resourcesWeekViewCurrentTimeIndicatorTimeBubble {\n  position: absolute;\n  top: 0;\n  height: var(--_time-bubble-height);\n  width: var(--_time-bubble-width);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 1000px;\n  background-color: var(--_indicator-color);\n  color: var(--mantine-color-white);\n  font-size: var(--mantine-font-size-xs);\n  font-weight: var(--mantine-font-weight-bold);\n  box-shadow: var(--mantine-shadow-sm);\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n  text-transform: uppercase;\n  left: calc(-1 * (var(--_time-bubble-width) / 2 - 1px));\n  z-index: 3;\n}\n\n.resourcesWeekViewDragPreview {\n  pointer-events: none;\n  z-index: 3;\n  border-radius: var(--resources-week-view-radius);\n  border: 1px dashed var(--mantine-color-blue-filled);\n  background-color: var(--mantine-color-blue-light);\n  opacity: 0.6;\n\n  &:where([data-invalid]) {\n    border-color: var(--mantine-color-error);\n    background-color: transparent;\n    opacity: 0.4;\n  }\n}\n"],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine/schedule",
-  "version": "9.7.1",
+  "version": "9.7.2",
   "description": "Schedule Mantine component",
   "homepage": "https://mantine.dev/",
   "license": "MIT",
@@ -35,9 +35,9 @@
     "directory": "packages/@mantine/schedule"
   },
   "peerDependencies": {
-    "@mantine/core": "9.7.1",
-    "@mantine/dates": "9.7.1",
-    "@mantine/hooks": "9.7.1",
+    "@mantine/core": "9.7.2",
+    "@mantine/dates": "9.7.2",
+    "@mantine/hooks": "9.7.2",
     "react": "^19.2.0",
     "react-dom": "^19.2.0"
   },

package/styles.css

@@ -2638,7 +2638,7 @@
   display: flex;
   position: sticky;
   top: 0;
-  z-index: 5;
+  z-index: 14;
   background-color: var(--mantine-color-body);
   border-bottom: 1px solid var(--resources-day-view-border-color);
   margin-bottom: calc(-0.0625rem * var(--mantine-scale));
@@ -3163,7 +3163,7 @@
   display: flex;
   position: sticky;
   top: 0;
-  z-index: 5;
+  z-index: 14;
   background-color: var(--mantine-color-body);
   border-bottom: 1px solid var(--resources-week-view-border-color);
   margin-bottom: calc(-0.0625rem * var(--mantine-scale));
@@ -3716,7 +3716,7 @@
   display: flex;
   position: sticky;
   top: 0;
-  z-index: 5;
+  z-index: 14;
   background-color: var(--mantine-color-body);
   border-bottom: 1px solid var(--resources-month-view-border-color);
   margin-bottom: calc(-0.0625rem * var(--mantine-scale));

package/styles.layer.css

@@ -2638,7 +2638,7 @@
   display: flex;
   position: sticky;
   top: 0;
-  z-index: 5;
+  z-index: 14;
   background-color: var(--mantine-color-body);
   border-bottom: 1px solid var(--resources-day-view-border-color);
   margin-bottom: calc(-0.0625rem * var(--mantine-scale));
@@ -3163,7 +3163,7 @@
   display: flex;
   position: sticky;
   top: 0;
-  z-index: 5;
+  z-index: 14;
   background-color: var(--mantine-color-body);
   border-bottom: 1px solid var(--resources-week-view-border-color);
   margin-bottom: calc(-0.0625rem * var(--mantine-scale));
@@ -3716,7 +3716,7 @@
   display: flex;
   position: sticky;
   top: 0;
-  z-index: 5;
+  z-index: 14;
   background-color: var(--mantine-color-body);
   border-bottom: 1px solid var(--resources-month-view-border-color);
   margin-bottom: calc(-0.0625rem * var(--mantine-scale));