@progress/kendo-vue-scheduler 3.0.9-dev.202202281506 → 3.0.9-dev.202203011321

package/dist/es/Scheduler.js

@@ -172,10 +172,7 @@ var SchedulerVue2 = {
   },
   watch: {
     view: function view(newName) {
-      this.ks.activeViewName = newName;
-      this.ks.view = this.views.find(function (currentView) {
-        return currentView.name === newName;
-      }) || this.views[0] || h(DayView);
+      this.updatePassedState(newName);
     }
   },
   // @ts-ignore
@@ -208,6 +205,7 @@ var SchedulerVue2 = {
     var viewComponent = this.getViewComponentByName(this.ks.activeViewName || view.name);
 
     var viewProps = __assign(__assign(__assign({}, this.$props), this.ks.view), {
+      showWorkHours: this.ks.showWorkHours,
       dataItems: undefined,
       views: undefined,
       defaultDate: undefined,
@@ -1083,20 +1081,7 @@ var SchedulerVue2 = {
       }
     },
     handleActiveViewNameChange: function handleActiveViewNameChange(newView, event) {
-      this.ks.activeViewName = newView;
-      this.ks.view = this.views.find(function (currentView) {
-        return currentView.name === newView;
-      }) || this.views[0] || h(DayView);
-      this.ks.dateFormat = this.getViewPropValue(this.ks.view, 'selectedDateFormat', newView) || DEFAULT_DATE_FORMAT;
-      this.ks.shortDateFormat = this.getViewPropValue(this.ks.view, 'selectedShortDateFormat', newView) || DEFAULT_SHORT_DATE_FORMAT;
-      this.ks.dateRange = this.getViewComponentByName(newView).props.dateRange.default()({
-        intl: this.intl,
-        date: this.ks.currentDate,
-        timezone: this.$props.timezone,
-        numberOfDays: this.getViewPropValue(this.ks.view, 'numberOfDays', this.ks.activeViewName),
-        workWeekStart: this.getViewPropValue(this.ks.view, 'workWeekStart', this.ks.activeViewName) || this.intl.firstDay(),
-        workWeekEnd: this.getViewPropValue(this.ks.view, 'workWeekEnd', this.ks.activeViewName) || (this.intl.firstDay() + this.getViewPropValue(this.ks.view, 'numberOfDays', this.ks.activeViewName)) % 6
-      });
+      this.updatePassedState(newView);
       this.$emit('viewchange', __assign(__assign({
         viewName: newView
       }, event), {
@@ -1152,7 +1137,21 @@ var SchedulerVue2 = {
     },
     setDate: function setDate(newDate, event) {
       this.ks.currentDate = newDate;
-      this.ks.dateRange = this.getViewComponentByName(this.ks.activeViewName).props.dateRange.default()({
+      this.updatePassedState();
+      this.$emit('datechange', {
+        date: newDate,
+        event: event
+      });
+    },
+    updatePassedState: function updatePassedState(newViewName) {
+      var newView = newViewName || this.ks.activeViewName;
+      this.ks.activeViewName = newView;
+      this.ks.view = this.views.find(function (currentView) {
+        return currentView.name === newView;
+      }) || this.views[0] || h(DayView);
+      this.ks.dateFormat = this.getViewPropValue(this.ks.view, 'selectedDateFormat', newView) || DEFAULT_DATE_FORMAT;
+      this.ks.shortDateFormat = this.getViewPropValue(this.ks.view, 'selectedShortDateFormat', newView) || DEFAULT_SHORT_DATE_FORMAT;
+      this.ks.dateRange = this.getViewComponentByName(newView).props.dateRange.default()({
         intl: this.intl,
         date: this.ks.currentDate,
         timezone: this.$props.timezone,
@@ -1160,10 +1159,6 @@ var SchedulerVue2 = {
         workWeekStart: this.getViewPropValue(this.ks.view, 'workWeekStart', this.ks.activeViewName) || this.intl.firstDay(),
         workWeekEnd: this.getViewPropValue(this.ks.view, 'workWeekEnd', this.ks.activeViewName) || (this.intl.firstDay() + this.getViewPropValue(this.ks.view, 'numberOfDays', this.ks.activeViewName)) % 6
       });
-      this.$emit('datechange', {
-        date: newDate,
-        event: event
-      });
     }
   }
 };

package/dist/es/components/header/view-selector/ViewSelectorList.js

@@ -95,6 +95,7 @@ var ViewSelectorListVue2 = {
         items: views.map(function (v) {
           return __assign(__assign({}, v.props), {
             selected: v.name === this.ks.activeViewName,
+            name: v.name,
             title: v.title || v.name
           });
         }, this),
@@ -107,6 +108,7 @@ var ViewSelectorListVue2 = {
       items: views.map(function (v) {
         return __assign(__assign({}, v.props), {
           selected: v.name === this.ks.activeViewName,
+          name: v.name,
           title: v.title || v.name
         });
       }, this),

package/dist/es/items/SchedulerViewItem.js

@@ -111,6 +111,13 @@ var SchedulerViewItemVue2 = {
   updated: function updated() {
     this.align();
     this.position();
+
+    if (!this.ks.scheduler || this.observer) {
+      return;
+    }
+
+    this.observer = new window.ResizeObserver(this.handleResize);
+    this.observer.observe(this.ks.scheduler);
   },
   destroyed: !!gh ? undefined : function () {
     if (this.observer) {
@@ -316,7 +323,13 @@ var SchedulerViewItemVue2 = {
         return;
       }
 
-      var firstSlot = first(slots);
+      var firstSlot = first(slots.sort(function (a, b) {
+        if (a.$props.start && b.$props.start) {
+          return a.$props.start.getTime() - b.$props.start.getTime();
+        }
+
+        return true;
+      }));
 
       if (!firstSlot) {
         return;
@@ -360,7 +373,10 @@ var SchedulerViewItemVue2 = {
       var rect = getRect(element);
       siblingsPerSlot.forEach(function (slot) {
         var currentOffset = 0;
-        slot.forEach(function (current) {
+        var currentSlot = slot.sort(function (a, b) {
+          return a.$props.order - b.$props.order;
+        });
+        currentSlot.forEach(function (current) {
           if (intersects(current.$props.start, current.$props.end, _this.$props.start, _this.$props.end) && !(_this.$props.dragHint || _this.$props.resizeHint) && current.$props.maxSiblingsPerSlot && current.$props.maxSiblingsPerSlot > mostSiblingsInSlot && current.$el !== element) {
             mostSiblingsInSlot = current.$props.maxSiblingsPerSlot;
           }
@@ -368,7 +384,7 @@ var SchedulerViewItemVue2 = {
           var currentRect = getRect(current.$el);
 
           if (current.$props.order !== null && current.$props.order < order) {
-            currentOffset = currentRect.top + currentRect.height - rect.top - BORDER_WIDTH * order + ITEMS_SPACING;
+            currentOffset = (currentRect.top || rect.top) + currentRect.height - rect.top - BORDER_WIDTH * order + ITEMS_SPACING;
           }
         });
 

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-scheduler',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1646060571,
+    publishDate: 1646140644,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
 };

package/dist/es/views/agenda/AgendaView.js

@@ -126,6 +126,8 @@ var AgendaViewVue2 = {
         groups: this.ks.groups,
         ranges: this.ranges
       });
+      mapItemsToSlots(items, this.agendaSlots, true);
+      mapSlotsToItems(items, this.agendaSlots, true);
       return items;
     }
   },
@@ -145,22 +147,18 @@ var AgendaViewVue2 = {
     var EditSlot = this.$props.editSlot || SchedulerEditSlot;
     var intl = provideIntlService(this);
     var localization = provideLocalizationService(this);
-    var items = this.items;
-    var agendaSlots = this.agendaSlots;
-    mapItemsToSlots(items, agendaSlots, true);
-    mapSlotsToItems(items, agendaSlots, true);
     return (// @ts-ignore  function children
       h(BaseView, {
         id: this.$props.id,
         attrs: this.v3 ? undefined : {
           id: this.$props.id,
           props: this.$props,
-          baseSlots: items,
+          baseSlots: this.items,
           ranges: this.ranges
         },
         "class": 'k-scheduler-agendaview',
         props: this.$props,
-        baseSlots: items,
+        baseSlots: this.items,
         ranges: this.ranges
       }, this.v3 ? function () {
         return [h("div", {
@@ -187,15 +185,15 @@ var AgendaViewVue2 = {
           nested: true
         }, _this.v3 ? function () {
           return [h(AgendaViewBody, {
-            agendaSlots: agendaSlots,
+            agendaSlots: _this.agendaSlots,
             attrs: _this.v3 ? undefined : {
-              agendaSlots: agendaSlots
+              agendaSlots: _this.agendaSlots
             }
           })];
         } : [h(AgendaViewBody, {
-          agendaSlots: agendaSlots,
+          agendaSlots: _this.agendaSlots,
           attrs: _this.v3 ? undefined : {
-            agendaSlots: agendaSlots
+            agendaSlots: _this.agendaSlots
           }
         })])];
       } : [h("div", {
@@ -220,15 +218,15 @@ var AgendaViewVue2 = {
         nested: true
       }, _this.v3 ? function () {
         return [h(AgendaViewBody, {
-          agendaSlots: agendaSlots,
+          agendaSlots: _this.agendaSlots,
           attrs: _this.v3 ? undefined : {
-            agendaSlots: agendaSlots
+            agendaSlots: _this.agendaSlots
           }
         })];
       } : [h(AgendaViewBody, {
-        agendaSlots: agendaSlots,
+        agendaSlots: _this.agendaSlots,
         attrs: _this.v3 ? undefined : {
-          agendaSlots: agendaSlots
+          agendaSlots: _this.agendaSlots
         }
       })])])
     );

package/dist/es/views/day/MultiDayView.js

@@ -229,6 +229,8 @@ var MultiDayViewVue2 = {
         groups: this.ks.groups,
         ranges: this.dayRanges
       });
+      mapItemsToSlots(dayItems, this.daySlots, false);
+      mapSlotsToItems(dayItems, this.daySlots, false);
       return dayItems;
     },
     timeItems: function timeItems() {
@@ -242,6 +244,8 @@ var MultiDayViewVue2 = {
       }).filter(function (item) {
         return _this.viewStart.getTime() === _this.viewEnd.getTime() || isInTimeRange(item.zonedStart, _this.viewStart, _this.viewEnd) || isInTimeRange(item.zonedEnd, _this.viewStart, _this.viewEnd) || isInTimeRange(new Date(item.zonedEnd.getTime() - (item.zonedEnd.getTime() - item.zonedStart.getTime()) / 2), _this.viewStart, _this.viewEnd);
       });
+      mapItemsToSlots(timeItems, this.timeSlots, false);
+      mapSlotsToItems(timeItems, this.timeSlots, false);
       return timeItems;
     }
   },
@@ -280,10 +284,6 @@ var MultiDayViewVue2 = {
     var timeItems = this.timeItems;
     var daySlots = this.daySlots;
     var timeSlots = this.timeSlots;
-    mapItemsToSlots(dayItems, daySlots, false);
-    mapSlotsToItems(dayItems, daySlots, false);
-    mapItemsToSlots(timeItems, timeSlots, false);
-    mapSlotsToItems(timeItems, timeSlots, false);
     return (// @ts-ignore  function children
       h(BaseView, {
         id: this.$props.id,

package/dist/es/views/month/MonthView.js

@@ -105,6 +105,8 @@ var MonthViewVue2 = {
         groups: this.ks.groups,
         ranges: this.ranges
       });
+      mapItemsToSlots(items, this.monthSlots, false);
+      mapSlotsToItems(items, this.monthSlots, false);
       return items;
     }
   },
@@ -130,9 +132,7 @@ var MonthViewVue2 = {
     var EditItem = this.$props.editItem || SchedulerEditItem;
     var EditSlot = this.$props.editSlot || SchedulerEditSlot;
     var items = this.items;
-    var monthSlots = this.monthSlots;
-    mapItemsToSlots(items, monthSlots, false);
-    mapSlotsToItems(items, monthSlots, false); // const [dataItems] = useSchedulerDataContext();
+    var monthSlots = this.monthSlots; // const [dataItems] = useSchedulerDataContext();
     // const [, setDate] = useSchedulerDateContext();
     // const [, setView] = useSchedulerActiveViewContext();
     // const views = useSchedulerViewsContext();