@@ -192,15 +192,14 @@ import {
192
192
addMinutes ,
193
193
endOfDay ,
194
194
isAfter ,
195
- isBefore ,
196
195
startOfDay ,
197
196
differenceInCalendarDays ,
198
197
addDays ,
199
198
addHours ,
200
199
differenceInDays ,
201
200
isSameDay ,
202
- min ,
203
- max
201
+ differenceInMinutes ,
202
+ roundToNearestMinutes ,
204
203
} from " date-fns" ;
205
204
import { guid } from " ../helpers/Utility" ;
206
205
@@ -314,8 +313,14 @@ function onMouseMove(mouseEvent: MouseEvent) {
314
313
const pixelsToTime = props .intervalMinutes / props .intervalHeight ;
315
314
const minuteDelta = (currentInterval - initialInterval ) * pixelsToTime ;
316
315
317
- const newStartTime = addMinutes (initialState .startDate , minuteDelta );
318
- const newEndTime = addMinutes (initialState .endDate , minuteDelta );
316
+ const newStartTime = roundToNearestMinutes (
317
+ addMinutes (initialState .startDate , minuteDelta ),
318
+ { nearestTo: props .intervalMinutes }
319
+ );
320
+ const newEndTime = roundToNearestMinutes (
321
+ addMinutes (initialState .endDate , minuteDelta ),
322
+ { nearestTo: props .intervalMinutes }
323
+ );
319
324
320
325
if (handle == " body" ) {
321
326
if (
@@ -336,17 +341,30 @@ function onMouseMove(mouseEvent: MouseEvent) {
336
341
handle === " top" ? initialState .endDate : initialState .startDate ;
337
342
const newTime = handle === " top" ? newStartTime : newEndTime ;
338
343
339
- const [startDate, endDate] = isAfter (newTime , anchor )
344
+ let [startDate, endDate] = isAfter (newTime , anchor )
340
345
? [anchor , newTime ]
341
346
: [newTime , anchor ];
342
347
343
- const mouseDownColumnDate = getDateFromX (startX );
348
+ // Prevent resizing to less than one interval in duration
349
+ if (differenceInMinutes (endDate , startDate ) < props .intervalMinutes ) {
350
+ if (mousePosition .value .y < getYFromDate (anchor )) {
351
+ startDate = addMinutes (endDate , - props .intervalMinutes );
352
+ } else {
353
+ endDate = addMinutes (startDate , props .intervalMinutes );
354
+ }
355
+ }
344
356
357
+ const mouseDownColumnDate = getDateFromX (startX );
345
358
const startOfNextDay = addDays (mouseDownColumnDate , 1 );
346
- const max = addHours (startOfNextDay , props .hoursPastMidnight );
359
+ const maxEndDate = addHours (startOfNextDay , props .hoursPastMidnight );
360
+ const maxStartDate = addMinutes (startOfNextDay , - props .intervalMinutes );
361
+
362
+ if (isAfter (startDate , maxStartDate ) || isAfter (endDate , maxEndDate )) {
363
+ return ;
364
+ }
347
365
348
- event .startDate = min ([ startDate , addMinutes ( startOfNextDay , - props . intervalMinutes )]) ;
349
- event .endDate = min ([ endDate , max ]) ;
366
+ event .startDate = startDate ;
367
+ event .endDate = endDate ;
350
368
}
351
369
}
352
370
@@ -385,6 +403,11 @@ function getDateFromY(startingDate: Date, y: number): Date {
385
403
return date ;
386
404
}
387
405
406
+ function getYFromDate(date : Date ): number {
407
+ let minutes = differenceInMinutes (date , startOfDay (date ));
408
+ return (minutes / props .intervalMinutes ) * props .intervalHeight ;
409
+ }
410
+
388
411
function getDateFromX(x : number ): Date {
389
412
let totalWidth = rootDiv .value ?.clientWidth ?? 0 ;
390
413
let columnWidth = totalWidth / range .value .length ;
@@ -410,15 +433,12 @@ function getTotalTime(date: Date) {
410
433
function createEvent() {
411
434
const hoveredDay = getDateFromX (mousePosition .value .x );
412
435
413
- // When creating an event, we fudge the initial mouse position so that
436
+ // When creating an event, we fudge the initial mouse position so that
414
437
// the start of the event is always at the beginning of the hovered interval
415
438
const effectiveMouseY = floorToNearestInterval (mousePosition .value .y );
416
439
417
- let start = getDateFromY (
418
- hoveredDay ,
419
- effectiveMouseY
420
- );
421
-
440
+ let start = getDateFromY (hoveredDay , effectiveMouseY );
441
+
422
442
if (isAfter (start , endOfDay (hoveredDay ))) {
423
443
return ;
424
444
}
@@ -428,7 +448,7 @@ function createEvent() {
428
448
description: props .defaultEventProperties ?.description ,
429
449
color: props .defaultEventProperties ?.color ?? " #2196f3" ,
430
450
startDate: start ,
431
- endDate: start ,
451
+ endDate: addMinutes ( start , props . intervalMinutes ) ,
432
452
nOfPreviousConcurrentEvents: 0 ,
433
453
totalConcurrentEvents: 0 ,
434
454
left: 0 ,
@@ -441,7 +461,7 @@ function createEvent() {
441
461
initialEventState: { ... event },
442
462
handle: " bottom" ,
443
463
x: mousePosition .value .x ,
444
- y: effectiveMouseY ,
464
+ y: effectiveMouseY + props . intervalHeight ,
445
465
};
446
466
creatingEvent = true ;
447
467
isDragging = true ;
0 commit comments