@mantine-vue/schedule 3.0.0 → 3.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (80) hide show
  1. package/cjs/index.cjs +6101 -3638
  2. package/cjs/index.cjs.map +1 -1
  3. package/esm/index.mjs +6045 -3632
  4. package/esm/index.mjs.map +1 -1
  5. package/lib/component-props.d.ts +181 -214
  6. package/lib/components/CurrentTimeIndicator/CurrentTimeIndicator.d.ts +8 -114
  7. package/lib/components/CurrentTimeIndicator/CurrentTimeIndicator.types.d.ts +89 -0
  8. package/lib/components/CurrentTimeIndicator/CurrentTimeIndicator.vue.d.ts +20 -0
  9. package/lib/components/DayView/DayView.d.ts +10 -212
  10. package/lib/components/DayView/DayView.types.d.ts +65 -0
  11. package/lib/components/DayView/DayView.vue.d.ts +51 -0
  12. package/lib/components/DragContext/DragContext.d.ts +43 -5
  13. package/lib/components/MobileMonthView/MobileMonthView.d.ts +10 -171
  14. package/lib/components/MobileMonthView/MobileMonthView.types.d.ts +110 -0
  15. package/lib/components/MobileMonthView/MobileMonthView.vue.d.ts +44 -0
  16. package/lib/components/MonthView/MonthView.d.ts +10 -174
  17. package/lib/components/MonthView/MonthView.types.d.ts +125 -0
  18. package/lib/components/MonthView/MonthView.vue.d.ts +56 -0
  19. package/lib/components/MoreEvents/MoreEvents.d.ts +9 -65
  20. package/lib/components/MoreEvents/MoreEvents.types.d.ts +62 -0
  21. package/lib/components/MoreEvents/MoreEvents.vue.d.ts +23 -0
  22. package/lib/components/ResourcesDayView/ResourcesDayView.d.ts +10 -346
  23. package/lib/components/ResourcesDayView/ResourcesDayView.types.d.ts +308 -0
  24. package/lib/components/ResourcesDayView/ResourcesDayView.vue.d.ts +53 -0
  25. package/lib/components/ResourcesMonthView/ResourcesMonthView.d.ts +10 -279
  26. package/lib/components/ResourcesMonthView/ResourcesMonthView.types.d.ts +233 -0
  27. package/lib/components/ResourcesMonthView/ResourcesMonthView.vue.d.ts +52 -0
  28. package/lib/components/ResourcesMonthView/get-resources-month-view-layout/get-resources-month-view-layout.d.ts +54 -0
  29. package/lib/components/ResourcesMonthView/index.d.ts +1 -0
  30. package/lib/components/ResourcesSchedule/ResourcesSchedule.d.ts +9 -201
  31. package/lib/components/ResourcesSchedule/ResourcesSchedule.types.d.ts +159 -0
  32. package/lib/components/ResourcesSchedule/ResourcesSchedule.vue.d.ts +44 -0
  33. package/lib/components/ResourcesWeekView/ResourcesWeekView.d.ts +10 -412
  34. package/lib/components/ResourcesWeekView/ResourcesWeekView.types.d.ts +314 -0
  35. package/lib/components/ResourcesWeekView/ResourcesWeekView.vue.d.ts +58 -0
  36. package/lib/components/Schedule/Schedule.d.ts +9 -134
  37. package/lib/components/Schedule/Schedule.types.d.ts +153 -0
  38. package/lib/components/Schedule/Schedule.vue.d.ts +50 -0
  39. package/lib/components/ScheduleEvent/ScheduleEvent.d.ts +11 -88
  40. package/lib/components/ScheduleEvent/ScheduleEvent.types.d.ts +109 -0
  41. package/lib/components/ScheduleEvent/ScheduleEvent.vue.d.ts +24 -0
  42. package/lib/components/ScheduleHeader/HeaderControl/HeaderControl.d.ts +36 -0
  43. package/lib/components/ScheduleHeader/HeaderControl/HeaderControl.types.d.ts +44 -0
  44. package/lib/components/ScheduleHeader/HeaderControl/HeaderControl.vue.d.ts +14 -0
  45. package/lib/components/ScheduleHeader/HeaderControl/ScheduleHeaderNext.vue.d.ts +11 -0
  46. package/lib/components/ScheduleHeader/HeaderControl/ScheduleHeaderPrevious.vue.d.ts +11 -0
  47. package/lib/components/ScheduleHeader/HeaderControl/ScheduleHeaderToday.vue.d.ts +11 -0
  48. package/lib/components/ScheduleHeader/HeaderControl/index.d.ts +1 -2
  49. package/lib/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.d.ts +8 -0
  50. package/lib/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.types.d.ts +70 -0
  51. package/lib/components/ScheduleHeader/MonthYearSelect/MonthYearSelect.vue.d.ts +21 -0
  52. package/lib/components/ScheduleHeader/MonthYearSelect/index.d.ts +1 -2
  53. package/lib/components/ScheduleHeader/ScheduleHeader.context.d.ts +12 -0
  54. package/lib/components/ScheduleHeader/ScheduleHeader.d.ts +20 -364
  55. package/lib/components/ScheduleHeader/ScheduleHeader.types.d.ts +28 -0
  56. package/lib/components/ScheduleHeader/ScheduleHeader.vue.d.ts +11 -0
  57. package/lib/components/ScheduleHeader/ScheduleHeaderBase.d.ts +37 -75
  58. package/lib/components/ScheduleHeader/ScheduleHeaderBase.types.d.ts +54 -0
  59. package/lib/components/ScheduleHeader/ScheduleHeaderBase.vue.d.ts +21 -0
  60. package/lib/components/ScheduleHeader/ViewSelect/ViewSelect.d.ts +8 -0
  61. package/lib/components/ScheduleHeader/ViewSelect/ViewSelect.types.d.ts +39 -0
  62. package/lib/components/ScheduleHeader/ViewSelect/ViewSelect.vue.d.ts +16 -0
  63. package/lib/components/ScheduleHeader/ViewSelect/index.d.ts +1 -2
  64. package/lib/components/ScheduleHeader/index.d.ts +4 -0
  65. package/lib/components/WeekView/WeekView.d.ts +10 -294
  66. package/lib/components/WeekView/WeekView.types.d.ts +129 -0
  67. package/lib/components/WeekView/WeekView.vue.d.ts +60 -0
  68. package/lib/components/YearView/YearView.d.ts +9 -151
  69. package/lib/components/YearView/YearView.types.d.ts +87 -0
  70. package/lib/components/YearView/YearView.vue.d.ts +35 -0
  71. package/lib/components/shared.d.ts +71 -141
  72. package/lib/components/use-slot-drag-select.d.ts +7 -9
  73. package/lib/components/use-slot-drop-target.d.ts +38 -0
  74. package/lib/hooks/use-event-resize.d.ts +1 -1
  75. package/lib/hooks/use-horizontal-event-resize.d.ts +2 -156
  76. package/lib/index.d.mts +1 -0
  77. package/lib/index.d.ts +1 -0
  78. package/package.json +4 -4
  79. package/styles.css +44 -54
  80. package/styles.layer.css +44 -54
