@progress/kendo-vue-scheduler 3.1.2 → 3.1.3-dev.202203311441

package/dist/npm/editors/SchedulerFormEditor.js

@@ -28,11 +28,24 @@ var kendo_date_math_1 = require("@progress/kendo-date-math");
 
 var kendo_vue_labels_1 = require("@progress/kendo-vue-labels");
 
+var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
+
 var kendo_vue_form_1 = require("@progress/kendo-vue-form");
 
+var kendo_vue_inputs_1 = require("@progress/kendo-vue-inputs");
+
 var kendo_vue_dateinputs_1 = require("@progress/kendo-vue-dateinputs");
 
-var messages_1 = require("../messages"); // tslint:enable:max-line-length
+var messages_1 = require("../messages"); // import { useSchedulerPropsContext, useSchedulerFieldsContext } from '../context';
+
+
+var FilterableComboBox_1 = require("./FilterableComboBox");
+
+var RecurrenceEditor_1 = require("../recurrence/RecurrenceEditor");
+
+var ResourceEditor_1 = require("./ResourceEditor");
+
+var ZonedDateTime_1 = require("./ZonedDateTime"); // tslint:enable:max-line-length
 
 
 var SchedulerFormEditorVue2 = {
@@ -41,34 +54,174 @@ var SchedulerFormEditorVue2 = {
     as: [String, Function, Object],
     id: String,
     tabIndex: Number,
-    titleLabel: [String, Function, Object],
-    titleError: [String, Function, Object],
-    titleEditor: [String, Function, Object],
-    startLabel: [String, Function, Object],
-    startError: [String, Function, Object],
-    startEditor: [String, Function, Object],
-    startTimezoneLabel: [String, Function, Object],
-    startTimezoneError: [String, Function, Object],
-    startTimezoneEditor: [String, Function, Object],
-    startTimezoneCheckedLabel: [String, Function, Object],
-    startTimezoneCheckedEditor: [String, Function, Object],
-    endLabel: [String, Function, Object],
-    endError: [String, Function, Object],
-    endEditor: [String, Function, Object],
-    endTimezoneLabel: [String, Function, Object],
-    endTimezoneError: [String, Function, Object],
-    endTimezoneEditor: [String, Function, Object],
-    endTimezoneCheckedLabel: [String, Function, Object],
-    endTimezoneCheckedEditor: [String, Function, Object],
-    allDayLabel: [String, Function, Object],
-    allDayEditor: [String, Function, Object],
-    recurrenceEditor: [String, Function, Object],
-    descriptionLabel: [String, Function, Object],
-    descriptionError: [String, Function, Object],
-    descriptionEditor: [String, Function, Object],
-    resourceLabel: [String, Function, Object],
-    resourcesError: [String, Function, Object],
-    resourceEditor: [String, Function, Object],
+    titleLabel: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    titleError: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Error;
+      }
+    },
+    titleEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_inputs_1.Input;
+      }
+    },
+    startLabel: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    startError: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Error;
+      }
+    },
+    startEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return ZonedDateTime_1.ZonedDateTime;
+      }
+    },
+    startTimezoneLabel: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    startTimezoneError: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Error;
+      }
+    },
+    startTimezoneEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return FilterableComboBox_1.FilterableComboBox;
+      }
+    },
+    startTimezoneCheckedLabel: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    startTimezoneCheckedEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_inputs_1.Checkbox;
+      }
+    },
+    endLabel: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    endError: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Error;
+      }
+    },
+    endEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return ZonedDateTime_1.ZonedDateTime;
+      }
+    },
+    endTimezoneLabel: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    endTimezoneError: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Error;
+      }
+    },
+    endTimezoneEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return FilterableComboBox_1.FilterableComboBox;
+      }
+    },
+    endTimezoneCheckedLabel: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    endTimezoneCheckedEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_inputs_1.Checkbox;
+      }
+    },
+    allDayLabel: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    allDayEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_inputs_1.Checkbox;
+      }
+    },
+    recurrenceEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return RecurrenceEditor_1.RecurrenceEditor;
+      }
+    },
+    descriptionLabel: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    descriptionError: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Error;
+      }
+    },
+    descriptionEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_inputs_1.TextArea;
+      }
+    },
+    resourceLabel: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    resourcesError: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return kendo_vue_labels_1.Label;
+      }
+    },
+    resourceEditor: {
+      type: [String, Function, Object],
+      default: function _default() {
+        return ResourceEditor_1.ResourceEditor;
+      }
+    },
     errors: Object,
     valid: Boolean,
     touched: Boolean,
