@mantine/schedule 9.3.2 → 9.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/components/AgendaView/AgendaView.cjs +133 -0
- package/cjs/components/AgendaView/AgendaView.cjs.map +1 -0
- package/cjs/components/AgendaView/AgendaView.module.cjs +19 -0
- package/cjs/components/AgendaView/AgendaView.module.cjs.map +1 -0
- package/cjs/components/AgendaView/get-agenda-view-events.cjs +48 -0
- package/cjs/components/AgendaView/get-agenda-view-events.cjs.map +1 -0
- package/cjs/components/CurrentTimeIndicator/CurrentTimeIndicator.cjs.map +1 -1
- package/cjs/components/DayView/DayView.cjs +127 -106
- package/cjs/components/DayView/DayView.cjs.map +1 -1
- package/cjs/components/DayView/DayView.module.cjs.map +1 -1
- package/cjs/components/DayView/get-day-view-events/get-day-positioned-events.cjs.map +1 -1
- package/cjs/components/DayView/get-day-view-events/get-day-view-events.cjs.map +1 -1
- package/cjs/components/DragContext/DragContext.cjs.map +1 -1
- package/cjs/components/MobileMonthView/MobileMonthView.cjs.map +1 -1
- package/cjs/components/MobileMonthView/get-mobile-month-view-events.cjs.map +1 -1
- package/cjs/components/MonthView/MonthView.cjs +114 -64
- package/cjs/components/MonthView/MonthView.cjs.map +1 -1
- package/cjs/components/MonthView/MonthView.module.cjs.map +1 -1
- package/cjs/components/MonthView/get-month-view-events/add-event-to-day-groups.cjs.map +1 -1
- package/cjs/components/MonthView/get-month-view-events/find-available-row.cjs.map +1 -1
- package/cjs/components/MonthView/get-month-view-events/get-month-positioned-events.cjs.map +1 -1
- package/cjs/components/MonthView/get-month-view-events/get-month-view-events.cjs.map +1 -1
- package/cjs/components/MonthView/get-month-view-events/get-weeks-in-range.cjs.map +1 -1
- package/cjs/components/MonthView/get-renderable-month-event-segments.cjs +17 -15
- package/cjs/components/MonthView/get-renderable-month-event-segments.cjs.map +1 -1
- package/cjs/components/MonthView/get-visible-columns.cjs +54 -0
- package/cjs/components/MonthView/get-visible-columns.cjs.map +1 -0
- package/cjs/components/MonthView/handle-month-view-key-down.cjs.map +1 -1
- package/cjs/components/MoreEvents/MoreEvents.cjs.map +1 -1
- package/cjs/components/ResourcesDayView/ResourcesDayView.cjs +578 -0
- package/cjs/components/ResourcesDayView/ResourcesDayView.cjs.map +1 -0
- package/cjs/components/ResourcesDayView/ResourcesDayView.module.cjs +29 -0
- package/cjs/components/ResourcesDayView/ResourcesDayView.module.cjs.map +1 -0
- package/cjs/components/ResourcesDayView/ResourcesDayViewColumn.cjs +89 -0
- package/cjs/components/ResourcesDayView/ResourcesDayViewColumn.cjs.map +1 -0
- package/cjs/components/ResourcesDayView/get-overlap-clusters/get-overlap-clusters.cjs +26 -0
- package/cjs/components/ResourcesDayView/get-overlap-clusters/get-overlap-clusters.cjs.map +1 -0
- package/cjs/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.cjs +129 -0
- package/cjs/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.cjs.map +1 -0
- package/cjs/components/ResourcesMonthView/ResourcesMonthView.cjs +602 -0
- package/cjs/components/ResourcesMonthView/ResourcesMonthView.cjs.map +1 -0
- package/cjs/components/ResourcesMonthView/ResourcesMonthView.module.cjs +23 -0
- package/cjs/components/ResourcesMonthView/ResourcesMonthView.module.cjs.map +1 -0
- package/cjs/components/ResourcesSchedule/ResourcesSchedule.cjs +105 -0
- package/cjs/components/ResourcesSchedule/ResourcesSchedule.cjs.map +1 -0
- package/cjs/components/ResourcesSchedule/ResourcesSchedule.module.cjs +7 -0
- package/cjs/components/ResourcesSchedule/ResourcesSchedule.module.cjs.map +1 -0
- package/cjs/components/ResourcesWeekView/ResourcesWeekView.cjs +676 -0
- package/cjs/components/ResourcesWeekView/ResourcesWeekView.cjs.map +1 -0
- package/cjs/components/ResourcesWeekView/ResourcesWeekView.module.cjs +33 -0
- package/cjs/components/ResourcesWeekView/ResourcesWeekView.module.cjs.map +1 -0
- package/cjs/components/ResourcesWeekView/ResourcesWeekViewRow.cjs +90 -0
- package/cjs/components/ResourcesWeekView/ResourcesWeekViewRow.cjs.map +1 -0
- package/cjs/components/ResourcesWeekView/get-resources-week-view-events/get-resources-week-view-events.cjs +97 -0
- package/cjs/components/ResourcesWeekView/get-resources-week-view-events/get-resources-week-view-events.cjs.map +1 -0
- package/cjs/components/Schedule/Schedule.cjs +3 -2
- package/cjs/components/Schedule/Schedule.cjs.map +1 -1
- package/cjs/components/ScheduleEvent/ScheduleEvent.cjs +1 -1
- package/cjs/components/ScheduleEvent/ScheduleEvent.cjs.map +1 -1
- package/cjs/components/ScheduleHeader/HeaderControl/HeaderControl.cjs.map +1 -1
- package/cjs/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.cjs.map +1 -1
- package/cjs/components/ScheduleHeader/ScheduleHeader.cjs.map +1 -1
- package/cjs/components/ScheduleHeader/ScheduleHeader.module.cjs +2 -0
- package/cjs/components/ScheduleHeader/ScheduleHeader.module.cjs.map +1 -1
- package/cjs/components/ScheduleHeader/ScheduleHeaderBase.cjs +29 -11
- package/cjs/components/ScheduleHeader/ScheduleHeaderBase.cjs.map +1 -1
- package/cjs/components/ScheduleHeader/ScheduleHeaderContext.cjs.map +1 -1
- package/cjs/components/ScheduleHeader/ViewSelect/ViewSelect.cjs.map +1 -1
- package/cjs/components/WeekView/WeekView.cjs +128 -102
- package/cjs/components/WeekView/WeekView.cjs.map +1 -1
- package/cjs/components/WeekView/WeekView.module.cjs.map +1 -1
- package/cjs/components/WeekView/WeekViewDay.cjs +3 -1
- package/cjs/components/WeekView/WeekViewDay.cjs.map +1 -1
- package/cjs/components/WeekView/get-week-label/get-week-label.cjs.map +1 -1
- package/cjs/components/WeekView/get-week-view-events/calculate-all-day-event-offset.cjs.map +1 -1
- package/cjs/components/WeekView/get-week-view-events/calculate-all-day-event-width.cjs.map +1 -1
- package/cjs/components/WeekView/get-week-view-events/calculate-event-days.cjs.map +1 -1
- package/cjs/components/WeekView/get-week-view-events/find-available-column.cjs.map +1 -1
- package/cjs/components/WeekView/get-week-view-events/get-event-end-date.cjs.map +1 -1
- package/cjs/components/WeekView/get-week-view-events/get-hanging-status.cjs.map +1 -1
- package/cjs/components/WeekView/get-week-view-events/get-week-positioned-events.cjs.map +1 -1
- package/cjs/components/WeekView/handle-week-view-key-down.cjs.map +1 -1
- package/cjs/components/YearView/YearView.cjs.map +1 -1
- package/cjs/components/YearView/YearViewMonth.cjs.map +1 -1
- package/cjs/components/YearView/get-year-view-events/get-year-view-events.cjs.map +1 -1
- package/cjs/components/YearView/handle-year-view-key-down.cjs.map +1 -1
- package/cjs/hooks/use-auto-scroll-on-drag.cjs.map +1 -1
- package/cjs/hooks/use-drag-drop-handlers.cjs.map +1 -1
- package/cjs/hooks/use-drag-state.cjs.map +1 -1
- package/cjs/hooks/use-event-resize.cjs.map +1 -1
- package/cjs/hooks/use-horizontal-event-resize.cjs +161 -0
- package/cjs/hooks/use-horizontal-event-resize.cjs.map +1 -0
- package/cjs/hooks/use-slot-drag-select.cjs.map +1 -1
- package/cjs/index.cjs +20 -0
- package/cjs/labels.cjs +5 -1
- package/cjs/labels.cjs.map +1 -1
- package/cjs/utils/calculate-drop-time/calculate-drop-time.cjs.map +1 -1
- package/cjs/utils/calculate-month-drop-date/calculate-month-drop-date.cjs.map +1 -1
- package/cjs/utils/expand-recurring-events/expand-recurring-events.cjs.map +1 -1
- package/cjs/utils/format-date/format-date.cjs.map +1 -1
- package/cjs/utils/get-current-time-position/get-current-time-position.cjs.map +1 -1
- package/cjs/utils/get-day-position/get-day-position.cjs.map +1 -1
- package/cjs/utils/get-day-relative-percent/get-day-relative-percent.cjs +18 -0
- package/cjs/utils/get-day-relative-percent/get-day-relative-percent.cjs.map +1 -0
- package/cjs/utils/get-end-of-week/get-end-of-week.cjs.map +1 -1
- package/cjs/utils/get-group-to-resource-id-map/get-group-to-resource-id-map.cjs +12 -0
- package/cjs/utils/get-group-to-resource-id-map/get-group-to-resource-id-map.cjs.map +1 -0
- package/cjs/utils/get-index-from-drag-point/get-index-from-drag-point.cjs +27 -0
- package/cjs/utils/get-index-from-drag-point/get-index-from-drag-point.cjs.map +1 -0
- package/cjs/utils/get-month-days/get-month-days.cjs.map +1 -1
- package/cjs/utils/get-month-range/get-month-range.cjs.map +1 -1
- package/cjs/utils/get-months-by-quarter/get-months-by-quarter.cjs.map +1 -1
- package/cjs/utils/get-months-list/get-months-list.cjs.map +1 -1
- package/cjs/utils/get-ordered-resources/get-ordered-resources.cjs +54 -0
- package/cjs/utils/get-ordered-resources/get-ordered-resources.cjs.map +1 -0
- package/cjs/utils/get-start-of-week/get-start-of-week.cjs.map +1 -1
- package/cjs/utils/get-week-days/get-week-days.cjs.map +1 -1
- package/cjs/utils/get-week-number/get-week-number.cjs.map +1 -1
- package/cjs/utils/get-weekdays-names/get-weekdays-names.cjs.map +1 -1
- package/cjs/utils/handle-resources-grid-key-down/handle-resources-grid-key-down.cjs +88 -0
- package/cjs/utils/handle-resources-grid-key-down/handle-resources-grid-key-down.cjs.map +1 -0
- package/cjs/utils/is-after-min-date/is-after-min-date.cjs.map +1 -1
- package/cjs/utils/is-all-day-event/is-all-day-event.cjs.map +1 -1
- package/cjs/utils/is-before-max-date/is-before-max-date.cjs.map +1 -1
- package/cjs/utils/is-event-in-time-range/is-event-in-time-range.cjs.map +1 -1
- package/cjs/utils/is-events-overlap/is-events-overlap.cjs.map +1 -1
- package/cjs/utils/is-in-time-range/is-in-time-range.cjs.map +1 -1
- package/cjs/utils/is-multiday-event/is-multiday-event.cjs.map +1 -1
- package/cjs/utils/is-same-month/is-same-month.cjs.map +1 -1
- package/cjs/utils/is-within-week/is-within-week.cjs.map +1 -1
- package/cjs/utils/next-week/next-week.cjs.map +1 -1
- package/cjs/utils/parse-time-string/parse-time-string.cjs.map +1 -1
- package/cjs/utils/previous-week/previous-week.cjs.map +1 -1
- package/cjs/utils/sort-events/sort-events.cjs.map +1 -1
- package/cjs/utils/to-date-string/to-date-string.cjs.map +1 -1
- package/cjs/utils/to-time-string/to-time-string.cjs.map +1 -1
- package/cjs/utils/validate-event/validate-event.cjs.map +1 -1
- package/esm/components/AgendaView/AgendaView.mjs +130 -0
- package/esm/components/AgendaView/AgendaView.mjs.map +1 -0
- package/esm/components/AgendaView/AgendaView.module.mjs +19 -0
- package/esm/components/AgendaView/AgendaView.module.mjs.map +1 -0
- package/esm/components/AgendaView/get-agenda-view-events.mjs +46 -0
- package/esm/components/AgendaView/get-agenda-view-events.mjs.map +1 -0
- package/esm/components/CurrentTimeIndicator/CurrentTimeIndicator.mjs.map +1 -1
- package/esm/components/DayView/DayView.mjs +128 -107
- package/esm/components/DayView/DayView.mjs.map +1 -1
- package/esm/components/DayView/DayView.module.mjs.map +1 -1
- package/esm/components/DayView/get-day-view-events/get-day-positioned-events.mjs.map +1 -1
- package/esm/components/DayView/get-day-view-events/get-day-view-events.mjs.map +1 -1
- package/esm/components/MobileMonthView/MobileMonthView.mjs.map +1 -1
- package/esm/components/MobileMonthView/get-mobile-month-view-events.mjs.map +1 -1
- package/esm/components/MonthView/MonthView.mjs +115 -65
- package/esm/components/MonthView/MonthView.mjs.map +1 -1
- package/esm/components/MonthView/MonthView.module.mjs.map +1 -1
- package/esm/components/MonthView/get-month-view-events/add-event-to-day-groups.mjs.map +1 -1
- package/esm/components/MonthView/get-month-view-events/find-available-row.mjs.map +1 -1
- package/esm/components/MonthView/get-month-view-events/get-month-positioned-events.mjs.map +1 -1
- package/esm/components/MonthView/get-month-view-events/get-month-view-events.mjs.map +1 -1
- package/esm/components/MonthView/get-renderable-month-event-segments.mjs +17 -15
- package/esm/components/MonthView/get-renderable-month-event-segments.mjs.map +1 -1
- package/esm/components/MonthView/get-visible-columns.mjs +53 -0
- package/esm/components/MonthView/get-visible-columns.mjs.map +1 -0
- package/esm/components/MonthView/handle-month-view-key-down.mjs.map +1 -1
- package/esm/components/MoreEvents/MoreEvents.mjs.map +1 -1
- package/esm/components/ResourcesDayView/ResourcesDayView.mjs +576 -0
- package/esm/components/ResourcesDayView/ResourcesDayView.mjs.map +1 -0
- package/esm/components/ResourcesDayView/ResourcesDayView.module.mjs +29 -0
- package/esm/components/ResourcesDayView/ResourcesDayView.module.mjs.map +1 -0
- package/esm/components/ResourcesDayView/ResourcesDayViewColumn.mjs +89 -0
- package/esm/components/ResourcesDayView/ResourcesDayViewColumn.mjs.map +1 -0
- package/esm/components/ResourcesDayView/get-overlap-clusters/get-overlap-clusters.mjs +26 -0
- package/esm/components/ResourcesDayView/get-overlap-clusters/get-overlap-clusters.mjs.map +1 -0
- package/esm/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.mjs +127 -0
- package/esm/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.mjs.map +1 -0
- package/esm/components/ResourcesMonthView/ResourcesMonthView.mjs +600 -0
- package/esm/components/ResourcesMonthView/ResourcesMonthView.mjs.map +1 -0
- package/esm/components/ResourcesMonthView/ResourcesMonthView.module.mjs +23 -0
- package/esm/components/ResourcesMonthView/ResourcesMonthView.module.mjs.map +1 -0
- package/esm/components/ResourcesSchedule/ResourcesSchedule.mjs +105 -0
- package/esm/components/ResourcesSchedule/ResourcesSchedule.mjs.map +1 -0
- package/esm/components/ResourcesSchedule/ResourcesSchedule.module.mjs +7 -0
- package/esm/components/ResourcesSchedule/ResourcesSchedule.module.mjs.map +1 -0
- package/esm/components/ResourcesWeekView/ResourcesWeekView.mjs +674 -0
- package/esm/components/ResourcesWeekView/ResourcesWeekView.mjs.map +1 -0
- package/esm/components/ResourcesWeekView/ResourcesWeekView.module.mjs +33 -0
- package/esm/components/ResourcesWeekView/ResourcesWeekView.module.mjs.map +1 -0
- package/esm/components/ResourcesWeekView/ResourcesWeekViewRow.mjs +90 -0
- package/esm/components/ResourcesWeekView/ResourcesWeekViewRow.mjs.map +1 -0
- package/esm/components/ResourcesWeekView/get-resources-week-view-events/get-resources-week-view-events.mjs +95 -0
- package/esm/components/ResourcesWeekView/get-resources-week-view-events/get-resources-week-view-events.mjs.map +1 -0
- package/esm/components/Schedule/Schedule.mjs +3 -2
- package/esm/components/Schedule/Schedule.mjs.map +1 -1
- package/esm/components/ScheduleEvent/ScheduleEvent.mjs +1 -1
- package/esm/components/ScheduleEvent/ScheduleEvent.mjs.map +1 -1
- package/esm/components/ScheduleHeader/HeaderControl/HeaderControl.mjs.map +1 -1
- package/esm/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.mjs.map +1 -1
- package/esm/components/ScheduleHeader/ScheduleHeader.module.mjs +2 -0
- package/esm/components/ScheduleHeader/ScheduleHeader.module.mjs.map +1 -1
- package/esm/components/ScheduleHeader/ScheduleHeaderBase.mjs +29 -11
- package/esm/components/ScheduleHeader/ScheduleHeaderBase.mjs.map +1 -1
- package/esm/components/ScheduleHeader/ViewSelect/ViewSelect.mjs.map +1 -1
- package/esm/components/WeekView/WeekView.mjs +128 -102
- package/esm/components/WeekView/WeekView.mjs.map +1 -1
- package/esm/components/WeekView/WeekView.module.mjs.map +1 -1
- package/esm/components/WeekView/WeekViewDay.mjs +3 -1
- package/esm/components/WeekView/WeekViewDay.mjs.map +1 -1
- package/esm/components/WeekView/get-week-label/get-week-label.mjs.map +1 -1
- package/esm/components/WeekView/get-week-view-events/calculate-all-day-event-offset.mjs.map +1 -1
- package/esm/components/WeekView/get-week-view-events/calculate-all-day-event-width.mjs.map +1 -1
- package/esm/components/WeekView/get-week-view-events/calculate-event-days.mjs.map +1 -1
- package/esm/components/WeekView/get-week-view-events/find-available-column.mjs.map +1 -1
- package/esm/components/WeekView/get-week-view-events/get-event-end-date.mjs.map +1 -1
- package/esm/components/WeekView/get-week-view-events/get-week-positioned-events.mjs.map +1 -1
- package/esm/components/WeekView/handle-week-view-key-down.mjs.map +1 -1
- package/esm/components/YearView/YearView.mjs.map +1 -1
- package/esm/components/YearView/YearViewMonth.mjs.map +1 -1
- package/esm/components/YearView/get-year-view-events/get-year-view-events.mjs.map +1 -1
- package/esm/components/YearView/handle-year-view-key-down.mjs.map +1 -1
- package/esm/hooks/use-drag-drop-handlers.mjs.map +1 -1
- package/esm/hooks/use-event-resize.mjs.map +1 -1
- package/esm/hooks/use-horizontal-event-resize.mjs +159 -0
- package/esm/hooks/use-horizontal-event-resize.mjs.map +1 -0
- package/esm/index.mjs +11 -1
- package/esm/labels.mjs +5 -1
- package/esm/labels.mjs.map +1 -1
- package/esm/utils/calculate-drop-time/calculate-drop-time.mjs.map +1 -1
- package/esm/utils/calculate-month-drop-date/calculate-month-drop-date.mjs.map +1 -1
- package/esm/utils/expand-recurring-events/expand-recurring-events.mjs.map +1 -1
- package/esm/utils/format-date/format-date.mjs.map +1 -1
- package/esm/utils/get-current-time-position/get-current-time-position.mjs.map +1 -1
- package/esm/utils/get-day-position/get-day-position.mjs.map +1 -1
- package/esm/utils/get-day-relative-percent/get-day-relative-percent.mjs +18 -0
- package/esm/utils/get-day-relative-percent/get-day-relative-percent.mjs.map +1 -0
- package/esm/utils/get-group-to-resource-id-map/get-group-to-resource-id-map.mjs +12 -0
- package/esm/utils/get-group-to-resource-id-map/get-group-to-resource-id-map.mjs.map +1 -0
- package/esm/utils/get-index-from-drag-point/get-index-from-drag-point.mjs +27 -0
- package/esm/utils/get-index-from-drag-point/get-index-from-drag-point.mjs.map +1 -0
- package/esm/utils/get-month-days/get-month-days.mjs.map +1 -1
- package/esm/utils/get-month-range/get-month-range.mjs.map +1 -1
- package/esm/utils/get-months-by-quarter/get-months-by-quarter.mjs.map +1 -1
- package/esm/utils/get-months-list/get-months-list.mjs.map +1 -1
- package/esm/utils/get-ordered-resources/get-ordered-resources.mjs +54 -0
- package/esm/utils/get-ordered-resources/get-ordered-resources.mjs.map +1 -0
- package/esm/utils/get-week-number/get-week-number.mjs.map +1 -1
- package/esm/utils/get-weekdays-names/get-weekdays-names.mjs.map +1 -1
- package/esm/utils/handle-resources-grid-key-down/handle-resources-grid-key-down.mjs +88 -0
- package/esm/utils/handle-resources-grid-key-down/handle-resources-grid-key-down.mjs.map +1 -0
- package/esm/utils/is-after-min-date/is-after-min-date.mjs.map +1 -1
- package/esm/utils/is-all-day-event/is-all-day-event.mjs.map +1 -1
- package/esm/utils/is-before-max-date/is-before-max-date.mjs.map +1 -1
- package/esm/utils/is-event-in-time-range/is-event-in-time-range.mjs.map +1 -1
- package/esm/utils/is-events-overlap/is-events-overlap.mjs.map +1 -1
- package/esm/utils/is-in-time-range/is-in-time-range.mjs.map +1 -1
- package/esm/utils/is-multiday-event/is-multiday-event.mjs.map +1 -1
- package/esm/utils/is-same-month/is-same-month.mjs.map +1 -1
- package/esm/utils/is-within-week/is-within-week.mjs.map +1 -1
- package/esm/utils/next-week/next-week.mjs.map +1 -1
- package/esm/utils/parse-time-string/parse-time-string.mjs.map +1 -1
- package/esm/utils/previous-week/previous-week.mjs.map +1 -1
- package/esm/utils/sort-events/sort-events.mjs.map +1 -1
- package/esm/utils/to-date-string/to-date-string.mjs.map +1 -1
- package/esm/utils/to-time-string/to-time-string.mjs.map +1 -1
- package/esm/utils/validate-event/validate-event.mjs.map +1 -1
- package/lib/components/AgendaView/AgendaView.d.ts +54 -0
- package/lib/components/AgendaView/get-agenda-view-events.d.ts +9 -0
- package/lib/components/AgendaView/index.d.ts +2 -0
- package/lib/components/DayView/DayView.d.ts +6 -1
- package/lib/components/MonthView/MonthView.d.ts +6 -1
- package/lib/components/MonthView/get-renderable-month-event-segments.d.ts +5 -1
- package/lib/components/MonthView/get-visible-columns.d.ts +19 -0
- package/lib/components/ResourcesDayView/ResourcesDayView.d.ts +148 -0
- package/lib/components/ResourcesDayView/ResourcesDayViewColumn.d.ts +39 -0
- package/lib/components/ResourcesDayView/get-overlap-clusters/get-overlap-clusters.d.ts +2 -0
- package/lib/components/ResourcesDayView/get-resources-day-view-events/get-resources-day-view-events.d.ts +16 -0
- package/lib/components/ResourcesDayView/index.d.ts +9 -0
- package/lib/components/ResourcesMonthView/ResourcesMonthView.d.ts +129 -0
- package/lib/components/ResourcesMonthView/index.d.ts +9 -0
- package/lib/components/ResourcesSchedule/ResourcesSchedule.d.ts +123 -0
- package/lib/components/ResourcesSchedule/index.d.ts +3 -0
- package/lib/components/ResourcesWeekView/ResourcesWeekView.d.ts +117 -0
- package/lib/components/ResourcesWeekView/ResourcesWeekViewRow.d.ts +39 -0
- package/lib/components/ResourcesWeekView/get-resources-week-view-events/get-resources-week-view-events.d.ts +29 -0
- package/lib/components/ResourcesWeekView/index.d.ts +3 -0
- package/lib/components/Schedule/Schedule.d.ts +3 -1
- package/lib/components/ScheduleHeader/ScheduleHeaderBase.d.ts +5 -1
- package/lib/components/WeekView/WeekView.d.ts +6 -1
- package/lib/components/WeekView/WeekViewDay.d.ts +3 -1
- package/lib/hooks/use-horizontal-event-resize.d.ts +39 -0
- package/lib/index.d.mts +5 -0
- package/lib/index.d.ts +5 -0
- package/lib/labels.d.ts +4 -0
- package/lib/types.d.ts +20 -0
- package/lib/utils/get-day-relative-percent/get-day-relative-percent.d.ts +15 -0
- package/lib/utils/get-group-to-resource-id-map/get-group-to-resource-id-map.d.ts +3 -0
- package/lib/utils/get-index-from-drag-point/get-index-from-drag-point.d.ts +6 -0
- package/lib/utils/get-ordered-resources/get-ordered-resources.d.ts +17 -0
- package/lib/utils/handle-resources-grid-key-down/handle-resources-grid-key-down.d.ts +10 -0
- package/lib/utils/index.d.ts +7 -0
- package/package.json +4 -4
- package/styles.css +1362 -9
- package/styles.layer.css +1363 -10
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MonthView.module.mjs","names":[],"sources":["../../../src/components/MonthView/MonthView.module.css"],"sourcesContent":[".monthView {\n --week-numbers-offset: 0rem;\n --month-view-border: 1px solid var(--month-view-border-color);\n --month-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n --day-base-color: var(--mantine-color-text);\n --min-day-width: 84px;\n\n &:where([data-with-week-numbers]) {\n --week-numbers-offset: 42px;\n }\n\n @mixin where-light {\n --month-view-border-color: var(--mantine-color-gray-3);\n }\n\n @mixin where-dark {\n --month-view-border-color: var(--mantine-color-dark-4);\n }\n}\n\n.monthViewWeekdays {\n display: flex;\n}\n\n.monthViewWeek {\n display: flex;\n position: relative;\n min-width: calc(var(--min-day-width) *
|
|
1
|
+
{"version":3,"file":"MonthView.module.mjs","names":[],"sources":["../../../src/components/MonthView/MonthView.module.css"],"sourcesContent":[".monthView {\n --week-numbers-offset: 0rem;\n --month-view-border: 1px solid var(--month-view-border-color);\n --month-view-radius: var(--schedule-radius, var(--mantine-radius-default));\n --day-base-color: var(--mantine-color-text);\n --min-day-width: 84px;\n --month-view-columns: 7;\n\n &:where([data-with-week-numbers]) {\n --week-numbers-offset: 42px;\n }\n\n @mixin where-light {\n --month-view-border-color: var(--mantine-color-gray-3);\n }\n\n @mixin where-dark {\n --month-view-border-color: var(--mantine-color-dark-4);\n }\n}\n\n.monthViewWeekdays {\n display: flex;\n}\n\n.monthViewWeek {\n display: flex;\n position: relative;\n min-width: calc(var(--min-day-width) * var(--month-view-columns) + var(--week-numbers-offset));\n}\n\n.monthViewWeekNumber {\n flex: 0 0 var(--week-numbers-offset);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--mantine-font-size-sm);\n padding: 4px;\n border-block-start: var(--month-view-border);\n border-block-end: none;\n border-inline-start: var(--month-view-border);\n border-inline-end: none;\n font-weight: var(--mantine-font-weight-medium);\n cursor: pointer;\n user-select: none;\n\n :where(.monthViewWeek:first-child) & {\n border-start-start-radius: var(--month-view-radius);\n\n :where([data-with-weekdays] .monthView) & {\n border-start-start-radius: 0;\n }\n }\n\n :where(.monthViewWeek:last-child) & {\n border-block-end: var(--month-view-border);\n border-end-start-radius: var(--month-view-radius);\n }\n\n @mixin hover {\n @mixin where-light {\n background-color: var(--mantine-color-gray-0);\n }\n\n @mixin where-dark {\n background-color: var(--mantine-color-dark-6);\n }\n }\n\n &:where([data-static]) {\n cursor: default;\n pointer-events: none;\n }\n}\n\n.monthViewWeekday {\n flex: 0 0\n calc(100% / var(--month-view-columns) - var(--week-numbers-offset) / var(--month-view-columns));\n min-width: var(--min-day-width);\n height: 36px;\n font-size: var(--mantine-font-size-sm);\n border-block-start: var(--month-view-border);\n border-block-end: none;\n border-inline-start: var(--month-view-border);\n border-inline-end: none;\n font-weight: var(--mantine-font-weight-medium);\n text-align: center;\n text-transform: capitalize;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: default;\n user-select: none;\n\n &:where(:first-child) {\n border-start-start-radius: var(--month-view-radius);\n\n :where([data-with-week-numbers] .monthView) & {\n border-start-start-radius: 0;\n }\n }\n\n &:where(:last-child) {\n border-inline-end: var(--month-view-border);\n border-start-end-radius: var(--month-view-radius);\n }\n}\n\n.monthViewWeekdaysCorner {\n flex: 0 0 var(--week-numbers-offset);\n border-block-start: var(--month-view-border);\n border-inline-start: var(--month-view-border);\n border-start-start-radius: var(--month-view-radius);\n}\n\n.monthViewDay {\n min-width: var(--min-day-width);\n flex: 0 0\n calc(100% / var(--month-view-columns) - var(--week-numbers-offset) / var(--month-view-columns));\n height: calc(52px + var(--month-view-max-events, 2) * 24px);\n padding: 4px;\n font-weight: var(--mantine-font-weight-medium);\n border-block-start: var(--month-view-border);\n border-block-end: none;\n border-inline-start: var(--month-view-border);\n border-inline-end: none;\n color: var(--day-base-color);\n cursor: pointer;\n display: flex;\n align-items: flex-start;\n position: relative;\n\n &:where(:last-child) {\n border-inline-end: var(--month-view-border);\n\n :where(.monthViewWeek:last-child) & {\n border-block-end: var(--month-view-border);\n border-end-end-radius: var(--month-view-radius);\n }\n\n :where(.monthViewWeek:first-child) & {\n border-start-end-radius: var(--month-view-radius);\n\n :where(:not([data-with-weekdays])) .monthView & {\n border-start-end-radius: var(--month-view-radius);\n }\n }\n }\n\n &:where(:first-of-type) {\n :where(.monthViewWeek:first-child) & {\n border-start-start-radius: var(--month-view-radius);\n\n :where([data-with-week-numbers]) .monthView & {\n border-start-start-radius: 0;\n }\n\n :where([data-with-weekdays]) .monthView & {\n border-start-start-radius: 0;\n }\n }\n\n :where(.monthViewWeek:last-child) & {\n border-end-start-radius: var(--month-view-radius);\n }\n\n :where([data-with-week-numbers]) .monthViewWeek:last-child & {\n border-end-start-radius: 0;\n }\n }\n\n :where(.monthViewWeek:last-child) & {\n border-block-end: var(--month-view-border);\n }\n\n &:where([data-weekend]) {\n color: var(--mantine-color-red-6);\n }\n\n &:where([data-outside]) {\n color: alpha(var(--day-base-color), 0.4);\n }\n\n &:where([data-static]) {\n cursor: default;\n pointer-events: none;\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-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: 0px;\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\n.monthView:where([data-event-interaction])\n .monthViewDay:hover:where(\n :not([data-drop-target], [data-drag-selected], [data-weekend], [data-outside])\n ) {\n background-color: transparent;\n}\n\n.monthViewDayLabel {\n width: 26px;\n aspect-ratio: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 100%;\n font-size: var(--mantine-font-size-sm);\n user-select: none;\n\n &:where([data-today]) {\n background-color: var(--mantine-primary-color-filled);\n color: var(--mantine-primary-color-contrast);\n }\n}\n\n.monthViewBackgroundEvent {\n position: absolute;\n pointer-events: none;\n z-index: 2;\n border-radius: var(--month-view-radius);\n background-color: var(--bg-event-bg);\n top: 0;\n bottom: -21px;\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\n.monthViewEvents {\n position: absolute;\n inset-inline: 0;\n inset-inline-start: var(--week-numbers-offset);\n top: 30px;\n bottom: 22px;\n pointer-events: none;\n z-index: 3;\n}\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"add-event-to-day-groups.mjs","names":[],"sources":["../../../../src/components/MonthView/get-month-view-events/add-event-to-day-groups.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport { MonthPositionedEventData } from '../../../types';\n\ninterface AddEventToDayGroupsInput {\n positionedEvent: MonthPositionedEventData;\n eventStart: dayjs.Dayjs;\n eventEnd: dayjs.Dayjs;\n groupedByDay: { [date: string]: MonthPositionedEventData[] };\n eventsAddedToDay: Set<string>;\n weekIdx: number;\n}\n\nexport function addEventToDayGroups({\n positionedEvent,\n eventStart,\n eventEnd,\n groupedByDay,\n eventsAddedToDay,\n weekIdx,\n}: AddEventToDayGroupsInput): void {\n if (weekIdx === 0 || !eventsAddedToDay.has(positionedEvent.id.toString())) {\n let dayDate = eventStart;\n while (dayDate.isBefore(eventEnd) || dayDate.isSame(eventEnd, 'day')) {\n const dayDateStr = dayDate.format('YYYY-MM-DD 00:00:00');\n if (groupedByDay[dayDateStr]) {\n groupedByDay[dayDateStr].push(positionedEvent);\n }\n dayDate = dayDate.add(1, 'day');\n }\n eventsAddedToDay.add(positionedEvent.id.toString());\n }\n}\n"],"mappings":";;AAYA,SAAgB,oBAAoB,EAClC,iBACA,YACA,UACA,cACA,kBACA,WACiC;CACjC,IAAI,YAAY,KAAK,CAAC,iBAAiB,IAAI,gBAAgB,GAAG,SAAS,CAAC,GAAG;EACzE,IAAI,UAAU;EACd,OAAO,QAAQ,SAAS,QAAQ,KAAK,QAAQ,OAAO,UAAU,KAAK,GAAG;GACpE,MAAM,aAAa,QAAQ,OAAO,qBAAqB;GACvD,IAAI,aAAa,aACf,aAAa,
|
|
1
|
+
{"version":3,"file":"add-event-to-day-groups.mjs","names":[],"sources":["../../../../src/components/MonthView/get-month-view-events/add-event-to-day-groups.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport { MonthPositionedEventData } from '../../../types';\n\ninterface AddEventToDayGroupsInput {\n positionedEvent: MonthPositionedEventData;\n eventStart: dayjs.Dayjs;\n eventEnd: dayjs.Dayjs;\n groupedByDay: { [date: string]: MonthPositionedEventData[] };\n eventsAddedToDay: Set<string>;\n weekIdx: number;\n}\n\nexport function addEventToDayGroups({\n positionedEvent,\n eventStart,\n eventEnd,\n groupedByDay,\n eventsAddedToDay,\n weekIdx,\n}: AddEventToDayGroupsInput): void {\n if (weekIdx === 0 || !eventsAddedToDay.has(positionedEvent.id.toString())) {\n let dayDate = eventStart;\n while (dayDate.isBefore(eventEnd) || dayDate.isSame(eventEnd, 'day')) {\n const dayDateStr = dayDate.format('YYYY-MM-DD 00:00:00');\n if (groupedByDay[dayDateStr]) {\n groupedByDay[dayDateStr].push(positionedEvent);\n }\n dayDate = dayDate.add(1, 'day');\n }\n eventsAddedToDay.add(positionedEvent.id.toString());\n }\n}\n"],"mappings":";;AAYA,SAAgB,oBAAoB,EAClC,iBACA,YACA,UACA,cACA,kBACA,WACiC;CACjC,IAAI,YAAY,KAAK,CAAC,iBAAiB,IAAI,gBAAgB,GAAG,SAAS,CAAC,GAAG;EACzE,IAAI,UAAU;EACd,OAAO,QAAQ,SAAS,QAAQ,KAAK,QAAQ,OAAO,UAAU,KAAK,GAAG;GACpE,MAAM,aAAa,QAAQ,OAAO,qBAAqB;GACvD,IAAI,aAAa,aACf,aAAa,WAAW,CAAC,KAAK,eAAe;GAE/C,UAAU,QAAQ,IAAI,GAAG,KAAK;EAChC;EACA,iBAAiB,IAAI,gBAAgB,GAAG,SAAS,CAAC;CACpD;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"find-available-row.mjs","names":[],"sources":["../../../../src/components/MonthView/get-month-view-events/find-available-row.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport { MonthPositionedEventData } from '../../../types';\n\ninterface FindAvailableRowInput {\n existingEvents: MonthPositionedEventData[];\n startDayIndex: number;\n daysSpanned: number;\n weekStart: dayjs.Dayjs;\n}\n\nexport function findAvailableRow({\n existingEvents,\n startDayIndex,\n daysSpanned,\n weekStart,\n}: FindAvailableRowInput): number {\n let row = 0;\n\n for (const existing of existingEvents) {\n const existingStart = dayjs(existing.start).startOf('day');\n const existingDisplayStart =\n existingStart.isBefore(weekStart) || existingStart.isSame(weekStart, 'day')\n ? weekStart\n : existingStart;\n const existingDayIndex = existingDisplayStart.diff(weekStart, 'day');\n const existingWidth = existing.position?.width || 0;\n const existingDaysSpanned = (existingWidth / 100) * 7;\n\n if (\n existingDayIndex + existingDaysSpanned > startDayIndex &&\n existingDayIndex < startDayIndex + daysSpanned\n ) {\n row = Math.max(row, (existing.position?.row || 0) + 1);\n }\n }\n\n return row;\n}\n"],"mappings":";;;AAUA,SAAgB,iBAAiB,EAC/B,gBACA,eACA,aACA,aACgC;CAChC,IAAI,MAAM;CAEV,KAAK,MAAM,YAAY,gBAAgB;EACrC,MAAM,gBAAgB,MAAM,SAAS,KAAK,
|
|
1
|
+
{"version":3,"file":"find-available-row.mjs","names":[],"sources":["../../../../src/components/MonthView/get-month-view-events/find-available-row.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport { MonthPositionedEventData } from '../../../types';\n\ninterface FindAvailableRowInput {\n existingEvents: MonthPositionedEventData[];\n startDayIndex: number;\n daysSpanned: number;\n weekStart: dayjs.Dayjs;\n}\n\nexport function findAvailableRow({\n existingEvents,\n startDayIndex,\n daysSpanned,\n weekStart,\n}: FindAvailableRowInput): number {\n let row = 0;\n\n for (const existing of existingEvents) {\n const existingStart = dayjs(existing.start).startOf('day');\n const existingDisplayStart =\n existingStart.isBefore(weekStart) || existingStart.isSame(weekStart, 'day')\n ? weekStart\n : existingStart;\n const existingDayIndex = existingDisplayStart.diff(weekStart, 'day');\n const existingWidth = existing.position?.width || 0;\n const existingDaysSpanned = (existingWidth / 100) * 7;\n\n if (\n existingDayIndex + existingDaysSpanned > startDayIndex &&\n existingDayIndex < startDayIndex + daysSpanned\n ) {\n row = Math.max(row, (existing.position?.row || 0) + 1);\n }\n }\n\n return row;\n}\n"],"mappings":";;;AAUA,SAAgB,iBAAiB,EAC/B,gBACA,eACA,aACA,aACgC;CAChC,IAAI,MAAM;CAEV,KAAK,MAAM,YAAY,gBAAgB;EACrC,MAAM,gBAAgB,MAAM,SAAS,KAAK,CAAC,CAAC,QAAQ,KAAK;EAKzD,MAAM,oBAHJ,cAAc,SAAS,SAAS,KAAK,cAAc,OAAO,WAAW,KAAK,IACtE,YACA,cAAA,CACwC,KAAK,WAAW,KAAK;EAInE,IACE,oBAJoB,SAAS,UAAU,SAAS,KACL,MAAO,IAGT,iBACzC,mBAAmB,gBAAgB,aAEnC,MAAM,KAAK,IAAI,MAAM,SAAS,UAAU,OAAO,KAAK,CAAC;CAEzD;CAEA,OAAO;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-month-positioned-events.mjs","names":[],"sources":["../../../../src/components/MonthView/get-month-view-events/get-month-positioned-events.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport {\n AnyDateValue,\n DateStringValue,\n DayOfWeek,\n MonthPositionedEventData,\n ScheduleEventData,\n} from '../../../types';\nimport { addEventToDayGroups } from './add-event-to-day-groups';\nimport { calculateEventPositionInWeek } from './calculate-event-position-in-week';\nimport { findAvailableRow } from './find-available-row';\nimport { getWeeksInRange } from './get-weeks-in-range';\n\ninterface GetMonthPositionedEventsInput {\n /** Date (month start) at which events are positioned */\n date: AnyDateValue;\n\n /** List of all events that belong to the given month, extra events must be filtered out before passing to the function */\n events: ScheduleEventData[];\n\n /** First day of the week, 0 - Sunday, 1 - Monday, etc., used to calculate events positions */\n firstDayOfWeek?: DayOfWeek;\n\n /** Range of dates for which events should be displayed (includes outside days if withOutsideDays is true) */\n range?: {\n start: DateStringValue;\n end: DateStringValue;\n };\n}\n\n/** Events grouped by week index and by day */\nexport interface GroupedMonthEvents {\n /** Events grouped by week index (index within month) */\n groupedByWeek: {\n [weekIndex: string]: MonthPositionedEventData[];\n };\n\n /** Events grouped by day (YYYY-MM-DD format) */\n groupedByDay: {\n [date: string]: MonthPositionedEventData[];\n };\n\n /** Background events grouped by week index */\n backgroundByWeek: {\n [weekIndex: string]: MonthPositionedEventData[];\n };\n}\n\nexport function getMonthPositionedEvents({\n date,\n events,\n firstDayOfWeek = 1,\n range,\n}: GetMonthPositionedEventsInput): GroupedMonthEvents {\n const groupedByWeek: GroupedMonthEvents['groupedByWeek'] = {};\n const backgroundByWeek: GroupedMonthEvents['backgroundByWeek'] = {};\n const eventsAddedToDay = new Set<string>();\n\n const rangeStart = range ? dayjs(range.start) : dayjs(date).startOf('month');\n const rangeEnd = range ? dayjs(range.end) : dayjs(date).startOf('month').endOf('month');\n\n const { weeks, groupedByDay } = getWeeksInRange({\n rangeStart,\n rangeEnd,\n firstDayOfWeek,\n });\n\n for (let i = 0; i < weeks.length; i++) {\n groupedByWeek[i.toString()] = [];\n backgroundByWeek[i.toString()] = [];\n }\n\n for (const event of events) {\n const eventStart = dayjs(event.start).startOf('day');\n const rawEnd = dayjs(event.end);\n const endAtMidnight = rawEnd.hour() === 0 && rawEnd.minute() === 0 && rawEnd.second() === 0;\n const eventEnd = endAtMidnight\n ? rawEnd.startOf('day').subtract(1, 'day')\n : rawEnd.startOf('day');\n const isMultiday = eventEnd.isAfter(eventStart);\n\n for (let weekIdx = 0; weekIdx < weeks.length; weekIdx++) {\n const week = weeks[weekIdx];\n const weekStart = dayjs(week[0]).startOf('day');\n const weekEnd = dayjs(week[6]).endOf('day');\n\n if (\n (eventStart.isBefore(weekEnd) || eventStart.isSame(weekEnd, 'day')) &&\n (eventEnd.isAfter(weekStart) || eventEnd.isSame(weekStart, 'day'))\n ) {\n const { startDayIndex, daysSpanned, startOffset, width, hanging } =\n calculateEventPositionInWeek({\n eventStart,\n eventEnd,\n weekStart,\n weekEnd,\n isMultiday,\n });\n\n if (event.display === 'background') {\n backgroundByWeek[weekIdx.toString()].push({\n ...event,\n position: {\n startOffset,\n width,\n weekIndex: weekIdx,\n row: 0,\n hanging,\n },\n });\n continue;\n }\n\n const row = findAvailableRow({\n existingEvents: groupedByWeek[weekIdx.toString()],\n startDayIndex,\n daysSpanned,\n weekStart,\n });\n\n const positionedEvent: MonthPositionedEventData = {\n ...event,\n position: {\n startOffset,\n width,\n weekIndex: weekIdx,\n row,\n hanging,\n },\n };\n\n groupedByWeek[weekIdx.toString()].push(positionedEvent);\n\n addEventToDayGroups({\n positionedEvent,\n eventStart,\n eventEnd,\n groupedByDay,\n eventsAddedToDay,\n weekIdx,\n });\n }\n }\n }\n\n return {\n groupedByWeek,\n groupedByDay,\n backgroundByWeek,\n };\n}\n"],"mappings":";;;;;;;AAgDA,SAAgB,yBAAyB,EACvC,MACA,QACA,iBAAiB,GACjB,SACoD;CACpD,MAAM,gBAAqD,CAAC;CAC5D,MAAM,mBAA2D,CAAC;CAClE,MAAM,mCAAmB,IAAI,IAAY;CAKzC,MAAM,EAAE,OAAO,iBAAiB,gBAAgB;EAC9C,YAJiB,QAAQ,MAAM,MAAM,KAAK,IAAI,MAAM,IAAI,
|
|
1
|
+
{"version":3,"file":"get-month-positioned-events.mjs","names":[],"sources":["../../../../src/components/MonthView/get-month-view-events/get-month-positioned-events.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport {\n AnyDateValue,\n DateStringValue,\n DayOfWeek,\n MonthPositionedEventData,\n ScheduleEventData,\n} from '../../../types';\nimport { addEventToDayGroups } from './add-event-to-day-groups';\nimport { calculateEventPositionInWeek } from './calculate-event-position-in-week';\nimport { findAvailableRow } from './find-available-row';\nimport { getWeeksInRange } from './get-weeks-in-range';\n\ninterface GetMonthPositionedEventsInput {\n /** Date (month start) at which events are positioned */\n date: AnyDateValue;\n\n /** List of all events that belong to the given month, extra events must be filtered out before passing to the function */\n events: ScheduleEventData[];\n\n /** First day of the week, 0 - Sunday, 1 - Monday, etc., used to calculate events positions */\n firstDayOfWeek?: DayOfWeek;\n\n /** Range of dates for which events should be displayed (includes outside days if withOutsideDays is true) */\n range?: {\n start: DateStringValue;\n end: DateStringValue;\n };\n}\n\n/** Events grouped by week index and by day */\nexport interface GroupedMonthEvents {\n /** Events grouped by week index (index within month) */\n groupedByWeek: {\n [weekIndex: string]: MonthPositionedEventData[];\n };\n\n /** Events grouped by day (YYYY-MM-DD format) */\n groupedByDay: {\n [date: string]: MonthPositionedEventData[];\n };\n\n /** Background events grouped by week index */\n backgroundByWeek: {\n [weekIndex: string]: MonthPositionedEventData[];\n };\n}\n\nexport function getMonthPositionedEvents({\n date,\n events,\n firstDayOfWeek = 1,\n range,\n}: GetMonthPositionedEventsInput): GroupedMonthEvents {\n const groupedByWeek: GroupedMonthEvents['groupedByWeek'] = {};\n const backgroundByWeek: GroupedMonthEvents['backgroundByWeek'] = {};\n const eventsAddedToDay = new Set<string>();\n\n const rangeStart = range ? dayjs(range.start) : dayjs(date).startOf('month');\n const rangeEnd = range ? dayjs(range.end) : dayjs(date).startOf('month').endOf('month');\n\n const { weeks, groupedByDay } = getWeeksInRange({\n rangeStart,\n rangeEnd,\n firstDayOfWeek,\n });\n\n for (let i = 0; i < weeks.length; i++) {\n groupedByWeek[i.toString()] = [];\n backgroundByWeek[i.toString()] = [];\n }\n\n for (const event of events) {\n const eventStart = dayjs(event.start).startOf('day');\n const rawEnd = dayjs(event.end);\n const endAtMidnight = rawEnd.hour() === 0 && rawEnd.minute() === 0 && rawEnd.second() === 0;\n const eventEnd = endAtMidnight\n ? rawEnd.startOf('day').subtract(1, 'day')\n : rawEnd.startOf('day');\n const isMultiday = eventEnd.isAfter(eventStart);\n\n for (let weekIdx = 0; weekIdx < weeks.length; weekIdx++) {\n const week = weeks[weekIdx];\n const weekStart = dayjs(week[0]).startOf('day');\n const weekEnd = dayjs(week[6]).endOf('day');\n\n if (\n (eventStart.isBefore(weekEnd) || eventStart.isSame(weekEnd, 'day')) &&\n (eventEnd.isAfter(weekStart) || eventEnd.isSame(weekStart, 'day'))\n ) {\n const { startDayIndex, daysSpanned, startOffset, width, hanging } =\n calculateEventPositionInWeek({\n eventStart,\n eventEnd,\n weekStart,\n weekEnd,\n isMultiday,\n });\n\n if (event.display === 'background') {\n backgroundByWeek[weekIdx.toString()].push({\n ...event,\n position: {\n startOffset,\n width,\n weekIndex: weekIdx,\n row: 0,\n hanging,\n },\n });\n continue;\n }\n\n const row = findAvailableRow({\n existingEvents: groupedByWeek[weekIdx.toString()],\n startDayIndex,\n daysSpanned,\n weekStart,\n });\n\n const positionedEvent: MonthPositionedEventData = {\n ...event,\n position: {\n startOffset,\n width,\n weekIndex: weekIdx,\n row,\n hanging,\n },\n };\n\n groupedByWeek[weekIdx.toString()].push(positionedEvent);\n\n addEventToDayGroups({\n positionedEvent,\n eventStart,\n eventEnd,\n groupedByDay,\n eventsAddedToDay,\n weekIdx,\n });\n }\n }\n }\n\n return {\n groupedByWeek,\n groupedByDay,\n backgroundByWeek,\n };\n}\n"],"mappings":";;;;;;;AAgDA,SAAgB,yBAAyB,EACvC,MACA,QACA,iBAAiB,GACjB,SACoD;CACpD,MAAM,gBAAqD,CAAC;CAC5D,MAAM,mBAA2D,CAAC;CAClE,MAAM,mCAAmB,IAAI,IAAY;CAKzC,MAAM,EAAE,OAAO,iBAAiB,gBAAgB;EAC9C,YAJiB,QAAQ,MAAM,MAAM,KAAK,IAAI,MAAM,IAAI,CAAC,CAAC,QAAQ,OAAO;EAKzE,UAJe,QAAQ,MAAM,MAAM,GAAG,IAAI,MAAM,IAAI,CAAC,CAAC,QAAQ,OAAO,CAAC,CAAC,MAAM,OAAO;EAKpF;CACF,CAAC;CAED,KAAK,IAAI,IAAI,GAAG,IAAI,MAAM,QAAQ,KAAK;EACrC,cAAc,EAAE,SAAS,KAAK,CAAC;EAC/B,iBAAiB,EAAE,SAAS,KAAK,CAAC;CACpC;CAEA,KAAK,MAAM,SAAS,QAAQ;EAC1B,MAAM,aAAa,MAAM,MAAM,KAAK,CAAC,CAAC,QAAQ,KAAK;EACnD,MAAM,SAAS,MAAM,MAAM,GAAG;EAE9B,MAAM,WADgB,OAAO,KAAK,MAAM,KAAK,OAAO,OAAO,MAAM,KAAK,OAAO,OAAO,MAAM,IAEtF,OAAO,QAAQ,KAAK,CAAC,CAAC,SAAS,GAAG,KAAK,IACvC,OAAO,QAAQ,KAAK;EACxB,MAAM,aAAa,SAAS,QAAQ,UAAU;EAE9C,KAAK,IAAI,UAAU,GAAG,UAAU,MAAM,QAAQ,WAAW;GACvD,MAAM,OAAO,MAAM;GACnB,MAAM,YAAY,MAAM,KAAK,EAAE,CAAC,CAAC,QAAQ,KAAK;GAC9C,MAAM,UAAU,MAAM,KAAK,EAAE,CAAC,CAAC,MAAM,KAAK;GAE1C,KACG,WAAW,SAAS,OAAO,KAAK,WAAW,OAAO,SAAS,KAAK,OAChE,SAAS,QAAQ,SAAS,KAAK,SAAS,OAAO,WAAW,KAAK,IAChE;IACA,MAAM,EAAE,eAAe,aAAa,aAAa,OAAO,YACtD,6BAA6B;KAC3B;KACA;KACA;KACA;KACA;IACF,CAAC;IAEH,IAAI,MAAM,YAAY,cAAc;KAClC,iBAAiB,QAAQ,SAAS,EAAE,CAAC,KAAK;MACxC,GAAG;MACH,UAAU;OACR;OACA;OACA,WAAW;OACX,KAAK;OACL;MACF;KACF,CAAC;KACD;IACF;IAEA,MAAM,MAAM,iBAAiB;KAC3B,gBAAgB,cAAc,QAAQ,SAAS;KAC/C;KACA;KACA;IACF,CAAC;IAED,MAAM,kBAA4C;KAChD,GAAG;KACH,UAAU;MACR;MACA;MACA,WAAW;MACX;MACA;KACF;IACF;IAEA,cAAc,QAAQ,SAAS,EAAE,CAAC,KAAK,eAAe;IAEtD,oBAAoB;KAClB;KACA;KACA;KACA;KACA;KACA;IACF,CAAC;GACH;EACF;CACF;CAEA,OAAO;EACL;EACA;EACA;CACF;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-month-view-events.mjs","names":[],"sources":["../../../../src/components/MonthView/get-month-view-events/get-month-view-events.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport { AnyDateValue, DayOfWeek, ScheduleEventData } from '../../../types';\nimport { getMonthRange, validateEvent } from '../../../utils';\nimport { getMonthPositionedEvents, GroupedMonthEvents } from './get-month-positioned-events';\n\ninterface UseMonthViewEventsInput {\n /** Date (month start) at which events are positioned */\n date: AnyDateValue;\n\n /** List of all events that belong to the given month, extra events must be filtered out before passing to the function */\n events: ScheduleEventData[] | undefined;\n\n /** First day of the week, 0 - Sunday, 1 - Monday, etc., used to calculate events positions */\n firstDayOfWeek?: DayOfWeek;\n\n /** If true, events for outside days are included */\n withOutsideDays?: boolean;\n\n /** If true, month will show events for consistent number of weeks (6) */\n consistentWeeks?: boolean;\n}\n\nexport function getMonthViewEvents({\n date,\n events,\n firstDayOfWeek = 1,\n withOutsideDays,\n consistentWeeks,\n}: UseMonthViewEventsInput): GroupedMonthEvents {\n if (events === undefined) {\n return { groupedByDay: {}, groupedByWeek: {}, backgroundByWeek: {} };\n }\n\n const ids = new Set<string | number>();\n const filteredEvents: ScheduleEventData[] = [];\n\n const range = getMonthRange({ month: date, withOutsideDays, consistentWeeks, firstDayOfWeek });\n\n for (const event of events) {\n if (\n dayjs(event.end).isAfter(range.start, 'day') ||\n dayjs(event.start).isBefore(range.end, 'day')\n ) {\n filteredEvents.push(validateEvent(event));\n\n if (!ids.has(event.id)) {\n ids.add(event.id);\n } else {\n throw new Error(`[@mantine/schedule] MonthView: Duplicated event ids found: ${event.id}`);\n }\n }\n }\n\n return getMonthPositionedEvents({\n date,\n events: filteredEvents,\n firstDayOfWeek,\n range,\n });\n}\n"],"mappings":";;;;;;AAsBA,SAAgB,mBAAmB,EACjC,MACA,QACA,iBAAiB,GACjB,iBACA,mBAC8C;CAC9C,IAAI,WAAW,KAAA,GACb,OAAO;EAAE,cAAc,CAAC;EAAG,eAAe,CAAC;EAAG,kBAAkB,CAAC;CAAE;CAGrE,MAAM,sBAAM,IAAI,IAAqB;CACrC,MAAM,iBAAsC,CAAC;CAE7C,MAAM,QAAQ,cAAc;EAAE,OAAO;EAAM;EAAiB;EAAiB;CAAe,CAAC;CAE7F,KAAK,MAAM,SAAS,QAClB,IACE,MAAM,MAAM,GAAG,
|
|
1
|
+
{"version":3,"file":"get-month-view-events.mjs","names":[],"sources":["../../../../src/components/MonthView/get-month-view-events/get-month-view-events.ts"],"sourcesContent":["import dayjs from 'dayjs';\nimport { AnyDateValue, DayOfWeek, ScheduleEventData } from '../../../types';\nimport { getMonthRange, validateEvent } from '../../../utils';\nimport { getMonthPositionedEvents, GroupedMonthEvents } from './get-month-positioned-events';\n\ninterface UseMonthViewEventsInput {\n /** Date (month start) at which events are positioned */\n date: AnyDateValue;\n\n /** List of all events that belong to the given month, extra events must be filtered out before passing to the function */\n events: ScheduleEventData[] | undefined;\n\n /** First day of the week, 0 - Sunday, 1 - Monday, etc., used to calculate events positions */\n firstDayOfWeek?: DayOfWeek;\n\n /** If true, events for outside days are included */\n withOutsideDays?: boolean;\n\n /** If true, month will show events for consistent number of weeks (6) */\n consistentWeeks?: boolean;\n}\n\nexport function getMonthViewEvents({\n date,\n events,\n firstDayOfWeek = 1,\n withOutsideDays,\n consistentWeeks,\n}: UseMonthViewEventsInput): GroupedMonthEvents {\n if (events === undefined) {\n return { groupedByDay: {}, groupedByWeek: {}, backgroundByWeek: {} };\n }\n\n const ids = new Set<string | number>();\n const filteredEvents: ScheduleEventData[] = [];\n\n const range = getMonthRange({ month: date, withOutsideDays, consistentWeeks, firstDayOfWeek });\n\n for (const event of events) {\n if (\n dayjs(event.end).isAfter(range.start, 'day') ||\n dayjs(event.start).isBefore(range.end, 'day')\n ) {\n filteredEvents.push(validateEvent(event));\n\n if (!ids.has(event.id)) {\n ids.add(event.id);\n } else {\n throw new Error(`[@mantine/schedule] MonthView: Duplicated event ids found: ${event.id}`);\n }\n }\n }\n\n return getMonthPositionedEvents({\n date,\n events: filteredEvents,\n firstDayOfWeek,\n range,\n });\n}\n"],"mappings":";;;;;;AAsBA,SAAgB,mBAAmB,EACjC,MACA,QACA,iBAAiB,GACjB,iBACA,mBAC8C;CAC9C,IAAI,WAAW,KAAA,GACb,OAAO;EAAE,cAAc,CAAC;EAAG,eAAe,CAAC;EAAG,kBAAkB,CAAC;CAAE;CAGrE,MAAM,sBAAM,IAAI,IAAqB;CACrC,MAAM,iBAAsC,CAAC;CAE7C,MAAM,QAAQ,cAAc;EAAE,OAAO;EAAM;EAAiB;EAAiB;CAAe,CAAC;CAE7F,KAAK,MAAM,SAAS,QAClB,IACE,MAAM,MAAM,GAAG,CAAC,CAAC,QAAQ,MAAM,OAAO,KAAK,KAC3C,MAAM,MAAM,KAAK,CAAC,CAAC,SAAS,MAAM,KAAK,KAAK,GAC5C;EACA,eAAe,KAAK,cAAc,KAAK,CAAC;EAExC,IAAI,CAAC,IAAI,IAAI,MAAM,EAAE,GACnB,IAAI,IAAI,MAAM,EAAE;OAEhB,MAAM,IAAI,MAAM,8DAA8D,MAAM,IAAI;CAE5F;CAGF,OAAO,yBAAyB;EAC9B;EACA,QAAQ;EACR;EACA;CACF,CAAC;AACH"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
import { getVisibleColumnMap } from "./get-visible-columns.mjs";
|
|
2
3
|
//#region packages/@mantine/schedule/src/components/MonthView/get-renderable-month-event-segments.ts
|
|
3
4
|
const DAYS_IN_WEEK = 7;
|
|
4
5
|
const DAY_WIDTH = 100 / DAYS_IN_WEEK;
|
|
@@ -22,13 +23,15 @@ function getSegmentHanging(originalHanging, touchesStart, touchesEnd) {
|
|
|
22
23
|
if (hangsFromEnd) return "end";
|
|
23
24
|
return "none";
|
|
24
25
|
}
|
|
25
|
-
function getSegmentPosition(event, segment, eventRange) {
|
|
26
|
+
function getSegmentPosition(event, segment, eventRange, visibleColumnMap, columnsCount) {
|
|
26
27
|
const touchesStart = segment.startDayIndex === eventRange.startDayIndex;
|
|
27
28
|
const touchesEnd = segment.endDayIndex === eventRange.endDayIndex;
|
|
29
|
+
const startColumn = visibleColumnMap[segment.startDayIndex];
|
|
30
|
+
const endColumn = visibleColumnMap[segment.endDayIndex];
|
|
28
31
|
return {
|
|
29
32
|
...event.position,
|
|
30
|
-
startOffset:
|
|
31
|
-
width: (
|
|
33
|
+
startOffset: startColumn / columnsCount * 100,
|
|
34
|
+
width: (endColumn - startColumn + 1) / columnsCount * 100,
|
|
32
35
|
row: segment.row,
|
|
33
36
|
hanging: getSegmentHanging(event.position.hanging, touchesStart, touchesEnd)
|
|
34
37
|
};
|
|
@@ -36,7 +39,9 @@ function getSegmentPosition(event, segment, eventRange) {
|
|
|
36
39
|
function getEventKey(event) {
|
|
37
40
|
return event.id;
|
|
38
41
|
}
|
|
39
|
-
function getRenderableMonthEventSegments({ events, groupedByDay, maxEventsPerDay, week }) {
|
|
42
|
+
function getRenderableMonthEventSegments({ events, groupedByDay, maxEventsPerDay, week, hiddenColumns = [], columnsCount = DAYS_IN_WEEK }) {
|
|
43
|
+
const hiddenColumnSet = new Set(hiddenColumns);
|
|
44
|
+
const visibleColumnMap = getVisibleColumnMap(hiddenColumns);
|
|
40
45
|
const eventIndexes = /* @__PURE__ */ new Map();
|
|
41
46
|
const eventRanges = /* @__PURE__ */ new Map();
|
|
42
47
|
const renderRows = /* @__PURE__ */ new Map();
|
|
@@ -48,26 +53,22 @@ function getRenderableMonthEventSegments({ events, groupedByDay, maxEventsPerDay
|
|
|
48
53
|
if (!renderRows.has(event)) renderRows.set(event, /* @__PURE__ */ new Map());
|
|
49
54
|
renderRows.get(event).set(dayIndex, row);
|
|
50
55
|
};
|
|
56
|
+
const lastRow = /* @__PURE__ */ new Map();
|
|
51
57
|
for (let dayIndex = 0; dayIndex < week.length; dayIndex += 1) {
|
|
58
|
+
if (hiddenColumnSet.has(dayIndex)) continue;
|
|
52
59
|
const dayEvents = groupedByDay[week[dayIndex]] || [];
|
|
53
60
|
const dayEventIds = new Set(dayEvents.map((event) => getEventKey(event)));
|
|
54
61
|
const dayWeekEvents = events.filter((event) => {
|
|
55
62
|
const range = eventRanges.get(event);
|
|
56
63
|
return dayEventIds.has(getEventKey(event)) && dayIndex >= range.startDayIndex && dayIndex <= range.endDayIndex;
|
|
57
64
|
});
|
|
58
|
-
|
|
59
|
-
dayWeekEvents.forEach((event) => {
|
|
60
|
-
if (event.position.row < maxEventsPerDay) setRenderRow(event, dayIndex, event.position.row);
|
|
61
|
-
});
|
|
62
|
-
continue;
|
|
63
|
-
}
|
|
65
|
+
const candidates = dayEvents.length > maxEventsPerDay ? dayWeekEvents.filter((event) => event.position.row < maxEventsPerDay) : dayWeekEvents;
|
|
64
66
|
const usedRows = /* @__PURE__ */ new Set();
|
|
65
|
-
[...
|
|
67
|
+
[...candidates].sort((a, b) => {
|
|
66
68
|
const rowDiff = a.position.row - b.position.row;
|
|
67
|
-
|
|
68
|
-
return eventIndexes.get(a) - eventIndexes.get(b);
|
|
69
|
+
return rowDiff !== 0 ? rowDiff : eventIndexes.get(a) - eventIndexes.get(b);
|
|
69
70
|
}).forEach((event) => {
|
|
70
|
-
let row = event.position.row;
|
|
71
|
+
let row = lastRow.get(event) ?? event.position.row;
|
|
71
72
|
if (row >= maxEventsPerDay || usedRows.has(row)) {
|
|
72
73
|
const availableRow = getFirstAvailableRow(usedRows, maxEventsPerDay);
|
|
73
74
|
if (availableRow === null) return;
|
|
@@ -75,6 +76,7 @@ function getRenderableMonthEventSegments({ events, groupedByDay, maxEventsPerDay
|
|
|
75
76
|
}
|
|
76
77
|
usedRows.add(row);
|
|
77
78
|
setRenderRow(event, dayIndex, row);
|
|
79
|
+
lastRow.set(event, row);
|
|
78
80
|
});
|
|
79
81
|
}
|
|
80
82
|
return events.flatMap((event) => {
|
|
@@ -83,7 +85,7 @@ function getRenderableMonthEventSegments({ events, groupedByDay, maxEventsPerDay
|
|
|
83
85
|
const segments = [];
|
|
84
86
|
let currentSegment = null;
|
|
85
87
|
const addSegment = (segment) => {
|
|
86
|
-
const position = getSegmentPosition(event, segment, eventRange);
|
|
88
|
+
const position = getSegmentPosition(event, segment, eventRange, visibleColumnMap, columnsCount);
|
|
87
89
|
segments.push({
|
|
88
90
|
event,
|
|
89
91
|
position,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-renderable-month-event-segments.mjs","names":[],"sources":["../../../src/components/MonthView/get-renderable-month-event-segments.ts"],"sourcesContent":["import { DateStringValue, MonthEventPositionData, MonthPositionedEventData } from '../../types';\n\nconst DAYS_IN_WEEK = 7;\nconst DAY_WIDTH = 100 / DAYS_IN_WEEK;\n\ninterface GetRenderableMonthEventSegmentsInput {\n events: MonthPositionedEventData[];\n groupedByDay: Record<string, MonthPositionedEventData[]>;\n maxEventsPerDay: number;\n week: DateStringValue[];\n}\n\ninterface EventDayRange {\n startDayIndex: number;\n endDayIndex: number;\n}\n\ninterface SegmentRange extends EventDayRange {\n row: number;\n}\n\nexport interface RenderableMonthEventSegment {\n event: MonthPositionedEventData;\n position: MonthEventPositionData;\n clipStart: boolean;\n clipEnd: boolean;\n key: string;\n}\n\nfunction getEventDayRange(event: MonthPositionedEventData): EventDayRange {\n const startDayIndex = Math.max(0, Math.round(event.position.startOffset / DAY_WIDTH));\n const daysSpanned = Math.max(1, Math.round(event.position.width / DAY_WIDTH));\n\n return {\n startDayIndex,\n endDayIndex: Math.min(DAYS_IN_WEEK - 1, startDayIndex + daysSpanned - 1),\n };\n}\n\nfunction getFirstAvailableRow(usedRows: Set<number>, maxEventsPerDay: number): number | null {\n for (let row = 0; row < maxEventsPerDay; row += 1) {\n if (!usedRows.has(row)) {\n return row;\n }\n }\n\n return null;\n}\n\nfunction getSegmentHanging(\n originalHanging: MonthEventPositionData['hanging'],\n touchesStart: boolean,\n touchesEnd: boolean\n): MonthEventPositionData['hanging'] {\n const hangsFromStart =\n touchesStart && (originalHanging === 'start' || originalHanging === 'both');\n const hangsFromEnd = touchesEnd && (originalHanging === 'end' || originalHanging === 'both');\n\n if (hangsFromStart && hangsFromEnd) {\n return 'both';\n }\n\n if (hangsFromStart) {\n return 'start';\n }\n\n if (hangsFromEnd) {\n return 'end';\n }\n\n return 'none';\n}\n\nfunction getSegmentPosition(\n event: MonthPositionedEventData,\n segment: SegmentRange,\n eventRange: EventDayRange\n): MonthEventPositionData {\n const touchesStart = segment.startDayIndex === eventRange.startDayIndex;\n const touchesEnd = segment.endDayIndex === eventRange.endDayIndex;\n\n return {\n ...event.position,\n startOffset: (segment.startDayIndex / DAYS_IN_WEEK) * 100,\n width: ((segment.endDayIndex - segment.startDayIndex + 1) / DAYS_IN_WEEK) * 100,\n row: segment.row,\n hanging: getSegmentHanging(event.position.hanging, touchesStart, touchesEnd),\n };\n}\n\nfunction getEventKey(event: MonthPositionedEventData): string | number {\n return event.id;\n}\n\nexport function getRenderableMonthEventSegments({\n events,\n groupedByDay,\n maxEventsPerDay,\n week,\n}: GetRenderableMonthEventSegmentsInput): RenderableMonthEventSegment[] {\n const eventIndexes = new Map<MonthPositionedEventData, number>();\n const eventRanges = new Map<MonthPositionedEventData, EventDayRange>();\n const renderRows = new Map<MonthPositionedEventData, Map<number, number>>();\n\n events.forEach((event, index) => {\n eventIndexes.set(event, index);\n eventRanges.set(event, getEventDayRange(event));\n });\n\n const setRenderRow = (event: MonthPositionedEventData, dayIndex: number, row: number) => {\n if (!renderRows.has(event)) {\n renderRows.set(event, new Map());\n }\n\n renderRows.get(event)!.set(dayIndex, row);\n };\n\n for (let dayIndex = 0; dayIndex < week.length; dayIndex += 1) {\n const dayEvents = groupedByDay[week[dayIndex]] || [];\n const dayEventIds = new Set(dayEvents.map((event) => getEventKey(event)));\n const dayWeekEvents = events.filter((event) => {\n const range = eventRanges.get(event)!;\n return (\n dayEventIds.has(getEventKey(event)) &&\n dayIndex >= range.startDayIndex &&\n dayIndex <= range.endDayIndex\n );\n });\n\n if (dayEvents.length > maxEventsPerDay) {\n dayWeekEvents.forEach((event) => {\n if (event.position.row < maxEventsPerDay) {\n setRenderRow(event, dayIndex, event.position.row);\n }\n });\n\n continue;\n }\n\n const usedRows = new Set<number>();\n const sortedDayEvents = [...dayWeekEvents].sort((a, b) => {\n const rowDiff = a.position.row - b.position.row;\n\n if (rowDiff !== 0) {\n return rowDiff;\n }\n\n return eventIndexes.get(a)! - eventIndexes.get(b)!;\n });\n\n sortedDayEvents.forEach((event) => {\n let row = event.position.row;\n\n if (row >= maxEventsPerDay || usedRows.has(row)) {\n const availableRow = getFirstAvailableRow(usedRows, maxEventsPerDay);\n\n if (availableRow === null) {\n return;\n }\n\n row = availableRow;\n }\n\n usedRows.add(row);\n setRenderRow(event, dayIndex, row);\n });\n }\n\n return events.flatMap((event) => {\n const eventRange = eventRanges.get(event)!;\n const eventRenderRows = renderRows.get(event);\n const segments: RenderableMonthEventSegment[] = [];\n let currentSegment: SegmentRange | null = null;\n\n const addSegment = (segment: SegmentRange) => {\n const position = getSegmentPosition(event, segment, eventRange);\n\n segments.push({\n event,\n position,\n clipStart: segment.startDayIndex > eventRange.startDayIndex,\n clipEnd: segment.endDayIndex < eventRange.endDayIndex,\n key: `${event.id}-${event.position.weekIndex}-${segment.startDayIndex}-${segment.endDayIndex}-${segment.row}`,\n });\n };\n\n for (\n let dayIndex = eventRange.startDayIndex;\n dayIndex <= eventRange.endDayIndex;\n dayIndex += 1\n ) {\n const row = eventRenderRows?.get(dayIndex);\n\n if (row === undefined) {\n if (currentSegment) {\n addSegment(currentSegment);\n currentSegment = null;\n }\n\n continue;\n }\n\n if (currentSegment && currentSegment.row === row) {\n currentSegment.endDayIndex = dayIndex;\n } else {\n if (currentSegment) {\n addSegment(currentSegment);\n }\n\n currentSegment = {\n startDayIndex: dayIndex,\n endDayIndex: dayIndex,\n row,\n };\n }\n }\n\n if (currentSegment) {\n addSegment(currentSegment);\n }\n\n return segments;\n });\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"get-renderable-month-event-segments.mjs","names":[],"sources":["../../../src/components/MonthView/get-renderable-month-event-segments.ts"],"sourcesContent":["import { DateStringValue, MonthEventPositionData, MonthPositionedEventData } from '../../types';\nimport { getVisibleColumnMap } from './get-visible-columns';\n\nconst DAYS_IN_WEEK = 7;\nconst DAY_WIDTH = 100 / DAYS_IN_WEEK;\n\ninterface GetRenderableMonthEventSegmentsInput {\n events: MonthPositionedEventData[];\n groupedByDay: Record<string, MonthPositionedEventData[]>;\n maxEventsPerDay: number;\n week: DateStringValue[];\n\n /** Week-relative indices (0–6) of hidden columns, e.g. weekend days */\n hiddenColumns?: number[];\n\n /** Number of visible columns, defaults to 7 */\n columnsCount?: number;\n}\n\ninterface EventDayRange {\n startDayIndex: number;\n endDayIndex: number;\n}\n\ninterface SegmentRange extends EventDayRange {\n row: number;\n}\n\nexport interface RenderableMonthEventSegment {\n event: MonthPositionedEventData;\n position: MonthEventPositionData;\n clipStart: boolean;\n clipEnd: boolean;\n key: string;\n}\n\nfunction getEventDayRange(event: MonthPositionedEventData): EventDayRange {\n const startDayIndex = Math.max(0, Math.round(event.position.startOffset / DAY_WIDTH));\n const daysSpanned = Math.max(1, Math.round(event.position.width / DAY_WIDTH));\n\n return {\n startDayIndex,\n endDayIndex: Math.min(DAYS_IN_WEEK - 1, startDayIndex + daysSpanned - 1),\n };\n}\n\nfunction getFirstAvailableRow(usedRows: Set<number>, maxEventsPerDay: number): number | null {\n for (let row = 0; row < maxEventsPerDay; row += 1) {\n if (!usedRows.has(row)) {\n return row;\n }\n }\n\n return null;\n}\n\nfunction getSegmentHanging(\n originalHanging: MonthEventPositionData['hanging'],\n touchesStart: boolean,\n touchesEnd: boolean\n): MonthEventPositionData['hanging'] {\n const hangsFromStart =\n touchesStart && (originalHanging === 'start' || originalHanging === 'both');\n const hangsFromEnd = touchesEnd && (originalHanging === 'end' || originalHanging === 'both');\n\n if (hangsFromStart && hangsFromEnd) {\n return 'both';\n }\n\n if (hangsFromStart) {\n return 'start';\n }\n\n if (hangsFromEnd) {\n return 'end';\n }\n\n return 'none';\n}\n\nfunction getSegmentPosition(\n event: MonthPositionedEventData,\n segment: SegmentRange,\n eventRange: EventDayRange,\n visibleColumnMap: number[],\n columnsCount: number\n): MonthEventPositionData {\n const touchesStart = segment.startDayIndex === eventRange.startDayIndex;\n const touchesEnd = segment.endDayIndex === eventRange.endDayIndex;\n const startColumn = visibleColumnMap[segment.startDayIndex];\n const endColumn = visibleColumnMap[segment.endDayIndex];\n\n return {\n ...event.position,\n startOffset: (startColumn / columnsCount) * 100,\n width: ((endColumn - startColumn + 1) / columnsCount) * 100,\n row: segment.row,\n hanging: getSegmentHanging(event.position.hanging, touchesStart, touchesEnd),\n };\n}\n\nfunction getEventKey(event: MonthPositionedEventData): string | number {\n return event.id;\n}\n\nexport function getRenderableMonthEventSegments({\n events,\n groupedByDay,\n maxEventsPerDay,\n week,\n hiddenColumns = [],\n columnsCount = DAYS_IN_WEEK,\n}: GetRenderableMonthEventSegmentsInput): RenderableMonthEventSegment[] {\n const hiddenColumnSet = new Set(hiddenColumns);\n const visibleColumnMap = getVisibleColumnMap(hiddenColumns);\n const eventIndexes = new Map<MonthPositionedEventData, number>();\n const eventRanges = new Map<MonthPositionedEventData, EventDayRange>();\n const renderRows = new Map<MonthPositionedEventData, Map<number, number>>();\n\n events.forEach((event, index) => {\n eventIndexes.set(event, index);\n eventRanges.set(event, getEventDayRange(event));\n });\n\n const setRenderRow = (event: MonthPositionedEventData, dayIndex: number, row: number) => {\n if (!renderRows.has(event)) {\n renderRows.set(event, new Map());\n }\n\n renderRows.get(event)!.set(dayIndex, row);\n };\n\n // Each event remembers the row it was last placed on, so a multi-day bar reuses that row on every\n // day it covers and stays continuous instead of jumping rows between adjacent days. A different row\n // is only picked when the preferred one is already taken on that day.\n const lastRow = new Map<MonthPositionedEventData, number>();\n\n for (let dayIndex = 0; dayIndex < week.length; dayIndex += 1) {\n if (hiddenColumnSet.has(dayIndex)) {\n continue;\n }\n\n const dayEvents = groupedByDay[week[dayIndex]] || [];\n const dayEventIds = new Set(dayEvents.map((event) => getEventKey(event)));\n const dayWeekEvents = events.filter((event) => {\n const range = eventRanges.get(event)!;\n return (\n dayEventIds.has(getEventKey(event)) &&\n dayIndex >= range.startDayIndex &&\n dayIndex <= range.endDayIndex\n );\n });\n\n // On a truncated day only the events whose stable row fits are shown; the rest collapse into the\n // \"+N more\" indicator. Other days show every event, compacting overflow rows down to fit.\n const candidates =\n dayEvents.length > maxEventsPerDay\n ? dayWeekEvents.filter((event) => event.position.row < maxEventsPerDay)\n : dayWeekEvents;\n\n const usedRows = new Set<number>();\n const sortedDayEvents = [...candidates].sort((a, b) => {\n const rowDiff = a.position.row - b.position.row;\n return rowDiff !== 0 ? rowDiff : eventIndexes.get(a)! - eventIndexes.get(b)!;\n });\n\n sortedDayEvents.forEach((event) => {\n let row = lastRow.get(event) ?? event.position.row;\n\n if (row >= maxEventsPerDay || usedRows.has(row)) {\n const availableRow = getFirstAvailableRow(usedRows, maxEventsPerDay);\n\n if (availableRow === null) {\n return;\n }\n\n row = availableRow;\n }\n\n usedRows.add(row);\n setRenderRow(event, dayIndex, row);\n lastRow.set(event, row);\n });\n }\n\n return events.flatMap((event) => {\n const eventRange = eventRanges.get(event)!;\n const eventRenderRows = renderRows.get(event);\n const segments: RenderableMonthEventSegment[] = [];\n let currentSegment: SegmentRange | null = null;\n\n const addSegment = (segment: SegmentRange) => {\n const position = getSegmentPosition(\n event,\n segment,\n eventRange,\n visibleColumnMap,\n columnsCount\n );\n\n segments.push({\n event,\n position,\n clipStart: segment.startDayIndex > eventRange.startDayIndex,\n clipEnd: segment.endDayIndex < eventRange.endDayIndex,\n key: `${event.id}-${event.position.weekIndex}-${segment.startDayIndex}-${segment.endDayIndex}-${segment.row}`,\n });\n };\n\n for (\n let dayIndex = eventRange.startDayIndex;\n dayIndex <= eventRange.endDayIndex;\n dayIndex += 1\n ) {\n const row = eventRenderRows?.get(dayIndex);\n\n if (row === undefined) {\n if (currentSegment) {\n addSegment(currentSegment);\n currentSegment = null;\n }\n\n continue;\n }\n\n if (currentSegment && currentSegment.row === row) {\n currentSegment.endDayIndex = dayIndex;\n } else {\n if (currentSegment) {\n addSegment(currentSegment);\n }\n\n currentSegment = {\n startDayIndex: dayIndex,\n endDayIndex: dayIndex,\n row,\n };\n }\n }\n\n if (currentSegment) {\n addSegment(currentSegment);\n }\n\n return segments;\n });\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
/**
|
|
3
|
+
* Builds a map from a full week-day index (0–6, relative to the first day of
|
|
4
|
+
* the week) to its visible column index. Hidden columns are mapped to -1.
|
|
5
|
+
*/
|
|
6
|
+
function getVisibleColumnMap(hiddenColumns) {
|
|
7
|
+
const hidden = new Set(hiddenColumns);
|
|
8
|
+
const map = [];
|
|
9
|
+
let column = 0;
|
|
10
|
+
for (let index = 0; index < 7; index += 1) if (hidden.has(index)) map.push(-1);
|
|
11
|
+
else {
|
|
12
|
+
map.push(column);
|
|
13
|
+
column += 1;
|
|
14
|
+
}
|
|
15
|
+
return map;
|
|
16
|
+
}
|
|
17
|
+
/**
|
|
18
|
+
* Clips a span defined by full week-day indices (`startColumn`–`endColumn`,
|
|
19
|
+
* inclusive) to the visible columns, returning one entry per contiguous run of
|
|
20
|
+
* visible columns. Offsets and widths are expressed in percent of the visible
|
|
21
|
+
* grid width.
|
|
22
|
+
*/
|
|
23
|
+
function clipSpanToVisibleColumns(startColumn, endColumn, visibleColumnMap, columnsCount) {
|
|
24
|
+
if (columnsCount <= 0) return [];
|
|
25
|
+
const spans = [];
|
|
26
|
+
let runStart = null;
|
|
27
|
+
let runEnd = null;
|
|
28
|
+
const flush = () => {
|
|
29
|
+
if (runStart !== null && runEnd !== null) {
|
|
30
|
+
spans.push({
|
|
31
|
+
startOffset: runStart / columnsCount * 100,
|
|
32
|
+
width: (runEnd - runStart + 1) / columnsCount * 100
|
|
33
|
+
});
|
|
34
|
+
runStart = null;
|
|
35
|
+
runEnd = null;
|
|
36
|
+
}
|
|
37
|
+
};
|
|
38
|
+
for (let index = startColumn; index <= endColumn; index += 1) {
|
|
39
|
+
const visible = visibleColumnMap[index];
|
|
40
|
+
if (visible === void 0 || visible === -1) {
|
|
41
|
+
flush();
|
|
42
|
+
continue;
|
|
43
|
+
}
|
|
44
|
+
if (runStart === null) runStart = visible;
|
|
45
|
+
runEnd = visible;
|
|
46
|
+
}
|
|
47
|
+
flush();
|
|
48
|
+
return spans;
|
|
49
|
+
}
|
|
50
|
+
//#endregion
|
|
51
|
+
export { clipSpanToVisibleColumns, getVisibleColumnMap };
|
|
52
|
+
|
|
53
|
+
//# sourceMappingURL=get-visible-columns.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"get-visible-columns.mjs","names":[],"sources":["../../../src/components/MonthView/get-visible-columns.ts"],"sourcesContent":["const DAYS_IN_WEEK = 7;\nconst COLUMN_WIDTH = 100 / DAYS_IN_WEEK;\n\n/**\n * Builds a map from a full week-day index (0–6, relative to the first day of\n * the week) to its visible column index. Hidden columns are mapped to -1.\n */\nexport function getVisibleColumnMap(hiddenColumns: number[]): number[] {\n const hidden = new Set(hiddenColumns);\n const map: number[] = [];\n let column = 0;\n\n for (let index = 0; index < DAYS_IN_WEEK; index += 1) {\n if (hidden.has(index)) {\n map.push(-1);\n } else {\n map.push(column);\n column += 1;\n }\n }\n\n return map;\n}\n\nexport interface VisibleColumnSpan {\n startOffset: number;\n width: number;\n}\n\n/**\n * Clips a span defined by full week-day indices (`startColumn`–`endColumn`,\n * inclusive) to the visible columns, returning one entry per contiguous run of\n * visible columns. Offsets and widths are expressed in percent of the visible\n * grid width.\n */\nexport function clipSpanToVisibleColumns(\n startColumn: number,\n endColumn: number,\n visibleColumnMap: number[],\n columnsCount: number\n): VisibleColumnSpan[] {\n if (columnsCount <= 0) {\n return [];\n }\n\n const spans: VisibleColumnSpan[] = [];\n let runStart: number | null = null;\n let runEnd: number | null = null;\n\n const flush = () => {\n if (runStart !== null && runEnd !== null) {\n spans.push({\n startOffset: (runStart / columnsCount) * 100,\n width: ((runEnd - runStart + 1) / columnsCount) * 100,\n });\n runStart = null;\n runEnd = null;\n }\n };\n\n for (let index = startColumn; index <= endColumn; index += 1) {\n const visible = visibleColumnMap[index];\n\n if (visible === undefined || visible === -1) {\n flush();\n continue;\n }\n\n if (runStart === null) {\n runStart = visible;\n }\n\n runEnd = visible;\n }\n\n flush();\n\n return spans;\n}\n\nexport { DAYS_IN_WEEK, COLUMN_WIDTH };\n"],"mappings":";;;;;AAOA,SAAgB,oBAAoB,eAAmC;CACrE,MAAM,SAAS,IAAI,IAAI,aAAa;CACpC,MAAM,MAAgB,CAAC;CACvB,IAAI,SAAS;CAEb,KAAK,IAAI,QAAQ,GAAG,QAAA,GAAsB,SAAS,GACjD,IAAI,OAAO,IAAI,KAAK,GAClB,IAAI,KAAK,EAAE;MACN;EACL,IAAI,KAAK,MAAM;EACf,UAAU;CACZ;CAGF,OAAO;AACT;;;;;;;AAaA,SAAgB,yBACd,aACA,WACA,kBACA,cACqB;CACrB,IAAI,gBAAgB,GAClB,OAAO,CAAC;CAGV,MAAM,QAA6B,CAAC;CACpC,IAAI,WAA0B;CAC9B,IAAI,SAAwB;CAE5B,MAAM,cAAc;EAClB,IAAI,aAAa,QAAQ,WAAW,MAAM;GACxC,MAAM,KAAK;IACT,aAAc,WAAW,eAAgB;IACzC,QAAS,SAAS,WAAW,KAAK,eAAgB;GACpD,CAAC;GACD,WAAW;GACX,SAAS;EACX;CACF;CAEA,KAAK,IAAI,QAAQ,aAAa,SAAS,WAAW,SAAS,GAAG;EAC5D,MAAM,UAAU,iBAAiB;EAEjC,IAAI,YAAY,KAAA,KAAa,YAAY,IAAI;GAC3C,MAAM;GACN;EACF;EAEA,IAAI,aAAa,MACf,WAAW;EAGb,SAAS;CACX;CAEA,MAAM;CAEN,OAAO;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"handle-month-view-key-down.mjs","names":[],"sources":["../../../src/components/MonthView/handle-month-view-key-down.ts"],"sourcesContent":["import { RefObject } from 'react';\n\n/** Reference to a 2D array of day buttons: [weekIndex][dayIndex] */\nexport type MonthViewControlsRef = RefObject<HTMLButtonElement[][]>;\n\ntype Direction = 'up' | 'down' | 'left' | 'right';\n\ninterface DayPosition {\n weekIndex: number;\n dayIndex: number;\n}\n\nfunction getDirection(key: KeyboardEvent['key']): Direction | null {\n switch (key) {\n case 'ArrowDown':\n return 'down';\n case 'ArrowUp':\n return 'up';\n case 'ArrowRight':\n return 'right';\n case 'ArrowLeft':\n return 'left';\n default:\n return null;\n }\n}\n\nfunction getControlsSize(controlsRef: MonthViewControlsRef): number[] | null {\n if (!controlsRef.current) {\n return null;\n }\n return controlsRef.current.map((week) => (week ? week.length : 0));\n}\n\ninterface GetNextPositionInput {\n direction: Direction;\n weekIndex: number;\n dayIndex: number;\n size: number[];\n}\n\nfunction getNextPosition({\n direction,\n weekIndex,\n dayIndex,\n size,\n}: GetNextPositionInput): DayPosition | null {\n const currentWeekSize = size[weekIndex];\n if (!currentWeekSize) {\n return null;\n }\n\n switch (direction) {\n case 'up': {\n if (weekIndex === 0) {\n return null;\n }\n\n const prevWeekSize = size[weekIndex - 1];\n const clampedDayIndex = Math.min(dayIndex, prevWeekSize - 1);\n return {\n weekIndex: weekIndex - 1,\n dayIndex: clampedDayIndex,\n };\n }\n\n case 'down': {\n if (weekIndex === size.length - 1) {\n return null;\n }\n\n const nextWeekSize = size[weekIndex + 1];\n const clampedDayIndex = Math.min(dayIndex, nextWeekSize - 1);\n return {\n weekIndex: weekIndex + 1,\n dayIndex: clampedDayIndex,\n };\n }\n\n case 'left': {\n if (dayIndex === 0) {\n if (weekIndex === 0) {\n return null;\n }\n\n return {\n weekIndex: weekIndex - 1,\n dayIndex: size[weekIndex - 1] - 1,\n };\n }\n\n return {\n weekIndex,\n dayIndex: dayIndex - 1,\n };\n }\n\n case 'right': {\n if (dayIndex === currentWeekSize - 1) {\n if (weekIndex === size.length - 1) {\n return null;\n }\n\n return {\n weekIndex: weekIndex + 1,\n dayIndex: 0,\n };\n }\n\n return {\n weekIndex,\n dayIndex: dayIndex + 1,\n };\n }\n\n default:\n return null;\n }\n}\n\ninterface FocusOnNextControlInput {\n controlsRef: MonthViewControlsRef;\n direction: Direction;\n weekIndex: number;\n dayIndex: number;\n size: number[];\n}\n\nfunction focusOnNextFocusableControl({\n controlsRef,\n direction,\n weekIndex,\n dayIndex,\n size,\n}: FocusOnNextControlInput): void {\n const nextPosition = getNextPosition({\n direction,\n weekIndex,\n dayIndex,\n size,\n });\n\n if (!nextPosition) {\n return;\n }\n\n const controlToFocus = controlsRef.current?.[nextPosition.weekIndex]?.[nextPosition.dayIndex];\n\n if (!controlToFocus) {\n return;\n }\n\n if (\n controlToFocus.disabled ||\n controlToFocus.getAttribute('data-hidden') ||\n controlToFocus.getAttribute('data-day-placeholder')\n ) {\n focusOnNextFocusableControl({\n controlsRef,\n direction,\n weekIndex: nextPosition.weekIndex,\n dayIndex: nextPosition.dayIndex,\n size,\n });\n } else {\n controlToFocus.focus();\n }\n}\n\nexport interface HandleMonthViewKeyDownInput {\n controlsRef: MonthViewControlsRef;\n weekIndex: number;\n dayIndex: number;\n event: React.KeyboardEvent<HTMLButtonElement>;\n}\n\nexport function handleMonthViewKeyDown({\n controlsRef,\n weekIndex,\n dayIndex,\n event,\n}: HandleMonthViewKeyDownInput): void {\n const direction = getDirection(event.key);\n\n if (direction) {\n event.preventDefault();\n\n const size = getControlsSize(controlsRef);\n\n if (!size) {\n return;\n }\n\n focusOnNextFocusableControl({\n controlsRef,\n direction,\n weekIndex,\n dayIndex,\n size,\n });\n }\n}\n"],"mappings":";;AAYA,SAAS,aAAa,KAA6C;CACjE,QAAQ,KAAR;EACE,KAAK,aACH,OAAO;EACT,KAAK,WACH,OAAO;EACT,KAAK,cACH,OAAO;EACT,KAAK,aACH,OAAO;EACT,SACE,OAAO;CACX;AACF;AAEA,SAAS,gBAAgB,aAAoD;CAC3E,IAAI,CAAC,YAAY,SACf,OAAO;CAET,OAAO,YAAY,QAAQ,KAAK,SAAU,OAAO,KAAK,SAAS,CAAE;AACnE;AASA,SAAS,gBAAgB,EACvB,WACA,WACA,UACA,QAC2C;CAC3C,MAAM,kBAAkB,KAAK;CAC7B,IAAI,CAAC,iBACH,OAAO;CAGT,QAAQ,WAAR;EACE,KAAK,MAAM;GACT,IAAI,cAAc,GAChB,OAAO;GAGT,MAAM,eAAe,KAAK,YAAY;GACtC,MAAM,kBAAkB,KAAK,IAAI,UAAU,eAAe,CAAC;GAC3D,OAAO;IACL,WAAW,YAAY;IACvB,UAAU;GACZ;EACF;EAEA,KAAK,QAAQ;GACX,IAAI,cAAc,KAAK,SAAS,GAC9B,OAAO;GAGT,MAAM,eAAe,KAAK,YAAY;GACtC,MAAM,kBAAkB,KAAK,IAAI,UAAU,eAAe,CAAC;GAC3D,OAAO;IACL,WAAW,YAAY;IACvB,UAAU;GACZ;EACF;EAEA,KAAK;GACH,IAAI,aAAa,GAAG;IAClB,IAAI,cAAc,GAChB,OAAO;IAGT,OAAO;KACL,WAAW,YAAY;KACvB,UAAU,KAAK,YAAY,KAAK;IAClC;GACF;GAEA,OAAO;IACL;IACA,UAAU,WAAW;GACvB;EAGF,KAAK;GACH,IAAI,aAAa,kBAAkB,GAAG;IACpC,IAAI,cAAc,KAAK,SAAS,GAC9B,OAAO;IAGT,OAAO;KACL,WAAW,YAAY;KACvB,UAAU;IACZ;GACF;GAEA,OAAO;IACL;IACA,UAAU,WAAW;GACvB;EAGF,SACE,OAAO;CACX;AACF;AAUA,SAAS,4BAA4B,EACnC,aACA,WACA,WACA,UACA,QACgC;CAChC,MAAM,eAAe,gBAAgB;EACnC;EACA;EACA;EACA;CACF,CAAC;CAED,IAAI,CAAC,cACH;CAGF,MAAM,iBAAiB,YAAY,UAAU,aAAa,
|
|
1
|
+
{"version":3,"file":"handle-month-view-key-down.mjs","names":[],"sources":["../../../src/components/MonthView/handle-month-view-key-down.ts"],"sourcesContent":["import { RefObject } from 'react';\n\n/** Reference to a 2D array of day buttons: [weekIndex][dayIndex] */\nexport type MonthViewControlsRef = RefObject<HTMLButtonElement[][]>;\n\ntype Direction = 'up' | 'down' | 'left' | 'right';\n\ninterface DayPosition {\n weekIndex: number;\n dayIndex: number;\n}\n\nfunction getDirection(key: KeyboardEvent['key']): Direction | null {\n switch (key) {\n case 'ArrowDown':\n return 'down';\n case 'ArrowUp':\n return 'up';\n case 'ArrowRight':\n return 'right';\n case 'ArrowLeft':\n return 'left';\n default:\n return null;\n }\n}\n\nfunction getControlsSize(controlsRef: MonthViewControlsRef): number[] | null {\n if (!controlsRef.current) {\n return null;\n }\n return controlsRef.current.map((week) => (week ? week.length : 0));\n}\n\ninterface GetNextPositionInput {\n direction: Direction;\n weekIndex: number;\n dayIndex: number;\n size: number[];\n}\n\nfunction getNextPosition({\n direction,\n weekIndex,\n dayIndex,\n size,\n}: GetNextPositionInput): DayPosition | null {\n const currentWeekSize = size[weekIndex];\n if (!currentWeekSize) {\n return null;\n }\n\n switch (direction) {\n case 'up': {\n if (weekIndex === 0) {\n return null;\n }\n\n const prevWeekSize = size[weekIndex - 1];\n const clampedDayIndex = Math.min(dayIndex, prevWeekSize - 1);\n return {\n weekIndex: weekIndex - 1,\n dayIndex: clampedDayIndex,\n };\n }\n\n case 'down': {\n if (weekIndex === size.length - 1) {\n return null;\n }\n\n const nextWeekSize = size[weekIndex + 1];\n const clampedDayIndex = Math.min(dayIndex, nextWeekSize - 1);\n return {\n weekIndex: weekIndex + 1,\n dayIndex: clampedDayIndex,\n };\n }\n\n case 'left': {\n if (dayIndex === 0) {\n if (weekIndex === 0) {\n return null;\n }\n\n return {\n weekIndex: weekIndex - 1,\n dayIndex: size[weekIndex - 1] - 1,\n };\n }\n\n return {\n weekIndex,\n dayIndex: dayIndex - 1,\n };\n }\n\n case 'right': {\n if (dayIndex === currentWeekSize - 1) {\n if (weekIndex === size.length - 1) {\n return null;\n }\n\n return {\n weekIndex: weekIndex + 1,\n dayIndex: 0,\n };\n }\n\n return {\n weekIndex,\n dayIndex: dayIndex + 1,\n };\n }\n\n default:\n return null;\n }\n}\n\ninterface FocusOnNextControlInput {\n controlsRef: MonthViewControlsRef;\n direction: Direction;\n weekIndex: number;\n dayIndex: number;\n size: number[];\n}\n\nfunction focusOnNextFocusableControl({\n controlsRef,\n direction,\n weekIndex,\n dayIndex,\n size,\n}: FocusOnNextControlInput): void {\n const nextPosition = getNextPosition({\n direction,\n weekIndex,\n dayIndex,\n size,\n });\n\n if (!nextPosition) {\n return;\n }\n\n const controlToFocus = controlsRef.current?.[nextPosition.weekIndex]?.[nextPosition.dayIndex];\n\n if (!controlToFocus) {\n return;\n }\n\n if (\n controlToFocus.disabled ||\n controlToFocus.getAttribute('data-hidden') ||\n controlToFocus.getAttribute('data-day-placeholder')\n ) {\n focusOnNextFocusableControl({\n controlsRef,\n direction,\n weekIndex: nextPosition.weekIndex,\n dayIndex: nextPosition.dayIndex,\n size,\n });\n } else {\n controlToFocus.focus();\n }\n}\n\nexport interface HandleMonthViewKeyDownInput {\n controlsRef: MonthViewControlsRef;\n weekIndex: number;\n dayIndex: number;\n event: React.KeyboardEvent<HTMLButtonElement>;\n}\n\nexport function handleMonthViewKeyDown({\n controlsRef,\n weekIndex,\n dayIndex,\n event,\n}: HandleMonthViewKeyDownInput): void {\n const direction = getDirection(event.key);\n\n if (direction) {\n event.preventDefault();\n\n const size = getControlsSize(controlsRef);\n\n if (!size) {\n return;\n }\n\n focusOnNextFocusableControl({\n controlsRef,\n direction,\n weekIndex,\n dayIndex,\n size,\n });\n }\n}\n"],"mappings":";;AAYA,SAAS,aAAa,KAA6C;CACjE,QAAQ,KAAR;EACE,KAAK,aACH,OAAO;EACT,KAAK,WACH,OAAO;EACT,KAAK,cACH,OAAO;EACT,KAAK,aACH,OAAO;EACT,SACE,OAAO;CACX;AACF;AAEA,SAAS,gBAAgB,aAAoD;CAC3E,IAAI,CAAC,YAAY,SACf,OAAO;CAET,OAAO,YAAY,QAAQ,KAAK,SAAU,OAAO,KAAK,SAAS,CAAE;AACnE;AASA,SAAS,gBAAgB,EACvB,WACA,WACA,UACA,QAC2C;CAC3C,MAAM,kBAAkB,KAAK;CAC7B,IAAI,CAAC,iBACH,OAAO;CAGT,QAAQ,WAAR;EACE,KAAK,MAAM;GACT,IAAI,cAAc,GAChB,OAAO;GAGT,MAAM,eAAe,KAAK,YAAY;GACtC,MAAM,kBAAkB,KAAK,IAAI,UAAU,eAAe,CAAC;GAC3D,OAAO;IACL,WAAW,YAAY;IACvB,UAAU;GACZ;EACF;EAEA,KAAK,QAAQ;GACX,IAAI,cAAc,KAAK,SAAS,GAC9B,OAAO;GAGT,MAAM,eAAe,KAAK,YAAY;GACtC,MAAM,kBAAkB,KAAK,IAAI,UAAU,eAAe,CAAC;GAC3D,OAAO;IACL,WAAW,YAAY;IACvB,UAAU;GACZ;EACF;EAEA,KAAK;GACH,IAAI,aAAa,GAAG;IAClB,IAAI,cAAc,GAChB,OAAO;IAGT,OAAO;KACL,WAAW,YAAY;KACvB,UAAU,KAAK,YAAY,KAAK;IAClC;GACF;GAEA,OAAO;IACL;IACA,UAAU,WAAW;GACvB;EAGF,KAAK;GACH,IAAI,aAAa,kBAAkB,GAAG;IACpC,IAAI,cAAc,KAAK,SAAS,GAC9B,OAAO;IAGT,OAAO;KACL,WAAW,YAAY;KACvB,UAAU;IACZ;GACF;GAEA,OAAO;IACL;IACA,UAAU,WAAW;GACvB;EAGF,SACE,OAAO;CACX;AACF;AAUA,SAAS,4BAA4B,EACnC,aACA,WACA,WACA,UACA,QACgC;CAChC,MAAM,eAAe,gBAAgB;EACnC;EACA;EACA;EACA;CACF,CAAC;CAED,IAAI,CAAC,cACH;CAGF,MAAM,iBAAiB,YAAY,UAAU,aAAa,UAAU,GAAG,aAAa;CAEpF,IAAI,CAAC,gBACH;CAGF,IACE,eAAe,YACf,eAAe,aAAa,aAAa,KACzC,eAAe,aAAa,sBAAsB,GAElD,4BAA4B;EAC1B;EACA;EACA,WAAW,aAAa;EACxB,UAAU,aAAa;EACvB;CACF,CAAC;MAED,eAAe,MAAM;AAEzB;AASA,SAAgB,uBAAuB,EACrC,aACA,WACA,UACA,SACoC;CACpC,MAAM,YAAY,aAAa,MAAM,GAAG;CAExC,IAAI,WAAW;EACb,MAAM,eAAe;EAErB,MAAM,OAAO,gBAAgB,WAAW;EAExC,IAAI,CAAC,MACH;EAGF,4BAA4B;GAC1B;GACA;GACA;GACA;GACA;EACF,CAAC;CACH;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MoreEvents.mjs","names":["classes"],"sources":["../../../src/components/MoreEvents/MoreEvents.tsx"],"sourcesContent":["import {\n BoxProps,\n ElementProps,\n factory,\n Factory,\n MantineRadius,\n Modal,\n ModalProps,\n Popover,\n PopoverProps,\n StylesApiProps,\n UnstyledButton,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport { ScheduleEventData, ScheduleMode } from '../../types';\nimport { RenderEvent, RenderEventBody, ScheduleEvent } from '../ScheduleEvent/ScheduleEvent';\nimport classes from './MoreEvents.module.css';\n\nexport type MoreEventsDropdownType = 'popover' | 'modal';\n\nexport type MoreEventsStylesNames = 'moreEventsButton' | 'moreEventsList' | 'moreEventsDropdown';\n\nexport interface MoreEventsProps\n extends BoxProps, StylesApiProps<MoreEventsFactory>, ElementProps<'button'> {\n /** List of events to display */\n events: ScheduleEventData[];\n\n /** Events count to use for `+X more` label */\n moreEventsCount: number;\n\n /** Key of `theme.radius` or any valid CSS value to set border-radius @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Title for the Modal component, ignored if `dropdownType` is not 'modal' */\n modalTitle?: string;\n\n /** Type of dropdown to use for displaying more events @default 'popover' */\n dropdownType?: MoreEventsDropdownType;\n\n /** Props passed down to `Popover` component */\n popoverProps?: Partial<Omit<PopoverProps, 'children'>>;\n\n /** Props passed down to `Modal` component */\n modalProps?: Partial<Omit<ModalProps, 'children'>>;\n\n /** Called when the dropdown is closed */\n onDropdownClose?: () => void;\n\n /** Function to customize event body, `event` object is passed as first argument */\n renderEventBody?: RenderEventBody;\n\n /** Function to fully customize event rendering, receives all props that would be passed to the root element including children */\n renderEvent?: RenderEvent;\n\n /** Labels override */\n labels?: ScheduleLabelsOverride;\n\n /** Interaction mode: 'default' allows all interactions, 'static' disables event interactions @default default */\n mode?: ScheduleMode;\n\n /** Called when an event inside the dropdown is clicked */\n onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport type MoreEventsFactory = Factory<{\n props: MoreEventsProps;\n ref: HTMLButtonElement;\n stylesNames: MoreEventsStylesNames;\n}>;\n\nconst defaultProps = {\n dropdownType: 'popover',\n} satisfies Partial<MoreEventsProps>;\n\nexport const MoreEvents = factory<MoreEventsFactory>((_props) => {\n const props = useProps('MoreEvents', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n attributes,\n radius,\n dropdownType,\n events,\n moreEventsCount,\n popoverProps,\n modalProps,\n onDropdownClose,\n children,\n modalTitle,\n renderEventBody,\n renderEvent,\n id,\n labels,\n mode,\n onEventClick,\n ...others\n } = props;\n const [dropdownOpened, dropdownHandlers] = useDisclosure();\n\n const getStyles = useStyles<MoreEventsFactory>({\n name: 'MoreEvents',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n rootSelector: 'moreEventsButton',\n });\n\n const handleClose = () => {\n dropdownHandlers.close();\n onDropdownClose?.();\n };\n\n const eventsList = (\n <div {...getStyles('moreEventsList')}>\n {events.map((event) => (\n <ScheduleEvent\n key={event.id}\n radius={radius}\n event={event}\n size=\"md\"\n renderEventBody={renderEventBody}\n renderEvent={renderEvent}\n mode={mode}\n onClick={onEventClick ? (e) => onEventClick(event, e) : undefined}\n >\n {event.title}\n </ScheduleEvent>\n ))}\n </div>\n );\n\n return (\n <>\n {dropdownType === 'modal' && (\n <Modal\n opened={dropdownOpened}\n onClose={handleClose}\n unstyled={unstyled}\n radius={radius}\n title={modalTitle}\n {...modalProps}\n >\n {eventsList}\n </Modal>\n )}\n\n <Popover\n position=\"bottom-start\"\n width={260}\n opened={dropdownOpened}\n trapFocus\n returnFocus={false}\n unstyled={unstyled}\n disabled={popoverProps?.disabled || dropdownType === 'modal'}\n radius={radius}\n transitionProps={{ transition: 'pop', duration: 120 }}\n offset={-46}\n id={id}\n {...popoverProps}\n onChange={(_opened) => {\n if (!_opened) {\n popoverProps?.onChange?.(_opened);\n handleClose();\n }\n }}\n >\n <Popover.Target>\n <UnstyledButton\n {...getStyles('moreEventsButton')}\n mod={{ static: mode === 'static' }}\n onClick={() => dropdownHandlers.toggle()}\n {...others}\n >\n {getLabel('moreLabel', labels)(moreEventsCount)}\n </UnstyledButton>\n </Popover.Target>\n\n <Popover.Dropdown {...getStyles('moreEventsDropdown')}>{eventsList}</Popover.Dropdown>\n </Popover>\n </>\n );\n});\n\nMoreEvents.displayName = '@mantine/schedule/MoreEvents';\nMoreEvents.classes = classes;\n"],"mappings":";;;;;;;;AAyEA,MAAM,eAAe,EACnB,cAAc,UAChB;AAEA,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,cAAc,MAAM;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,QACA,cACA,QACA,iBACA,cACA,YACA,iBACA,UACA,YACA,iBACA,aACA,IACA,QACA,MACA,cACA,GAAG,WACD;CACJ,MAAM,CAAC,gBAAgB,oBAAoB,cAAc;CAEzD,MAAM,YAAY,UAA6B;EAC7C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,MAAM,oBAAoB;EACxB,iBAAiB,MAAM;EACvB,kBAAkB;CACpB;CAEA,MAAM,aACJ,oBAAC,OAAD;EAAK,GAAI,UAAU,gBAAgB;YAChC,OAAO,KAAK,UACX,oBAAC,eAAD;GAEU;GACD;GACP,MAAK;GACY;GACJ;GACP;GACN,SAAS,gBAAgB,MAAM,aAAa,OAAO,CAAC,IAAI,KAAA;aAEvD,MAAM;EACM,GAVR,MAAM,EAUE,CAChB;CACE,CAAA;CAGP,OACE,qBAAA,UAAA,EAAA,UAAA,CACG,iBAAiB,WAChB,oBAAC,OAAD;EACE,QAAQ;EACR,SAAS;EACC;EACF;EACR,OAAO;EACP,GAAI;YAEH;CACI,CAAA,GAGT,qBAAC,SAAD;EACE,UAAS;EACT,OAAO;EACP,QAAQ;EACR,WAAA;EACA,aAAa;EACH;EACV,UAAU,cAAc,YAAY,iBAAiB;EAC7C;EACR,iBAAiB;GAAE,YAAY;GAAO,UAAU;EAAI;EACpD,QAAQ;EACJ;EACJ,GAAI;EACJ,WAAW,YAAY;GACrB,IAAI,CAAC,SAAS;IACZ,cAAc,WAAW,OAAO;IAChC,YAAY;GACd;EACF;YAlBF,CAoBE,oBAAC,QAAQ,QAAT,EAAA,UACE,oBAAC,gBAAD;GACE,GAAI,UAAU,kBAAkB;GAChC,KAAK,EAAE,QAAQ,SAAS,SAAS;GACjC,eAAe,iBAAiB,OAAO;GACvC,GAAI;aAEH,SAAS,aAAa,MAAM,
|
|
1
|
+
{"version":3,"file":"MoreEvents.mjs","names":["classes"],"sources":["../../../src/components/MoreEvents/MoreEvents.tsx"],"sourcesContent":["import {\n BoxProps,\n ElementProps,\n factory,\n Factory,\n MantineRadius,\n Modal,\n ModalProps,\n Popover,\n PopoverProps,\n StylesApiProps,\n UnstyledButton,\n useProps,\n useStyles,\n} from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { getLabel, ScheduleLabelsOverride } from '../../labels';\nimport { ScheduleEventData, ScheduleMode } from '../../types';\nimport { RenderEvent, RenderEventBody, ScheduleEvent } from '../ScheduleEvent/ScheduleEvent';\nimport classes from './MoreEvents.module.css';\n\nexport type MoreEventsDropdownType = 'popover' | 'modal';\n\nexport type MoreEventsStylesNames = 'moreEventsButton' | 'moreEventsList' | 'moreEventsDropdown';\n\nexport interface MoreEventsProps\n extends BoxProps, StylesApiProps<MoreEventsFactory>, ElementProps<'button'> {\n /** List of events to display */\n events: ScheduleEventData[];\n\n /** Events count to use for `+X more` label */\n moreEventsCount: number;\n\n /** Key of `theme.radius` or any valid CSS value to set border-radius @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Title for the Modal component, ignored if `dropdownType` is not 'modal' */\n modalTitle?: string;\n\n /** Type of dropdown to use for displaying more events @default 'popover' */\n dropdownType?: MoreEventsDropdownType;\n\n /** Props passed down to `Popover` component */\n popoverProps?: Partial<Omit<PopoverProps, 'children'>>;\n\n /** Props passed down to `Modal` component */\n modalProps?: Partial<Omit<ModalProps, 'children'>>;\n\n /** Called when the dropdown is closed */\n onDropdownClose?: () => void;\n\n /** Function to customize event body, `event` object is passed as first argument */\n renderEventBody?: RenderEventBody;\n\n /** Function to fully customize event rendering, receives all props that would be passed to the root element including children */\n renderEvent?: RenderEvent;\n\n /** Labels override */\n labels?: ScheduleLabelsOverride;\n\n /** Interaction mode: 'default' allows all interactions, 'static' disables event interactions @default default */\n mode?: ScheduleMode;\n\n /** Called when an event inside the dropdown is clicked */\n onEventClick?: (event: ScheduleEventData, e: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport type MoreEventsFactory = Factory<{\n props: MoreEventsProps;\n ref: HTMLButtonElement;\n stylesNames: MoreEventsStylesNames;\n}>;\n\nconst defaultProps = {\n dropdownType: 'popover',\n} satisfies Partial<MoreEventsProps>;\n\nexport const MoreEvents = factory<MoreEventsFactory>((_props) => {\n const props = useProps('MoreEvents', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n attributes,\n radius,\n dropdownType,\n events,\n moreEventsCount,\n popoverProps,\n modalProps,\n onDropdownClose,\n children,\n modalTitle,\n renderEventBody,\n renderEvent,\n id,\n labels,\n mode,\n onEventClick,\n ...others\n } = props;\n const [dropdownOpened, dropdownHandlers] = useDisclosure();\n\n const getStyles = useStyles<MoreEventsFactory>({\n name: 'MoreEvents',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n rootSelector: 'moreEventsButton',\n });\n\n const handleClose = () => {\n dropdownHandlers.close();\n onDropdownClose?.();\n };\n\n const eventsList = (\n <div {...getStyles('moreEventsList')}>\n {events.map((event) => (\n <ScheduleEvent\n key={event.id}\n radius={radius}\n event={event}\n size=\"md\"\n renderEventBody={renderEventBody}\n renderEvent={renderEvent}\n mode={mode}\n onClick={onEventClick ? (e) => onEventClick(event, e) : undefined}\n >\n {event.title}\n </ScheduleEvent>\n ))}\n </div>\n );\n\n return (\n <>\n {dropdownType === 'modal' && (\n <Modal\n opened={dropdownOpened}\n onClose={handleClose}\n unstyled={unstyled}\n radius={radius}\n title={modalTitle}\n {...modalProps}\n >\n {eventsList}\n </Modal>\n )}\n\n <Popover\n position=\"bottom-start\"\n width={260}\n opened={dropdownOpened}\n trapFocus\n returnFocus={false}\n unstyled={unstyled}\n disabled={popoverProps?.disabled || dropdownType === 'modal'}\n radius={radius}\n transitionProps={{ transition: 'pop', duration: 120 }}\n offset={-46}\n id={id}\n {...popoverProps}\n onChange={(_opened) => {\n if (!_opened) {\n popoverProps?.onChange?.(_opened);\n handleClose();\n }\n }}\n >\n <Popover.Target>\n <UnstyledButton\n {...getStyles('moreEventsButton')}\n mod={{ static: mode === 'static' }}\n onClick={() => dropdownHandlers.toggle()}\n {...others}\n >\n {getLabel('moreLabel', labels)(moreEventsCount)}\n </UnstyledButton>\n </Popover.Target>\n\n <Popover.Dropdown {...getStyles('moreEventsDropdown')}>{eventsList}</Popover.Dropdown>\n </Popover>\n </>\n );\n});\n\nMoreEvents.displayName = '@mantine/schedule/MoreEvents';\nMoreEvents.classes = classes;\n"],"mappings":";;;;;;;;AAyEA,MAAM,eAAe,EACnB,cAAc,UAChB;AAEA,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,cAAc,MAAM;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,QACA,cACA,QACA,iBACA,cACA,YACA,iBACA,UACA,YACA,iBACA,aACA,IACA,QACA,MACA,cACA,GAAG,WACD;CACJ,MAAM,CAAC,gBAAgB,oBAAoB,cAAc;CAEzD,MAAM,YAAY,UAA6B;EAC7C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,MAAM,oBAAoB;EACxB,iBAAiB,MAAM;EACvB,kBAAkB;CACpB;CAEA,MAAM,aACJ,oBAAC,OAAD;EAAK,GAAI,UAAU,gBAAgB;YAChC,OAAO,KAAK,UACX,oBAAC,eAAD;GAEU;GACD;GACP,MAAK;GACY;GACJ;GACP;GACN,SAAS,gBAAgB,MAAM,aAAa,OAAO,CAAC,IAAI,KAAA;aAEvD,MAAM;EACM,GAVR,MAAM,EAUE,CAChB;CACE,CAAA;CAGP,OACE,qBAAA,UAAA,EAAA,UAAA,CACG,iBAAiB,WAChB,oBAAC,OAAD;EACE,QAAQ;EACR,SAAS;EACC;EACF;EACR,OAAO;EACP,GAAI;YAEH;CACI,CAAA,GAGT,qBAAC,SAAD;EACE,UAAS;EACT,OAAO;EACP,QAAQ;EACR,WAAA;EACA,aAAa;EACH;EACV,UAAU,cAAc,YAAY,iBAAiB;EAC7C;EACR,iBAAiB;GAAE,YAAY;GAAO,UAAU;EAAI;EACpD,QAAQ;EACJ;EACJ,GAAI;EACJ,WAAW,YAAY;GACrB,IAAI,CAAC,SAAS;IACZ,cAAc,WAAW,OAAO;IAChC,YAAY;GACd;EACF;YAlBF,CAoBE,oBAAC,QAAQ,QAAT,EAAA,UACE,oBAAC,gBAAD;GACE,GAAI,UAAU,kBAAkB;GAChC,KAAK,EAAE,QAAQ,SAAS,SAAS;GACjC,eAAe,iBAAiB,OAAO;GACvC,GAAI;aAEH,SAAS,aAAa,MAAM,CAAC,CAAC,eAAe;EAChC,CAAA,EACF,CAAA,GAEhB,oBAAC,QAAQ,UAAT;GAAkB,GAAI,UAAU,oBAAoB;aAAI;EAA6B,CAAA,CAC9E;GACT,EAAA,CAAA;AAEN,CAAC;AAED,WAAW,cAAc;AACzB,WAAW,UAAUA"}
|