@progress/kendo-vue-scheduler 3.1.3 → 3.1.5-dev.202204110939

package/dist/es/items/SchedulerEditItem.js

@@ -1,19 +1,41 @@
-// @ts-ignore
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+
+      for (var p in s) {
+        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+      }
+    }
+
+    return t;
+  };
+
+  return __assign.apply(this, arguments);
+}; // @ts-ignore
+
+
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
 var inject = allVue.inject;
-import { Keys } from '@progress/kendo-vue-common';
+import { SchedulerOccurrenceDialog } from '../components/SchedulerOccurrenceDialog';
+import { SchedulerForm } from '../components/SchedulerForm';
+import { SchedulerRemoveDialog } from '../components/SchedulerRemoveDialog';
+import { DATA_ACTION } from '../Scheduler';
+import { clone, Keys } from '@progress/kendo-vue-common';
+import { SchedulerDrag } from '../views/common/SchedulerDrag';
 import { SchedulerViewItem } from './SchedulerViewItem';
 import { ITEMS_FOCUS_ACTION, SLOTS_FOCUS_ACTION, useEditable } from '../hooks';
-import { FORM_ITEM_ACTION, useFormItem } from './hooks/use-form-item';
-import { SHOW_OCCURRENCE_DIALOG_ACTION, useShowOccurrenceDialog } from './hooks/use-show-occurrence-dialog';
-import { REMOVE_ITEM_ACTION, useRemoveItem } from './hooks/use-remove-item';
-import { SHOW_REMOVE_DIALOG_ACTION, useShowRemoveDialog } from './hooks/use-show-remove-item-dialog';
+import { FORM_ITEM_ACTION } from './hooks/use-form-item';
+import { showOccurrenceDialogReducer, SHOW_OCCURRENCE_DIALOG_ACTION, useShowOccurrenceDialog } from './hooks/use-show-occurrence-dialog';
+import { REMOVE_ITEM_ACTION } from './hooks/use-remove-item';
+import { showRemoveDialogReducer, SHOW_REMOVE_DIALOG_ACTION, useShowRemoveDialog } from './hooks/use-show-remove-item-dialog';
 import { DRAG_ITEM_ACTION, useDragItem } from './hooks/use-drag-item';
 import { RESIZE_ITEM_ACTION, useResizeItem } from './hooks/use-resize-item';
