@progress/kendo-vue-scheduler 3.0.8 → 3.0.9-dev.202203010857

package/dist/npm/editors/SchedulerFormEditor.js

@@ -0,0 +1,505 @@
+"use strict";
+
+var __rest = undefined && undefined.__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SchedulerFormEditorVue2 = exports.SchedulerFormEditor = void 0; // @ts-ignore
+
+var Vue = require("vue");
+
+var allVue = Vue;
+var gh = allVue.h;
+var inject = allVue.inject;
+
+var kendo_date_math_1 = require("@progress/kendo-date-math");
+
+var kendo_vue_labels_1 = require("@progress/kendo-vue-labels");
+
+var kendo_vue_form_1 = require("@progress/kendo-vue-form");
+
+var kendo_vue_dateinputs_1 = require("@progress/kendo-vue-dateinputs");
+
+var messages_1 = require("../messages"); // tslint:enable:max-line-length
+
+
+var SchedulerFormEditorVue2 = {
+  name: 'KendoSchedulerFormEditor',
+  props: {
+    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],
+    errors: Object,
+    valid: Boolean,
+    touched: Boolean,
+    visited: Boolean,
+    modified: Boolean,
+    submitted: Boolean,
+    allowSubmit: Boolean,
+    valueGetter: Function
+  },
+  created: function created() {
+    this.requiredValidationMessage = undefined;
+  },
+  inject: {
+    ks: {
+      default: null
+    },
+    kendoLocalizationService: {
+      default: null
+    }
+  },
+  data: function data() {
+    return {
+      startZoneChecked: Boolean(this.$props.valueGetter(this.fields.startTimezone)),
+      endZoneChecked: Boolean(this.$props.valueGetter(this.fields.endTimezone))
+    };
+  },
+  // @ts-ignore
+  setup: !gh ? undefined : function () {
+    var v3 = !!gh;
+    return {
+      v3: v3
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var timezones = kendo_date_math_1.timezoneNames();
+    var localization = this.provideLocalizationService(this); // const fields = useSchedulerFieldsContext();
+    // const { resources, timezone } = useSchedulerPropsContext();
+
+    var _a = this.$props,
+        Component = _a.as,
+        other = __rest(_a, ["as"]);
+
+    var _b = this.$props,
+        TitleLabel = _b.titleLabel,
+        TitleError = _b.titleError,
+        TitleEditor = _b.titleEditor,
+        StartLabel = _b.startLabel,
+        StartError = _b.startError,
+        StartEditor = _b.startEditor,
+        StartTimezoneLabel = _b.startTimezoneLabel,
+        StartTimezoneError = _b.startTimezoneError,
+        StartTimezoneEditor = _b.startTimezoneEditor,
+        StartTimezoneCheckedLabel = _b.startTimezoneCheckedLabel,
+        StartTimezoneCheckedEditor = _b.startTimezoneCheckedEditor,
+        EndLabel = _b.endLabel,
+        EndError = _b.endError,
+        EndEditor = _b.endEditor,
+        EndTimezoneLabel = _b.endTimezoneLabel,
+        EndTimezoneError = _b.endTimezoneError,
+        EndTimezoneEditor = _b.endTimezoneEditor,
+        EndTimezoneCheckedLabel = _b.endTimezoneCheckedLabel,
+        EndTimezoneCheckedEditor = _b.endTimezoneCheckedEditor,
+        AllDayLabel = _b.allDayLabel,
+        AllDayEditor = _b.allDayEditor,
+        RecurrenceEditor = _b.recurrenceEditor,
+        DescriptionLabel = _b.descriptionLabel,
+        DescriptionEditor = _b.descriptionEditor,
+        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 || '';
+    this.requiredValidationMessage = localization.toLanguageString(messages_1.editorValidationRequired, messages_1.messages[messages_1.editorValidationRequired]);
+    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,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.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", {
+      "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,
+        component: TitleEditor
+      },
+      name: this.fields.title,
+      field: this.fields.title,
+      component: TitleEditor
+    }), this.$props.errors[this.fields.title] && h(kendo_vue_form_1.Field, {
+      name: this.fields.title,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.title,
+        component: TitleError
+      },
+      component: TitleError
+    }, [this.$props.errors[this.fields.title]])])]), h("div", {
+      "class": "k-form-field"
+    }, [h(kendo_vue_form_1.Field, {
+      name: this.fields.start,
+      attrs: this.v3 ? undefined : {
+        name: this.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", {
+      "class": "k-form-field-wrap",
+      style: {
+        display: 'flex'
+      }
+    }, [h("div", [h(kendo_vue_form_1.Field, {
+      id: "k-scheduler-editor-start",
+      attrs: this.v3 ? undefined : {
+        id: "k-scheduler-editor-start",
+        name: this.fields.start,
+        width: "auto",
+        component: StartEditor,
+        as: this.$props.valueGetter(this.fields.isAllDay) ? kendo_vue_dateinputs_1.DatePicker : kendo_vue_dateinputs_1.DateTimePicker,
+        timezone: this.ks.timezone
+      },
+      name: this.fields.start,
+      width: "auto",
+      component: StartEditor,
+      as: this.$props.valueGetter(this.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,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.start,
+        component: StartError
+      },
+      component: StartError
+    }, [this.$props.errors[this.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',
+        value: this.startZoneChecked
+      },
+      onChange: this.handleStartZoneCheckboxChange,
+      on: this.v3 ? undefined : {
+        "change": this.handleStartZoneCheckboxChange
+      },
+      value: this.startZoneChecked
+    }), "\xA0", h(StartTimezoneCheckedLabel, {
+      "class": 'k-checkbox-label',
+      editorId: 'k-scheduler-editor-set-start-timezone',
+      attrs: this.v3 ? undefined : {
+        editorId: 'k-scheduler-editor-set-start-timezone'
+      },
+      style: {
+        display: 'inline-flex'
+      }
+    }, [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,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.start,
+        component: StartTimezoneLabel
+      },
+      component: StartTimezoneLabel
+    }, [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,
+      attrs: this.v3 ? undefined : {
+        component: StartTimezoneEditor,
+        value: startTimezone,
+        validator: this.startTimezoneValidator,
+        data: timezones,
+        name: this.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,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.startTimezone,
+        component: StartTimezoneError
+      },
+      component: StartTimezoneError
+    }, [this.$props.errors[this.fields.startTimezone]])])]), h("div", {
+      "class": "k-form-field"
+    }, [h(kendo_vue_form_1.Field, {
+      name: this.fields.end,
+      attrs: this.v3 ? undefined : {
+        name: this.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", {
+      "class": "k-form-field-wrap",
+      style: {
+        display: 'flex'
+      }
+    }, [h("div", [h(kendo_vue_form_1.Field, {
+      id: "k-scheduler-editor-end",
+      attrs: this.v3 ? undefined : {
+        id: "k-scheduler-editor-end",
+        name: this.fields.end,
+        width: "auto",
+        component: EndEditor,
+        as: this.$props.valueGetter(this.fields.isAllDay) ? kendo_vue_dateinputs_1.DatePicker : kendo_vue_dateinputs_1.DateTimePicker,
+        timezone: this.ks.timezone
+      },
+      name: this.fields.end,
+      width: "auto",
+      component: EndEditor,
+      as: this.$props.valueGetter(this.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,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.end,
+        component: EndError
+      },
+      component: EndError
+    }, [this.$props.errors[this.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',
+        value: this.endZoneChecked
+      },
+      onChange: this.handleEndZoneCheckboxChange,
+      on: this.v3 ? undefined : {
+        "change": this.handleEndZoneCheckboxChange
+      },
+      value: this.endZoneChecked
+    }), h(EndTimezoneCheckedLabel, {
+      "class": 'k-checkbox-label',
+      editorId: 'k-scheduler-editor-set-end-timezone',
+      attrs: this.v3 ? undefined : {
+        editorId: 'k-scheduler-editor-set-end-timezone'
+      },
+      style: {
+        display: 'inline-flex'
+      }
+    }, [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,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.endTimezone,
+        component: EndTimezoneLabel
+      },
+      component: EndTimezoneLabel
+    }, [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,
+        validator: this.endTimezoneValidator,
+        component: EndTimezoneEditor,
+        name: this.fields.endTimezone
+      },
+      data: 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,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.endTimezone,
+        component: EndTimezoneError
+      },
+      component: EndTimezoneError
+    }, [this.$props.errors[this.fields.endTimezone]])])]), h("div", {
+      "class": "k-form-field"
+    }, [h(kendo_vue_form_1.Field, {
+      name: this.fields.isAllDay,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.isAllDay,
+        component: kendo_vue_labels_1.Label
+      },
+      component: kendo_vue_labels_1.Label
+    }), h("div", {
+      "class": "k-form-field-wrap"
+    }, [h(kendo_vue_form_1.Field, {
+      id: 'k-is-allday-checkbox',
+      attrs: this.v3 ? undefined : {
+        id: 'k-is-allday-checkbox',
+        name: this.fields.isAllDay,
+        component: AllDayEditor
+      },
+      name: this.fields.isAllDay,
+      component: AllDayEditor
+    }), "\xA0", h(kendo_vue_form_1.Field, {
+      name: this.fields.isAllDay,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.isAllDay,
+        field: this.fields.isAllDay,
+        editorId: 'k-is-allday-checkbox',
+        component: AllDayLabel
+      },
+      field: this.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, {
+      component: RecurrenceEditor,
+      attrs: this.v3 ? undefined : {
+        component: RecurrenceEditor,
+        field: this.fields.recurrenceRule,
+        name: this.fields.recurrenceRule,
+        start: start
+      },
+      field: this.fields.recurrenceRule,
+      name: this.fields.recurrenceRule,
+      start: start
+    }), h("div", {
+      "class": "k-form-field"
+    }, [h(kendo_vue_form_1.Field, {
+      name: this.fields.description,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.description,
+        component: DescriptionLabel
+      },
+      component: DescriptionLabel
+    }, [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,
+        rows: 1,
+        id: 'k-event-description'
+      },
+      name: this.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,
+      attrs: this.v3 ? undefined : {
+        name: this.fields.description,
+        component: DescriptionError
+      },
+      component: DescriptionError
+    }, [this.$props.errors[this.fields.description]])])]), (this.resources || []).map(function (resource) {
+      return h("div", {
+        key: resource.field
+      }, [h("div", {
+        "class": "k-form-field"
+      }, [h(kendo_vue_form_1.Field, {
+        name: resource.field,
+        attrs: this.v3 ? undefined : {
+          name: resource.field,
+          component: ResourceLabel
+        },
+        component: ResourceLabel
+      }), h(kendo_vue_labels_1.Label, [resource.name]), h(kendo_vue_form_1.Field, {
+        name: resource.field,
+        attrs: this.v3 ? undefined : {
+          name: resource.field,
+          component: ResourceEditor,
+          resource: resource,
+          multiple: resource.multiple,
+          data: resource.data,
+          textField: resource.textField,
+          valueField: resource.valueField,
+          colorField: resource.colorField
+        },
+        component: ResourceEditor,
+        resource: resource,
+        multiple: resource.multiple,
+        data: resource.data,
+        textField: resource.textField,
+        valueField: resource.valueField,
+        colorField: resource.colorField
+      })])]);
+    })]);
+  },
+  methods: {
+    handleStartZoneCheckboxChange: function handleStartZoneCheckboxChange(e) {
+      if (!e.value) {
+        this.$emit('change', this.fields.startTimezone, {
+          value: null
+        });
+        this.$emit('change', this.fields.endTimezone, {
+          value: null
+        });
+        this.endZoneChecked = e.value;
+      }
+
+      this.startZoneChecked = e.value;
+    },
+    handleEndZoneCheckboxChange: function handleEndZoneCheckboxChange(e) {
+      if (!e.value) {
+        this.$emit('change', this.fields.endTimezone, {
+          value: null
+        });
+      }
+
+      this.endZoneChecked = e.value;
+    },
+    requiredValidator: function requiredValidator(value) {
+      return value ? undefined : this.requiredValidationMessage;
+    },
+    startTimezoneValidator: function startTimezoneValidator(_dataItem, formValueGetter) {
+      return this.startZoneChecked ? this.requiredValidator(formValueGetter(this.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;
+    }
+  }
+};
+exports.SchedulerFormEditorVue2 = SchedulerFormEditorVue2;
+var SchedulerFormEditor = SchedulerFormEditorVue2;
+exports.SchedulerFormEditor = SchedulerFormEditor;

package/dist/npm/editors/ZonedDateTime.d.ts

@@ -0,0 +1,46 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { DatePickerProps, DateTimePickerProps } from '@progress/kendo-vue-dateinputs';
+import { Omit } from '../models/Omit';
+/**
+ * @hidden
+ */
+export declare type ZonedDateTimeProps = Omit<(DatePickerProps | DateTimePickerProps), 'onChange'> & {
+    as?: any;
+    onChange?: (args: {
+        value: Date | null;
+    }) => void;
+};
+/**
+ * @hidden
+ */
+export interface ZonedDateTimeState {
+}
+/**
+ * @hidden
+ */
+export interface ZonedDateTimeComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface ZonedDateTimeMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface ZonedDateTimeData {
+}
+/**
+ * @hidden
+ */
+export interface ZonedDateTimeAll extends Vue2type, ZonedDateTimeMethods, ZonedDateTimeData, ZonedDateTimeComputed, ZonedDateTimeState {
+}
+declare let ZonedDateTimeVue2: ComponentOptions<ZonedDateTimeAll, DefaultData<ZonedDateTimeData>, DefaultMethods<ZonedDateTimeAll>, ZonedDateTimeComputed, RecordPropsDefinition<ZonedDateTimeProps>>;
+declare const ZonedDateTime: DefineComponent<ZonedDateTimeProps, any, ZonedDateTimeData, ZonedDateTimeComputed, ZonedDateTimeMethods, {}, {}, {}, string, ZonedDateTimeProps, ZonedDateTimeProps, {}>;
+export { ZonedDateTime, ZonedDateTimeVue2 };

package/dist/npm/editors/ZonedDateTime.js

@@ -0,0 +1,96 @@
+"use strict";
+
+var __rest = undefined && undefined.__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ZonedDateTimeVue2 = exports.ZonedDateTime = void 0; // @ts-ignore
+
+var Vue = require("vue");
+
+var allVue = Vue;
+var gh = allVue.h;
+var inject = allVue.inject;
+
+var kendo_vue_dateinputs_1 = require("@progress/kendo-vue-dateinputs");
+
+var kendo_date_math_1 = require("@progress/kendo-date-math"); // tslint:enable:max-line-length
+
+
+var ZonedDateTimeVue2 = {
+  name: 'KendoZonedDateTime',
+  props: {
+    as: [String, Function, Object]
+  },
+  inject: {
+    ks: {
+      default: null
+    }
+  },
+  // @ts-ignore
+  setup: !gh ? undefined : function () {
+    var v3 = !!gh;
+    return {
+      v3: v3
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+
+    var _a = this.$props,
+        Component = _a.as,
+        other = __rest(_a, ["as"]);
+
+    var timezone = this.ks.timezone;
+    return (// @ts-ignore
+      h(kendo_vue_dateinputs_1.DateTimePicker, {
+        //  {...other}
+        value: this.readDateAsLocal(other.value, timezone),
+        attrs: this.v3 ? undefined : {
+          value: this.readDateAsLocal(other.value, timezone)
+        },
+        onChange: this.handleChange,
+        on: this.v3 ? undefined : {
+          "change": this.handleChange
+        }
+      })
+    );
+  },
+  methods: {
+    handleChange: function handleChange(event) {
+      this.$emit('change', {
+        value: this.readDateWithTimezone(event.target.value, this.ks.timezone)
+      });
+    },
+    readDateAsLocal: function readDateAsLocal(value, timezone) {
+      if (value) {
+        return kendo_date_math_1.toLocalDate(kendo_date_math_1.ZonedDate.fromLocalDate(value, timezone).toUTCDate());
+      }
+
+      return value;
+    },
+    readDateWithTimezone: function readDateWithTimezone(value, timezone) {
+      if (value) {
+        return kendo_date_math_1.ZonedDate.fromUTCDate(new Date(Date.UTC(value.getFullYear(), value.getMonth(), value.getDate(), value.getHours(), value.getMinutes(), value.getSeconds(), value.getMilliseconds())), timezone).toLocalDate();
+      }
+
+      return value;
+    }
+  }
+};
+exports.ZonedDateTimeVue2 = ZonedDateTimeVue2;
+var ZonedDateTime = ZonedDateTimeVue2;
+exports.ZonedDateTime = ZonedDateTime;

package/dist/npm/editors/common.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @hidden
+ */
+export declare const labelUserSelect: any;
+/**
+ * @hidden
+ */
+export declare const readDateWithTimezone: (value: any, timezone: string) => Date;
+/**
+ * @hidden
+ */
+export declare const readDateAsLocal: (value: any, timezone?: string) => Date;

package/dist/npm/editors/common.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.readDateAsLocal = exports.readDateWithTimezone = exports.labelUserSelect = void 0;
+var kendo_date_math_1 = require("@progress/kendo-date-math");
+var utils_1 = require("../utils");
+/**
+ * @hidden
+ */
+exports.labelUserSelect = {
+    userSelect: 'none',
+    msUserSelect: 'none',
+    MozUserSelect: 'none',
+    WebkitUserSelect: 'none'
+};
+/**
+ * @hidden
+ */
+exports.readDateWithTimezone = function (value, timezone) {
+    if (value) {
+        return kendo_date_math_1.ZonedDate.fromUTCDate(utils_1.toUTCDateTime(value), timezone).toLocalDate();
+    }
+    return value;
+};
+/**
+ * @hidden
+ */
+exports.readDateAsLocal = function (value, timezone) {
+    if (value) {
+        return kendo_date_math_1.toLocalDate(kendo_date_math_1.ZonedDate.fromLocalDate(value, timezone).toUTCDate());
+    }
+    return value;
+};