I feel like this is a bit of a longshot but I'll ask anyway.
I have a component that displays the angular-calendar day-view-scheduler. I use this to display a view of any given day with the events that are scheduled on that particular day. One of the requirements I was given is to have this day-view-scheduler applied to a week view so it shows a higher level view of what is going on for the week. I modified a week-view to display a day-view-scheduler component instead of a singular column as it does normally.
I have this working as needed except for the ability to drag and drop events from one day to another. The events don't follow the cursor when I try to drag them across day boundaries, they are essentially stuck in the day column and that leaves me puzzled and out of luck.
Here is the html code associated with this week view component:
<div class="cal-week-view" role="grid">
<mwl-calendar-week-view-header
[days]="days"
[locale]="locale"
[customTemplate]="headerTemplate"
(dayHeaderClicked)="dayHeaderClicked.emit($event)"
(eventDropped)="eventDropped({ dropData: $event }, $event.newStart, true)"
(dragEnter)="dateDragEnter($event.date)">
</mwl-calendar-week-view-header>
<div class="cal-time-events" mwlDroppable (dragEnter)="dragEnter('time')" (dragLeave)="dragLeave('time')">
<div *ngIf="view.hourColumns.length > 0 && daysInWeek !== 1" class="cal-time-label-column">
<div *ngFor="let hour of view.hourColumns[0].hours; trackBy: trackByHour; let odd = odd" class="cal-hour" [class.cal-hour-odd]="odd">
<mwl-calendar-week-view-hour-segment
*ngFor="let segment of hour.segments; trackBy: trackByHourSegment"
[style.height.px]="hourSegmentHeight"
[segment]="segment"
[segmentHeight]="hourSegmentHeight"
[locale]="locale"
[customTemplate]="hourSegmentTemplate"
[isTimeLabel]="true"
[daysInWeek]="daysInWeek">
</mwl-calendar-week-view-hour-segment>
</div>
</div>
<div #dayColumns class="cal-day-columns" [class.cal-resize-active]="timeEventResizes.size > 0">
<div *ngFor="let column of view.hourColumns; trackBy: trackByHourColumn" class="cal-day-column">
<mwl-day-view-scheduler
[viewDate]="column.date"
[events]="events"
[users]="users"
[showHours]="false"
[dayStartHour]="8"
[dayEndHour]="17"
[hourSegments]="hourSegments"
[templateMode]="templateMode"
[eventTemplate]="customTemplate"
[hourSegmentHeight]="25"
(eventTimesChanged)="eventChanged($event)"
(userChanged)="resourceChanged($event)"
(clipboardEventDropped)="eventChanged($event)">
</mwl-day-view-scheduler>
</div>
</div>
<ng-template #customTemplate let-event="weekEvent">
<app-appointment-formatter [event]="event"></app-appointment-formatter>
</ng-template>
</div>
</div>
My guess is that there is some sort of limiter or boundary associated with the mwlDroppable, I'm just not sure how to remove it. Any input or insight would be greatly appreciated.