@progress/kendo-vue-scheduler 3.0.7 → 3.0.9-dev.202202280631

package/dist/es/Scheduler.js

@@ -0,0 +1,1163 @@
+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);
+};
+
+var __spreadArrays = this && this.__spreadArrays || function () {
+  for (var s = 0, i = 0, il = arguments.length; i < il; i++) {
+    s += arguments[i].length;
+  }
+
+  for (var r = Array(s), k = 0, i = 0; i < il; i++) {
+    for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) {
+      r[k] = a[j];
+    }
+  }
+
+  return r;
+}; // @ts-ignore
+
+
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+import { getModelFields, getField, findMaster, setField, toSchedulerGroups, getToday } from './utils';
+import { clone, getListeners, templateRendering } from '@progress/kendo-vue-common';
+import { provideIntlService, provideLocalizationService } from '@progress/kendo-vue-intl';
+import { SchedulerHeader } from './components/header/SchedulerHeader';
+import { SchedulerNavigation } from './components/header/navigation/SchedulerNavigation';
+import { SchedulerViewSelector } from './components/header/view-selector/SchedulerViewSelector';
+import { addDays, addMonths } from '@progress/kendo-date-math';
+import { SchedulerFooter } from './components/footer/SchedulerFooter';
+import { Button, ToolbarSpacer, ButtonGroup } from '@progress/kendo-vue-buttons';
+import { showFullDay, showWorkDay, messages, today, previousTitle, nextTitle } from './messages';
+import { NavigationDatePicker } from './components/header/navigation/NavigationDatePicker';
+import { ViewSelectorList } from './components/header/view-selector/ViewSelectorList';
+import { BusinessHours } from './components/footer/bussiness-hours/BussinessHours';
+import { DayView } from './views/day/DayView'; // import { SchedulerFormProps } from './editors/SchedulerFormEditor';
+
+import { validatePackage } from '@progress/kendo-vue-common';
+import { packageMetadata } from './package-metadata';
+import { AgendaView, MonthView, WeekView, WorkWeekView } from './main';
+import { TimelineView } from './views/time/TimelineView';
+var DEFAULT_DATE_FORMAT = '{0:D}';
+var DEFAULT_SHORT_DATE_FORMAT = '{0:d}';
+/**
+ * Specifies the available [DataAction]({% slug api_scheduler_data_action %}) types.
+ */
+
+export var DATA_ACTION;
+
+(function (DATA_ACTION) {
+  DATA_ACTION[DATA_ACTION["create"] = 0] = "create";
+  DATA_ACTION[DATA_ACTION["update"] = 1] = "update";
+  DATA_ACTION[DATA_ACTION["remove"] = 2] = "remove";
+})(DATA_ACTION || (DATA_ACTION = {})); // tslint:enable:max-line-length
+
+
+var SchedulerVue2 = {
+  name: 'KendoScheduler',
+  props: {
+    dataItems: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    views: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    view: String,
+    defaultView: String,
+    date: Date,
+    rtl: Boolean,
+    height: {
+      type: [Number, String],
+      default: 600
+    },
+    timezone: String,
+    group: Object,
+    resources: [Object, Array],
+    modelFields: Object,
+    tabIndex: {
+      type: Number,
+      default: -1
+    },
+    editable: {
+      type: [Boolean, Object],
+      default: false
+    },
+    defaultDate: {
+      type: Date,
+      default: new Date()
+    },
+    header: [String, Function, Object],
+    footer: [String, Function, Object]
+  },
+  computed: {
+    wrapperClassName: function wrapperClassName() {
+      return {
+        'k-rtl': this.$props.rtl !== undefined ? this.$props.rtl : this.dir === 'rtl',
+        'k-widget': true,
+        'k-scheduler': true,
+        'k-scheduler-flex': true,
+        'k-floatwrap': true
+      };
+    },
+    fields: function fields() {
+      return getModelFields(this.$props.modelFields).fields;
+    }
+  },
+  provide: function provide() {
+    return {
+      ks: this.ks,
+      setActiveViewName: this.handleActiveViewNameChange,
+      setActiveDate: this.handleDateChange
+    };
+  },
+  data: function data() {
+    this.intl = provideIntlService(this);
+    this.localization = provideLocalizationService(this);
+    var currentDate = this.$props.date || this.$props.defaultDate;
+    var activeViewName = this.$props.view || this.$props.defaultView || this.views[0] && this.views[0].name || 'day';
+    var view = this.views.find(function (currentView) {
+      return currentView.name === activeViewName;
+    }) || this.views[0] || h(DayView);
+    var dateFormat = this.getViewPropValue(view, 'selectedDateFormat', activeViewName) || DEFAULT_DATE_FORMAT;
+    var shortDateFormat = this.getViewPropValue(view, 'selectedShortDateFormat', activeViewName) || DEFAULT_SHORT_DATE_FORMAT;
+    var dateRange = this.getViewComponentByName(activeViewName).props.dateRange.default()({
+      intl: this.intl,
+      date: currentDate,
+      timezone: this.$props.timezone,
+      numberOfDays: this.getViewPropValue(view, 'numberOfDays', activeViewName),
+      workWeekStart: view.workWeekStart || this.intl.firstDay(),
+      workWeekEnd: view.workWeekEnd || (this.intl.firstDay() + this.getViewPropValue(view, 'numberOfDays', activeViewName)) % 6
+    });
+    return {
+      ks: {
+        activeViewName: activeViewName,
+        currentDate: currentDate,
+        showWorkHours: true,
+        timezone: this.$props.timezone,
+        props: this.$props,
+        views: this.views,
+        view: view,
+        fields: getModelFields(this.$props.modelFields).fields,
+        groups: toSchedulerGroups(this.$props.group, this.$props.resources),
+        dateRange: dateRange,
+        orientation: this.$props.group && this.$props.group.orientation ? this.$props.group.orientation : 'horizontal',
+        dateFormat: dateFormat,
+        shortDateFormat: shortDateFormat,
+        scheduler: null,
+        // State
+        //       date: [currentDate, this.handleDateChange],
+        // Reducers
+        dataItems: this.dataItems // , this.handleDataAction]
+
+      }
+    };
+  },
+  mounted: function mounted() {
+    this.ks.scheduler = this.$el;
+  },
+  // @ts-ignore
+  setup: !gh ? undefined : function () {
+    var v3 = !!gh;
+    return {
+      v3: v3
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var _this2 = this;
+
+    var _this = this;
+
+    var h = gh || createElement;
+    validatePackage(packageMetadata);
+    var timezone = this.$props.timezone; //  const dir = useDir(element);
+
+    var view = this.views.find(function (currentView) {
+      return currentView.name === _this.ks.activeViewName;
+    }) || this.views[0] || h(DayView);
+    var slotDuration = this.getViewPropValue(this.ks.view, 'slotDuration', this.ks.activeViewName);
+    var todayText = this.localization.toLanguageString(today, messages[today]);
+    var previousText = this.localization.toLanguageString(previousTitle, messages[previousTitle]);
+    var nextText = this.localization.toLanguageString(nextTitle, messages[nextTitle]);
+    var heaeder = templateRendering.call(this, view.header || this.$props.header, getListeners.call(this));
+    var footer = templateRendering.call(this, view.footer || this.$props.footer, getListeners.call(this));
+    var ViewSelector = SchedulerViewSelector;
+    var viewComponent = this.getViewComponentByName(this.ks.activeViewName || view.name);
+
+    var viewProps = __assign(__assign({
+      key: view.name
+    }, this.$props), {
+      dataItems: undefined,
+      dateRange: this.ks.dateRange
+    });
+
+    return h("div", {
+      id: this.$props.id,
+      attrs: this.v3 ? undefined : {
+        id: this.$props.id,
+        tabIndex: this.$props.tabIndex // Aria
+        //  dir={dir}
+        ,
+        role: this.$props.role,
+        "aria-label": this.$props.ariaLabel,
+        "aria-labelledby": this.$props.ariaLabelledby // Handlers
+
+      },
+      style: {
+        height: this.$props.height + 'px'
+      },
+      "class": this.wrapperClassName,
+      tabIndex: this.$props.tabIndex,
+      role: this.$props.role,
+      "aria-label": this.$props.ariaLabel,
+      "aria-labelledby": this.$props.ariaLabelledby,
+      onFocusin: this.handleFocus,
+      on: this.v3 ? undefined : {
+        "focusin": this.handleFocus,
+        "focusout": this.handleBlur
+      },
+      onFocusout: this.handleBlur
+    }, [// @ts-ignore  function children
+    h(SchedulerHeader, this.v3 ? function () {
+      return [// @ts-ignore  function children
+      h(SchedulerNavigation, _this2.v3 ? function () {
+        return [// @ts-ignore  function children
+        h(ButtonGroup, {
+          "class": "k-scheduler-navigation"
+        }, _this2.v3 ? function () {
+          return [// @ts-ignore  function children
+          h(Button, {
+            role: "button",
+            attrs: _this2.v3 ? undefined : {
+              role: "button",
+              tabIndex: -1,
+              title: todayText,
+              "aria-label": todayText
+            },
+            tabIndex: -1,
+            title: todayText,
+            "aria-label": todayText,
+            onClick: _this2.handleTodayClick,
+            on: _this2.v3 ? undefined : {
+              "click": _this2.handleTodayClick
+            }
+          }, _this2.v3 ? function () {
+            return [todayText];
+          } : [todayText]), // @ts-ignore  function children
+          h(Button, {
+            role: "button",
+            attrs: _this2.v3 ? undefined : {
+              role: "button",
+              tabIndex: -1,
+              title: previousText,
+              "aria-label": previousText
+            },
+            tabIndex: -1,
+            "class": "k-button-icon",
+            title: previousText,
+            "aria-label": previousText,
+            onClick: _this2.handlePrevClick,
+            on: _this2.v3 ? undefined : {
+              "click": _this2.handlePrevClick
+            }
+          }, _this2.v3 ? function () {
+            return [h("span", {
+              "class": "k-button-text"
+            }, [h("span", {
+              "class": "k-icon k-i-arrow-60-left"
+            })])];
+          } : [h("span", {
+            "class": "k-button-text"
+          }, [h("span", {
+            "class": "k-icon k-i-arrow-60-left"
+          })])]), // @ts-ignore  function children
+          h(Button, {
+            role: "button",
+            attrs: _this2.v3 ? undefined : {
+              role: "button",
+              tabIndex: -1,
+              title: nextText,
+              "aria-label": nextText
+            },
+            tabIndex: -1,
+            "class": "k-button-icon",
+            title: nextText,
+            "aria-label": nextText,
+            onClick: _this2.handleNextClick,
+            on: _this2.v3 ? undefined : {
+              "click": _this2.handleNextClick
+            }
+          }, _this2.v3 ? function () {
+            return [h("span", {
+              "class": "k-button-text"
+            }, [h("span", {
+              "class": "k-icon k-i-arrow-60-right"
+            })])];
+          } : [h("span", {
+            "class": "k-button-text"
+          }, [h("span", {
+            "class": "k-icon k-i-arrow-60-right"
+          })])])];
+        } : [h(Button, {
+          role: "button",
+          attrs: _this2.v3 ? undefined : {
+            role: "button",
+            tabIndex: -1,
+            title: todayText,
+            "aria-label": todayText
+          },
+          tabIndex: -1,
+          title: todayText,
+          "aria-label": todayText,
+          onClick: _this2.handleTodayClick,
+          on: _this2.v3 ? undefined : {
+            "click": _this2.handleTodayClick
+          }
+        }, _this2.v3 ? function () {
+          return [todayText];
+        } : [todayText]), h(Button, {
+          role: "button",
+          attrs: _this2.v3 ? undefined : {
+            role: "button",
+            tabIndex: -1,
+            title: previousText,
+            "aria-label": previousText
+          },
+          tabIndex: -1,
+          "class": "k-button-icon",
+          title: previousText,
+          "aria-label": previousText,
+          onClick: _this2.handlePrevClick,
+          on: _this2.v3 ? undefined : {
+            "click": _this2.handlePrevClick
+          }
+        }, _this2.v3 ? function () {
+          return [h("span", {
+            "class": "k-button-text"
+          }, [h("span", {
+            "class": "k-icon k-i-arrow-60-left"
+          })])];
+        } : [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-left"
+        })])]), h(Button, {
+          role: "button",
+          attrs: _this2.v3 ? undefined : {
+            role: "button",
+            tabIndex: -1,
+            title: nextText,
+            "aria-label": nextText
+          },
+          tabIndex: -1,
+          "class": "k-button-icon",
+          title: nextText,
+          "aria-label": nextText,
+          onClick: _this2.handleNextClick,
+          on: _this2.v3 ? undefined : {
+            "click": _this2.handleNextClick
+          }
+        }, _this2.v3 ? function () {
+          return [h("span", {
+            "class": "k-button-text"
+          }, [h("span", {
+            "class": "k-icon k-i-arrow-60-right"
+          })])];
+        } : [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-right"
+        })])])])];
+      } : [h(ButtonGroup, {
+        "class": "k-scheduler-navigation"
+      }, _this2.v3 ? function () {
+        return [h(Button, {
+          role: "button",
+          attrs: _this2.v3 ? undefined : {
+            role: "button",
+            tabIndex: -1,
+            title: todayText,
+            "aria-label": todayText
+          },
+          tabIndex: -1,
+          title: todayText,
+          "aria-label": todayText,
+          onClick: _this2.handleTodayClick,
+          on: _this2.v3 ? undefined : {
+            "click": _this2.handleTodayClick
+          }
+        }, _this2.v3 ? function () {
+          return [todayText];
+        } : [todayText]), h(Button, {
+          role: "button",
+          attrs: _this2.v3 ? undefined : {
+            role: "button",
+            tabIndex: -1,
+            title: previousText,
+            "aria-label": previousText
+          },
+          tabIndex: -1,
+          "class": "k-button-icon",
+          title: previousText,
+          "aria-label": previousText,
+          onClick: _this2.handlePrevClick,
+          on: _this2.v3 ? undefined : {
+            "click": _this2.handlePrevClick
+          }
+        }, _this2.v3 ? function () {
+          return [h("span", {
+            "class": "k-button-text"
+          }, [h("span", {
+            "class": "k-icon k-i-arrow-60-left"
+          })])];
+        } : [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-left"
+        })])]), h(Button, {
+          role: "button",
+          attrs: _this2.v3 ? undefined : {
+            role: "button",
+            tabIndex: -1,
+            title: nextText,
+            "aria-label": nextText
+          },
+          tabIndex: -1,
+          "class": "k-button-icon",
+          title: nextText,
+          "aria-label": nextText,
+          onClick: _this2.handleNextClick,
+          on: _this2.v3 ? undefined : {
+            "click": _this2.handleNextClick
+          }
+        }, _this2.v3 ? function () {
+          return [h("span", {
+            "class": "k-button-text"
+          }, [h("span", {
+            "class": "k-icon k-i-arrow-60-right"
+          })])];
+        } : [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-right"
+        })])])];
+      } : [h(Button, {
+        role: "button",
+        attrs: _this2.v3 ? undefined : {
+          role: "button",
+          tabIndex: -1,
+          title: todayText,
+          "aria-label": todayText
+        },
+        tabIndex: -1,
+        title: todayText,
+        "aria-label": todayText,
+        onClick: _this2.handleTodayClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handleTodayClick
+        }
+      }, _this2.v3 ? function () {
+        return [todayText];
+      } : [todayText]), h(Button, {
+        role: "button",
+        attrs: _this2.v3 ? undefined : {
+          role: "button",
+          tabIndex: -1,
+          title: previousText,
+          "aria-label": previousText
+        },
+        tabIndex: -1,
+        "class": "k-button-icon",
+        title: previousText,
+        "aria-label": previousText,
+        onClick: _this2.handlePrevClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handlePrevClick
+        }
+      }, _this2.v3 ? function () {
+        return [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-left"
+        })])];
+      } : [h("span", {
+        "class": "k-button-text"
+      }, [h("span", {
+        "class": "k-icon k-i-arrow-60-left"
+      })])]), h(Button, {
+        role: "button",
+        attrs: _this2.v3 ? undefined : {
+          role: "button",
+          tabIndex: -1,
+          title: nextText,
+          "aria-label": nextText
+        },
+        tabIndex: -1,
+        "class": "k-button-icon",
+        title: nextText,
+        "aria-label": nextText,
+        onClick: _this2.handleNextClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handleNextClick
+        }
+      }, _this2.v3 ? function () {
+        return [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-right"
+        })])];
+      } : [h("span", {
+        "class": "k-button-text"
+      }, [h("span", {
+        "class": "k-icon k-i-arrow-60-right"
+      })])])])]), h(NavigationDatePicker, {
+        value: _this2.ks.currentDate,
+        attrs: _this2.v3 ? undefined : {
+          value: _this2.ks.currentDate
+        },
+        onChange: _this2.handleDatePickerChange,
+        on: _this2.v3 ? undefined : {
+          "change": _this2.handleDatePickerChange
+        }
+      }), h(ToolbarSpacer), // @ts-ignore  function children
+      h(ViewSelector, _this2.v3 ? function () {
+        return [h(ViewSelectorList)];
+      } : [h(ViewSelectorList)])];
+    } : [h(SchedulerNavigation, _this2.v3 ? function () {
+      return [h(ButtonGroup, {
+        "class": "k-scheduler-navigation"
+      }, _this2.v3 ? function () {
+        return [h(Button, {
+          role: "button",
+          attrs: _this2.v3 ? undefined : {
+            role: "button",
+            tabIndex: -1,
+            title: todayText,
+            "aria-label": todayText
+          },
+          tabIndex: -1,
+          title: todayText,
+          "aria-label": todayText,
+          onClick: _this2.handleTodayClick,
+          on: _this2.v3 ? undefined : {
+            "click": _this2.handleTodayClick
+          }
+        }, _this2.v3 ? function () {
+          return [todayText];
+        } : [todayText]), h(Button, {
+          role: "button",
+          attrs: _this2.v3 ? undefined : {
+            role: "button",
+            tabIndex: -1,
+            title: previousText,
+            "aria-label": previousText
+          },
+          tabIndex: -1,
+          "class": "k-button-icon",
+          title: previousText,
+          "aria-label": previousText,
+          onClick: _this2.handlePrevClick,
+          on: _this2.v3 ? undefined : {
+            "click": _this2.handlePrevClick
+          }
+        }, _this2.v3 ? function () {
+          return [h("span", {
+            "class": "k-button-text"
+          }, [h("span", {
+            "class": "k-icon k-i-arrow-60-left"
+          })])];
+        } : [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-left"
+        })])]), h(Button, {
+          role: "button",
+          attrs: _this2.v3 ? undefined : {
+            role: "button",
+            tabIndex: -1,
+            title: nextText,
+            "aria-label": nextText
+          },
+          tabIndex: -1,
+          "class": "k-button-icon",
+          title: nextText,
+          "aria-label": nextText,
+          onClick: _this2.handleNextClick,
+          on: _this2.v3 ? undefined : {
+            "click": _this2.handleNextClick
+          }
+        }, _this2.v3 ? function () {
+          return [h("span", {
+            "class": "k-button-text"
+          }, [h("span", {
+            "class": "k-icon k-i-arrow-60-right"
+          })])];
+        } : [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-right"
+        })])])];
+      } : [h(Button, {
+        role: "button",
+        attrs: _this2.v3 ? undefined : {
+          role: "button",
+          tabIndex: -1,
+          title: todayText,
+          "aria-label": todayText
+        },
+        tabIndex: -1,
+        title: todayText,
+        "aria-label": todayText,
+        onClick: _this2.handleTodayClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handleTodayClick
+        }
+      }, _this2.v3 ? function () {
+        return [todayText];
+      } : [todayText]), h(Button, {
+        role: "button",
+        attrs: _this2.v3 ? undefined : {
+          role: "button",
+          tabIndex: -1,
+          title: previousText,
+          "aria-label": previousText
+        },
+        tabIndex: -1,
+        "class": "k-button-icon",
+        title: previousText,
+        "aria-label": previousText,
+        onClick: _this2.handlePrevClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handlePrevClick
+        }
+      }, _this2.v3 ? function () {
+        return [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-left"
+        })])];
+      } : [h("span", {
+        "class": "k-button-text"
+      }, [h("span", {
+        "class": "k-icon k-i-arrow-60-left"
+      })])]), h(Button, {
+        role: "button",
+        attrs: _this2.v3 ? undefined : {
+          role: "button",
+          tabIndex: -1,
+          title: nextText,
+          "aria-label": nextText
+        },
+        tabIndex: -1,
+        "class": "k-button-icon",
+        title: nextText,
+        "aria-label": nextText,
+        onClick: _this2.handleNextClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handleNextClick
+        }
+      }, _this2.v3 ? function () {
+        return [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-right"
+        })])];
+      } : [h("span", {
+        "class": "k-button-text"
+      }, [h("span", {
+        "class": "k-icon k-i-arrow-60-right"
+      })])])])];
+    } : [h(ButtonGroup, {
+      "class": "k-scheduler-navigation"
+    }, _this2.v3 ? function () {
+      return [h(Button, {
+        role: "button",
+        attrs: _this2.v3 ? undefined : {
+          role: "button",
+          tabIndex: -1,
+          title: todayText,
+          "aria-label": todayText
+        },
+        tabIndex: -1,
+        title: todayText,
+        "aria-label": todayText,
+        onClick: _this2.handleTodayClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handleTodayClick
+        }
+      }, _this2.v3 ? function () {
+        return [todayText];
+      } : [todayText]), h(Button, {
+        role: "button",
+        attrs: _this2.v3 ? undefined : {
+          role: "button",
+          tabIndex: -1,
+          title: previousText,
+          "aria-label": previousText
+        },
+        tabIndex: -1,
+        "class": "k-button-icon",
+        title: previousText,
+        "aria-label": previousText,
+        onClick: _this2.handlePrevClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handlePrevClick
+        }
+      }, _this2.v3 ? function () {
+        return [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-left"
+        })])];
+      } : [h("span", {
+        "class": "k-button-text"
+      }, [h("span", {
+        "class": "k-icon k-i-arrow-60-left"
+      })])]), h(Button, {
+        role: "button",
+        attrs: _this2.v3 ? undefined : {
+          role: "button",
+          tabIndex: -1,
+          title: nextText,
+          "aria-label": nextText
+        },
+        tabIndex: -1,
+        "class": "k-button-icon",
+        title: nextText,
+        "aria-label": nextText,
+        onClick: _this2.handleNextClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handleNextClick
+        }
+      }, _this2.v3 ? function () {
+        return [h("span", {
+          "class": "k-button-text"
+        }, [h("span", {
+          "class": "k-icon k-i-arrow-60-right"
+        })])];
+      } : [h("span", {
+        "class": "k-button-text"
+      }, [h("span", {
+        "class": "k-icon k-i-arrow-60-right"
+      })])])];
+    } : [h(Button, {
+      role: "button",
+      attrs: _this2.v3 ? undefined : {
+        role: "button",
+        tabIndex: -1,
+        title: todayText,
+        "aria-label": todayText
+      },
+      tabIndex: -1,
+      title: todayText,
+      "aria-label": todayText,
+      onClick: _this2.handleTodayClick,
+      on: _this2.v3 ? undefined : {
+        "click": _this2.handleTodayClick
+      }
+    }, _this2.v3 ? function () {
+      return [todayText];
+    } : [todayText]), h(Button, {
+      role: "button",
+      attrs: _this2.v3 ? undefined : {
+        role: "button",
+        tabIndex: -1,
+        title: previousText,
+        "aria-label": previousText
+      },
+      tabIndex: -1,
+      "class": "k-button-icon",
+      title: previousText,
+      "aria-label": previousText,
+      onClick: _this2.handlePrevClick,
+      on: _this2.v3 ? undefined : {
+        "click": _this2.handlePrevClick
+      }
+    }, _this2.v3 ? function () {
+      return [h("span", {
+        "class": "k-button-text"
+      }, [h("span", {
+        "class": "k-icon k-i-arrow-60-left"
+      })])];
+    } : [h("span", {
+      "class": "k-button-text"
+    }, [h("span", {
+      "class": "k-icon k-i-arrow-60-left"
+    })])]), h(Button, {
+      role: "button",
+      attrs: _this2.v3 ? undefined : {
+        role: "button",
+        tabIndex: -1,
+        title: nextText,
+        "aria-label": nextText
+      },
+      tabIndex: -1,
+      "class": "k-button-icon",
+      title: nextText,
+      "aria-label": nextText,
+      onClick: _this2.handleNextClick,
+      on: _this2.v3 ? undefined : {
+        "click": _this2.handleNextClick
+      }
+    }, _this2.v3 ? function () {
+      return [h("span", {
+        "class": "k-button-text"
+      }, [h("span", {
+        "class": "k-icon k-i-arrow-60-right"
+      })])];
+    } : [h("span", {
+      "class": "k-button-text"
+    }, [h("span", {
+      "class": "k-icon k-i-arrow-60-right"
+    })])])])]), h(NavigationDatePicker, {
+      value: _this2.ks.currentDate,
+      attrs: _this2.v3 ? undefined : {
+        value: _this2.ks.currentDate
+      },
+      onChange: _this2.handleDatePickerChange,
+      on: _this2.v3 ? undefined : {
+        "change": _this2.handleDatePickerChange
+      }
+    }), h(ToolbarSpacer), h(ViewSelector, _this2.v3 ? function () {
+      return [h(ViewSelectorList)];
+    } : [h(ViewSelectorList)])]), view && h(viewComponent, __assign({
+      onDataaction: this.handleDataAction,
+      on: this.v3 ? undefined : {
+        'dataaction': this.handleDataAction
+      },
+      attrs: this.v3 ? undefined : viewProps
+    }, viewProps)), // @ts-ignore  function children
+    h(SchedulerFooter, this.v3 ? function () {
+      return [slotDuration && slotDuration < 24 * 60 && // @ts-ignore  function children
+      h(BusinessHours, _this2.v3 ? function () {
+        return [// @ts-ignore  function children
+        h(Button, {
+          tabIndex: -1,
+          attrs: _this2.v3 ? undefined : {
+            tabIndex: -1
+          },
+          onClick: _this2.handleShowWorkHoursClick,
+          on: _this2.v3 ? undefined : {
+            "click": _this2.handleShowWorkHoursClick
+          }
+        }, _this2.v3 ? function () {
+          return [h("span", {
+            "class": "k-icon k-i-clock"
+          }), "\xA0", _this2.localization.toLanguageString(_this2.ks.showWorkHours ? showFullDay : showWorkDay, messages[_this2.ks.showWorkHours ? showFullDay : showWorkDay])];
+        } : [h("span", {
+          "class": "k-icon k-i-clock"
+        }), "\xA0", _this2.localization.toLanguageString(_this2.ks.showWorkHours ? showFullDay : showWorkDay, messages[_this2.ks.showWorkHours ? showFullDay : showWorkDay])])];
+      } : [h(Button, {
+        tabIndex: -1,
+        attrs: _this2.v3 ? undefined : {
+          tabIndex: -1
+        },
+        onClick: _this2.handleShowWorkHoursClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handleShowWorkHoursClick
+        }
+      }, _this2.v3 ? function () {
+        return [h("span", {
+          "class": "k-icon k-i-clock"
+        }), "\xA0", _this2.localization.toLanguageString(_this2.ks.showWorkHours ? showFullDay : showWorkDay, messages[_this2.ks.showWorkHours ? showFullDay : showWorkDay])];
+      } : [h("span", {
+        "class": "k-icon k-i-clock"
+      }), "\xA0", _this2.localization.toLanguageString(_this2.ks.showWorkHours ? showFullDay : showWorkDay, messages[_this2.ks.showWorkHours ? showFullDay : showWorkDay])])])];
+    } : [slotDuration && slotDuration < 24 * 60 && h(BusinessHours, _this2.v3 ? function () {
+      return [h(Button, {
+        tabIndex: -1,
+        attrs: _this2.v3 ? undefined : {
+          tabIndex: -1
+        },
+        onClick: _this2.handleShowWorkHoursClick,
+        on: _this2.v3 ? undefined : {
+          "click": _this2.handleShowWorkHoursClick
+        }
+      }, _this2.v3 ? function () {
+        return [h("span", {
+          "class": "k-icon k-i-clock"
+        }), "\xA0", _this2.localization.toLanguageString(_this2.ks.showWorkHours ? showFullDay : showWorkDay, messages[_this2.ks.showWorkHours ? showFullDay : showWorkDay])];
+      } : [h("span", {
+        "class": "k-icon k-i-clock"
+      }), "\xA0", _this2.localization.toLanguageString(_this2.ks.showWorkHours ? showFullDay : showWorkDay, messages[_this2.ks.showWorkHours ? showFullDay : showWorkDay])])];
+    } : [h(Button, {
+      tabIndex: -1,
+      attrs: _this2.v3 ? undefined : {
+        tabIndex: -1
+      },
+      onClick: _this2.handleShowWorkHoursClick,
+      on: _this2.v3 ? undefined : {
+        "click": _this2.handleShowWorkHoursClick
+      }
+    }, _this2.v3 ? function () {
+      return [h("span", {
+        "class": "k-icon k-i-clock"
+      }), "\xA0", _this2.localization.toLanguageString(_this2.ks.showWorkHours ? showFullDay : showWorkDay, messages[_this2.ks.showWorkHours ? showFullDay : showWorkDay])];
+    } : [h("span", {
+      "class": "k-icon k-i-clock"
+    }), "\xA0", _this2.localization.toLanguageString(_this2.ks.showWorkHours ? showFullDay : showWorkDay, messages[_this2.ks.showWorkHours ? showFullDay : showWorkDay])])])])]);
+  },
+  methods: {
+    getViewComponentByName: function getViewComponentByName(viewName) {
+      switch (viewName.toLowerCase()) {
+        case 'week':
+          return WeekView;
+
+        case 'workweek':
+          return WorkWeekView;
+
+        case 'agenda':
+          return AgendaView;
+
+        case 'timeline':
+          return TimelineView;
+
+        case 'month':
+          return MonthView;
+
+        default:
+          return DayView;
+      }
+    },
+    getViewPropValue: function getViewPropValue(view, propName, activeViewName) {
+      var componentProp = this.getViewComponentByName(activeViewName).props[propName];
+      return view[propName] || componentProp ? componentProp.default : undefined;
+    },
+    handleDataChange: function handleDataChange(_a) {
+      var _b = _a.created,
+          created = _b === void 0 ? [] : _b,
+          _c = _a.updated,
+          updated = _c === void 0 ? [] : _c,
+          _d = _a.deleted,
+          deleted = _d === void 0 ? [] : _d;
+      var args = {
+        created: created,
+        updated: updated,
+        deleted: deleted
+      };
+      this.$emit('datachange', args);
+    },
+    handleCreate: function handleCreate(action) {
+      var created = [action.dataItem];
+      this.handleDataChange({
+        created: created
+      });
+    },
+    handleUpdate: function handleUpdate(action) {
+      var _this = this;
+
+      var created = [];
+      var updated = [];
+
+      if (action.series) {
+        if (Array.isArray(action.dataItem)) {
+          action.dataItem.map(function (dataItem) {
+            var masterClone = clone(findMaster(action.dataItem, _this.fields, _this.dataItems));
+            var newDataItem = clone(dataItem);
+            setField(newDataItem, _this.fields.originalStart, getField(masterClone, _this.fields.originalStart));
+            setField(newDataItem, _this.fields.recurrenceId, getField(masterClone, _this.fields.recurrenceId));
+            setField(newDataItem, _this.fields.recurrenceExceptions, getField(masterClone, _this.fields.recurrenceExceptions));
+            updated.push(newDataItem);
+          });
+        } else {
+          var masterClone = clone(findMaster(action.dataItem, this.fields, this.dataItems));
+          var newDataItem = clone(action.dataItem);
+          setField(newDataItem, this.fields.originalStart, getField(masterClone, this.fields.originalStart));
+          setField(newDataItem, this.fields.recurrenceId, getField(masterClone, this.fields.recurrenceId));
+          setField(newDataItem, this.fields.recurrenceExceptions, getField(masterClone, this.fields.recurrenceExceptions));
+          updated.push(newDataItem);
+        }
+      } else {
+        if (Array.isArray(action.dataItem)) {
+          action.dataItem.map(function (dataItem) {
+            var isException = getField(dataItem, _this.fields.recurrenceRule) !== null && getField(dataItem, _this.fields.recurrenceRule) !== undefined;
+            var isRecurring = getField(dataItem, _this.fields.recurrenceId) !== null && getField(dataItem, _this.fields.recurrenceId) !== undefined;
+
+            if (isRecurring && isException) {
+              var masterClone = clone(findMaster(dataItem, _this.fields, _this.dataItems));
+              var exceptionDate = getField(dataItem, _this.fields.originalStart);
+              var currentExceptions = getField(masterClone, _this.fields.recurrenceExceptions) || [];
+              setField(masterClone, _this.fields.recurrenceExceptions, __spreadArrays(currentExceptions, [exceptionDate]));
+              setField(dataItem, _this.fields.recurrenceRule, null);
+              updated.push(masterClone);
+              created.push(dataItem);
+            } else {
+              updated.push(dataItem);
+            }
+          });
+        } else {
+          var isException = getField(action.dataItem, this.fields.recurrenceRule) !== null && getField(action.dataItem, this.fields.recurrenceRule) !== undefined;
+          var isRecurring = getField(action.dataItem, this.fields.recurrenceId) !== null && getField(action.dataItem, this.fields.recurrenceId) !== undefined;
+
+          if (isRecurring && isException) {
+            var masterClone = clone(findMaster(action.dataItem, this.fields, this.dataItems));
+            var exceptionDate = getField(action.dataItem, this.fields.originalStart);
+            var currentExceptions = getField(masterClone, this.fields.recurrenceExceptions) || [];
+            setField(masterClone, this.fields.recurrenceExceptions, __spreadArrays(currentExceptions, [exceptionDate]));
+            setField(action.dataItem, this.fields.recurrenceRule, null);
+            updated.push(masterClone);
+            created.push(action.dataItem);
+          } else {
+            updated.push(action.dataItem);
+          }
+        }
+      }
+
+      this.handleDataChange({
+        updated: updated,
+        created: created
+      });
+    },
+    handleRemove: function handleRemove(action) {
+      var updated = [];
+      var deleted = [];
+
+      if (action.series) {
+        var masterClone = clone(findMaster(action.dataItem, this.fields, this.dataItems));
+        var dataItem = clone(action.dataItem);
+        setField(dataItem, this.fields.originalStart, getField(masterClone, this.fields.originalStart));
+        setField(dataItem, this.fields.recurrenceId, getField(masterClone, this.fields.recurrenceId));
+        setField(dataItem, this.fields.recurrenceRule, getField(masterClone, this.fields.recurrenceRule));
+        setField(dataItem, this.fields.recurrenceExceptions, getField(masterClone, this.fields.recurrenceExceptions));
+        deleted.push(dataItem);
+      } else {
+        var isException = getField(action.dataItem, this.fields.recurrenceRule) !== null && getField(action.dataItem, this.fields.recurrenceRule) !== undefined;
+
+        if (!isException) {
+          deleted.push(action.dataItem);
+        } else {
+          var masterClone = clone(findMaster(action.dataItem, this.fields, this.dataItems));
+          var exceptionDate = getField(action.dataItem, this.fields.originalStart);
+          var currentExceptions = getField(masterClone, this.fields.recurrenceExceptions) || [];
+          setField(masterClone, this.fields.recurrenceExceptions, __spreadArrays(currentExceptions, [exceptionDate]));
+          setField(action.dataItem, this.fields.recurrenceRule, null);
+          updated.push(masterClone);
+        }
+      }
+
+      this.handleDataChange({
+        updated: updated,
+        deleted: deleted
+      });
+    },
+    handleDataAction: function handleDataAction(action) {
+      switch (action.type) {
+        case DATA_ACTION.create:
+          this.handleCreate(action);
+          break;
+
+        case DATA_ACTION.update:
+          this.handleUpdate(action);
+          break;
+
+        case DATA_ACTION.remove:
+          this.handleRemove(action);
+          break;
+
+        default:
+          break;
+      }
+    },
+    handleActiveViewNameChange: function handleActiveViewNameChange(newView, event) {
+      this.ks.activeViewName = newView;
+      this.ks.dateFormat = this.getViewPropValue(this.ks.view, 'selectedDateFormat', newView) || DEFAULT_DATE_FORMAT;
+      this.ks.shortDateFormat = this.getViewPropValue(this.ks.view, 'selectedShortDateFormat', newView) || DEFAULT_SHORT_DATE_FORMAT;
+      this.ks.dateRange = this.getViewComponentByName(newView).props.dateRange.default()({
+        intl: this.intl,
+        date: this.ks.currentDate,
+        timezone: this.$props.timezone,
+        numberOfDays: this.getViewPropValue(this.ks.view, 'numberOfDays', this.ks.activeViewName),
+        workWeekStart: this.getViewPropValue(this.ks.view, 'workWeekStart', this.ks.activeViewName) || this.intl.firstDay(),
+        workWeekEnd: this.getViewPropValue(this.ks.view, 'workWeekEnd', this.ks.activeViewName) || (this.intl.firstDay() + this.getViewPropValue(this.ks.view, 'numberOfDays', this.ks.activeViewName)) % 6
+      });
+      this.$emit('viewchange', __assign(__assign({
+        viewName: newView
+      }, event), {
+        target: this.ks.scheduler
+      }));
+    },
+    handleDateChange: function handleDateChange(newDate, event) {
+      this.setDate(newDate, __assign(__assign({}, event), {
+        target: this.ks.scheduler
+      }));
+    },
+    handleDatePickerChange: function handleDatePickerChange(event) {
+      if (!event.value) {
+        return;
+      }
+
+      this.setDate(event.value, __assign(__assign({}, event), {
+        target: this.ks.scheduler,
+        nativeEvent: event.event
+      }));
+    },
+    handleNextClick: function handleNextClick(event) {
+      event.preventDefault();
+      var offset = this.getViewPropValue(this.ks.view, 'numberOfDays', this.ks.activeViewName) || 1;
+      var isMonthView = offset > 27;
+      var newDate = isMonthView ? addMonths(this.ks.currentDate, Math.round(offset / 27)) : addDays(this.ks.currentDate, offset);
+      this.setDate(newDate, event);
+    },
+    handlePrevClick: function handlePrevClick(event) {
+      event.preventDefault();
+      var offset = this.getViewPropValue(this.ks.view, 'numberOfDays', this.ks.activeViewName) || 1;
+      var isMonthView = offset > 27;
+      var newDate = isMonthView ? addMonths(this.ks.currentDate, -Math.round(offset / 27)) : addDays(this.ks.currentDate, -offset);
+      this.setDate(newDate, event);
+    },
+    handleTodayClick: function handleTodayClick(event) {
+      event.preventDefault();
+      var newDate = getToday();
+      this.setDate(newDate, event);
+    },
+    handleShowWorkHoursClick: function handleShowWorkHoursClick() {
+      this.ks.showWorkHours = !this.ks.showWorkHours;
+    },
+    handleFocus: function handleFocus() {
+      if (this.$el) {
+        this.$el.style.boxShadow = '0 0.5px 0.5px 0.5px rgba(0, 0, 0, .12)';
+      }
+    },
+    handleBlur: function handleBlur() {
+      if (this.$el) {
+        this.$el.style.boxShadow = '';
+      }
+    },
+    setDate: function setDate(newDate, event) {
+      this.ks.currentDate = newDate;
+      this.ks.dateRange = this.getViewComponentByName(this.ks.activeViewName).props.dateRange.default()({
+        intl: this.intl,
+        date: this.ks.currentDate,
+        timezone: this.$props.timezone,
+        numberOfDays: this.getViewPropValue(this.ks.view, 'numberOfDays', this.ks.activeViewName),
+        workWeekStart: this.getViewPropValue(this.ks.view, 'workWeekStart', this.ks.activeViewName) || this.intl.firstDay(),
+        workWeekEnd: this.getViewPropValue(this.ks.view, 'workWeekEnd', this.ks.activeViewName) || (this.intl.firstDay() + this.getViewPropValue(this.ks.view, 'numberOfDays', this.ks.activeViewName)) % 6
+      });
+      this.$emit('datechange', {
+        date: newDate,
+        event: event
+      });
+    }
+  }
+};
+var Scheduler = SchedulerVue2;
+export { Scheduler, SchedulerVue2 };