@@ -1,265 +1,232 @@
1
- import type { CSSProperties, HTMLAttributes, PropType, VNodeChild } from 'vue';
1
+ import type { CSSProperties, HTMLAttributes, VNodeChild } from 'vue';
2
+ import type { EmitsToProps } from '@mantine-vue/core';
3
+ import type { ViewSelectEmits, ViewSelectProps } from './components/ScheduleHeader/ViewSelect/ViewSelect.types';
2
4
  import type { ScheduleLabelsOverride } from './labels';
3
- import type { AnyDateValue, DateLabelFormat, DateStringValue, DateTimeStringValue, DayOfWeek, ScheduleEventData, ScheduleMode, ScheduleViewLevel } from './types';
5
+ import type { AnyDateValue, DateLabelFormat, DateStringValue, DateTimeStringValue, ScheduleEventData, ScheduleMode, ScheduleViewLevel } from './types';
4
6
  import type { BusinessHoursValue } from './utils';
7
+ /**
8
+ * Native attributes accepted by the header controls and the other button-like elements
9
+ * a view renders on the consumer's behalf. `data-*` attributes are part of the type
10
+ * because Vue's `HTMLAttributes` does not model them.
11
+ */
5
12
  export type NativeButtonProps = HTMLAttributes & Record<`data-${string}`, unknown>;
13
+ /**
14
+ * Props forwarded to a component a view renders internally, plus the `on*` listeners for its
15
+ * events so a nested object can subscribe to them.
16
+ *
17
+ * `rootRef` is dropped because it only makes sense on the element a consumer owns, and because
18
+ * the factory narrows it to a concrete element type that a `Partial<…Props>` cannot satisfy.
19
+ */
20
+ export type ForwardedProps<Props, Emits = Record<never, never>> = Partial<Omit<Props, 'rootRef'>> & EmitsToProps<Emits>;
21
+ /** Renders the body of an event, replacing the default title. */
6
22
  export type RenderEventBody = (event: ScheduleEventData) => VNodeChild;
7
- export type RenderEvent = (event: ScheduleEventData, props: ScheduleEventRenderProps) => VNodeChild;
23
+ /** Props `ScheduleEvent` would spread onto its root element, handed to `renderEvent`. */
8
24
  export interface ScheduleEventRenderProps extends NativeButtonProps {
25
+ /** Default event content, so a custom root can still render it. */
9
26
  children?: VNodeChild;
10
27
  }
