@progress/kendo-vue-scheduler 3.1.0 → 3.1.2-dev.202203221454

package/dist/es/items/SchedulerEditItem.js

@@ -19,6 +19,7 @@ var SchedulerEditItemVue2 = {
   name: 'KendoSchedulerEditItem',
   props: {
     tabIndex: Number,
+    item: [String, Function, Object],
     viewItem: [String, Function, Object],
     drag: [String, Function, Object],
     resize: [String, Function, Object],
@@ -89,7 +90,8 @@ var SchedulerEditItemVue2 = {
         showOccurrenceDialog: this.showOccurrenceDialog
       },
       currentTabIndex: this.$props.tabIndex,
-      item: null
+      currentItem: null //    item: null
+
     };
   },
   computed: {

package/dist/es/items/SchedulerItem.d.ts

@@ -177,6 +177,8 @@ export interface SchedulerItemProps extends Item {
     onResizeRelease?: (event: SchedulerItemDragEvent) => void;
     /** @hidden */
     maxSiblingsPerSlot?: number;
+    /** @hidden */
+    itemTitle?: string;
 }
 /**
  * Represents the object which is returned from the `ref` callback of the [SchedulerItem]({% slug api_scheduler_scheduleritem %}).

package/dist/es/items/SchedulerItem.js

@@ -87,7 +87,8 @@ var SchedulerItemVue2 = {
     dragHint: Boolean,
     resizeHint: Boolean,
     format: String,
-    maxSiblingsPerSlot: Number
+    maxSiblingsPerSlot: Number,
+    itemTitle: String
   },
   data: function data() {
     return {
@@ -265,7 +266,15 @@ var SchedulerItemVue2 = {
       onKeyup: this.handleKeyUp,
       "data-group-index": this.$props.group.index,
       "data-range-index": this.$props.range.index
-    }, [defaultSlot, !this.$props.resizeHint && h("span", {
+    }, [!this.$props.resizeHint && h("span", {
+      "class": "k-event-actions"
+    }, [this.$props.tail && h("span", {
+      "class": "k-icon k-i-arrow-60-left"
+    }), this.$props.isRecurring && !this.$props.isException && h("span", {
+      "class": "k-icon k-i-reload"
+    }), !this.$props.isRecurring && this.$props.isException && h("span", {
+      "class": "k-icon k-i-non-recurrence"
+    })]), defaultSlot, !this.$props.resizeHint && h("span", {
       "class": "k-event-actions"
     }, [editable.remove && h("a", {
       tabIndex: -1,

package/dist/es/items/SchedulerViewItem.js

@@ -25,6 +25,7 @@ import { getRect, setRect } from '../views/common/utils';
 import { BORDER_WIDTH } from '../constants';
 import { provideIntlService } from '@progress/kendo-vue-intl';
 import { SchedulerItemContent } from './SchedulerItemContent';
+import { getDefaultSlots, getTemplate } from '@progress/kendo-vue-common';
 var ITEMS_SPACING = 1; // tslint:enable:max-line-length
 
 var SchedulerViewItemVue2 = {
@@ -141,58 +142,16 @@ var SchedulerViewItemVue2 = {
   render: function render(createElement) {
     var _this2 = this;
 
-    var h = gh || createElement; // tslint:enable:max-line-length
+    var h = gh || createElement;
+    var defaultSlot = getDefaultSlots(this); // tslint:enable:max-line-length
 
-    var _a = this.$props,
-        itemProp = _a.item,
-        refTo = _a.refTo,
-        itemRef = _a.itemRef;
     this.intl = provideIntlService(this);
-    return (// @ts-ignore  function children
-      h(SchedulerItem, {
+    var itemRender;
+    var itemRenderDefaultRendering = // @ts-ignore  function children
+    h(SchedulerItem, {
+      ignoreIsAllDay: this.ignoreIsAllDay,
+      attrs: this.v3 ? undefined : {
         ignoreIsAllDay: this.ignoreIsAllDay,
-        attrs: this.v3 ? undefined : {
-          ignoreIsAllDay: this.ignoreIsAllDay,
-          item: this.item,
-          uid: this.uid,
-          start: this.start,
-          end: this.end,
-          originalStart: this.originalStart,
-          startTimezone: this.startTimezone,
-          endTimezone: this.endTimezone,
-          isAllDay: this.isAllDay,
-          title: this.title,
-          description: this.description,
-          occurrenceId: this.occurrenceId,
-          recurrenceExceptions: this.recurrenceExceptions,
-          recurrenceRule: this.recurrenceRule,
-          recurrenceId: this.recurrenceId,
-          dataItem: this.dataItem,
-          head: this.head,
-          tail: this.tail,
-          order: this.order,
-          zonedStart: this.zonedStart,
-          zonedEnd: this.zonedEnd,
-          slots: this.slots,
-          group: this.group,
-          range: this.range,
-          isException: this.isException,
-          isRecurring: this.isRecurring,
-          id: this.id,
-          tabIndex: this.tabIndex,
-          className: this.className,
-          itemStyle: this.itemStyle,
-          editable: this.editable,
-          selected: this.selected,
-          vertical: this.vertical,
-          dragHint: this.dragHint,
-          resizeHint: this.resizeHint,
-          format: this.format //   {...itemProps}
-          //  refTo={this}
-          ,
-          maxSiblingsPerSlot: this.maxSiblingsPerSlot //  itemRef={item}
-
-        },
         item: this.item,
         uid: this.uid,
         start: this.start,
@@ -228,59 +187,88 @@ var SchedulerViewItemVue2 = {
         dragHint: this.dragHint,
         resizeHint: this.resizeHint,
         format: this.format,
-        maxSiblingsPerSlot: this.maxSiblingsPerSlot,
-        style: __assign({
-          visibility: this.visible ? undefined : 'hidden',
-          display: this.display ? undefined : 'none'
-        }, this.$props.style)
-      }, this.v3 ? function () {
-        return [!_this2.$props.resizeHint && h("span", {
-          "class": "k-event-actions"
-        }, [_this2.$props.tail && h("span", {
-          "class": "k-icon k-i-arrow-60-left"
-        }), _this2.$props.isRecurring && !_this2.$props.isException && h("span", {
-          "class": "k-icon k-i-reload"
-        }), !_this2.$props.isRecurring && _this2.$props.isException && h("span", {
-          "class": "k-icon k-i-non-recurrence"
-        })]), !_this2.$props.resizeHint && h("div", {
-          title: _this2.itemTitle,
-          attrs: _this2.v3 ? undefined : {
-            title: _this2.itemTitle
-          }
-        }, [!_this2.$props.isAllDay && // @ts-ignore  function children
-        h(SchedulerItemContent, {
-          "class": "k-event-template k-event-time "
-        }, _this2.v3 ? function () {
-          return [_this2.itemTitle];
-        } : [_this2.itemTitle]), // @ts-ignore  function children
-        h(SchedulerItemContent, {
-          "class": "k-event-template"
-        }, _this2.v3 ? function () {
-          return [_this2.$props.title];
-        } : [_this2.$props.title])])];
-      } : [!_this2.$props.resizeHint && h("span", {
-        "class": "k-event-actions"
-      }, [_this2.$props.tail && h("span", {
-        "class": "k-icon k-i-arrow-60-left"
-      }), _this2.$props.isRecurring && !_this2.$props.isException && h("span", {
-        "class": "k-icon k-i-reload"
-      }), !_this2.$props.isRecurring && _this2.$props.isException && h("span", {
-        "class": "k-icon k-i-non-recurrence"
-      })]), !_this2.$props.resizeHint && h("div", {
+        itemTitle: this.itemTitle,
+        maxSiblingsPerSlot: this.maxSiblingsPerSlot
+      },
+      item: this.item,
+      uid: this.uid,
+      start: this.start,
+      end: this.end,
+      originalStart: this.originalStart,
+      startTimezone: this.startTimezone,
+      endTimezone: this.endTimezone,
+      isAllDay: this.isAllDay,
+      title: this.title,
+      description: this.description,
+      occurrenceId: this.occurrenceId,
+      recurrenceExceptions: this.recurrenceExceptions,
+      recurrenceRule: this.recurrenceRule,
+      recurrenceId: this.recurrenceId,
+      dataItem: this.dataItem,
+      head: this.head,
+      tail: this.tail,
+      order: this.order,
+      zonedStart: this.zonedStart,
+      zonedEnd: this.zonedEnd,
+      slots: this.slots,
+      group: this.group,
+      range: this.range,
+      isException: this.isException,
+      isRecurring: this.isRecurring,
+      id: this.id,
+      tabIndex: this.tabIndex,
+      className: this.className,
+      itemStyle: this.itemStyle,
+      editable: this.editable,
+      selected: this.selected,
+      vertical: this.vertical,
+      dragHint: this.dragHint,
+      resizeHint: this.resizeHint,
+      format: this.format,
+      itemTitle: this.itemTitle,
+      maxSiblingsPerSlot: this.maxSiblingsPerSlot,
+      style: __assign({
+        visibility: this.visible ? undefined : 'hidden',
+        display: this.display ? undefined : 'none'
+      }, this.$props.style)
+    }, this.v3 ? function () {
+      return [!_this2.$props.resizeHint && h("div", {
         title: _this2.itemTitle,
         attrs: _this2.v3 ? undefined : {
           title: _this2.itemTitle
         }
-      }, [!_this2.$props.isAllDay && h(SchedulerItemContent, {
+      }, [!_this2.$props.isAllDay && // @ts-ignore  function children
+      h(SchedulerItemContent, {
         "class": "k-event-template k-event-time "
       }, _this2.v3 ? function () {
         return [_this2.itemTitle];
-      } : [_this2.itemTitle]), h(SchedulerItemContent, {
+      } : [_this2.itemTitle]), // @ts-ignore  function children
+      h(SchedulerItemContent, {
         "class": "k-event-template"
       }, _this2.v3 ? function () {
         return [_this2.$props.title];
-      } : [_this2.$props.title])])])
-    );
+      } : [_this2.$props.title])])];
+    } : [!_this2.$props.resizeHint && h("div", {
+      title: _this2.itemTitle,
+      attrs: _this2.v3 ? undefined : {
+        title: _this2.itemTitle
+      }
+    }, [!_this2.$props.isAllDay && h(SchedulerItemContent, {
+      "class": "k-event-template k-event-time "
+    }, _this2.v3 ? function () {
+      return [_this2.itemTitle];
+    } : [_this2.itemTitle]), h(SchedulerItemContent, {
+      "class": "k-event-template"
+    }, _this2.v3 ? function () {
+      return [_this2.$props.title];
+    } : [_this2.$props.title])])]);
+    itemRender = getTemplate.call(this, {
+      h: h,
+      template: this.$props.item,
+      defaultRendering: itemRenderDefaultRendering,
+      defaultSlots: defaultSlot
+    });
+    return itemRender;
   },
   methods: {
     calculateMostSiblings: function calculateMostSiblings(slots, items) {

package/dist/es/main.d.ts

@@ -22,8 +22,12 @@ import { SchedulerFormEditor, SchedulerFormEditorHandle, SchedulerFormEditorProp
 import { SchedulerOccurrenceDialog, SchedulerOccurrenceDialogHandle, SchedulerOccurrenceDialogProps } from './components/SchedulerOccurrenceDialog';
 import { SchedulerRemoveDialog, SchedulerRemoveDialogHandle, SchedulerRemoveDialogProps } from './components/SchedulerRemoveDialog';
 import { SchedulerHeader, SchedulerHeaderProps, SchedulerHeaderHandle } from './components/header/SchedulerHeader';
+import { BusinessHours, BusinessHoursProps } from './components/footer/bussiness-hours/BusinessHours';
 import { DateHeaderCell, DateHeaderCellHandle, DateHeaderCellProps } from './components/DateHeaderCell';
 import { TimeHeaderCell, TimeHeaderCellHandle, TimeHeaderCellProps } from './components/TimeHeaderCell';
+import { SchedulerNavigation, SchedulerNavigationProps } from './components/header/navigation/SchedulerNavigation';
+import { NavigationDatePicker } from './components/header/navigation/NavigationDatePicker';
+import { SchedulerViewSelector, SchedulerViewSelectorProps } from './components/header/view-selector/SchedulerViewSelector';
 import { SchedulerFooter, SchedulerFooterProps, SchedulerFooterHandle } from './components/footer/SchedulerFooter';
 import { DRAG_ITEM_ACTION, SchedulerItemDragItemAction } from './items/hooks/use-drag-item';
 import { ITEMS_FOCUS_ACTION, SchedulerItemsFocusAction, SchedulerSlotsFocusAction, SLOTS_FOCUS_ACTION } from './hooks';
@@ -35,4 +39,4 @@ import { SchedulerItemShowOccurrenceDialogAction, SHOW_OCCURRENCE_DIALOG_ACTION
 import { SchedulerItemShowRemoveDialogAction, SHOW_REMOVE_DIALOG_ACTION } from './items/hooks/use-show-remove-item-dialog';
 import { SchedulerSlotsSelectAction, SLOTS_SELECT_ACTION } from './hooks/use-slots-selection';
 import { SchedulerGroup, SchedulerResource } from './models';
-export { Scheduler, SchedulerProps, AgendaView, TimelineView, DayView, WeekView, WorkWeekView, MonthView, SchedulerDataChangeEvent, SchedulerDateChangeEvent, SchedulerViewChangeEvent, DataAction, DATA_ACTION, SchedulerItem, SchedulerItemProps, SchedulerItemHandle, SchedulerItemContent, SchedulerItemContentProps, SchedulerViewItem, SchedulerViewItemProps, SchedulerViewItemHandle, SchedulerEditItem, SchedulerEditItemProps, SchedulerEditItemState, SchedulerEditItemAction, SchedulerEditItemHandle, SchedulerSlot, SchedulerSlotProps, SchedulerSlotHandle, SchedulerViewSlot, SchedulerViewSlotProps, SchedulerViewSlotHandle, SchedulerSlotExpandableConfig, SchedulerEditSlot, SchedulerEditSlotProps, SchedulerEditSlotHandle, SchedulerTask, SchedulerTaskProps, SchedulerTaskHandle, SchedulerViewTask, SchedulerViewTaskProps, SchedulerViewTaskHandle, SchedulerEditTask, SchedulerEditTaskProps, SchedulerEditTaskHandle, SchedulerDrag, SchedulerDragProps, SchedulerResize, SchedulerResizeProps, SchedulerForm, SchedulerFormHandle, SchedulerFormProps, SchedulerFormEditor, SchedulerFormEditorProps, SchedulerFormEditorHandle, SchedulerOccurrenceDialog, SchedulerOccurrenceDialogProps, SchedulerOccurrenceDialogHandle, SchedulerRemoveDialog, SchedulerRemoveDialogProps, SchedulerRemoveDialogHandle, SchedulerHeader, SchedulerHeaderProps, SchedulerHeaderHandle, SchedulerFooter, SchedulerFooterProps, SchedulerFooterHandle, DateHeaderCell, DateHeaderCellHandle, DateHeaderCellProps, TimeHeaderCell, TimeHeaderCellHandle, TimeHeaderCellProps, DRAG_ITEM_ACTION, SchedulerItemDragItemAction, ITEMS_FOCUS_ACTION, SchedulerItemsFocusAction, ITEMS_SELECT_ACTION, SchedulerItemsSelectAction, REMOVE_ITEM_ACTION, SchedulerItemRemoveItemAction, RESIZE_ITEM_ACTION, SchedulerItemResizeItemAction, SERIES_ACTION, SchedulerItemSeriesAction, SHOW_OCCURRENCE_DIALOG_ACTION, SchedulerItemShowOccurrenceDialogAction, SHOW_REMOVE_DIALOG_ACTION, SchedulerItemShowRemoveDialogAction, SLOTS_FOCUS_ACTION, SchedulerSlotsFocusAction, SLOTS_SELECT_ACTION, SchedulerSlotsSelectAction, SchedulerResource, SchedulerGroup };
+export { Scheduler, SchedulerProps, AgendaView, TimelineView, DayView, WeekView, WorkWeekView, MonthView, SchedulerDataChangeEvent, SchedulerDateChangeEvent, SchedulerViewChangeEvent, DataAction, DATA_ACTION, SchedulerItem, SchedulerItemProps, SchedulerItemHandle, SchedulerItemContent, SchedulerItemContentProps, SchedulerViewItem, SchedulerViewItemProps, SchedulerViewItemHandle, SchedulerEditItem, SchedulerEditItemProps, SchedulerEditItemState, SchedulerEditItemAction, SchedulerEditItemHandle, SchedulerSlot, SchedulerSlotProps, SchedulerSlotHandle, SchedulerViewSlot, SchedulerViewSlotProps, SchedulerViewSlotHandle, SchedulerSlotExpandableConfig, SchedulerEditSlot, SchedulerEditSlotProps, SchedulerEditSlotHandle, SchedulerTask, SchedulerTaskProps, SchedulerTaskHandle, SchedulerViewTask, SchedulerViewTaskProps, SchedulerViewTaskHandle, SchedulerEditTask, SchedulerEditTaskProps, SchedulerEditTaskHandle, SchedulerDrag, SchedulerDragProps, SchedulerResize, SchedulerResizeProps, SchedulerForm, SchedulerFormHandle, SchedulerFormProps, SchedulerFormEditor, SchedulerFormEditorProps, SchedulerFormEditorHandle, SchedulerOccurrenceDialog, SchedulerOccurrenceDialogProps, SchedulerOccurrenceDialogHandle, SchedulerRemoveDialog, SchedulerRemoveDialogProps, SchedulerRemoveDialogHandle, SchedulerHeader, SchedulerHeaderProps, SchedulerHeaderHandle, SchedulerFooter, SchedulerFooterProps, SchedulerFooterHandle, DateHeaderCell, DateHeaderCellHandle, DateHeaderCellProps, TimeHeaderCell, TimeHeaderCellHandle, TimeHeaderCellProps, DRAG_ITEM_ACTION, SchedulerItemDragItemAction, ITEMS_FOCUS_ACTION, SchedulerItemsFocusAction, ITEMS_SELECT_ACTION, SchedulerItemsSelectAction, REMOVE_ITEM_ACTION, SchedulerItemRemoveItemAction, RESIZE_ITEM_ACTION, SchedulerItemResizeItemAction, SERIES_ACTION, SchedulerItemSeriesAction, SHOW_OCCURRENCE_DIALOG_ACTION, SchedulerItemShowOccurrenceDialogAction, SHOW_REMOVE_DIALOG_ACTION, SchedulerItemShowRemoveDialogAction, SLOTS_FOCUS_ACTION, SchedulerSlotsFocusAction, SLOTS_SELECT_ACTION, SchedulerSlotsSelectAction, SchedulerResource, SchedulerGroup, BusinessHours, BusinessHoursProps, SchedulerNavigation, SchedulerNavigationProps, NavigationDatePicker, SchedulerViewSelector, SchedulerViewSelectorProps };

package/dist/es/main.js

@@ -22,18 +22,12 @@ import { SchedulerFormEditor } from './editors/SchedulerFormEditor';
 import { SchedulerOccurrenceDialog } from './components/SchedulerOccurrenceDialog';
 import { SchedulerRemoveDialog } from './components/SchedulerRemoveDialog';
 import { SchedulerHeader } from './components/header/SchedulerHeader';
+import { BusinessHours } from './components/footer/bussiness-hours/BusinessHours';
 import { DateHeaderCell } from './components/DateHeaderCell';
 import { TimeHeaderCell } from './components/TimeHeaderCell';
-// import {
-//     SchedulerNavigation,
-//     SchedulerNavigationProps,
-//     SchedulerNavigationHandle
-// } from './components/SchedulerNavigation';
-// import {
-//     SchedulerViewSelector,
-//     SchedulerViewSelectorProps,
-//     SchedulerViewSelectorHandle
-// } from './components/SchedulerViewSelector';
+import { SchedulerNavigation } from './components/header/navigation/SchedulerNavigation';
+import { NavigationDatePicker } from './components/header/navigation/NavigationDatePicker';
+import { SchedulerViewSelector } from './components/header/view-selector/SchedulerViewSelector';
 import { SchedulerFooter } from './components/footer/SchedulerFooter';
 import { DRAG_ITEM_ACTION } from './items/hooks/use-drag-item';
 import { ITEMS_FOCUS_ACTION, SLOTS_FOCUS_ACTION } from './hooks';
@@ -79,4 +73,4 @@ SchedulerHeader,
 // SchedulerViewSelector,
 // SchedulerViewSelectorProps,
 // SchedulerViewSelectorHandle
-SchedulerFooter, DateHeaderCell, TimeHeaderCell, DRAG_ITEM_ACTION, ITEMS_FOCUS_ACTION, ITEMS_SELECT_ACTION, REMOVE_ITEM_ACTION, RESIZE_ITEM_ACTION, SERIES_ACTION, SHOW_OCCURRENCE_DIALOG_ACTION, SHOW_REMOVE_DIALOG_ACTION, SLOTS_FOCUS_ACTION, SLOTS_SELECT_ACTION };
+SchedulerFooter, DateHeaderCell, TimeHeaderCell, DRAG_ITEM_ACTION, ITEMS_FOCUS_ACTION, ITEMS_SELECT_ACTION, REMOVE_ITEM_ACTION, RESIZE_ITEM_ACTION, SERIES_ACTION, SHOW_OCCURRENCE_DIALOG_ACTION, SHOW_REMOVE_DIALOG_ACTION, SLOTS_FOCUS_ACTION, SLOTS_SELECT_ACTION, BusinessHours, SchedulerNavigation, NavigationDatePicker, SchedulerViewSelector };

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: 1646205551,
+    publishDate: 1647960632,
     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/slots/SchedulerEditSlot.js

@@ -6,6 +6,7 @@ var inject = allVue.inject;
 import { getDefaultSlots, Keys } from '@progress/kendo-vue-common';
 import { DATA_ACTION } from '../Scheduler';
 import { setField, getField, findFirstItem, isGroupped } from '../utils';
+import { SchedulerForm } from '../components/SchedulerForm';
 import { SchedulerViewSlot } from './SchedulerViewSlot';
 import { SLOTS_FOCUS_ACTION, useEditable } from '../hooks';
 import { SLOTS_SELECT_ACTION } from '../hooks/use-slots-selection'; // tslint:enable:max-line-length
@@ -14,7 +15,6 @@ var SchedulerEditSlotVue2 = {
   name: 'KendoSchedulerEditSlot',
   props: {
     viewSlot: Object,
-    renderSlot: Object,
     form: Object,
     formItem: Object,
     refTo: [Function, Object],
@@ -38,7 +38,10 @@ var SchedulerEditSlotVue2 = {
     zonedStart: Object,
     zonedEnd: Object,
     isAllDay: Boolean,
-    expandable: [Boolean, Object]
+    expandable: [Boolean, Object],
+    slotRender: [String, Function, Object],
+    navDay: Boolean,
+    itemsPerSlot: Number
   },
   created: function created() {
     this.slot = null;
@@ -75,6 +78,8 @@ var SchedulerEditSlotVue2 = {
   },
   // @ts-ignore
   render: function render(createElement) {
+    var _this2 = this;
+
     var _this = this;
 
     var h = gh || createElement;
@@ -96,7 +101,9 @@ var SchedulerEditSlotVue2 = {
         start = _a.start,
         end = _a.end,
         zonedStart = _a.zonedStart,
-        zonedEnd = _a.zonedEnd; // const fields = useSchedulerFieldsContext();
+        zonedEnd = _a.zonedEnd,
+        navDay = _a.navDay,
+        itemsPerSlot = _a.itemsPerSlot; // const fields = useSchedulerFieldsContext();
     // const [slots] = useSchedulerViewSlotsContext();
     // const [items] = useSchedulerViewItemsContext();
     // const [selectedSlots, dispatchSlotsSelection] = useSchedulerViewSelectedSlotsContext();
@@ -107,8 +114,9 @@ var SchedulerEditSlotVue2 = {
     });
     return (// @ts-ignore  function children
       h(SchedulerViewSlot, {
-        isAllDay: this.isAllDay,
+        slotRender: this.$props.slotRender,
         attrs: this.v3 ? undefined : {
+          slotRender: this.$props.slotRender,
           isAllDay: this.isAllDay,
           expandable: this.expandable,
           items: items,
@@ -122,12 +130,14 @@ var SchedulerEditSlotVue2 = {
           start: start,
           end: end,
           zonedStart: zonedStart,
-          zonedEnd: zonedEnd //  refTo={this}
-          ,
+          zonedEnd: zonedEnd,
           selected: selected,
+          navDay: navDay,
+          itemsPerSlot: itemsPerSlot,
           tabIndex: this.currentTabIndex // Focus
 
         },
+        isAllDay: this.isAllDay,
         expandable: this.expandable,
         items: items,
         row: row,
@@ -142,30 +152,56 @@ var SchedulerEditSlotVue2 = {
         zonedStart: zonedStart,
         zonedEnd: zonedEnd,
         selected: selected,
+        navDay: navDay,
+        itemsPerSlot: itemsPerSlot,
         tabIndex: this.currentTabIndex,
         onFocus: this.handleFocus // Mouse
         ,
         on: this.v3 ? undefined : {
           "focus": this.handleFocus,
           "doubleclick": this.handleDoubleClick,
-          "keydown": this.handleKeyDown
+          "keydown": this.handleKeyDown,
+          "showmoreitems": this.handleShowMoreItemsClick
         },
         onDoubleclick: this.handleDoubleClick // Keyboard
         ,
-        onKeydown: this.handleKeyDown
+        onKeydown: this.handleKeyDown,
+        onShowmoreitems: this.handleShowMoreItemsClick
       }, this.v3 ? function () {
-        return [defaultSlot];
-      } : [defaultSlot]) // (this.formItem && <SchedulerForm
-      //     dataItem={this.formItem}
-      //     onSubmit={this.handleEditFormSubmit}
-      //     onClose={this.handleEditFormClose}
-      //     onCancel={this.handleEditFormCancel}
-      // />
-      // </SchedulerEditSlotContext>
-
+        return [defaultSlot, _this2.currentFormItem && h(SchedulerForm, {
+          dataItem: _this2.formItem,
+          attrs: _this2.v3 ? undefined : {
+            dataItem: _this2.formItem
+          },
+          onSubmit: _this2.handleEditFormSubmit,
+          on: _this2.v3 ? undefined : {
+            "submit": _this2.handleEditFormSubmit,
+            "close": _this2.handleEditFormClose,
+            "cancel": _this2.handleEditFormCancel
+          },
+          onClose: _this2.handleEditFormClose,
+          onCancel: _this2.handleEditFormCancel
+        })];
+      } : [defaultSlot, _this2.currentFormItem && h(SchedulerForm, {
+        dataItem: _this2.formItem,
+        attrs: _this2.v3 ? undefined : {
+          dataItem: _this2.formItem
+        },
+        onSubmit: _this2.handleEditFormSubmit,
+        on: _this2.v3 ? undefined : {
+          "submit": _this2.handleEditFormSubmit,
+          "close": _this2.handleEditFormClose,
+          "cancel": _this2.handleEditFormCancel
+        },
+        onClose: _this2.handleEditFormClose,
+        onCancel: _this2.handleEditFormCancel
+      })])
     );
   },
   methods: {
+    handleShowMoreItemsClick: function handleShowMoreItemsClick(event) {
+      this.$emit('showmoreitems', event);
+    },
     createDataItemFromSlot: function createDataItemFromSlot() {
       var dataItem = {};
       setField(dataItem, this.fields.start, new Date(this.$props.start.getTime()));
@@ -191,7 +227,7 @@ var SchedulerEditSlotVue2 = {
       if (this.computedEditable.select) {
         this.dispatchSlotsSelection({
           type: SLOTS_SELECT_ACTION.select,
-          slot: this.renderSlot
+          slot: this.slotRender
         }, event.event);
       }
 
@@ -302,6 +338,10 @@ var SchedulerEditSlotVue2 = {
       }
 
       this.setFormItem(value, event);
+    },
+    setFormItem: function setFormItem(dataItem, event) {
+      this.currentFormItem = dataItem;
+      this.$emit('formitemchange', event);
     }
   }
 };

package/dist/es/slots/SchedulerSlot.d.ts

@@ -10,6 +10,10 @@ import { Slot, SchedulerSlotMouseEvent, SchedulerSlotKeyboardEvent, SchedulerSlo
 export interface SchedulerSlotProps extends Slot {
     /** @hidden */
     refTo: any;
+    /** @hidden */
+    navDay?: boolean;
+    /** @hidden */
+    itemsPerSlot?: number;
     /**
      * Specifies the `id` of the wrapping element of the SchedulerSlot.
      */

package/dist/es/slots/SchedulerSlot.js

@@ -21,7 +21,11 @@ var gh = allVue.h;
 var inject = allVue.inject;
 import { getDefaultSlots } from '@progress/kendo-vue-common';
 import { COLLECTION_ACTION, formatEventTime } from '../utils';
-import { provideIntlService } from '@progress/kendo-vue-intl'; // tslint:enable:max-line-length
+import { provideIntlService } from '@progress/kendo-vue-intl';
+import { ShowMoreItemsButton } from '../components/ShowMoreItemsButton';
+var DAY_FORMAT = {
+  skeleton: 'dd'
+}; // tslint:enable:max-line-length
 
 var SchedulerSlotVue2 = {
   name: 'KendoSchedulerSlot',
@@ -46,7 +50,9 @@ var SchedulerSlotVue2 = {
     end: Date,
     zonedStart: Object,
     zonedEnd: Object,
-    isAllDay: Boolean
+    isAllDay: Boolean,
+    navDay: Boolean,
+    itemsPerSlot: Number
   },
   computed: {
     currentTabIndex: function currentTabIndex() {
@@ -165,9 +171,19 @@ var SchedulerSlotVue2 = {
       "data-slot-group": this.$props.group.index,
       "data-slot-range": this.$props.range.index,
       "data-slot-index": this.$props.index
-    }, [defaultSlot]);
+    }, [this.navDay && h("span", {
+      "class": "k-link k-nav-day"
+    }, [this.intl.formatDate(new Date(this.end.getTime() - (this.end.getTime() - this.start.getTime()) / 2), DAY_FORMAT)]), this.itemsPerSlot < this.items.length && h(ShowMoreItemsButton, {
+      onClick: this.handleShowMoreItemsClick,
+      on: this.v3 ? undefined : {
+        "click": this.handleShowMoreItemsClick
+      }
+    }), defaultSlot]);
   },
   methods: {
+    handleShowMoreItemsClick: function handleShowMoreItemsClick(event) {
+      this.$emit('showmoreitems', event);
+    },
     handleFocus: function handleFocus(event) {
       this.$emit('focus', {
         event: event,

package/dist/es/slots/SchedulerViewSlot.d.ts

@@ -22,7 +22,7 @@ export interface SchedulerViewSlotProps extends SchedulerSlotProps {
      *
      * The default Component is: [SchedulerSlot]({% slug api_scheduler_schedulerslot %}).
      */
-    renderSlot?: any;
+    slotRender?: any;
     /**
      * Set to `false` will render the `slot` as is, without expanding depending on the `items` inside it.
      *