-import { SERIES_ACTION, useSeries } from './hooks/use-series';
-import { ITEMS_SELECT_ACTION } from '../hooks/use-items-selection'; // tslint:enable:max-line-length
+import { seriesReducer, SERIES_ACTION, useSeries } from './hooks/use-series';
+import { ITEMS_SELECT_ACTION } from '../hooks/use-items-selection';
+import { findMaster } from '../utils'; // tslint:enable:max-line-length
 
 var SchedulerEditItemVue2 = {
   name: 'KendoSchedulerEditItem',
@@ -30,9 +52,18 @@ var SchedulerEditItemVue2 = {
     dragItem: Object,
     resizeItem: Object,
     removeItem: Object,
-    showOccurrenceDialog: Boolean,
-    showRemoveDialog: Boolean,
-    series: Boolean,
+    showOccurrenceDialog: {
+      type: Boolean,
+      default: undefined
+    },
+    showRemoveDialog: {
+      type: Boolean,
+      default: undefined
+    },
+    series: {
+      type: Boolean,
+      default: undefined
+    },
     uid: [String, Number],
     start: Date,
     end: Date,
@@ -71,6 +102,9 @@ var SchedulerEditItemVue2 = {
   inject: {
     bv: {
       default: null
+    },
+    ks: {
+      default: null
     }
   },
   provide: function provide() {
@@ -90,22 +124,41 @@ var SchedulerEditItemVue2 = {
         showOccurrenceDialog: this.showOccurrenceDialog
       },
       currentTabIndex: this.$props.tabIndex,
-      currentItem: null //    item: null
+      currentFormItem: null,
+      currentSelected: null,
+      currentSeries: null,
+      currentRemoveItem: null,
+      currentDragItem: null,
+      currentResizeItem: null,
+      currentShowRemoveDialog: null,
+      currentShowOccurrenceDialog: null //    item: null
 
     };
   },
   computed: {
-    currentState: function currentState() {
-      return {
-        selected: this.selected,
-        series: this.series,
-        formItem: this.formItem,
-        dragItem: this.dragItem,
-        resizeItem: this.resizeItem,
-        removeItem: this.removeItem,
-        showRemoveDialog: this.showRemoveDialog,
-        showOccurrenceDialog: this.showOccurrenceDialog
-      };
+    compSelected: function compSelected() {
+      return this.selected !== undefined ? this.selected : this.currentSelected;
+    },
+    compSeries: function compSeries() {
+      return this.series !== undefined ? this.series : this.currentSeries;
+    },
+    compFormItem: function compFormItem() {
+      return this.formItem !== undefined ? this.formItem : this.currentFormItem;
+    },
+    compRemoveItem: function compRemoveItem() {
+      return this.removeItem !== undefined ? this.removeItem : this.currentRemoveItem;
+    },
+    compDragItem: function compDragItem() {
+      return this.dragItem !== undefined ? this.dragItem : this.currentDragItem;
+    },
+    compResizeItem: function compResizeItem() {
+      return this.resizeItem !== undefined ? this.resizeItem : this.currentResizeItem;
+    },
+    compShowRemoveDialog: function compShowRemoveDialog() {
+      return this.showRemoveDialog !== undefined ? this.showRemoveDialog : this.currentShowRemoveDialog;
+    },
+    compShowOccurrenceDialog: function compShowOccurrenceDialog() {
+      return this.showOccurrenceDialog !== undefined ? this.showOccurrenceDialog : this.currentShowOccurrenceDialog;
     },
     actionsReducerMap: function actionsReducerMap() {
       var _a;
@@ -126,6 +179,8 @@ var SchedulerEditItemVue2 = {
   },
   // @ts-ignore
   render: function render(createElement) {
+    var _this2 = this;
+
     var _this = this;
 
     var h = gh || createElement; // tslint:enable:max-line-length
@@ -165,51 +220,41 @@ var SchedulerEditItemVue2 = {
 
     var _b = useSeries(null, propSeries, onSeriesChange),
         series = _b[0],
-        dispatchSeries = _b[1];
-
-    var _c = useFormItem({
-      series: series,
-      onDataaction: onDataaction
-    }, [null, propFormItem, onFormItemChange]),
-        formItem = _c[0],
-        setFormItem = _c[1],
-        dispatchFormItem = _c[2];
-
-    var _d = useDragItem({
-      dataItem: this.$props.dataItem,
-      ignoreIsAllDay: this.$props.ignoreIsAllDay,
-      isAllDay: this.$props.isAllDay,
-      onDataaction: onDataaction
-    }, [null, propDragItem, onDragItemChange]),
-        dragItem = _d[0],
-        setDragItem = _d[1],
-        dispatchDragItem = _d[2];
-
-    var _e = useResizeItem({
+        dispatchSeries = _b[1]; // const [formItem, setFormItem, dispatchFormItem] = useFormItem(
+    //     { series, onDataaction},
+    //     [null, propFormItem, onFormItemChange]
+    // );
+    // const [dragItem, setDragItem, dispatchDragItem] = useDragItem(
+    //     { 
+    //         dataItem: this.$props.dataItem, 
+    //         ignoreIsAllDay: this.$props.ignoreIsAllDay, 
+    //         isAllDay: this.$props.isAllDay, 
+    //         onDataaction },
+    //     [null, propDragItem, onDragItemChange]
+    // );
+
+
+    var _c = useResizeItem({
       dataItem: this.$props.dataItem,
       onDataaction: onDataaction
     }, [null, propResizeItem, onResizeItemChange]),
-        resizeItem = _e[0],
-        setResizeItem = _e[1],
-        dispatchResizeItem = _e[2];
+        resizeItem = _c[0],
+        setResizeItem = _c[1],
+        dispatchResizeItem = _c[2]; // const [removeItem, setRemoveItem, dispatchRemoveItem] = useRemoveItem(
+    //     { series, onDataaction},
+    //     [null, propRemoveItem, onRemoveItemChange]
+    // );
 
-    var _f = useRemoveItem({
-      series: series,
-      onDataaction: onDataaction
-    }, [null, propRemoveItem, onRemoveItemChange]),
-        removeItem = _f[0],
-        setRemoveItem = _f[1],
-        dispatchRemoveItem = _f[2];
 
-    var _g = useShowRemoveDialog(false, propShowRemoveDialog, onShowRemoveDialogChange),
-        showRemoveDialog = _g[0],
-        setShowRemoveDialog = _g[1],
-        dispatchShowRemoveDialog = _g[2];
+    var _d = useShowRemoveDialog(false, propShowRemoveDialog, onShowRemoveDialogChange),
+        showRemoveDialog = _d[0],
+        setShowRemoveDialog = _d[1],
+        dispatchShowRemoveDialog = _d[2];
 
-    var _h = useShowOccurrenceDialog(false, propShowOccurrenceDialog, onShowOccurrenceDialogChange),
-        showOccurrenceDialog = _h[0],
-        setShowOccurrenceDialog = _h[1],
-        dispatchShowOccurrenceDialog = _h[2];
+    var _e = useShowOccurrenceDialog(false, propShowOccurrenceDialog, onShowOccurrenceDialogChange),
+        showOccurrenceDialog = _e[0],
+        setShowOccurrenceDialog = _e[1],
+        dispatchShowOccurrenceDialog = _e[2];
 
     var items = this.bv.items; // useSchedulerViewItemsContext();
     // const [,dispatchViewItemsFocus] = useSchedulerViewFocusedItemsContext();
@@ -218,15 +263,7 @@ var SchedulerEditItemVue2 = {
     var selected = Boolean(this.bv.selectedItems && this.bv.selectedItems.some(function (si) {
       return si === _this.item;
     }));
-    return (// <SchedulerEditItemContext
-      //     props={this.$props}
-      //     form={[formItem, setFormItem, dispatchFormItem]}
-      //     drag={[dragItem, setDragItem, dispatchDragItem]}
-      //     resize={[resizeItem, setResizeItem, dispatchResizeItem]}
-      //     remove={[removeItem, setRemoveItem, dispatchRemoveItem ]}
-      //     showRemoveDialog={[showRemoveDialog, setShowRemoveDialog, dispatchShowRemoveDialog]}
-      //     showOccurrenceDialog={[showOccurrenceDialog, setShowOccurrenceDialog, dispatchShowOccurrenceDialog]}
-      // >
+    return (// @ts-ignore  function children
       h(SchedulerViewItem, {
         ignoreIsAllDay: this.ignoreIsAllDay,
         attrs: this.v3 ? undefined : {
@@ -342,25 +379,149 @@ var SchedulerEditItemVue2 = {
         onResizeenddrag: this.handleResizeEndDrag,
         onResizestartdrag: this.handleResizeStartDrag,
         onResizeselease: this.handleResizeRelease
-      }) // {((dragItem && editable.drag)) && (Array.isArray(dragItem) 
-      //     ? (dragItem as any).map((di, idx) => (
-      //     <Drag
-      //         key={idx}
-      //         ignoreIsAllDay={ignoreIsAllDay}
-      //         dataItem={di}
-      //         vertical={this.$props.vertical}
-      //         viewItem={ViewItem}
-      //         item={this.$props.item}
-      //     /> 
-      //     ))
-      //     : (<Drag
-      //         ignoreIsAllDay={ignoreIsAllDay}
-      //         dataItem={dragItem}
-      //         vertical={this.$props.vertical}
-      //         viewItem={ViewItem}
-      //         item={this.$props.item}
-      //     />))}
-      // {((resizeItem && editable.resize)) && (Array.isArray(resizeItem)
+      }, this.v3 ? function () {
+        return [_this2.compFormItem && !showOccurrenceDialog && editable.edit && h(SchedulerForm, {
+          dataItem: _this2.compFormItem,
+          attrs: _this2.v3 ? undefined : {
+            dataItem: _this2.compFormItem
+          },
+          onSubmit: _this2.handleFormSubmit,
+          on: _this2.v3 ? undefined : {
+            "submit": _this2.handleFormSubmit,
+            "close": _this2.handleCancel,
+            "cancel": _this2.handleCancel
+          },
+          onClose: _this2.handleCancel,
+          onCancel: _this2.handleCancel
+        }), _this2.compDragItem && editable.drag && (Array.isArray(_this2.compDragItem) ? _this2.compDragItem.map(function (di, idx) {
+          return h(SchedulerDrag, {
+            key: idx,
+            ignoreIsAllDay: ignoreIsAllDay,
+            attrs: this.v3 ? undefined : {
+              ignoreIsAllDay: ignoreIsAllDay,
+              dataItem: di,
+              vertical: this.$props.vertical,
+              viewItem: ViewItem,
+              item: this.$props.dataItem
+            },
+            dataItem: di,
+            vertical: this.$props.vertical,
+            viewItem: ViewItem,
+            item: this.$props.dataItem
+          });
+        }, _this2) : h(SchedulerDrag, {
+          ignoreIsAllDay: ignoreIsAllDay,
+          attrs: _this2.v3 ? undefined : {
+            ignoreIsAllDay: ignoreIsAllDay,
+            dataItem: _this2.compDragItem,
+            vertical: _this2.$props.vertical,
+            viewItem: ViewItem,
+            item: _this2.$props.dataItem
+          },
+          dataItem: _this2.compDragItem,
+          vertical: _this2.$props.vertical,
+          viewItem: ViewItem,
+          item: _this2.$props.dataItem
+        })), _this2.compShowOccurrenceDialog && h(SchedulerOccurrenceDialog, {
+          dataItem: _this2.compFormItem || _this2.compDragItem || _this2.compResizeItem || _this2.compRemoveItem,
+          attrs: _this2.v3 ? undefined : {
+            dataItem: _this2.compFormItem || _this2.compDragItem || _this2.compResizeItem || _this2.compRemoveItem,
+            isRemove: !!_this2.compRemoveItem
+          },
+          isRemove: !!_this2.compRemoveItem,
+          onClose: _this2.handleCancel,
+          on: _this2.v3 ? undefined : {
+            "close": _this2.handleCancel,
+            "occurrenceclose": _this2.handleOccurrenceClick,
+            "seriesclose": _this2.handleSeriesClick
+          },
+          onOccurrenceclose: _this2.handleOccurrenceClick,
+          onSeriesclose: _this2.handleSeriesClick
+        }), _this2.compShowRemoveDialog && _this2.compRemoveItem && editable.remove && h(SchedulerRemoveDialog, {
+          dataItem: _this2.compRemoveItem,
+          attrs: _this2.v3 ? undefined : {
+            dataItem: _this2.compRemoveItem
+          },
+          onClose: _this2.handleCancel,
+          on: _this2.v3 ? undefined : {
+            "close": _this2.handleCancel,
+            "cancel": _this2.handleCancel,
+            "confirm": _this2.handleRemoveConfirm
+          },
+          onCancel: _this2.handleCancel,
+          onConfirm: _this2.handleRemoveConfirm
+        })];
+      } : [_this2.compFormItem && !showOccurrenceDialog && editable.edit && h(SchedulerForm, {
+        dataItem: _this2.compFormItem,
+        attrs: _this2.v3 ? undefined : {
+          dataItem: _this2.compFormItem
+        },
+        onSubmit: _this2.handleFormSubmit,
+        on: _this2.v3 ? undefined : {
+          "submit": _this2.handleFormSubmit,
+          "close": _this2.handleCancel,
+          "cancel": _this2.handleCancel
+        },
+        onClose: _this2.handleCancel,
+        onCancel: _this2.handleCancel
+      }), _this2.compDragItem && editable.drag && (Array.isArray(_this2.compDragItem) ? _this2.compDragItem.map(function (di, idx) {
+        return h(SchedulerDrag, {
+          key: idx,
+          ignoreIsAllDay: ignoreIsAllDay,
+          attrs: this.v3 ? undefined : {
+            ignoreIsAllDay: ignoreIsAllDay,
+            dataItem: di,
+            vertical: this.$props.vertical,
+            viewItem: ViewItem,
+            item: this.$props.dataItem
+          },
+          dataItem: di,
+          vertical: this.$props.vertical,
+          viewItem: ViewItem,
+          item: this.$props.dataItem
+        });
+      }, _this2) : h(SchedulerDrag, {
+        ignoreIsAllDay: ignoreIsAllDay,
+        attrs: _this2.v3 ? undefined : {
+          ignoreIsAllDay: ignoreIsAllDay,
+          dataItem: _this2.compDragItem,
+          vertical: _this2.$props.vertical,
+          viewItem: ViewItem,
+          item: _this2.$props.dataItem
+        },
+        dataItem: _this2.compDragItem,
+        vertical: _this2.$props.vertical,
+        viewItem: ViewItem,
+        item: _this2.$props.dataItem
+      })), _this2.compShowOccurrenceDialog && h(SchedulerOccurrenceDialog, {
+        dataItem: _this2.compFormItem || _this2.compDragItem || _this2.compResizeItem || _this2.compRemoveItem,
+        attrs: _this2.v3 ? undefined : {
+          dataItem: _this2.compFormItem || _this2.compDragItem || _this2.compResizeItem || _this2.compRemoveItem,
+          isRemove: !!_this2.compRemoveItem
+        },
+        isRemove: !!_this2.compRemoveItem,
+        onClose: _this2.handleCancel,
+        on: _this2.v3 ? undefined : {
+          "close": _this2.handleCancel,
+          "occurrenceclose": _this2.handleOccurrenceClick,
+          "seriesclose": _this2.handleSeriesClick
+        },
+        onOccurrenceclose: _this2.handleOccurrenceClick,
+        onSeriesclose: _this2.handleSeriesClick
+      }), _this2.compShowRemoveDialog && _this2.compRemoveItem && editable.remove && h(SchedulerRemoveDialog, {
+        dataItem: _this2.compRemoveItem,
+        attrs: _this2.v3 ? undefined : {
+          dataItem: _this2.compRemoveItem
+        },
+        onClose: _this2.handleCancel,
+        on: _this2.v3 ? undefined : {
+          "close": _this2.handleCancel,
+          "cancel": _this2.handleCancel,
+          "confirm": _this2.handleRemoveConfirm
+        },
+        onCancel: _this2.handleCancel,
+        onConfirm: _this2.handleRemoveConfirm
+      })]) // {((resizeItem && editable.resize)) && (Array.isArray(resizeItem)
       //     ? (resizeItem as any).map((ri, idx) => (
       //     <Resize
       //         key={idx}
@@ -382,38 +543,116 @@ var SchedulerEditItemVue2 = {
       //         vertical={this.$props.vertical}
       //         />
       //     ))}
-      // {(formItem && !showOccurrenceDialog && editable.edit) && (<Form
-      // dataItem={formItem}
-      // onSubmit={this.handleFormSubmit}
-      // onClose={this.handleCancel}
-      // onCancel={this.handleCancel}
-      // />)}
-      // {(showOccurrenceDialog) && (<OccurrenceDialog
-      // dataItem={formItem || dragItem || resizeItem || removeItem}
-      // isRemove={removeItem !== null}
-      // onClose={this.handleCancel}
-      // onOccurrenceClick={this.handleOccurrenceClick}
-      // onSeriesClick={this.handleSeriesClick}
-      // />)}
-      // {(showRemoveDialog && removeItem && editable.remove) && (<RemoveDialog
-      // dataItem={removeItem}
-      // onClose={this.handleCancel}
-      // onCancel={this.handleCancel}
-      // onConfirm={this.handleRemoveConfirm}
-      // />)}
-      // </SchedulerEditItemContext>
 
     );
   },
   methods: {
+    dispatchSeries: function dispatchSeries(action, _event) {
+      var newSeries = seriesReducer(this.compSeries, action);
+      this.currentSeries = newSeries;
+      this.$emit('serieschange', newSeries);
+    },
+    dispatchItemSelection: function dispatchItemSelection(action, _event) {
+      this.aaa = action;
+    },
+    dispatchRemoveItem: function dispatchRemoveItem(action, _event) {
+      var newRemoveItem;
+
+      switch (action.type) {
+        case REMOVE_ITEM_ACTION.set:
+          newRemoveItem = action.payload;
+          break;
+
+        case REMOVE_ITEM_ACTION.reset:
+          newRemoveItem = null;
+          break;
+
+        case REMOVE_ITEM_ACTION.complete:
+          if (this.compRemoveItem) {
+            this.$emit('dataaction', {
+              type: DATA_ACTION.remove,
+              series: this.compSeries,
+              dataItem: this.compRemoveItem
+            });
+          }
+
+          newRemoveItem = null;
+          break;
+
+        default:
+          newRemoveItem = this.compRemoveItem;
+          break;
+      }
+
+      this.currentRemoveItem = newRemoveItem;
+      this.$emit('removeitemchange', newRemoveItem);
+    },
+    dispatchShowOccurrenceDialog: function dispatchShowOccurrenceDialog(action, _event) {
+      var newShowOccurrenceDialog = showOccurrenceDialogReducer(this.compShowOccurrenceDialog, action);
+      this.currentShowOccurrenceDialog = newShowOccurrenceDialog;
+      this.$emit('showremovedialogchange', newShowOccurrenceDialog);
+    },
+    dispatchShowRemoveDialog: function dispatchShowRemoveDialog(action, _event) {
+      var newShowRemoveDialog = showRemoveDialogReducer(this.compShowRemoveDialog, action);
+      this.currentShowRemoveDialog = newShowRemoveDialog;
+      this.$emit('showremovedialogchange', newShowRemoveDialog);
+    },
+    dispatchDragItem: function dispatchDragItem(action, _event) {
+      useDragItem.call(this, action);
+    },
+    dispatchResizeItem: function dispatchResizeItem(action, _event) {
+      this.aaa = action;
+    },
+    dispatchViewSlotsFocus: function dispatchViewSlotsFocus(action, _event) {
+      this.aaa = action;
+    },
+    dispatchViewItemsFocus: function dispatchViewItemsFocus(action, _event) {
+      this.aaa = action;
+    },
+    dispatchFormItem: function dispatchFormItem(action, _event) {
+      var newFormItem;
+
+      switch (action.type) {
+        case FORM_ITEM_ACTION.set:
+          newFormItem = action.payload;
+          break;
+
+        case FORM_ITEM_ACTION.reset:
+          newFormItem = null;
+          break;
+
+        case FORM_ITEM_ACTION.setMaster:
+          newFormItem = clone(findMaster(action.payload, this.ks.fields, this.ks.dataItems));
+          break;
+
+        case FORM_ITEM_ACTION.complete:
+          if (this.compFormItem) {
+            this.$emit('dataaction', {
+              type: DATA_ACTION.update,
+              series: this.compSeries,
+              dataItem: action.payload
+            });
+            newFormItem = null;
+          }
+
+          break;
+
+        default:
+          newFormItem = this.compFormItem;
+          break;
+      }
+
+      this.currentFormItem = newFormItem;
+      this.$emit('formitemchange', newFormItem);
+    },
     handleFocus: function handleFocus(event) {
       if (this.onFocusAction) {
-        var actions = this.onFocusAction(event, this.$props, this.currentState);
+        var actions = this.onFocusAction(event, this.$props);
 
         if (actions) {// Array.isArray(actions) 
           //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type]({...action, item: this.item}, event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item});
+          //      this.actionsReducerMap[action.type]({...action, item: this.dataItem}, event))
+          //     : this.actionsReducerMap[actions.type]({...actions, item: this.dataItem});
         }
       }
 
@@ -421,12 +660,12 @@ var SchedulerEditItemVue2 = {
     },
     handleMouseDown: function handleMouseDown(event) {
       if (this.onMouseDownAction) {
-        var actions = this.onMouseDownAction(event, this.$props, this.currentState);
+        var actions = this.onMouseDownAction(event, this.$props);
 
         if (actions) {// Array.isArray(actions) 
           //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type]({...action, item: this.item}, event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item});
+          //      this.actionsReducerMap[action.type]({...action, item: this.dataItem}, event))
+          //     : this.actionsReducerMap[actions.type]({...actions, item: this.dataItem});
         }
       }
 
@@ -434,12 +673,12 @@ var SchedulerEditItemVue2 = {
     },
     handleMouseUp: function handleMouseUp(event) {
       if (this.onMouseUpAction) {
-        var actions = this.onMouseUpAction(event, this.$props, this.currentState);
+        var actions = this.onMouseUpAction(event, this.$props);
 
         if (actions) {// Array.isArray(actions) 
           //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type]({...action, item: this.item}, event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item});
+          //      this.actionsReducerMap[action.type]({...action, item: this.dataItem}, event))
+          //     : this.actionsReducerMap[actions.type]({...actions, item: this.dataItem});
         }
       }
 
@@ -447,86 +686,106 @@ var SchedulerEditItemVue2 = {
     },
     handleClick: function handleClick(event) {
       if (this.onClickAction) {
-        var actions = this.onClickAction(event, this.props, this.currentState);
+        var actions = this.onClickAction(event, this.$props);
 
         if (actions) {// Array.isArray(actions) 
           //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type]({...action, item: this.item}, event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item});
+          //      this.actionsReducerMap[action.type]({...action, item: this.dataItem}, event))
+          //     : this.actionsReducerMap[actions.type]({...actions, item: this.dataItem});
         }
       }
 
       this.$emit('click', event);
     },
     handleDoubleClick: function handleDoubleClick(event) {
-      if (this.onDoubleClickAction) {//        const actions = this.onDoubleClickAction(event, this.props, this.currentState);
-        //        if (actions) {
-        // Array.isArray(actions) 
-        //     ? actions.filter(Boolean).map((action) => action &&
-        //      this.actionsReducerMap[action.type]({...action, item: this.item}, event))
-        //     : this.actionsReducerMap[actions.type]({...actions, item: this.item});
-        //        }
+      if (this.onDoubleClickAction) {
+        var actions = this.onDoubleClickAction(event, this.$props);
+        var that_1 = this;
+
+        if (actions) {
+          Array.isArray(actions) ? actions.filter(Boolean).map(function (action) {
+            return action && that_1.actionsReducerMap[action.type](__assign(__assign({}, action), {
+              item: that_1.dataItem
+            }), event);
+          }) : that_1.actionsReducerMap[actions.type](__assign(__assign({}, actions), {
+            item: that_1.dataItem
+          }));
+        }
       }
 
       this.$emit('doubleclick', event);
     },
     handleRemoveClick: function handleRemoveClick(event) {
-      if (this.onRemoveClickAction) {
-        var actions = this.onRemoveClickAction(event, this.props, this.currentState);
+      var _this = this;
 
-        if (actions) {// Array.isArray(actions) 
-          //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type]({...action, item: this.item}, event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item});
+      if (this.onRemoveClickAction) {
+        var actions = this.onRemoveClickAction(event, this.$props);
+
+        if (actions) {
+          Array.isArray(actions) ? actions.filter(Boolean).map(function (action) {
+            return action && _this.actionsReducerMap[action.type](__assign(__assign({}, action), {
+              item: _this.dataItem
+            }), event);
+          }) : this.actionsReducerMap[actions.type](__assign(__assign({}, actions), {
+            item: this.dataItem
+          }));
         }
       }
 
       this.$emit('removeclick', event);
     },
     handlePress: function handlePress(event) {
-      if (this.onPressAction) {
-        var actions = this.onPressAction(event, this.props, this.currentState);
+      var _this = this;
 
-        if (actions) {// Array.isArray(actions) 
-          //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type]({...action, item: this.item}, event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item }, event);
+      if (this.onPressAction) {
+        var actions = this.onPressAction(event, this.$props);
+
+        if (actions) {
+          Array.isArray(actions) ? actions.filter(Boolean).map(function (action) {
+            return action && _this.actionsReducerMap[action.type](__assign(__assign({}, action), {
+              item: _this.dataItem
+            }), event);
+          }) : this.actionsReducerMap[actions.type](__assign(__assign({}, actions), {
+            item: this.dataItem
+          }), event);
         }
       }
 
       this.$emit('press', event);
     },
     handleDrag: function handleDrag(event) {
-      if (this.onDragAction) {
-        var actions = this.onDragAction(event, this.props, this.currentState);
+      var _this = this;
 
-        if (actions) {// Array.isArray(actions) 
-          //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type](
-          //          {...action, item: this.item}, 
-          //          event.dragEvent.originalEvent
-          //         ))
-          //     : this.actionsReducerMap[actions.type](
-          //         {...actions, item: this.item}, 
-          //         event.dragEvent.originalEvent
-          //     );
+      if (this.onDragAction) {
+        var actions = this.onDragAction(event, this.$props);
+
+        if (actions) {
+          Array.isArray(actions) ? actions.filter(Boolean).map(function (action) {
+            return action && _this.actionsReducerMap[action.type](__assign(__assign({}, action), {
+              item: _this.dataItem
+            }), event.dragEvent.originalEvent);
+          }) : this.actionsReducerMap[actions.type](__assign(__assign({}, actions), {
+            item: this.dataItem
+          }), event.dragEvent.originalEvent);
         }
       }
 
       this.$emit('drag', event);
     },
     handleRelease: function handleRelease(event) {
-      if (this.onReleaseAction) {
-        var actions = this.onReleaseAction(event, this.$props, this.currentState);
+      var _this = this;
 
-        if (actions) {// Array.isArray(actions) 
-          //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type](
-          //          {...action, item: this.item }, 
-          //          event.dragEvent.originalEvent))
-          //     : this.actionsReducerMap[actions.type](
-          //         {...actions, item: this.item}, 
-          //         event.dragEvent.originalEvent);
+      if (this.onReleaseAction) {
+        var actions = this.onReleaseAction(event, this.$props);
+
+        if (actions) {
+          Array.isArray(actions) ? actions.filter(Boolean).map(function (action) {
+            return action && _this.actionsReducerMap[action.type](__assign(__assign({}, action), {
+              item: _this.dataItem
+            }), event.dragEvent.originalEvent);
+          }) : this.actionsReducerMap[actions.type](__assign(__assign({}, actions), {
+            item: this.dataItem
+          }), event.dragEvent.originalEvent);
         }
       }
 
@@ -534,15 +793,15 @@ var SchedulerEditItemVue2 = {
     },
     handleResizePress: function handleResizePress(event) {
       if (this.onResizePressAction) {
-        var actions = this.onResizePressAction(event, this.$props, this.currentState);
+        var actions = this.onResizePressAction(event, this.$props);
 
         if (actions) {// Array.isArray(actions) 
           //     ? actions.filter(Boolean).map((action) => action &&
           //      this.actionsReducerMap[action.type](
-          //          {...action, item: this.item}, 
+          //          {...action, item: this.dataItem}, 
           //          event.dragEvent.originalEvent))
           //     : this.actionsReducerMap[actions.type](
-          //         {...actions, item: this.item}, 
+          //         {...actions, item: this.dataItem}, 
           //         event.dragEvent.originalEvent
           //         );
         }
@@ -552,15 +811,15 @@ var SchedulerEditItemVue2 = {
     },
     handleResizeStartDrag: function handleResizeStartDrag(event) {
       if (this.onResizeStartDragAction) {
-        var actions = this.onResizeStartDragAction(event, this.$props, this.currentState);
+        var actions = this.onResizeStartDragAction(event, this.$props);
 
         if (actions) {// Array.isArray(actions) 
           //     ? actions.filter(Boolean).map((action) => action &&
           //      this.actionsReducerMap[action.type](
-          //          {...action, item: this.item}, 
+          //          {...action, item: this.dataItem}, 
           //          event.dragEvent.originalEvent))
           //     : this.actionsReducerMap[actions.type](
-          //         {...actions, item: this.item}, 
+          //         {...actions, item: this.dataItem}, 
           //         event.dragEvent.originalEvent
           //     );
         }
@@ -570,15 +829,15 @@ var SchedulerEditItemVue2 = {
     },
     handleResizeEndDrag: function handleResizeEndDrag(event) {
       if (this.onResizeEndDragAction) {
-        var actions = this.onResizeEndDragAction(event, this.$props, this.currentState);
+        var actions = this.onResizeEndDragAction(event, this.$props);
 
         if (actions) {// Array.isArray(actions) 
           //     ? actions.filter(Boolean).map((action) => action &&
           //      this.actionsReducerMap[action.type](
-          //          {...action, item: this.item}, 
+          //          {...action, item: this.dataItem}, 
           //          event.dragEvent.originalEvent))
           //     : this.actionsReducerMap[actions.type](
-          //         {...actions, item: this.item}, 
+          //         {...actions, item: this.dataItem}, 
           //         event.dragEvent.originalEvent);
         }
       }
@@ -587,15 +846,15 @@ var SchedulerEditItemVue2 = {
     },
     handleResizeRelease: function handleResizeRelease(event) {
       if (this.onResizeReleaseAction) {
-        var actions = this.onResizeReleaseAction(event, this.$props, this.currentState);
+        var actions = this.onResizeReleaseAction(event, this.$props);
 
         if (actions) {// Array.isArray(actions) 
           //     ? actions.filter(Boolean).map((action) => action && 
           //     this.actionsReducerMap[action.type](
-          //         {...action, item: this.item}, 
+          //         {...action, item: this.dataItem}, 
           //         event.dragEvent.originalEvent))
           //     : this.actionsReducerMap[actions.type](
-          //         {...actions, item: this.item }, 
+          //         {...actions, item: this.dataItem }, 
           //         event.dragEvent.originalEvent
           //     );
         }
@@ -604,54 +863,76 @@ var SchedulerEditItemVue2 = {
       this.$emit('resizerelease', event);
     },
     handleFormSubmit: function handleFormSubmit(event) {
-      if (this.onFormSubmitAction) {
-        var actions = this.onFormSubmitAction(event, this.$props, this.currentState);
+      var _this = this;
 
-        if (actions) {// Array.isArray(actions) 
-          //     ? actions.filter(Boolean).map((action) => action && 
-          //     this.actionsReducerMap[action.type](
-          //         {...action, item: this.item}, event))
-          //     : this.actionsReducerMap[actions.type](
-          //         {...actions, item: this.item}, event);
+      if (this.onFormSubmitAction) {
+        var actions = this.onFormSubmitAction(event, this.$props);
+
+        if (actions) {
+          Array.isArray(actions) ? actions.filter(Boolean).map(function (action) {
+            return action && _this.actionsReducerMap[action.type](__assign(__assign({}, action), {
+              item: _this.dataItem
+            }), event);
+          }) : this.actionsReducerMap[actions.type](__assign(__assign({}, actions), {
+            item: this.dataItem
+          }), event);
         }
       }
 
       this.$emit('formsubmit', event);
     },
     handleCancel: function handleCancel(event) {
-      if (this.onCancelAction) {
-        var actions = this.onCancelAction(event, this.$props, this.currentState);
+      var _this = this;
 
-        if (actions) {// Array.isArray(actions) 
-          //     ? actions.filter(Boolean).map((action) => action && 
-          //     this.actionsReducerMap[action.type]({...action, item: this.item}, event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item}, event);
+      if (this.onCancelAction) {
+        var actions = this.onCancelAction(event, this.$props);
+
+        if (actions) {
+          Array.isArray(actions) ? actions.filter(Boolean).map(function (action) {
+            return action && _this.actionsReducerMap[action.type](__assign(__assign({}, action), {
+              item: _this.dataItem
+            }), event);
+          }) : this.actionsReducerMap[actions.type](__assign(__assign({}, actions), {
+            item: this.dataItem
+          }), event);
         }
       }
 
       this.$emit('cancel', event);
     },
     handleOccurrenceClick: function handleOccurrenceClick(event) {
-      if (this.onOccurrenceClickAction) {
-        var actions = this.onOccurrenceClickAction(event, this.$props, this.currentState);
+      var _this = this;
 
-        if (actions) {// Array.isArray(actions) 
-          //     ? actions.filter(Boolean).map((action) => action && 
-          //     this.actionsReducerMap[action.type]({...action, item: this.item}, event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item}, event);
+      if (this.onOccurrenceClickAction) {
+        var actions = this.onOccurrenceClickAction(event, this.$props);
+
+        if (actions) {
+          Array.isArray(actions) ? actions.filter(Boolean).map(function (action) {
+            return action && _this.actionsReducerMap[action.type](__assign(__assign({}, action), {
+              item: _this.dataItem
+            }), event);
+          }) : this.actionsReducerMap[actions.type](__assign(__assign({}, actions), {
+            item: this.dataItem
+          }), event);
         }
       }
 
       this.$emit('occurrenceclick', event);
     },
     handleSeriesClick: function handleSeriesClick(event) {
-      if (this.onSeriesClickAction) {
-        var actions = this.onSeriesClickAction(event, this.$props, this.currentState);
+      var _this = this;
 
-        if (actions) {// Array.isArray(actions) 
-          //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type]({...action, item: this.item}, event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item}, event);
+      if (this.onSeriesClickAction) {
+        var actions = this.onSeriesClickAction(event, this.$props);
+
+        if (actions) {
+          Array.isArray(actions) ? actions.filter(Boolean).map(function (action) {
+            return action && _this.actionsReducerMap[action.type](__assign(__assign({}, action), {
+              item: _this.dataItem
+            }), event);
+          }) : this.actionsReducerMap[actions.type](__assign(__assign({}, actions), {
+            item: this.dataItem
+          }), event);
         }
       }
 
@@ -659,12 +940,12 @@ var SchedulerEditItemVue2 = {
     },
     handleKeyDown: function handleKeyDown(event) {
       if (this.onKeyDownAction) {
-        var actions = this.onKeyDownAction(event, this.$props, this.currentState);
+        var actions = this.onKeyDownAction(event, this.$props);
 
         if (actions) {// Array.isArray(actions)
           //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type]({...action, item: this.item}, event.event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item}, event.event);
+          //      this.actionsReducerMap[action.type]({...action, item: this.dataItem}, event.event))
+          //     : this.actionsReducerMap[actions.type]({...actions, item: this.dataItem}, event.event);
         }
       }
 
@@ -672,33 +953,39 @@ var SchedulerEditItemVue2 = {
     },
     handleKeyUp: function handleKeyUp(event) {
       if (this.onKeyUpAction) {
-        var actions = this.onKeyUpAction(event, this.$props, this.currentState);
+        var actions = this.onKeyUpAction(event, this.$props);
 
         if (actions) {// Array.isArray(actions)
           //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type]({...action, item: this.item}, event.event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item}, event.event);
+          //      this.actionsReducerMap[action.type]({...action, item: this.dataItem}, event.event))
+          //     : this.actionsReducerMap[actions.type]({...actions, item: this.dataItem}, event.event);
         }
       }
 
       this.$emit('keyup', event);
     },
     handleRemoveConfirm: function handleRemoveConfirm(event) {
-      if (this.onRemoveConfirmAction) {
-        var actions = this.onRemoveConfirmAction(event, this.$props, this.currentState);
+      var _this = this;
 
-        if (actions) {// Array.isArray(actions)
-          //     ? actions.filter(Boolean).map((action) => action &&
-          //      this.actionsReducerMap[action.type]({...action, item: this.item}, event.event))
-          //     : this.actionsReducerMap[actions.type]({...actions, item: this.item}, event.event);
+      if (this.onRemoveConfirmAction) {
+        var actions = this.onRemoveConfirmAction(event, this.$props);
+
+        if (actions) {
+          Array.isArray(actions) ? actions.filter(Boolean).map(function (action) {
+            return action && _this.actionsReducerMap[action.type](__assign(__assign({}, action), {
+              item: _this.dataItem
+            }), event.event);
+          }) : this.actionsReducerMap[actions.type](__assign(__assign({}, actions), {
+            item: this.dataItem
+          }), event.event);
         }
       }
 
       this.$emit('removeconfirm', event);
     },
-    onClickAction: function onClickAction(event, _, state) {
+    onClickAction: function onClickAction(event, _) {
       return [{
-        type: event.event.metaKey || event.event.ctrlKey ? state.selected && !state.dragItem && !state.resizeItem ? ITEMS_SELECT_ACTION.remove : ITEMS_SELECT_ACTION.add : ITEMS_SELECT_ACTION.select
+        type: event.event.metaKey || event.event.ctrlKey ? this.compSelected && !this.compDragItem && !this.compResizeItem ? ITEMS_SELECT_ACTION.remove : ITEMS_SELECT_ACTION.add : ITEMS_SELECT_ACTION.select
       }];
     },
     onDoubleClickAction: function onDoubleClickAction(_, props) {
@@ -737,11 +1024,11 @@ var SchedulerEditItemVue2 = {
         }
       } : [];
     },
-    onReleaseAction: function onReleaseAction(event, props, state) {
-      return props.editable && state.dragItem ? props.isRecurring && !props.isException && state.series === null ? {
+    onReleaseAction: function onReleaseAction(event, props) {
+      return props.editable && this.compDragItem ? props.isRecurring && !props.isException && this.compSeries === null ? {
         type: SHOW_OCCURRENCE_DIALOG_ACTION.open
       } : {
-        type: props.isRecurring ? state.series ? DRAG_ITEM_ACTION.completeSeries : DRAG_ITEM_ACTION.completeOccurrence : DRAG_ITEM_ACTION.complete,
+        type: props.isRecurring ? this.compSeries ? DRAG_ITEM_ACTION.completeSeries : DRAG_ITEM_ACTION.completeOccurrence : DRAG_ITEM_ACTION.complete,
         payload: {
           x: event.dragEvent.clientX,
           y: event.dragEvent.clientY
@@ -775,19 +1062,19 @@ var SchedulerEditItemVue2 = {
         }
       } : [];
     },
-    onResizeReleaseAction: function onResizeReleaseAction(event, props, state) {
-      return props.editable && state.resizeItem ? props.isRecurring && !props.isException && state.series === null ? {
+    onResizeReleaseAction: function onResizeReleaseAction(event, props) {
+      return props.editable && this.compResizeItem ? props.isRecurring && !props.isException && this.compSeries === null ? {
         type: SHOW_OCCURRENCE_DIALOG_ACTION.open
       } : {
-        type: props.isRecurring ? state.series ? RESIZE_ITEM_ACTION.completeSeries : RESIZE_ITEM_ACTION.completeOccurrence : RESIZE_ITEM_ACTION.complete,
+        type: props.isRecurring ? this.compSeries ? RESIZE_ITEM_ACTION.completeSeries : RESIZE_ITEM_ACTION.completeOccurrence : RESIZE_ITEM_ACTION.complete,
         payload: {
           x: event.dragEvent.clientX,
           y: event.dragEvent.clientY
         }
       } : [];
     },
-    onOccurrenceClickAction: function onOccurrenceClickAction(_event, props, state) {
-      if (state.dragItem) {
+    onOccurrenceClickAction: function onOccurrenceClickAction(_event, props) {
+      if (this.compDragItem) {
         return [{
           type: DRAG_ITEM_ACTION.completeOccurrence
         }, {
@@ -795,7 +1082,7 @@ var SchedulerEditItemVue2 = {
         }];
       }
 
-      if (state.resizeItem) {
+      if (this.compResizeItem) {
         return [{
           type: RESIZE_ITEM_ACTION.completeOccurrence
         }, {
@@ -803,7 +1090,7 @@ var SchedulerEditItemVue2 = {
         }];
       }
 
-      if (state.formItem) {
+      if (this.compFormItem) {
         return [{
           type: SERIES_ACTION.set,
           payload: false
@@ -815,7 +1102,7 @@ var SchedulerEditItemVue2 = {
         }];
       }
 
-      if (state.removeItem) {
+      if (this.compRemoveItem) {
         return [{
           type: SERIES_ACTION.set,
           payload: false
@@ -829,8 +1116,8 @@ var SchedulerEditItemVue2 = {
         }];
       }
     },
-    onSeriesClickAction: function onSeriesClickAction(_event, props, state) {
-      if (state.dragItem) {
+    onSeriesClickAction: function onSeriesClickAction(_event, props) {
+      if (this.compDragItem) {
         return [{
           type: DRAG_ITEM_ACTION.completeSeries
         }, {
@@ -838,7 +1125,7 @@ var SchedulerEditItemVue2 = {
         }];
       }
 
-      if (state.resizeItem) {
+      if (this.compResizeItem) {
         return [{
           type: RESIZE_ITEM_ACTION.completeSeries
         }, {
@@ -846,7 +1133,7 @@ var SchedulerEditItemVue2 = {
         }];
       }
 
-      if (state.formItem) {
+      if (this.compFormItem) {
         return [{
           type: SERIES_ACTION.set,
           payload: true
@@ -858,7 +1145,7 @@ var SchedulerEditItemVue2 = {
         }];
       }
 
-      if (state.removeItem) {
+      if (this.compRemoveItem) {
         return [{
           type: SERIES_ACTION.set,
           payload: true