28
+ /** Replaces the rendering of an event entirely, root element included. */
29
+ export type RenderEvent = (event: ScheduleEventData, props: ScheduleEventRenderProps) => VNodeChild;
30
+ /** Payload of the `eventDrop` and `eventResize` events and of the matching callback props. */
11
31
  export interface EventDropData {
32
+ /** Id of the event that changed. */
12
33
  eventId: string | number;
34
+ /** New start datetime, `YYYY-MM-DD HH:mm:ss`. */
13
35
  newStart: DateTimeStringValue;
36
+ /** New end datetime, `YYYY-MM-DD HH:mm:ss`. */
14
37
  newEnd: DateTimeStringValue;
38
+ /** Event object as it was before the change. */
15
39
  event: ScheduleEventData;
16
40
  }
41
+ /** Payload of the `timeSlotClick` event and of the `onTimeSlotClick` prop. */
17
42
  export interface TimeSlotClickData {
43
+ /** Start datetime of the clicked slot, `YYYY-MM-DD HH:mm:ss`. */
18
44
  slotStart: DateTimeStringValue;
45
+ /** End datetime of the clicked slot, `YYYY-MM-DD HH:mm:ss`. */
19
46
  slotEnd: DateTimeStringValue;
47
+ /** Originating DOM event. */
20
48
  nativeEvent: MouseEvent;
21
49
  }