@@ -85,14 +238,17 @@ var SchedulerFormEditorVue2 = {
     ks: {
       default: null
     },
+    kendoForm: {
+      default: {}
+    },
     kendoLocalizationService: {
       default: null
     }
   },
   data: function data() {
     return {
-      startZoneChecked: Boolean(this.$props.valueGetter(this.fields.startTimezone)),
-      endZoneChecked: Boolean(this.$props.valueGetter(this.fields.endTimezone))
+      startZoneChecked: Boolean(this.kendoForm.valueGetter(this.ks.fields.startTimezone)),
+      endZoneChecked: Boolean(this.kendoForm.valueGetter(this.ks.fields.endTimezone))
     };
   },
   // @ts-ignore
@@ -104,9 +260,11 @@ var SchedulerFormEditorVue2 = {
   },
   // @ts-ignore
   render: function render(createElement) {
+    var _this = this;
+
     var h = gh || createElement;
     var timezones = kendo_date_math_1.timezoneNames();
-    var localization = this.provideLocalizationService(this); // const fields = useSchedulerFieldsContext();
+    var localization = kendo_vue_intl_1.provideLocalizationService(this); // const fields = useSchedulerFieldsContext();
     // const { resources, timezone } = useSchedulerPropsContext();
 
     var _a = this.$props,
@@ -141,56 +299,66 @@ var SchedulerFormEditorVue2 = {
         DescriptionError = _b.descriptionError,
         ResourceLabel = _b.resourceLabel,
         ResourceEditor = _b.resourceEditor;
-    var start = this.$props.valueGetter(this.fields.start) || new Date();
-    var startTimezone = this.$props.valueGetter(this.fields.startTimezone) || this.ks.timezone || '';
-    var endTimezone = this.$props.valueGetter(this.fields.endTimezone) || this.ks.timezone || '';
+    var start = this.kendoForm.valueGetter(this.ks.fields.start) || new Date();
+    var startTimezone = this.kendoForm.valueGetter(this.ks.fields.startTimezone) || this.ks.timezone || '';
+    var endTimezone = this.kendoForm.valueGetter(this.ks.fields.endTimezone) || this.ks.timezone || '';
     this.requiredValidationMessage = localization.toLanguageString(messages_1.editorValidationRequired, messages_1.messages[messages_1.editorValidationRequired]);
+    var title = this.ks.fields.title;
     return h("div", {
       //   {...other}
       "class": 'k-scheduler-edit-form'
     }, [h("div", {
       "class": "k-form-field"
-    }, [h(kendo_vue_form_1.Field, {
-      name: this.fields.title,
+    }, [// @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: title,
       attrs: this.v3 ? undefined : {
-        name: this.fields.title,
+        name: title,
         component: TitleLabel,
         editorId: 'k-scheduler-editor-title'
       },
       component: TitleLabel,
       editorId: 'k-scheduler-editor-title'
-    }, [localization.toLanguageString(messages_1.editorEventTitle, messages_1.messages[messages_1.editorEventTitle])]), h("div", {
+    }, this.v3 ? function () {
+      return [localization.toLanguageString(messages_1.editorEventTitle, messages_1.messages[messages_1.editorEventTitle])];
+    } : [localization.toLanguageString(messages_1.editorEventTitle, messages_1.messages[messages_1.editorEventTitle])]), h("div", {
       "class": "k-form-field-wrap"
     }, [h(kendo_vue_form_1.Field, {
       id: "k-scheduler-editor-title",
       attrs: this.v3 ? undefined : {
         id: "k-scheduler-editor-title",
-        name: this.fields.title,
-        field: this.fields.title,
+        name: title,
+        field: title,
         component: TitleEditor
       },
-      name: this.fields.title,
-      field: this.fields.title,
+      name: title,
+      field: title,
       component: TitleEditor
-    }), this.$props.errors[this.fields.title] && h(kendo_vue_form_1.Field, {
-      name: this.fields.title,
+    }), this.kendoForm.errors[title] && // @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: title,
       attrs: this.v3 ? undefined : {
-        name: this.fields.title,
+        name: title,
         component: TitleError
       },
       component: TitleError
-    }, [this.$props.errors[this.fields.title]])])]), h("div", {
+    }, this.v3 ? function () {
+      return [_this.kendoForm.errors[title]];
+    } : [_this.kendoForm.errors[title]])])]), h("div", {
       "class": "k-form-field"
-    }, [h(kendo_vue_form_1.Field, {
-      name: this.fields.start,
+    }, [// @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.start,
       attrs: this.v3 ? undefined : {
-        name: this.fields.start,
+        name: this.ks.fields.start,
         component: StartLabel,
         editorId: "k-scheduler-editor-start"
       },
       component: StartLabel,
       editorId: "k-scheduler-editor-start"
-    }, [localization.toLanguageString(messages_1.editorEventStart, messages_1.messages[messages_1.editorEventStart])]), h("div", {
+    }, this.v3 ? function () {
+      return [localization.toLanguageString(messages_1.editorEventStart, messages_1.messages[messages_1.editorEventStart])];
+    } : [localization.toLanguageString(messages_1.editorEventStart, messages_1.messages[messages_1.editorEventStart])]), h("div", {
       "class": "k-form-field-wrap",
       style: {
         display: 'flex'
@@ -199,25 +367,28 @@ var SchedulerFormEditorVue2 = {
       id: "k-scheduler-editor-start",
       attrs: this.v3 ? undefined : {
         id: "k-scheduler-editor-start",
-        name: this.fields.start,
+        name: this.ks.fields.start,
         width: "auto",
         component: StartEditor,
-        as: this.$props.valueGetter(this.fields.isAllDay) ? kendo_vue_dateinputs_1.DatePicker : kendo_vue_dateinputs_1.DateTimePicker,
+        as: this.kendoForm.valueGetter(this.ks.fields.isAllDay) ? kendo_vue_dateinputs_1.DatePicker : kendo_vue_dateinputs_1.DateTimePicker,
         timezone: this.ks.timezone
       },
-      name: this.fields.start,
+      name: this.ks.fields.start,
       width: "auto",
       component: StartEditor,
-      as: this.$props.valueGetter(this.fields.isAllDay) ? kendo_vue_dateinputs_1.DatePicker : kendo_vue_dateinputs_1.DateTimePicker,
+      as: this.kendoForm.valueGetter(this.ks.fields.isAllDay) ? kendo_vue_dateinputs_1.DatePicker : kendo_vue_dateinputs_1.DateTimePicker,
       timezone: this.ks.timezone
-    }), this.$props.errors[this.fields.start] && h(kendo_vue_form_1.Field, {
-      name: this.fields.start,
+    }), this.kendoForm.errors[this.ks.fields.start] && // @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.start,
       attrs: this.v3 ? undefined : {
-        name: this.fields.start,
+        name: this.ks.fields.start,
         component: StartError
       },
       component: StartError
-    }, [this.$props.errors[this.fields.start]])]), "\xA0", h("div", [h(StartTimezoneCheckedEditor, {
+    }, this.v3 ? function () {
+      return [_this.kendoForm.errors[_this.ks.fields.start]];
+    } : [_this.kendoForm.errors[_this.ks.fields.start]])]), "\xA0", h("div", [h(StartTimezoneCheckedEditor, {
       id: 'k-scheduler-editor-set-start-timezone',
       attrs: this.v3 ? undefined : {
         id: 'k-scheduler-editor-set-start-timezone',
@@ -228,7 +399,8 @@ var SchedulerFormEditorVue2 = {
         "change": this.handleStartZoneCheckboxChange
       },
       value: this.startZoneChecked
-    }), "\xA0", h(StartTimezoneCheckedLabel, {
+    }), "\xA0", // @ts-ignore function children
+    h(StartTimezoneCheckedLabel, {
       "class": 'k-checkbox-label',
       editorId: 'k-scheduler-editor-set-start-timezone',
       attrs: this.v3 ? undefined : {
@@ -237,16 +409,21 @@ var SchedulerFormEditorVue2 = {
       style: {
         display: 'inline-flex'
       }
-    }, [localization.toLanguageString(messages_1.editorEventTimeZone, messages_1.messages[messages_1.editorEventTimeZone])])])])]), this.startZoneChecked && h("div", {
+    }, this.v3 ? function () {
+      return [localization.toLanguageString(messages_1.editorEventTimeZone, messages_1.messages[messages_1.editorEventTimeZone])];
+    } : [localization.toLanguageString(messages_1.editorEventTimeZone, messages_1.messages[messages_1.editorEventTimeZone])])])])]), this.startZoneChecked && h("div", {
       "class": "k-form-field"
-    }, [h(kendo_vue_form_1.Field, {
-      name: this.fields.start,
+    }, [// @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.start,
       attrs: this.v3 ? undefined : {
-        name: this.fields.start,
+        name: this.ks.fields.start,
         component: StartTimezoneLabel
       },
       component: StartTimezoneLabel
-    }, [localization.toLanguageString(messages_1.editorEventStartTimeZone, messages_1.messages[messages_1.editorEventStartTimeZone])]), h("div", {
+    }, this.v3 ? function () {
+      return [localization.toLanguageString(messages_1.editorEventStartTimeZone, messages_1.messages[messages_1.editorEventStartTimeZone])];
+    } : [localization.toLanguageString(messages_1.editorEventStartTimeZone, messages_1.messages[messages_1.editorEventStartTimeZone])]), h("div", {
       "class": "k-form-field-wrap"
     }, [h(kendo_vue_form_1.Field, {
       component: StartTimezoneEditor,
@@ -254,32 +431,38 @@ var SchedulerFormEditorVue2 = {
         component: StartTimezoneEditor,
         value: startTimezone,
         validator: this.startTimezoneValidator,
-        data: timezones,
-        name: this.fields.startTimezone
+        dataItems: timezones,
+        name: this.ks.fields.startTimezone
       },
       value: startTimezone,
       validator: this.startTimezoneValidator,
-      data: timezones,
-      name: this.fields.startTimezone
-    }), this.$props.errors[this.fields.startTimezone] && h(kendo_vue_form_1.Field, {
-      name: this.fields.startTimezone,
+      dataItems: timezones,
+      name: this.ks.fields.startTimezone
+    }), this.kendoForm.errors[this.ks.fields.startTimezone] && // @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.startTimezone,
       attrs: this.v3 ? undefined : {
-        name: this.fields.startTimezone,
+        name: this.ks.fields.startTimezone,
         component: StartTimezoneError
       },
       component: StartTimezoneError
-    }, [this.$props.errors[this.fields.startTimezone]])])]), h("div", {
+    }, this.v3 ? function () {
+      return [_this.kendoForm.errors[_this.ks.fields.startTimezone]];
+    } : [_this.kendoForm.errors[_this.ks.fields.startTimezone]])])]), h("div", {
       "class": "k-form-field"
-    }, [h(kendo_vue_form_1.Field, {
-      name: this.fields.end,
+    }, [// @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.end,
       attrs: this.v3 ? undefined : {
-        name: this.fields.end,
+        name: this.ks.fields.end,
         component: EndLabel,
         editorId: "k-scheduler-editor-end"
       },
       component: EndLabel,
       editorId: "k-scheduler-editor-end"
-    }, [localization.toLanguageString(messages_1.editorEventEnd, messages_1.messages[messages_1.editorEventEnd])]), h("div", {
+    }, this.v3 ? function () {
+      return [localization.toLanguageString(messages_1.editorEventEnd, messages_1.messages[messages_1.editorEventEnd])];
+    } : [localization.toLanguageString(messages_1.editorEventEnd, messages_1.messages[messages_1.editorEventEnd])]), h("div", {
       "class": "k-form-field-wrap",
       style: {
         display: 'flex'
@@ -288,25 +471,28 @@ var SchedulerFormEditorVue2 = {
       id: "k-scheduler-editor-end",
       attrs: this.v3 ? undefined : {
         id: "k-scheduler-editor-end",
-        name: this.fields.end,
+        name: this.ks.fields.end,
         width: "auto",
         component: EndEditor,
-        as: this.$props.valueGetter(this.fields.isAllDay) ? kendo_vue_dateinputs_1.DatePicker : kendo_vue_dateinputs_1.DateTimePicker,
+        as: this.kendoForm.valueGetter(this.ks.fields.isAllDay) ? kendo_vue_dateinputs_1.DatePicker : kendo_vue_dateinputs_1.DateTimePicker,
         timezone: this.ks.timezone
       },
-      name: this.fields.end,
+      name: this.ks.fields.end,
       width: "auto",
       component: EndEditor,
-      as: this.$props.valueGetter(this.fields.isAllDay) ? kendo_vue_dateinputs_1.DatePicker : kendo_vue_dateinputs_1.DateTimePicker,
+      as: this.kendoForm.valueGetter(this.ks.fields.isAllDay) ? kendo_vue_dateinputs_1.DatePicker : kendo_vue_dateinputs_1.DateTimePicker,
       timezone: this.ks.timezone
-    }), this.$props.errors[this.fields.end] && h(kendo_vue_form_1.Field, {
-      name: this.fields.end,
+    }), this.kendoForm.errors[this.ks.fields.end] && // @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.end,
       attrs: this.v3 ? undefined : {
-        name: this.fields.end,
+        name: this.ks.fields.end,
         component: EndError
       },
       component: EndError
-    }, [this.$props.errors[this.fields.end]])]), "\xA0", h("div", [this.startZoneChecked && [h(EndTimezoneCheckedEditor, {
+    }, this.v3 ? function () {
+      return [_this.kendoForm.errors[_this.ks.fields.end]];
+    } : [_this.kendoForm.errors[_this.ks.fields.end]])]), "\xA0", h("div", [this.startZoneChecked && [h(EndTimezoneCheckedEditor, {
       id: 'k-scheduler-editor-set-end-timezone',
       attrs: this.v3 ? undefined : {
         id: 'k-scheduler-editor-set-end-timezone',
@@ -317,7 +503,8 @@ var SchedulerFormEditorVue2 = {
         "change": this.handleEndZoneCheckboxChange
       },
       value: this.endZoneChecked
-    }), h(EndTimezoneCheckedLabel, {
+    }), // @ts-ignore function children
+    h(EndTimezoneCheckedLabel, {
       "class": 'k-checkbox-label',
       editorId: 'k-scheduler-editor-set-end-timezone',
       attrs: this.v3 ? undefined : {
@@ -326,43 +513,51 @@ var SchedulerFormEditorVue2 = {
       style: {
         display: 'inline-flex'
       }
-    }, [localization.toLanguageString(messages_1.editorEventSeparateTimeZones, messages_1.messages[messages_1.editorEventSeparateTimeZones])])]])])]), this.endZoneChecked && h("div", {
+    }, this.v3 ? function () {
+      return [localization.toLanguageString(messages_1.editorEventSeparateTimeZones, messages_1.messages[messages_1.editorEventSeparateTimeZones])];
+    } : [localization.toLanguageString(messages_1.editorEventSeparateTimeZones, messages_1.messages[messages_1.editorEventSeparateTimeZones])])]])])]), this.endZoneChecked && h("div", {
       "class": "k-form-field"
-    }, [h(kendo_vue_form_1.Field, {
-      name: this.fields.endTimezone,
+    }, [// @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.endTimezone,
       attrs: this.v3 ? undefined : {
-        name: this.fields.endTimezone,
+        name: this.ks.fields.endTimezone,
         component: EndTimezoneLabel
       },
       component: EndTimezoneLabel
-    }, [localization.toLanguageString(messages_1.editorEventEndTimeZone, messages_1.messages[messages_1.editorEventEndTimeZone])]), h("div", {
+    }, this.v3 ? function () {
+      return [localization.toLanguageString(messages_1.editorEventEndTimeZone, messages_1.messages[messages_1.editorEventEndTimeZone])];
+    } : [localization.toLanguageString(messages_1.editorEventEndTimeZone, messages_1.messages[messages_1.editorEventEndTimeZone])]), h("div", {
       "class": "k-form-field-wrap"
     }, [h(kendo_vue_form_1.Field, {
       value: endTimezone,
       attrs: this.v3 ? undefined : {
         value: endTimezone,
-        data: timezones,
+        dataItems: timezones,
         validator: this.endTimezoneValidator,
         component: EndTimezoneEditor,
-        name: this.fields.endTimezone
+        name: this.ks.fields.endTimezone
       },
-      data: timezones,
+      dataItems: timezones,
       validator: this.endTimezoneValidator,
       component: EndTimezoneEditor,
-      name: this.fields.endTimezone
-    }), this.$props.errors[this.fields.endTimezone] && h(kendo_vue_form_1.Field, {
-      name: this.fields.endTimezone,
+      name: this.ks.fields.endTimezone
+    }), this.kendoForm.errors[this.ks.fields.endTimezone] && // @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.endTimezone,
       attrs: this.v3 ? undefined : {
-        name: this.fields.endTimezone,
+        name: this.ks.fields.endTimezone,
         component: EndTimezoneError
       },
       component: EndTimezoneError
-    }, [this.$props.errors[this.fields.endTimezone]])])]), h("div", {
+    }, this.v3 ? function () {
+      return [_this.kendoForm.errors[_this.ks.fields.endTimezone]];
+    } : [_this.kendoForm.errors[_this.ks.fields.endTimezone]])])]), h("div", {
       "class": "k-form-field"
     }, [h(kendo_vue_form_1.Field, {
-      name: this.fields.isAllDay,
+      name: this.ks.fields.isAllDay,
       attrs: this.v3 ? undefined : {
-        name: this.fields.isAllDay,
+        name: this.ks.fields.isAllDay,
         component: kendo_vue_labels_1.Label
       },
       component: kendo_vue_labels_1.Label
@@ -372,67 +567,76 @@ var SchedulerFormEditorVue2 = {
       id: 'k-is-allday-checkbox',
       attrs: this.v3 ? undefined : {
         id: 'k-is-allday-checkbox',
-        name: this.fields.isAllDay,
+        name: this.ks.fields.isAllDay,
         component: AllDayEditor
       },
-      name: this.fields.isAllDay,
+      name: this.ks.fields.isAllDay,
       component: AllDayEditor
-    }), "\xA0", h(kendo_vue_form_1.Field, {
-      name: this.fields.isAllDay,
+    }), "\xA0", // @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.isAllDay,
       attrs: this.v3 ? undefined : {
-        name: this.fields.isAllDay,
-        field: this.fields.isAllDay,
+        name: this.ks.fields.isAllDay,
+        field: this.ks.fields.isAllDay,
         editorId: 'k-is-allday-checkbox',
         component: AllDayLabel
       },
-      field: this.fields.isAllDay,
+      field: this.ks.fields.isAllDay,
       editorId: 'k-is-allday-checkbox',
       "class": 'k-checkbox-label',
       component: AllDayLabel
-    }, [localization.toLanguageString(messages_1.editorEventAllDay, messages_1.messages[messages_1.editorEventAllDay])])])]), h(kendo_vue_form_1.Field, {
+    }, this.v3 ? function () {
+      return [localization.toLanguageString(messages_1.editorEventAllDay, messages_1.messages[messages_1.editorEventAllDay])];
+    } : [localization.toLanguageString(messages_1.editorEventAllDay, messages_1.messages[messages_1.editorEventAllDay])])])]), h(kendo_vue_form_1.Field, {
       component: RecurrenceEditor,
       attrs: this.v3 ? undefined : {
         component: RecurrenceEditor,
-        field: this.fields.recurrenceRule,
-        name: this.fields.recurrenceRule,
+        field: this.ks.fields.recurrenceRule,
+        name: this.ks.fields.recurrenceRule,
         start: start
       },
-      field: this.fields.recurrenceRule,
-      name: this.fields.recurrenceRule,
+      field: this.ks.fields.recurrenceRule,
+      name: this.ks.fields.recurrenceRule,
       start: start
     }), h("div", {
       "class": "k-form-field"
-    }, [h(kendo_vue_form_1.Field, {
-      name: this.fields.description,
+    }, [// @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.description,
       attrs: this.v3 ? undefined : {
-        name: this.fields.description,
+        name: this.ks.fields.description,
         component: DescriptionLabel
       },
       component: DescriptionLabel
-    }, [localization.toLanguageString(messages_1.editorEventDescription, messages_1.messages[messages_1.editorEventDescription])]), h("div", {
+    }, this.v3 ? function () {
+      return [localization.toLanguageString(messages_1.editorEventDescription, messages_1.messages[messages_1.editorEventDescription])];
+    } : [localization.toLanguageString(messages_1.editorEventDescription, messages_1.messages[messages_1.editorEventDescription])]), h("div", {
       "class": "k-form-field-wrap"
     }, [h(kendo_vue_form_1.Field, {
       component: DescriptionEditor,
       attrs: this.v3 ? undefined : {
         component: DescriptionEditor,
-        name: this.fields.description,
+        name: this.ks.fields.description,
         rows: 1,
         id: 'k-event-description'
       },
-      name: this.fields.description,
+      name: this.ks.fields.description,
       rows: 1,
       id: 'k-event-description',
       style: {
         width: '100%'
       }
-    }), this.$props.errors[this.fields.description] && h(kendo_vue_form_1.Field, {
-      name: this.fields.description,
+    }), this.kendoForm.errors[this.ks.fields.description] && // @ts-ignore function children
+    h(kendo_vue_form_1.Field, {
+      name: this.ks.fields.description,
       attrs: this.v3 ? undefined : {
-        name: this.fields.description,
+        name: this.ks.fields.description,
         component: DescriptionError
       },
       component: DescriptionError
-    }, [this.$props.errors[this.fields.description]])])]), (this.resources || []).map(function (resource) {
+    }, this.v3 ? function () {
+      return [_this.kendoForm.errors[_this.ks.fields.description]];
+    } : [_this.kendoForm.errors[_this.ks.fields.description]])])]), (this.ks.resources || []).map(function (resource) {
       return h("div", {
         key: resource.field
       }, [h("div", {
@@ -444,7 +648,10 @@ var SchedulerFormEditorVue2 = {
           component: ResourceLabel
         },
         component: ResourceLabel
-      }), h(kendo_vue_labels_1.Label, [resource.name]), h(kendo_vue_form_1.Field, {
+      }), // @ts-ignore function children
+      h(kendo_vue_labels_1.Label, this.v3 ? function () {
+        return [resource.name];
+      } : [resource.name]), h(kendo_vue_form_1.Field, {
         name: resource.field,
         attrs: this.v3 ? undefined : {
           name: resource.field,
@@ -469,10 +676,10 @@ var SchedulerFormEditorVue2 = {
   methods: {
     handleStartZoneCheckboxChange: function handleStartZoneCheckboxChange(e) {
       if (!e.value) {
-        this.$emit('change', this.fields.startTimezone, {
+        this.$emit('change', this.ks.fields.startTimezone, {
           value: null
         });
-        this.$emit('change', this.fields.endTimezone, {
+        this.$emit('change', this.ks.fields.endTimezone, {
           value: null
         });
         this.endZoneChecked = e.value;
@@ -482,7 +689,7 @@ var SchedulerFormEditorVue2 = {
     },
     handleEndZoneCheckboxChange: function handleEndZoneCheckboxChange(e) {
       if (!e.value) {
-        this.$emit('change', this.fields.endTimezone, {
+        this.$emit('change', this.ks.fields.endTimezone, {
           value: null
         });
       }
@@ -493,10 +700,10 @@ var SchedulerFormEditorVue2 = {
       return value ? undefined : this.requiredValidationMessage;
     },
     startTimezoneValidator: function startTimezoneValidator(_dataItem, formValueGetter) {
-      return this.startZoneChecked ? this.requiredValidator(formValueGetter(this.fields.startTimezone)) : undefined;
+      return this.startZoneChecked ? this.requiredValidator(formValueGetter(this.ks.fields.startTimezone)) : undefined;
     },
     endTimezoneValidator: function endTimezoneValidator(_dataItem, formValueGetter) {
-      return this.startZoneChecked && this.endZoneChecked ? this.requiredValidator(formValueGetter(this.fields.endTimezone)) || this.requiredValidator(formValueGetter(this.fields.startTimezone)) : undefined;
+      return this.startZoneChecked && this.endZoneChecked ? this.requiredValidator(formValueGetter(this.ks.fields.endTimezone)) || this.requiredValidator(formValueGetter(this.ks.fields.startTimezone)) : undefined;
     }
   }
 };