@progress/kendo-vue-scheduler 3.2.8-dev.202205030909 → 3.2.9

package/dist/es/components/SchedulerForm.js

@@ -25,7 +25,8 @@ import { Dialog as KendoDialog } from '@progress/kendo-vue-dialogs';
 import { provideLocalizationService } from '@progress/kendo-vue-intl';
 import { SchedulerFormEditor } from '../editors/SchedulerFormEditor'; // import { useSchedulerFieldsContext } from '../context';
 
-import { messages, editorValidationRequired, editorValidationStart, editorValidationEnd, editorSave, editorCancel, editorTitle } from '../messages'; // tslint:enable:max-line-length
+import { messages, editorValidationRequired, editorValidationStart, editorValidationEnd, editorSave, editorCancel, editorTitle } from '../messages';
+import { getTemplate } from '@progress/kendo-vue-common'; // tslint:enable:max-line-length
 
 var SchedulerFormVue2 = {
   name: 'KendoSchedulerForm',
@@ -36,10 +37,7 @@ var SchedulerFormVue2 = {
     submit: null
   },
   props: {
-    dataItem: Object,
-    renderForm: Object,
-    editor: [String, Function, Object],
-    dialog: [String, Function, Object]
+    dataItem: Object
   },
   inject: {
     ks: {
@@ -69,179 +67,18 @@ var SchedulerFormVue2 = {
     var _this = this;
 
     var h = gh || createElement;
-    var _a = this.$props,
-        Editor = _a.editor,
-        Dialog = _a.dialog,
-        validator = _a.validator; // const form = React.useRef<SchedulerFormHandle>(null);
-
-    var localization = provideLocalizationService(this); // const fields = useSchedulerFieldsContext();
-
+    var that = this;
+    var localization = provideLocalizationService(this);
     this.requiredValidationMessage = localization.toLanguageString(editorValidationRequired, messages[editorValidationRequired]);
     this.endValidationMessage = localization.toLanguageString(editorValidationEnd, messages[editorValidationEnd]);
     var editSaveMessage = localization.toLanguageString(editorSave, messages[editorSave]);
     var editCancelMessage = localization.toLanguageString(editorCancel, messages[editorCancel]);
     var editorTitleMessage = localization.toLanguageString(editorTitle, messages[editorTitle]);
     this.startValidationMessage = localization.toLanguageString(editorValidationStart, messages[editorValidationStart]);
-    return (// @ts-ignore  function children
-      h(KendoDialog, {
-        title: editorTitleMessage,
-        attrs: this.v3 ? undefined : {
-          title: editorTitleMessage,
-          appendTo: 'body',
-          minWidth: 600
-        },
-        appendTo: 'body',
-        minWidth: 600,
-        onClose: this.handleClose,
-        on: this.v3 ? undefined : {
-          "close": this.handleClose
-        },
-        "class": "k-scheduler-edit-dialog"
-      }, this.v3 ? function () {
-        return [// @ts-ignore  function children
-        h(Form, {
-          initialValues: _this.ksModifyInitialFormValues(_this.$props.dataItem),
-          attrs: _this.v3 ? undefined : {
-            initialValues: _this.ksModifyInitialFormValues(_this.$props.dataItem),
-            validator: _this.formValidator
-          },
-          onSubmit: _this.handleSubmit,
-          on: _this.v3 ? undefined : {
-            "submit": _this.handleSubmit
-          },
-          validator: _this.formValidator
-        }, _this.v3 ? function () {
-          return [// @ts-ignore  function children
-          h(SchedulerFormEditor, {
-            renderForm: _this.renderForm //   {...this.renderProps}
-            ,
-            attrs: _this.v3 ? undefined : {
-              renderForm: _this.renderForm,
-              as: Editor
-            },
-            as: Editor
-          }, _this.v3 ? function () {
-            return [h(SchedulerActionButtons, {
-              editSaveMessage: editSaveMessage,
-              attrs: _this.v3 ? undefined : {
-                editSaveMessage: editSaveMessage,
-                editCancelMessage: editCancelMessage
-              },
-              editCancelMessage: editCancelMessage,
-              onCancel: _this.handleCancel,
-              on: _this.v3 ? undefined : {
-                "cancel": _this.handleCancel
-              }
-            })];
-          } : [h(SchedulerActionButtons, {
-            editSaveMessage: editSaveMessage,
-            attrs: _this.v3 ? undefined : {
-              editSaveMessage: editSaveMessage,
-              editCancelMessage: editCancelMessage
-            },
-            editCancelMessage: editCancelMessage,
-            onCancel: _this.handleCancel,
-            on: _this.v3 ? undefined : {
-              "cancel": _this.handleCancel
-            }
-          })])];
-        } : [h(SchedulerFormEditor, {
-          renderForm: _this.renderForm,
-          attrs: _this.v3 ? undefined : {
-            renderForm: _this.renderForm,
-            as: Editor
-          },
-          as: Editor
-        }, _this.v3 ? function () {
-          return [h(SchedulerActionButtons, {
-            editSaveMessage: editSaveMessage,
-            attrs: _this.v3 ? undefined : {
-              editSaveMessage: editSaveMessage,
-              editCancelMessage: editCancelMessage
-            },
-            editCancelMessage: editCancelMessage,
-            onCancel: _this.handleCancel,
-            on: _this.v3 ? undefined : {
-              "cancel": _this.handleCancel
-            }
-          })];
-        } : [h(SchedulerActionButtons, {
-          editSaveMessage: editSaveMessage,
-          attrs: _this.v3 ? undefined : {
-            editSaveMessage: editSaveMessage,
-            editCancelMessage: editCancelMessage
-          },
-          editCancelMessage: editCancelMessage,
-          onCancel: _this.handleCancel,
-          on: _this.v3 ? undefined : {
-            "cancel": _this.handleCancel
-          }
-        })])])];
-      } : [h(Form, {
-        initialValues: _this.ksModifyInitialFormValues(_this.$props.dataItem),
-        attrs: _this.v3 ? undefined : {
-          initialValues: _this.ksModifyInitialFormValues(_this.$props.dataItem),
-          validator: _this.formValidator
-        },
-        onSubmit: _this.handleSubmit,
-        on: _this.v3 ? undefined : {
-          "submit": _this.handleSubmit
-        },
-        validator: _this.formValidator
-      }, _this.v3 ? function () {
-        return [h(SchedulerFormEditor, {
-          renderForm: _this.renderForm,
-          attrs: _this.v3 ? undefined : {
-            renderForm: _this.renderForm,
-            as: Editor
-          },
-          as: Editor
-        }, _this.v3 ? function () {
-          return [h(SchedulerActionButtons, {
-            editSaveMessage: editSaveMessage,
-            attrs: _this.v3 ? undefined : {
-              editSaveMessage: editSaveMessage,
-              editCancelMessage: editCancelMessage
-            },
-            editCancelMessage: editCancelMessage,
-            onCancel: _this.handleCancel,
-            on: _this.v3 ? undefined : {
-              "cancel": _this.handleCancel
-            }
-          })];
-        } : [h(SchedulerActionButtons, {
-          editSaveMessage: editSaveMessage,
-          attrs: _this.v3 ? undefined : {
-            editSaveMessage: editSaveMessage,
-            editCancelMessage: editCancelMessage
-          },
-          editCancelMessage: editCancelMessage,
-          onCancel: _this.handleCancel,
-          on: _this.v3 ? undefined : {
-            "cancel": _this.handleCancel
-          }
-        })])];
-      } : [h(SchedulerFormEditor, {
-        renderForm: _this.renderForm,
-        attrs: _this.v3 ? undefined : {
-          renderForm: _this.renderForm,
-          as: Editor
-        },
-        as: Editor
-      }, _this.v3 ? function () {
-        return [h(SchedulerActionButtons, {
-          editSaveMessage: editSaveMessage,
-          attrs: _this.v3 ? undefined : {
-            editSaveMessage: editSaveMessage,
-            editCancelMessage: editCancelMessage
-          },
-          editCancelMessage: editCancelMessage,
-          onCancel: _this.handleCancel,
-          on: _this.v3 ? undefined : {
-            "cancel": _this.handleCancel
-          }
-        })];
-      } : [h(SchedulerActionButtons, {
+    var renderAs;
+    var defaultRendering = // @ts-ignore  function children
+    h(SchedulerFormEditor, this.v3 ? function () {
+      return [h(SchedulerActionButtons, {
         editSaveMessage: editSaveMessage,
         attrs: _this.v3 ? undefined : {
           editSaveMessage: editSaveMessage,
@@ -252,8 +89,70 @@ var SchedulerFormVue2 = {
         on: _this.v3 ? undefined : {
           "cancel": _this.handleCancel
         }
-      })])])])
-    );
+      })];
+    } : [h(SchedulerActionButtons, {
+      editSaveMessage: editSaveMessage,
+      attrs: _this.v3 ? undefined : {
+        editSaveMessage: editSaveMessage,
+        editCancelMessage: editCancelMessage
+      },
+      editCancelMessage: editCancelMessage,
+      onCancel: _this.handleCancel,
+      on: _this.v3 ? undefined : {
+        "cancel": _this.handleCancel
+      }
+    })]);
+    renderAs = getTemplate.call(this, {
+      h: h,
+      template: this.ks.form,
+      defaultRendering: defaultRendering,
+      additionalProps: {
+        dataItem: this.dataItem,
+        editSaveMessage: editSaveMessage,
+        editCancelMessage: editCancelMessage
+      },
+      additionalListeners: {
+        onCancel: this.handleCancel
+      }
+    });
+
+    var dialogProps = __assign({
+      title: editorTitleMessage,
+      appendTo: 'body',
+      minWidth: 600
+    }, this.ks.dialogProps);
+
+    var formProps = __assign({
+      initialValues: that.ksModifyInitialFormValues(that.$props.dataItem),
+      validator: that.formValidator
+    }, this.ks.formProps);
+
+    return h(KendoDialog, __assign({
+      attrs: this.v3 ? undefined : dialogProps,
+      onClose: this.handleClose,
+      on: this.v3 ? undefined : {
+        'close': this.handleClose
+      },
+      'class': 'k-scheduler-edit-dialog'
+    }, dialogProps), this.v3 ? function () {
+      return [h(Form, __assign({
+        attrs: that.v3 ? undefined : formProps,
+        onSubmit: that.handleSubmit,
+        on: that.v3 ? undefined : {
+          'submit': that.handleSubmit
+        }
+      }, formProps), that.v3 ? function () {
+        return [renderAs];
+      } : [renderAs])];
+    } : [h(Form, __assign({
+      attrs: this.v3 ? undefined : formProps,
+      onSubmit: this.handleSubmit,
+      on: this.v3 ? undefined : {
+        'submit': this.handleSubmit
+      }
+    }, formProps), this.v3 ? function () {
+      return [renderAs];
+    } : [renderAs])]);
   },
   methods: {
     handleCancel: function handleCancel(event) {

package/dist/es/components/TimeHeaderCell.js

@@ -3,7 +3,8 @@ import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
 var inject = allVue.inject;
-import { provideIntlService } from '@progress/kendo-vue-intl'; // tslint:enable:max-line-length
+import { provideIntlService } from '@progress/kendo-vue-intl';
+import { getTemplate } from '@progress/kendo-vue-common'; // tslint:enable:max-line-length
 
 var TimeHeaderCellVue2 = {
   name: 'KendoTimeHeaderCell',
@@ -35,9 +36,21 @@ var TimeHeaderCellVue2 = {
   render: function render(createElement) {
     var h = gh || createElement;
     var intl = provideIntlService(this);
+    var renderAs;
+    var defaultRendering = intl.formatDate(this.$props.date, this.$props.format);
+    renderAs = getTemplate.call(this, {
+      h: h,
+      template: this.$props.as,
+      defaultRendering: defaultRendering,
+      additionalProps: {
+        default: defaultRendering,
+        date: this.$props.date,
+        format: this.$props.format
+      }
+    });
     return h("div", {
       "class": 'k-scheduler-cell k-heading-cell'
-    }, [intl.formatDate(this.$props.date, this.$props.format)]);
+    }, [renderAs]);
   }
 };
 var TimeHeaderCell = TimeHeaderCellVue2;

package/dist/es/items/SchedulerViewItem.js

@@ -117,23 +117,26 @@ var SchedulerViewItemVue2 = {
       that.position();
     });
 
-    if (!this.ks.scheduler) {
+    if (!this.ks.scheduler || !this.ks.scheduler.$el) {
       return;
     }
 
     this.observer = new window.ResizeObserver(this.handleResize);
-    this.observer.observe(this.ks.scheduler);
+    this.observer.observe(this.ks.scheduler.$el);
   },
   updated: function updated() {
-    this.align();
-    this.position();
+    var that = this;
+    this.$nextTick(function () {
+      that.align();
+      that.position();
+    });
 
-    if (!this.ks.scheduler || this.observer) {
+    if (!this.ks.scheduler || !this.ks.scheduler.$el || this.observer) {
       return;
     }
 
     this.observer = new window.ResizeObserver(this.handleResize);
-    this.observer.observe(this.ks.scheduler);
+    this.observer.observe(this.ks.scheduler.$el);
   },
   destroyed: !!gh ? undefined : function () {
     if (this.observer) {

package/dist/es/main.d.ts

@@ -19,6 +19,7 @@ import { SchedulerDrag, SchedulerDragProps } from './views/common/SchedulerDrag'
 import { SchedulerResize, SchedulerResizeProps } from './views/common/SchedulerResize';
 import { SchedulerForm, SchedulerFormHandle, SchedulerFormProps } from './components/SchedulerForm';
 import { SchedulerFormEditor, SchedulerFormEditorHandle, SchedulerFormEditorProps } from './editors/SchedulerFormEditor';
+import { SchedulerActionButtons } from './components/SchedulerActionButtons';
 import { SchedulerOccurrenceDialog, SchedulerOccurrenceDialogHandle, SchedulerOccurrenceDialogProps } from './components/SchedulerOccurrenceDialog';
 import { SchedulerRemoveDialog, SchedulerRemoveDialogHandle, SchedulerRemoveDialogProps } from './components/SchedulerRemoveDialog';
 import { SchedulerHeader, SchedulerHeaderProps, SchedulerHeaderHandle } from './components/header/SchedulerHeader';
@@ -39,4 +40,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, BusinessHours, BusinessHoursProps, SchedulerNavigation, SchedulerNavigationProps, NavigationDatePicker, SchedulerViewSelector, SchedulerViewSelectorProps };
+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, SchedulerActionButtons, 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

@@ -19,6 +19,7 @@ import { SchedulerDrag } from './views/common/SchedulerDrag';
 import { SchedulerResize } from './views/common/SchedulerResize';
 import { SchedulerForm } from './components/SchedulerForm';
 import { SchedulerFormEditor } from './editors/SchedulerFormEditor';
+import { SchedulerActionButtons } from './components/SchedulerActionButtons';
 import { SchedulerOccurrenceDialog } from './components/SchedulerOccurrenceDialog';
 import { SchedulerRemoveDialog } from './components/SchedulerRemoveDialog';
 import { SchedulerHeader } from './components/header/SchedulerHeader';
@@ -38,7 +39,7 @@ import { SERIES_ACTION } from './items/hooks/use-series';
 import { SHOW_OCCURRENCE_DIALOG_ACTION } from './items/hooks/use-show-occurrence-dialog';
 import { SHOW_REMOVE_DIALOG_ACTION } from './items/hooks/use-show-remove-item-dialog';
 import { SLOTS_SELECT_ACTION } from './hooks/use-slots-selection';
-export { Scheduler, AgendaView, TimelineView, DayView, WeekView, WorkWeekView, MonthView, DATA_ACTION, SchedulerItem, SchedulerItemContent, SchedulerViewItem, SchedulerEditItem, SchedulerSlot, SchedulerViewSlot, SchedulerEditSlot, SchedulerTask, SchedulerViewTask, SchedulerEditTask, SchedulerDrag, SchedulerResize, SchedulerForm, SchedulerFormEditor, SchedulerOccurrenceDialog, SchedulerRemoveDialog, 
+export { Scheduler, AgendaView, TimelineView, DayView, WeekView, WorkWeekView, MonthView, DATA_ACTION, SchedulerItem, SchedulerItemContent, SchedulerViewItem, SchedulerEditItem, SchedulerSlot, SchedulerViewSlot, SchedulerEditSlot, SchedulerTask, SchedulerViewTask, SchedulerEditTask, SchedulerDrag, SchedulerResize, SchedulerForm, SchedulerActionButtons, SchedulerFormEditor, SchedulerOccurrenceDialog, SchedulerRemoveDialog, 
 // SchedulerEditItemFormItemContext,
 // useSchedulerEditItemFormItemContext,
 // SchedulerEditItemFormItemContextType,

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: 1651568671,
+    publishDate: 1651757342,
     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

@@ -3,7 +3,7 @@ import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
 var inject = allVue.inject;
-import { getDefaultSlots, Keys } from '@progress/kendo-vue-common';
+import { getDefaultSlots, getTemplate, Keys } from '@progress/kendo-vue-common';
 import { DATA_ACTION } from '../Scheduler';
 import { setField, getField, findFirstItem, isGroupped, compareSlots, findNextItem } from '../utils';
 import { SchedulerViewSlot } from './SchedulerViewSlot';
@@ -13,7 +13,6 @@ import { SLOTS_SELECT_ACTION } from '../hooks/use-slots-selection'; // tslint:en
 var SchedulerEditSlotVue2 = {
   name: 'KendoSchedulerEditSlot',
   props: {
-    viewSlot: Object,
     tabIndex: {
       type: Number,
       default: undefined
@@ -43,6 +42,7 @@ var SchedulerEditSlotVue2 = {
     isAllDay: Boolean,
     expandable: [Boolean, Object],
     slotRender: [String, Function, Object],
+    viewSlot: [String, Function, Object],
     navDay: Boolean,
     editable: [Object, Boolean],
     itemsPerSlot: Number
@@ -125,33 +125,13 @@ var SchedulerEditSlotVue2 = {
     var selected = this.bv.selectedSlots.some(function (s) {
       return compareSlots(s, _this);
     });
-    return (// @ts-ignore  function children
-      h(SchedulerViewSlot, {
+    var editSlotRender;
+    var editSlotRenderDefaultRendering = // @ts-ignore  function children
+    h(SchedulerViewSlot, {
+      slotRender: this.$props.slotRender,
+      attrs: this.v3 ? undefined : {
         slotRender: this.$props.slotRender,
-        attrs: this.v3 ? undefined : {
-          slotRender: this.$props.slotRender,
-          isAllDay: this.isAllDay,
-          expandable: this.expandable,
-          editable: this.editable,
-          items: items,
-          row: row,
-          group: group,
-          range: range,
-          isWorkDay: isWorkDay,
-          isWorkHour: isWorkHour,
-          col: col,
-          index: index,
-          start: start,
-          end: end,
-          zonedStart: zonedStart,
-          zonedEnd: zonedEnd,
-          selected: selected,
-          navDay: navDay,
-          itemsPerSlot: itemsPerSlot,
-          tabIndex: this.currentTabIndex,
-          formItem: this.compFormItem // Focus
-
-        },
+        viewSlot: this.$props.viewSlot,
         isAllDay: this.isAllDay,
         expandable: this.expandable,
         editable: this.editable,
@@ -171,23 +151,58 @@ var SchedulerEditSlotVue2 = {
         navDay: navDay,
         itemsPerSlot: itemsPerSlot,
         tabIndex: this.currentTabIndex,
-        formItem: this.compFormItem,
-        onFocus: this.handleFocus // Mouse
-        ,
-        on: this.v3 ? undefined : {
-          "focus": this.handleFocus,
-          "doubleclick": this.handleDoubleClick,
-          "keydown": this.handleKeyDown,
-          "showmoreitems": this.handleShowMoreItemsClick
-        },
-        onDoubleclick: this.handleDoubleClick // Keyboard
-        ,
-        onKeydown: this.handleKeyDown,
-        onShowmoreitems: this.handleShowMoreItemsClick
-      }, this.v3 ? function () {
-        return [defaultSlot];
-      } : [defaultSlot])
-    );
+        formItem: this.compFormItem // Focus
+
+      },
+      viewSlot: this.$props.viewSlot,
+      isAllDay: this.isAllDay,
+      expandable: this.expandable,
+      editable: this.editable,
+      items: items,
+      row: row,
+      group: group,
+      range: range,
+      isWorkDay: isWorkDay,
+      isWorkHour: isWorkHour,
+      col: col,
+      index: index,
+      start: start,
+      end: end,
+      zonedStart: zonedStart,
+      zonedEnd: zonedEnd,
+      selected: selected,
+      navDay: navDay,
+      itemsPerSlot: itemsPerSlot,
+      tabIndex: this.currentTabIndex,
+      formItem: this.compFormItem,
+      onFocus: this.handleFocus // Mouse
+      ,
+      on: this.v3 ? undefined : {
+        "focus": this.handleFocus,
+        "doubleclick": this.handleDoubleClick,
+        "keydown": this.handleKeyDown,
+        "showmoreitems": this.handleShowMoreItemsClick
+      },
+      onDoubleclick: this.handleDoubleClick // Keyboard
+      ,
+      onKeydown: this.handleKeyDown,
+      onShowmoreitems: this.handleShowMoreItemsClick
+    }, this.v3 ? function () {
+      return [defaultSlot];
+    } : [defaultSlot]);
+    editSlotRender = getTemplate.call(this, {
+      h: h,
+      template: this.$props.viewSlot,
+      defaultRendering: editSlotRenderDefaultRendering,
+      defaultSlots: defaultSlot,
+      additionalListeners: {
+        focus: this.handleFocus,
+        doubleclick: this.handleDoubleClick,
+        keydown: this.handleKeyDown,
+        showmoreitems: this.handleShowMoreItemsClick
+      }
+    });
+    return editSlotRender;
   },
   methods: {
     handleShowMoreItemsClick: function handleShowMoreItemsClick(event) {

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

@@ -16,6 +16,10 @@ export interface SchedulerSlotProps extends Slot {
     itemsPerSlot?: number;
     /** @hidden */
     formItem?: object;
+    /** @hidden */
+    viewSlot?: any;
+    /** @hidden */
+    slotStyle?: any;
     /**
      * Specifies the `id` of the wrapping element of the SchedulerSlot.
      */

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

@@ -42,7 +42,6 @@ export interface SchedulerViewSlotHandle {
  * @hidden
  */
 export interface SchedulerViewSlotState {
-    viewSlot: SchedulerViewSlotHandle | null;
     slot: SchedulerSlotHandle | null;
 }
 /**

package/dist/es/slots/SchedulerViewSlot.js

@@ -47,7 +47,8 @@ var SchedulerViewSlotVue2 = {
     tabIndex: {
       type: Number,
       default: undefined
-    }
+    },
+    slotStyle: Object
   },
   created: function created() {
     this.viewSlot = null;
@@ -62,10 +63,16 @@ var SchedulerViewSlotVue2 = {
     }
   },
   updated: function updated() {
-    useSlotExpand(this, this.ks.scheduler, this.$props.expandable);
+    var that = this;
+    this.$nextTick(function () {
+      useSlotExpand(that, that.ks.scheduler, that.$props.expandable);
+    });
   },
   mounted: function mounted() {
-    useSlotExpand(this, this.ks.scheduler, this.$props.expandable);
+    var that = this;
+    this.$nextTick(function () {
+      useSlotExpand(that, that.ks.scheduler, that.$props.expandable);
+    });
   },
   // @ts-ignore
   setup: !gh ? undefined : function () {
@@ -147,7 +154,8 @@ var SchedulerViewSlotVue2 = {
       onDoubleclick: this.handleDoubleClick,
       onKeydown: this.handleKeyDown,
       onFocus: this.handleFocus,
-      selected: this.selected
+      selected: this.selected,
+      style: this.$props.slotStyle
     }, this.v3 ? function () {
       return [defaultSlot];
     } : [defaultSlot]);

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

@@ -90,7 +90,6 @@ var AgendaViewBodyVue2 = {
         editable: this.$props.editable,
         row: filtered.length * (this.ri.groupIndex || 0) + slotIndex,
         col: 0,
-        slot: this.$props.slot,
         viewSlot: this.$props.viewSlot,
         onDataaction: this.handleDataAction,
         on: this.v3 ? undefined : {

package/dist/es/views/common/VerticalResourceIterator.js

@@ -47,6 +47,7 @@ var VerticalResourceIteratorVue2 = {
         slotRender: more.slotRender,
         attrs: this.v3 ? undefined : {
           slotRender: more.slotRender,
+          viewSlot: more.viewSlot,
           groupIndex: currentGroupIndex,
           ranges: more.ranges,
           workDayStart: more.workDayStart,
@@ -54,6 +55,7 @@ var VerticalResourceIteratorVue2 = {
           timelineSlots: more.timelineSlots,
           editable: more.editable
         },
+        viewSlot: more.viewSlot,
         groupIndex: currentGroupIndex,
         ranges: more.ranges,
         workDayStart: more.workDayStart,
@@ -69,6 +71,7 @@ var VerticalResourceIteratorVue2 = {
           slotRender: more.slotRender,
           attrs: this.v3 ? undefined : {
             slotRender: more.slotRender,
+            viewSlot: more.viewSlot,
             ranges: more.ranges,
             groupIndex: currentGroupIndex,
             monthSlots: more.monthSlots,
@@ -76,6 +79,7 @@ var VerticalResourceIteratorVue2 = {
             itemsPerSlot: more.itemsPerSlot,
             editable: more.editable
           },
+          viewSlot: more.viewSlot,
           ranges: more.ranges,
           groupIndex: currentGroupIndex,
           monthSlots: more.monthSlots,
@@ -94,6 +98,7 @@ var VerticalResourceIteratorVue2 = {
           slotRender: more.slotRender,
           attrs: this.v3 ? undefined : {
             slotRender: more.slotRender,
+            viewSlot: more.viewSlot,
             groupIndex: currentGroupIndex,
             root: root,
             rootIndex: rootIndex,
@@ -105,8 +110,10 @@ var VerticalResourceIteratorVue2 = {
             numberOfDays: more.numberOfDays,
             workWeekStart: more.workWeekStart,
             workWeekEnd: more.workWeekEnd,
-            editable: more.editable
+            editable: more.editable,
+            currentTimeMarker: more.currentTimeMarker
           },
+          viewSlot: more.viewSlot,
           groupIndex: currentGroupIndex,
           onDataaction: this.handleDataAction,
           on: this.v3 ? undefined : {
@@ -122,7 +129,8 @@ var VerticalResourceIteratorVue2 = {
           numberOfDays: more.numberOfDays,
           workWeekStart: more.workWeekStart,
           workWeekEnd: more.workWeekEnd,
-          editable: more.editable
+          editable: more.editable,
+          currentTimeMarker: more.currentTimeMarker
         });
       }, this) : null;
     };