22
- export interface BaseViewProps extends HTMLAttributes {
50
+ /**
51
+ * Props shared by every schedule view. Not a component of its own: `DayViewOwnProps`,
52
+ * `MonthViewOwnProps` and friends extend it, so its members appear in their props tables.
53
+ */
54
+ export interface BaseViewOwnProps {
55
+ /** Date displayed by the view. Accepts anything `dayjs` understands. */
23
56
  date: Date | DateStringValue;
24
- onDateChange?: (date: DateStringValue) => void;
57
+ /** Events rendered by the view. */
25
58
  events?: ScheduleEventData[];
59
+ /**
60
+ * Locale passed down to `dayjs` when formatting labels.
61
+ * @default 'en'
62
+ */
26
63
  locale?: string;
64
+ /** Key of `theme.radius` or any valid CSS value to set `border-radius`. */
27
65
  radius?: string | number;
66
+ /** Overrides for the built-in labels, used for i18n and accessible names. */
28
67
  labels?: ScheduleLabelsOverride;
68
+ /**
69
+ * Interaction mode. `static` disables every event, slot and navigation interaction.
70
+ * @default 'default'
71
+ */
29
72
  mode?: ScheduleMode;
73
+ /**
74
+ * If set, the navigation header is rendered above the view.
75
+ * @default true
76
+ */
30
77
  withHeader?: boolean;
31
- onViewChange?: (view: ScheduleViewLevel) => void;
78
+ /** Props passed to the previous control of the header. */
32
79
  previousControlProps?: NativeButtonProps;
80
+ /** Props passed to the next control of the header. */
33
81
  nextControlProps?: NativeButtonProps;
82
+ /** Props passed to the today control of the header. */
34
83
  todayControlProps?: NativeButtonProps;
35
- viewSelectProps?: Partial<ViewSelectProps>;
84
+ /** Props passed to the view select of the header. */
85
+ viewSelectProps?: ForwardedProps<ViewSelectProps, ViewSelectEmits>;
86
+ /**
87
+ * Replaces the body of every event. Can also be set with the `eventBody` slot,
88
+ * which takes precedence over the prop.
89
+ */
36
90
  renderEventBody?: RenderEventBody;
91
+ /**
92
+ * Replaces every event entirely, root element included. Can also be set with the
93
+ * `event` slot, which takes precedence over the prop.
94
+ */
37
95
  renderEvent?: RenderEvent;
38
- onEventClick?: (event: ScheduleEventData, nativeEvent: MouseEvent) => void;
96
+ /**
97
+ * Maximum number of instances generated per recurring series.
98
+ * @default 2000
99
+ */
39
100
  recurrenceExpansionLimit?: number;
40
101
  }
41
- export interface TimeViewProps extends BaseViewProps {
102
+ /**
103
+ * Props shared by the views that lay events out on a time axis. Not a component of its own:
104
+ * `DayViewOwnProps` and `WeekViewOwnProps` extend it.
105
+ */
106
+ export interface TimeViewOwnProps extends BaseViewOwnProps {
107
+ /**
108
+ * First visible time of the day, `HH:mm:ss`.
109
+ * @default '00:00:00'
110
+ */
42
111
  startTime?: string;
112
+ /**
113
+ * Last visible time of the day, `HH:mm:ss`.
114
+ * @default '23:59:59'
115
+ */
43
116
  endTime?: string;
117
+ /** Length of one time slot in minutes. */
44
118
  intervalMinutes?: number;
119
+ /**
120
+ * Format of the time slot labels.
121
+ * @default 'HH:mm'
122
+ */
45
123
  slotLabelFormat?: DateLabelFormat;
124
+ /** If set, a line marking the current time is displayed. */
46
125
  withCurrentTimeIndicator?: boolean;
126
+ /**
127
+ * If set, the current time indicator carries a bubble with the current time.
128
+ * @default true
129
+ */
47
130
  withCurrentTimeBubble?: boolean;
131
+ /**
132
+ * Returns the current time, called on every tick. Use it to render the indicator in
133
+ * another timezone.
134
+ * @default () => dayjs()
135
+ */
48
136
  getCurrentTime?: () => AnyDateValue;
137
+ /**
138
+ * Height of a one hour slot.
139
+ * @default 64
140
+ */
49
141
  slotHeight?: CSSProperties['height'];
142
+ /**
143
+ * If set, business hours are highlighted.
144
+ * @default false
145
+ */
50
146
  highlightBusinessHours?: boolean;
147
+ /**
148
+ * Business hours as an `HH:mm:ss` range shared by every day, or a record keyed by day of
149
+ * the week (`0` – Sunday) for per-day ranges. Set a day to `null` to mark it as fully
150
+ * outside business hours.
151
+ * @default ['09:00:00', '17:00:00']
152
+ */
51
153
  businessHours?: BusinessHoursValue;
154
+ /**
155
+ * If set, events can be dragged onto another slot.
156
+ * @default false
157
+ */
52
158
  withEventsDragAndDrop?: boolean;
53
- onEventDrop?: (data: EventDropData) => void;
159
+ /**
160
+ * Returns whether the given event may be dragged.
161
+ * @default () => true
162
+ */
54
163
  canDragEvent?: (event: ScheduleEventData) => boolean;
55
- onEventDragStart?: (event: ScheduleEventData) => void;
56
- onEventDragEnd?: () => void;
57
- onTimeSlotClick?: (data: TimeSlotClickData) => void;
58
- onAllDaySlotClick?: (date: DateStringValue, nativeEvent: MouseEvent) => void;
164
+ /**
165
+ * If set, dragging across time slots selects a range.
166
+ * @default false
167
+ */
59
168
  withDragSlotSelect?: boolean;
60
- onSlotDragEnd?: (rangeStart: DateTimeStringValue, rangeEnd: DateTimeStringValue) => void;
169
+ /**
170
+ * If set, items dragged in from outside the schedule can be dropped on a slot, which emits
171
+ * `externalEventDrop`. Enabling event drag and drop turns this on as well.
172
+ * @default false
173
+ */
174
+ withExternalEventDrop?: boolean;
175
+ /** Time the view scrolls to on the initial render, `HH:mm:ss`. */
61
176
  startScrollTime?: string;
62
- onExternalEventDrop?: (dataTransfer: DataTransfer, dropDateTime: DateTimeStringValue) => void;
177
+ /**
178
+ * If set, events can be resized by dragging their edges.
179
+ * @default false
180
+ */
63
181
  withEventResize?: boolean;
64
- onEventResize?: (data: EventDropData) => void;
182
+ /**
183
+ * Returns whether the given event may be resized.
184
+ * @default () => true
185
+ */
65
186
  canResizeEvent?: (event: ScheduleEventData) => boolean;
66
187
  }
67
- export interface DayViewProps extends TimeViewProps {
68
- headerFormat?: DateLabelFormat;
69
- withAllDaySlot?: boolean;
70
- allDaySlotHeight?: CSSProperties['height'];
71
- maxAllDayEvents?: number;
72
- moreEventsProps?: Partial<MoreEventsProps>;
73
- }
74
- export interface WeekViewProps extends TimeViewProps {
75
- firstDayOfWeek?: DayOfWeek;
76
- weekdayFormat?: DateLabelFormat;
77
- dayFormat?: DateLabelFormat;
78
- withWeekNumber?: boolean;
79
- withAllDaySlots?: boolean;
80
- /** @deprecated Use withWeekNumber */
81
- withWeekNumbers?: boolean;
82
- /** @deprecated Use withAllDaySlots */
83
- withAllDaySlot?: boolean;
84
- allDaySlotsHeight?: CSSProperties['height'];
85
- maxAllDayEvents?: number;
86
- weekendDays?: DayOfWeek[];
87
- withWeekendDays?: boolean;
88
- forceCurrentTimeIndicator?: boolean;
89
- weekLabelFormat?: DateLabelFormat;
90
- renderWeekLabel?: (input: {
91
- weekStart: DateStringValue;
92
- weekEnd: DateStringValue;
93
- }) => string;
94
- }
95
- export interface MonthViewProps extends BaseViewProps {
96
- firstDayOfWeek?: DayOfWeek;
97
- weekdayFormat?: DateLabelFormat;
98
- weekendDays?: DayOfWeek[];
99
- withWeekNumbers?: boolean;
100
- withWeekDays?: boolean;
101
- consistentWeeks?: boolean;
102
- highlightToday?: boolean;
103
- withOutsideDays?: boolean;
104
- maxEventsPerDay?: number;
105
- getDayProps?: (date: DateStringValue) => NativeButtonProps;
106
- getWeekNumberProps?: (weekStartDate: DateStringValue) => NativeButtonProps;
107
- onDayClick?: (date: DateStringValue, nativeEvent: MouseEvent) => void;
108
- onWeekNumberClick?: (date: DateStringValue, nativeEvent: MouseEvent) => void;
109
- withEventsDragAndDrop?: boolean;
110
- onEventDrop?: (data: EventDropData) => void;
111
- canDragEvent?: (event: ScheduleEventData) => boolean;
112
- onEventDragStart?: (event: ScheduleEventData) => void;
113
- onEventDragEnd?: () => void;
114
- onExternalEventDrop?: (dataTransfer: DataTransfer, date: DateStringValue) => void;
115
- withDragSlotSelect?: boolean;
116
- onSlotDragEnd?: (rangeStart: DateStringValue, rangeEnd: DateStringValue) => void;
117
- }
118
- export interface YearViewProps extends BaseViewProps {
119
- firstDayOfWeek?: DayOfWeek;
120
- weekdayFormat?: DateLabelFormat;
121
- weekendDays?: DayOfWeek[];
122
- withWeekNumbers?: boolean;
123
- withWeekDays?: boolean;
124
- consistentWeeks?: boolean;
125
- highlightToday?: boolean;
126
- withOutsideDays?: boolean;
127
- monthsListFormat?: DateLabelFormat;
128
- getDayProps?: (date: DateStringValue) => NativeButtonProps;
129
- getWeekNumberProps?: (weekStartDate: DateStringValue) => NativeButtonProps;
130
- onDayClick?: (date: DateStringValue, nativeEvent: MouseEvent) => void;
131
- onMonthClick?: (month: DateStringValue) => void;
132
- onWeekNumberClick?: (date: DateStringValue, nativeEvent: MouseEvent) => void;
133
- }
134
- export interface MobileMonthViewProps extends MonthViewProps {
135
- selectedDate?: Date | DateStringValue | null;
136
- defaultSelectedDate?: Date | DateStringValue | null;
137
- onSelectedDateChange?: (date: DateStringValue | null) => void;
138
- eventsHeaderFormat?: DateLabelFormat;
139
- onYearClick?: () => void;
140
- renderHeader?: (input: {
141
- mode: ScheduleMode;
142
- date: Date | DateStringValue;
143
- defaultHeader: VNodeChild;
188
+ /**
189
+ * Events emitted by every schedule view. Not a component of its own: `DayViewEmits`,
190
+ * `MonthViewEmits` and friends extend it.
191
+ */
192
+ export interface BaseViewEmits {
193
+ /** Emitted when the view navigates to another date. */
194
+ dateChange: [date: DateStringValue];
195
+ /** Emitted when the header view select picks another view level. */
196
+ viewChange: [view: ScheduleViewLevel];
197
+ /** Emitted when an event is clicked. */
198
+ eventClick: [event: ScheduleEventData, nativeEvent: MouseEvent];
199
+ }
200
+ /**
201
+ * Events emitted by the views that lay events out on a time axis. Not a component of its own:
202
+ * `DayViewEmits` and `WeekViewEmits` extend it.
203
+ */
204
+ export interface TimeViewEmits extends BaseViewEmits {
205
+ /** Emitted when an event is dropped on a new slot. */
206
+ eventDrop: [data: EventDropData];
207
+ /** Emitted when a drag of an event starts. */
208
+ eventDragStart: [event: ScheduleEventData];
209
+ /** Emitted when a drag of an event ends. */
210
+ eventDragEnd: [];
211
+ /** Emitted when a time slot is clicked. */
212
+ timeSlotClick: [data: TimeSlotClickData];
213
+ /** Emitted when an all-day slot is clicked. */
214
+ allDaySlotClick: [date: DateStringValue, nativeEvent: MouseEvent];
215
+ /** Emitted when a time slot range is selected by dragging. */
216
+ slotDragEnd: [rangeStart: DateTimeStringValue, rangeEnd: DateTimeStringValue];
217
+ /** Emitted when an item from outside the schedule is dropped on a slot. */
218
+ externalEventDrop: [dataTransfer: DataTransfer, dropDateTime: DateTimeStringValue];
219
+ /** Emitted when an event is resized. */
220
+ eventResize: [data: EventDropData];
221
+ }
222
+ /** Scoped slots that mirror the `renderEvent` and `renderEventBody` props. */
223
+ export interface EventSlots {
224
+ /** Replaces the body of every event. Takes precedence over `renderEventBody`. */
225
+ eventBody?: (props: {
226
+ event: ScheduleEventData;
227
+ }) => VNodeChild;
228
+ /** Replaces every event entirely. Takes precedence over `renderEvent`. */
229
+ event?: (props: ScheduleEventRenderProps & {
230
+ event: ScheduleEventData;
144
231
  }) => VNodeChild;
145
232
  }
146
- export interface ViewSelectProps extends Omit<HTMLAttributes, 'onChange'> {
147
- views?: readonly ScheduleViewLevel[];
148
- value?: ScheduleViewLevel;
149
- onChange?: (value: ScheduleViewLevel) => void;
150
- radius?: string | number;
151
- labels?: ScheduleLabelsOverride;
152
- }
153
- export interface MonthYearSelectProps extends HTMLAttributes {
154
- locale?: string;
155
- startYear?: number;
156
- endYear?: number;
157
- yearValue?: number;
158
- monthValue?: number;
159
- onYearChange?: (year: number) => void;
160
- onMonthChange?: (month: number) => void;
161
- monthsListFormat?: DateLabelFormat;
162
- labelFormat?: DateLabelFormat;
163
- radius?: string | number;
164
- getYearControlProps?: (year: number) => NativeButtonProps;
165
- getMonthControlProps?: (month: number) => NativeButtonProps;
166
- withMonths?: boolean;
167
- labels?: ScheduleLabelsOverride;
168
- }
169
- export interface ScheduleHeaderProps extends HTMLAttributes {
170
- labels?: ScheduleLabelsOverride;
171
- }
172
- export interface HeaderControlProps extends NativeButtonProps {
173
- active?: boolean;
174
- square?: boolean;
175
- radius?: string | number;
176
- interactive?: boolean;
177
- labels?: ScheduleLabelsOverride;
178
- }
179
- export interface ScheduleEventProps extends NativeButtonProps {
180
- event: ScheduleEventData;
181
- radius?: string | number;
182
- nowrap?: boolean;
183
- autoSize?: boolean;
184
- size?: 'sm' | 'md' | (string & {});
185
- renderEventBody?: RenderEventBody;
186
- renderEvent?: RenderEvent;
187
- hanging?: 'start' | 'end' | 'both' | 'none';
188
- draggable?: boolean;
189
- onEventDragStart?: (event: ScheduleEventData) => void;
190
- onEventDragEnd?: () => void;
191
- isDragging?: boolean;
192
- mode?: ScheduleMode;
193
- withResize?: boolean;
194
- onResizeStart?: (edge: 'top' | 'bottom', event: PointerEvent) => void;
195
- isResizing?: boolean;
196
- }
197
- export type MoreEventsDropdownType = 'popover' | 'modal';
198
- export interface MoreEventsProps extends NativeButtonProps {
199
- events: ScheduleEventData[];
200
- moreEventsCount: number;
201
- radius?: string | number;
202
- modalTitle?: string;
203
- dropdownType?: MoreEventsDropdownType;
204
- popoverProps?: Record<string, unknown>;
205
- modalProps?: Record<string, unknown>;
206
- onDropdownClose?: () => void;
207
- renderEventBody?: RenderEventBody;
208
- renderEvent?: RenderEvent;
209
- labels?: ScheduleLabelsOverride;
210
- mode?: ScheduleMode;
211
- onEventClick?: (event: ScheduleEventData, nativeEvent: MouseEvent) => void;
212
- }
213
- export interface CurrentTimeIndicatorProps extends HTMLAttributes {
214
- color?: string;
215
- startOffset?: string;
216
- endOffset?: string;
217
- topOffset?: string;
218
- timeBubbleStartOffset?: string;
219
- withTimeBubble?: boolean;
220
- withThumb?: boolean;
221
- currentTimeFormat?: DateLabelFormat;
222
- locale?: string;
223
- startTime?: string;
224
- endTime?: string;
225
- intervalMinutes?: number;
226
- getCurrentTime?: () => AnyDateValue;
227
- }
228
- export interface ScheduleProps extends HTMLAttributes {
229
- date?: Date | DateStringValue;
230
- defaultDate?: Date | DateStringValue;
231
- onDateChange?: (date: DateStringValue) => void;
232
- view?: ScheduleViewLevel;
233
- defaultView?: ScheduleViewLevel;
234
- onViewChange?: (view: ScheduleViewLevel) => void;
235
- events?: ScheduleEventData[];
236
- locale?: string;
237
- radius?: string | number;
238
- labels?: ScheduleLabelsOverride;
239
- renderEventBody?: RenderEventBody;
240
- withEventsDragAndDrop?: boolean;
241
- onEventDrop?: (data: EventDropData) => void;
242
- canDragEvent?: (event: ScheduleEventData) => boolean;
243
- onEventDragStart?: (event: ScheduleEventData) => void;
244
- onEventDragEnd?: () => void;
245
- onTimeSlotClick?: (data: TimeSlotClickData) => void;
246
- onAllDaySlotClick?: (date: DateStringValue, nativeEvent: MouseEvent) => void;
247
- onEventClick?: (event: ScheduleEventData, nativeEvent: MouseEvent) => void;
248
- onDayClick?: (date: DateStringValue, nativeEvent: MouseEvent) => void;
249
- onMonthClick?: (month: DateStringValue) => void;
250
- withDragSlotSelect?: boolean;
251
- onSlotDragEnd?: (rangeStart: string, rangeEnd: string) => void;
252
- mode?: ScheduleMode;
253
- onExternalEventDrop?: (dataTransfer: DataTransfer, dateTime: string) => void;
254
- withEventResize?: boolean;
255
- onEventResize?: (data: EventDropData) => void;
256
- canResizeEvent?: (event: ScheduleEventData) => boolean;
257
- recurrenceExpansionLimit?: number;
258
- layout?: 'default' | 'responsive';
259
- dayViewProps?: Partial<DayViewProps>;
260
- weekViewProps?: Partial<WeekViewProps>;
261
- monthViewProps?: Partial<MonthViewProps>;
262
- yearViewProps?: Partial<YearViewProps>;
263
- mobileMonthViewProps?: Partial<MobileMonthViewProps>;
264
- }
265
- export declare const objectProp: PropType<Record<string, unknown>>;
@@ -1,114 +1,8 @@
1
- import { type PropType } from 'vue';
2
- import type { CurrentTimeIndicatorProps } from '../../component-props';
3
- import type { AnyDateValue, DateLabelFormat } from '../../types';
4
- export declare const CurrentTimeIndicator: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
5
- color: {
6
- type: StringConstructor;
7
- default: string;
8
- };
9
- startOffset: {
10
- type: StringConstructor;
11
- default: string;
12
- };
13
- endOffset: {
14
- type: StringConstructor;
15
- default: string;
16
- };
17
- topOffset: {
18
- type: StringConstructor;
19
- default: string;
20
- };
21
- timeBubbleStartOffset: {
22
- type: StringConstructor;
23
- default: string;
24
- };
25
- withTimeBubble: {
26
- type: BooleanConstructor;
27
- default: boolean;
28
- };
29
- withThumb: {
30
- type: BooleanConstructor;
31
- default: boolean;
32
- };
33
- currentTimeFormat: {
34
- type: PropType<DateLabelFormat>;
35
- default: string;
36
- };
37
- locale: StringConstructor;
38
- startTime: {
39
- type: StringConstructor;
40
- default: string;
41
- };
42
- endTime: {
43
- type: StringConstructor;
44
- default: string;
45
- };
46
- intervalMinutes: {
47
- type: NumberConstructor;
48
- default: number;
49
- };
50
- getCurrentTime: PropType<() => AnyDateValue>;
51
- }>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
52
- [key: string]: any;
53
- }> | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
54
- color: {
55
- type: StringConstructor;
56
- default: string;
57
- };
58
- startOffset: {
59
- type: StringConstructor;
60
- default: string;
61
- };
62
- endOffset: {
63
- type: StringConstructor;
64
- default: string;
65
- };
66
- topOffset: {
67
- type: StringConstructor;
68
- default: string;
69
- };
70
- timeBubbleStartOffset: {
71
- type: StringConstructor;
72
- default: string;
73
- };
74
- withTimeBubble: {
75
- type: BooleanConstructor;
76
- default: boolean;
77
- };
78
- withThumb: {
79
- type: BooleanConstructor;
80
- default: boolean;
81
- };
82
- currentTimeFormat: {
83
- type: PropType<DateLabelFormat>;
84
- default: string;
85
- };
86
- locale: StringConstructor;
87
- startTime: {
88
- type: StringConstructor;
89
- default: string;
90
- };
91
- endTime: {
92
- type: StringConstructor;
93
- default: string;
94
- };
95
- intervalMinutes: {
96
- type: NumberConstructor;
97
- default: number;
98
- };
99
- getCurrentTime: PropType<() => AnyDateValue>;
100
- }>> & Readonly<{}>, {
101
- color: string;
102
- startTime: string;
103
- endTime: string;
104
- intervalMinutes: number;
105
- startOffset: string;
106
- endOffset: string;
107
- topOffset: string;
108
- timeBubbleStartOffset: string;
109
- withTimeBubble: boolean;
110
- withThumb: boolean;
111
- currentTimeFormat: DateLabelFormat;
112
- }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
113
- export type { CurrentTimeIndicatorProps };
114
- export type CurrentTimeIndicatorStylesNames = 'currentTimeIndicator' | 'currentTimeIndicatorLine' | 'currentTimeIndicatorThumb' | 'currentTimeIndicatorTimeBubble';
1
+ export declare const CurrentTimeIndicator: import("@mantine-vue/core").MantineComponent<{
2
+ props: Omit<import("./CurrentTimeIndicator.types").CurrentTimeIndicatorProps, "rootRef">;
3
+ ref: HTMLDivElement;
4
+ element: "div";
5
+ stylesNames: import("./CurrentTimeIndicator.types").CurrentTimeIndicatorStylesNames;
6
+ vars: import("./CurrentTimeIndicator.types").CurrentTimeIndicatorCssVariables;
7
+ }>;
8
+ export type { CurrentTimeIndicatorCssVariables, CurrentTimeIndicatorFactory, CurrentTimeIndicatorOwnProps, CurrentTimeIndicatorProps, CurrentTimeIndicatorStylesNames, } from './CurrentTimeIndicator.types';
@@ -0,0 +1,89 @@
1
+ import type { BoxProps, Factory, MantineColor } from '@mantine-vue/core';
2
+ import type { StylesApiProps } from '@mantine-vue/core/styles-api';
3
+ import type { AnyDateValue, DateLabelFormat } from '../../types';
4
+ export type CurrentTimeIndicatorStylesNames = 'currentTimeIndicator' | 'currentTimeIndicatorLine' | 'currentTimeIndicatorThumb' | 'currentTimeIndicatorTimeBubble';
5
+ export type CurrentTimeIndicatorCssVariables = {
6
+ currentTimeIndicator: '--indicator-color' | '--start-offset' | '--end-offset' | '--top-offset' | '--time-bubble-start-offset' | '--time-bubble-width';
7
+ };
8
+ /**
9
+ * Props declared by `CurrentTimeIndicator` itself. See `CurrentTimeIndicatorProps` for the
10
+ * full public type.
11
+ */
12
+ export interface CurrentTimeIndicatorOwnProps extends StylesApiProps<CurrentTimeIndicatorFactory> {
13
+ /**
14
+ * Key of `theme.colors` or any valid CSS color.
15
+ * @default 'red'
16
+ */
17
+ color?: MantineColor;
18
+ /**
19
+ * Offset from the start of the row.
20
+ * @default '0px'
21
+ */
22
+ startOffset?: string;
23
+ /**
24
+ * Offset from the end of the row.
25
+ * @default '0px'
26
+ */
27
+ endOffset?: string;
28
+ /**
29
+ * Extra offset added to the computed vertical position.
30
+ * @default '0px'
31
+ */
32
+ topOffset?: string;
33
+ /**
34
+ * Offset of the time bubble from the start of the row.
35
+ * @default '0px'
36
+ */
37
+ timeBubbleStartOffset?: string;
38
+ /**
39
+ * If set, a bubble with the current time is displayed next to the line.
40
+ * @default true
41
+ */
42
+ withTimeBubble?: boolean;
43
+ /**
44
+ * If set, a thumb is displayed at the start of the line.
45
+ * @default true
46
+ */
47
+ withThumb?: boolean;
48
+ /**
49
+ * Format of the time displayed in the bubble.
50
+ * @default 'HH:mm'
51
+ */
52
+ currentTimeFormat?: DateLabelFormat;
53
+ /**
54
+ * Locale passed down to `dayjs` when formatting the time.
55
+ * @default 'en'
56
+ */
57
+ locale?: string;
58
+ /**
59
+ * First visible time of the day, `HH:mm:ss`.
60
+ * @default '00:00:00'
61
+ */
62
+ startTime?: string;
63
+ /**
64
+ * Last visible time of the day, `HH:mm:ss`.
65
+ * @default '23:59:59'
66
+ */
67
+ endTime?: string;
68
+ /**
69
+ * Length of one time slot in minutes. Used to align the indicator to whole slots when
70
+ * `endTime` does not divide evenly.
71
+ * @default 60
72
+ */
73
+ intervalMinutes?: number;
74
+ /**
75
+ * Returns the current time, called on every tick. Use it to render the indicator in
76
+ * another timezone.
77
+ * @default () => dayjs()
78
+ */
79
+ getCurrentTime?: () => AnyDateValue;
80
+ }
81
+ export interface CurrentTimeIndicatorProps extends Omit<BoxProps, keyof CurrentTimeIndicatorOwnProps>, CurrentTimeIndicatorOwnProps {
82
+ }
83
+ export type CurrentTimeIndicatorFactory = Factory<{
84
+ props: Omit<CurrentTimeIndicatorProps, 'rootRef'>;
85
+ ref: HTMLDivElement;
86
+ element: 'div';
87
+ stylesNames: CurrentTimeIndicatorStylesNames;
88
+ vars: CurrentTimeIndicatorCssVariables;
89
+ }>;
@@ -0,0 +1,20 @@
1
+ import type { CurrentTimeIndicatorOwnProps } from './CurrentTimeIndicator.types';
2
+ declare const defaultProps: {
3
+ readonly color: "red";
4
+ readonly startOffset: "0px";
5
+ readonly endOffset: "0px";
6
+ readonly topOffset: "0px";
7
+ readonly timeBubbleStartOffset: "0px";
8
+ readonly withTimeBubble: true;
9
+ readonly withThumb: true;
10
+ readonly currentTimeFormat: "HH:mm";
11
+ readonly startTime: "00:00:00";
12
+ readonly endTime: "23:59:59";
13
+ readonly intervalMinutes: 60;
14
+ };
15
+ declare const varsResolver: (theme: import("@mantine-vue/core").MantineTheme, props: any, ctx: Record<string, any>) => Record<string, Record<string, string | undefined>>;
16
+ declare const TICK_INTERVAL = 30000;
17
+ export { defaultProps, varsResolver, TICK_INTERVAL };
18
+ declare const _default: typeof __VLS_export;
19
+ export default _default;
20
+ declare const __VLS_export: import("vue").DefineComponent<CurrentTimeIndicatorOwnProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CurrentTimeIndicatorOwnProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;