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

package/dist/npm/additionalTypes.ts

@@ -0,0 +1,9 @@
+// @ts-ignore
+import { DefineComponent } from 'vue';
+// @ts-ignore
+import * as Vue from 'vue';
+// @ts-ignore
+type Vue2type = Vue.default;
+// @ts-ignore
+import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
+export { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type };

package/dist/npm/components/BaseView.d.ts

@@ -0,0 +1,45 @@
+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 { Range, SchedulerViewProps } from '../models';
+/**
+ * @hidden
+ */
+export interface BaseViewProps {
+    props: SchedulerViewProps;
+    baseSlots: any[];
+    ranges: Range[];
+    id?: string;
+}
+/**
+ * @hidden
+ */
+export interface BaseViewState {
+}
+/**
+ * @hidden
+ */
+export interface BaseViewComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface BaseViewMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface BaseViewData {
+}
+/**
+ * @hidden
+ */
+export interface BaseViewAll extends Vue2type, BaseViewMethods, BaseViewData, BaseViewComputed, BaseViewState {
+}
+declare let BaseViewVue2: ComponentOptions<BaseViewAll, DefaultData<BaseViewData>, DefaultMethods<BaseViewAll>, BaseViewComputed, RecordPropsDefinition<BaseViewProps>>;
+declare const BaseView: DefineComponent<{}, any, BaseViewData, BaseViewComputed, BaseViewMethods, {}, {}, {}, string, {}, {}, {}>;
+export { BaseView, BaseViewVue2 };

package/dist/npm/components/BaseView.js

@@ -0,0 +1,159 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BaseViewVue2 = exports.BaseView = void 0; // @ts-ignore
+
+var Vue = require("vue");
+
+var allVue = Vue;
+var gh = allVue.h;
+
+var hooks_1 = require("../hooks"); // import { SchedulerItemHandle, SchedulerSlotHandle } from '../main';
+
+
+var use_items_selection_1 = require("../hooks/use-items-selection");
+
+var use_slots_selection_1 = require("../hooks/use-slots-selection");
+
+var kendo_vue_common_1 = require("@progress/kendo-vue-common");
+
+var utils_1 = require("../utils"); // tslint:enable:max-line-length
+
+
+var BaseViewVue2 = {
+  name: 'KendoBaseView',
+  // @ts-ignore
+  setup: !gh ? undefined : function () {
+    var v3 = !!gh;
+    return {
+      v3: v3
+    };
+  },
+  props: {
+    props: Object,
+    baseSlots: Array,
+    ranges: Array,
+    id: String
+  },
+  provide: function provide() {
+    return {
+      bv: this.bv,
+      setItems: this.dispatchItems,
+      setSlots: this.dispatchSlots,
+      setSelectedSlots: use_slots_selection_1.dispatchSelectedSlots,
+      setSelectedItems: use_items_selection_1.dispatchSelectedItems,
+      setFocusedItems: hooks_1.dispatchFocusedItems,
+      setFocusedSlots: hooks_1.dispatchFocusedSlots //    setActiveViewName: this.handleActiveViewNameChange
+
+    };
+  },
+  //  provide: {
+  // props={props.props}
+  // ranges={props.ranges}
+  // items={[items, dispatchItems]}
+  // slots={[slots, dispatchSlots]}
+  // selectedItems={[selectedItems, handleSchedulerItemsSelectAction]}
+  // selectedSlots={[selectedSlots, handleSchedulerSlotsSelectAction]}
+  // focusedItems={[focusedItems, dispatchFocusedItems]}
+  // focusedSlots={[focusedSlots, dispatchFocusedSlots]}
+  //   },
+  data: function data() {
+    return {
+      bv: {
+        props: this.props,
+        ranges: this.ranges,
+        items: [],
+        slots: [],
+        focusedItems: [],
+        focusedSlots: [],
+        selectedItems: [],
+        selectedSlots: []
+      }
+    };
+  },
+  mounted: function mounted() {
+    this.syncCells();
+  },
+  updated: function updated() {
+    this.syncCells();
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var defaultSlot = kendo_vue_common_1.getDefaultSlots(this);
+    return h("div", {
+      "class": 'k-scheduler-layout k-scheduler-layout-flex',
+      role: "presentation",
+      attrs: this.v3 ? undefined : {
+        role: "presentation"
+      }
+    }, [defaultSlot]);
+  },
+  methods: {
+    syncCells: function syncCells() {
+      hooks_1.useCellSync({
+        element: this.$el,
+        selector: '.k-group-cell',
+        attribute: 'data-depth-index',
+        explicitDepth: true
+      });
+      hooks_1.useCellSync({
+        element: this.$el,
+        selector: '.k-side-cell',
+        attribute: 'data-depth-index',
+        explicitDepth: false
+      });
+    },
+    handleSchedulerItemsSelectAction: function handleSchedulerItemsSelectAction(action, event) {
+      this.dispatchSelectedSlots({
+        type: use_slots_selection_1.SLOTS_SELECT_ACTION.reset
+      });
+      this.dispatchSelectedItems(action, event);
+    },
+    handleSchedulerSlotsSelectAction: function handleSchedulerSlotsSelectAction(action, event) {
+      this.dispatchSelectedItems({
+        type: use_items_selection_1.ITEMS_SELECT_ACTION.reset
+      }, event);
+      this.dispatchSelectedSlots(action);
+    },
+    dispatchSelectedSlots: use_slots_selection_1.dispatchSelectedSlots,
+    dispatchSelectedItems: use_items_selection_1.dispatchSelectedItems,
+    dispatchFocusedItems: hooks_1.dispatchFocusedItems,
+    dispatchFocusedSlots: hooks_1.dispatchFocusedSlots,
+    dispatchItems: function dispatchItems(action) {
+      switch (action.type) {
+        case utils_1.COLLECTION_ACTION.add:
+          this.bv.items.push(action.item);
+          break;
+
+        case utils_1.COLLECTION_ACTION.remove:
+          var index = this.bv.items.indexOf(action.item);
+          this.bv.items.splice(index, 1);
+          break;
+
+        default:
+          break;
+      }
+    },
+    dispatchSlots: function dispatchSlots(action) {
+      switch (action.type) {
+        case utils_1.COLLECTION_ACTION.add:
+          this.bv.slots.push(action.item);
+          break;
+
+        case utils_1.COLLECTION_ACTION.remove:
+          var index = this.bv.slots.indexOf(action.item);
+          this.bv.slots.splice(index, 1);
+          break;
+
+        default:
+          break;
+      }
+    }
+  }
+};
+exports.BaseViewVue2 = BaseViewVue2;
+var BaseView = BaseViewVue2;
+exports.BaseView = BaseView;

package/dist/npm/components/CurrentTimeMarket.d.ts

@@ -0,0 +1,44 @@
+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;
+};
+declare type CurrentTimeMarkerProps = {
+    updateInterval?: number;
+    groupIndex?: number | null;
+    vertical?: boolean;
+    attachArrow?: HTMLElement;
+};
+/**
+ * @hidden
+ */
+export interface CurrentTimeMarkerState {
+    interval: number | undefined;
+    arrowRef: HTMLDivElement | null;
+    line: HTMLDivElement | Element | null;
+}
+/**
+ * @hidden
+ */
+export interface CurrentTimeMarkerComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface CurrentTimeMarkerMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface CurrentTimeMarkerData {
+}
+/**
+ * @hidden
+ */
+export interface CurrentTimeMarkerAll extends Vue2type, CurrentTimeMarkerMethods, CurrentTimeMarkerData, CurrentTimeMarkerComputed, CurrentTimeMarkerState {
+}
+declare let CurrentTimeMarkerVue2: ComponentOptions<CurrentTimeMarkerAll, DefaultData<CurrentTimeMarkerData>, DefaultMethods<CurrentTimeMarkerAll>, CurrentTimeMarkerComputed, RecordPropsDefinition<CurrentTimeMarkerProps>>;
+declare const CurrentTimeMarker: DefineComponent<CurrentTimeMarkerProps, any, CurrentTimeMarkerData, CurrentTimeMarkerComputed, CurrentTimeMarkerMethods, {}, {}, {}, string, CurrentTimeMarkerProps, CurrentTimeMarkerProps, {}>;
+export { CurrentTimeMarker, CurrentTimeMarkerVue2 };

package/dist/npm/components/CurrentTimeMarket.js

@@ -0,0 +1,205 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CurrentTimeMarkerVue2 = exports.CurrentTimeMarker = void 0; // @ts-ignore
+
+var Vue = require("vue");
+
+var allVue = Vue;
+var gh = allVue.h;
+
+var kendo_date_math_1 = require("@progress/kendo-date-math");
+
+var kendo_vue_common_1 = require("@progress/kendo-vue-common"); // import { useSchedulerElementContext, useSchedulerPropsContext, useSchedulerViewSlotsContext } from '../context';
+
+
+var utils_1 = require("../utils");
+
+var utils_2 = require("../views/common/utils");
+
+var combineWidths = function combineWidths(slots) {
+  var result = 0;
+  slots.forEach(function (slot) {
+    if (slot.current) {
+      var rect = utils_2.getRect(slot.current.element);
+      result += rect.width;
+    }
+  });
+  return result;
+};
+
+var combineHeights = function combineHeights(slots) {
+  var result = 0;
+  slots.forEach(function (slot) {
+    if (slot.current) {
+      var rect = utils_2.getRect(slot.current.element);
+      result += rect.height;
+    }
+  });
+  return result;
+};
+
+var setTime = function setTime(origin, candidate) {
+  var date = kendo_date_math_1.cloneDate(origin);
+  date.setHours(candidate.getHours(), candidate.getMinutes(), candidate.getSeconds(), candidate.getMilliseconds());
+  return date;
+}; // tslint:enable:max-line-length
+
+
+var CurrentTimeMarkerVue2 = {
+  name: 'KendoCurrentTimeMarker',
+  props: {
+    updateInterval: {
+      type: Number,
+      default: 60000
+    },
+    groupIndex: Number,
+    vertical: Boolean,
+    attachArrow: Object
+  },
+  inject: {
+    ks: {
+      default: null
+    }
+  },
+  created: function created() {
+    this.interval = undefined;
+    this.arrowRef = null;
+    this.line = null;
+  },
+  data: function data() {
+    return {
+      show: false
+    };
+  },
+  mounted: function mounted() {
+    this.line = this.$el;
+    this.position();
+  },
+  updated: function updated() {
+    var _this = this; // React.useEffect(
+    //     () => {
+
+
+    if (!this.ks.scheduler || !window) {
+      return;
+    }
+
+    clearInterval(this.interval);
+    this.interval = window.setInterval(this.refresh, this.updateInterval);
+    var observer = new window.ResizeObserver(this.refresh);
+    observer.observe(this.ks.scheduler);
+    return function () {
+      clearInterval(_this.interval);
+      observer.disconnect();
+    }; // },
+    // [position, refresh, scheduler, updateInterval]);
+  },
+  // @ts-ignore
+  setup: !gh ? undefined : function () {
+    var v3 = !!gh;
+    return {
+      v3: v3
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var _a;
+
+    var h = gh || createElement;
+    var defaultSlot = kendo_vue_common_1.getDefaultSlots(this);
+    var scheduler = this.ks.scheduler; // useSchedulerElementContext();
+
+    var schedulerProps = this.schedulerProps; // useSchedulerPropsContext();
+    //  const [, setForce] = React.useState(false);
+    //   const dir = useDir(line, schedulerProps.rtl === true ? 'rtl' : undefined);
+    // const slots = this.slots; //useSchedulerViewSlotsContext();
+    // const refresh = React.useCallback(
+    //     () => {
+    //         position();
+    //         setForce(f => !f);
+    //     },
+    //     [position]);
+    // const arrow = (
+    //   <div
+    //     ref={arrowRef}
+    //     class={classNames(
+    //             'k-current-time',
+    //             {
+    //                 'k-current-time-arrow-right': !props.vertical && dir !== 'rtl',
+    //                 'k-current-time-arrow-left': !props.vertical && dir === 'rtl',
+    //                 'k-current-time-arrow-down': props.vertical
+    //             })}
+    //     style={{
+    //             transform: props.vertical
+    //                 ? dir === 'rtl'
+    //                     ? 'translateX(50%)'
+    //                     : 'translateX(-50%)'
+    //                 : 'translateY(-50%)',
+    //             visibility: !show ? 'hidden' : undefined
+    //         }}
+    //     />
+    // );
+
+    return (//   <React.Fragment>
+      //     {(props.attachArrow && props.attachArrow.current) ? 
+      // ReactDOM.createPortal(arrow, props.attachArrow.current) : arrow}
+      h("div", {
+        "class": "k-current-time",
+        style: (_a = {
+          transform: this.$props.vertical ? 'translateX(-50%)' : 'translateY(-50%)'
+        }, _a[this.$props.vertical ? 'width' : 'height'] = '1px', _a.visibility = !this.show ? 'hidden' : undefined, _a)
+      }) //   </React.Fragment>
+
+    );
+  },
+  methods: {
+    position: function position() {
+      var _this = this;
+
+      if (!this.slots) {
+        return;
+      }
+
+      var sameTimeSlots = this.slots.filter(function (s) {
+        return s.current && (_this.$props.groupIndex === undefined || _this.$props.groupIndex === null || s.current.props.group.index === _this.$props.groupIndex) && (_this.$props.vertical ? utils_1.intersects(new Date(), new Date(), s.current.props.start, s.current.props.end, true) : utils_1.isInTimeRange(new Date(), s.current.props.start, s.current.props.end)) && !s.current.props.isAllDay;
+      });
+
+      if (sameTimeSlots && sameTimeSlots.length && this.arrowRef && this.line) {
+        var firstSlot = utils_1.first(sameTimeSlots);
+
+        if (!firstSlot) {
+          return;
+        }
+
+        var size = this.$props.vertical ? combineHeights(sameTimeSlots) : combineWidths(sameTimeSlots);
+        var rect = utils_2.getRect(firstSlot.element);
+        var arrowRect = utils_2.getRect(this.arrowRef);
+        var pxPerMillisecond = (this.$props.vertical ? rect.width : rect.height) / (firstSlot.props.end.getTime() - firstSlot.props.start.getTime());
+        var offset = (Date.now() - setTime(new Date(), firstSlot.props.start).getTime()) * pxPerMillisecond;
+        var rtl = this.$props.dir === 'rtl';
+        var top_1 = this.$props.vertical ? rect.top : rect.top + offset - arrowRect.height / 2;
+        var horizontalDimension = rtl ? 'right' : 'left';
+        var horizontalMeasure = this.$props.vertical ? rect[horizontalDimension] + offset - arrowRect.width / 2 : rect[horizontalDimension];
+
+        if (this.$props.vertical) {
+          this.arrowRef.style[horizontalDimension] = horizontalMeasure + "px";
+        } else {
+          this.arrowRef.style.top = top_1 + "px";
+        }
+
+        this.line.style[horizontalDimension] = horizontalMeasure + "px";
+        this.line.style.top = top_1 + "px";
+        this.line.style[this.$props.vertical ? 'height' : 'width'] = size - 1 + "px";
+        this.show = true;
+      } else {
+        this.show = false;
+      }
+    }
+  }
+};
+exports.CurrentTimeMarkerVue2 = CurrentTimeMarkerVue2;
+var CurrentTimeMarker = CurrentTimeMarkerVue2;
+exports.CurrentTimeMarker = CurrentTimeMarker;

package/dist/npm/components/DateHeaderCell.d.ts

@@ -0,0 +1,72 @@
+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 { DateFormatOptions } from '@progress/kendo-vue-intl';
+/**
+ * Represents the properties of [DateHeaderCell]({% slug api_scheduler_dateheadercell %}) component.
+ */
+export interface DateHeaderCellProps {
+    /** @hidden */
+    as?: any;
+    /**
+     * Represents the date format.
+     */
+    format?: string | DateFormatOptions;
+    /**
+     * Represents the current date.
+     */
+    date: Date;
+    /**
+     * Represents the start date.
+     */
+    start: Date;
+    /**
+     * Represents the end date.
+     */
+    end: Date;
+}
+/**
+ * Represents the target(element and props).
+ */
+export interface DateHeaderCellHandle {
+    /**
+     * The current element or `null` if there is no one.
+     */
+    element: HTMLElement | null;
+    /**
+     * The props values of the DateHeaderCell.
+     */
+    props: DateHeaderCellProps;
+}
+/**
+ * @hidden
+ */
+export interface DateHeaderCellState {
+}
+/**
+ * @hidden
+ */
+export interface DateHeaderCellComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface DateHeaderCellMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface DateHeaderCellData {
+}
+/**
+ * @hidden
+ */
+export interface DateHeaderCellAll extends Vue2type, DateHeaderCellMethods, DateHeaderCellData, DateHeaderCellComputed, DateHeaderCellState {
+}
+declare let DateHeaderCellVue2: ComponentOptions<DateHeaderCellAll, DefaultData<DateHeaderCellData>, DefaultMethods<DateHeaderCellAll>, DateHeaderCellComputed, RecordPropsDefinition<DateHeaderCellProps>>;
+declare const DateHeaderCell: DefineComponent<DateHeaderCellProps, any, DateHeaderCellData, DateHeaderCellComputed, DateHeaderCellMethods, {}, {}, {}, string, DateHeaderCellProps, DateHeaderCellProps, {}>;
+export { DateHeaderCell, DateHeaderCellVue2 };

package/dist/npm/components/DateHeaderCell.js

@@ -0,0 +1,56 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DateHeaderCellVue2 = exports.DateHeaderCell = void 0; // @ts-ignore
+
+var Vue = require("vue");
+
+var allVue = Vue;
+var gh = allVue.h;
+var inject = allVue.inject;
+
+var kendo_vue_intl_1 = require("@progress/kendo-vue-intl"); // tslint:enable:max-line-length
+
+
+var DateHeaderCellVue2 = {
+  name: 'KendoDateHeaderCell',
+  props: {
+    as: [String, Function, Object],
+    format: {
+      type: [String, Object],
+      default: 'd'
+    },
+    date: [Date, Object],
+    start: Date,
+    end: Date
+  },
+  inject: {
+    kendoIntlService: {
+      default: null
+    }
+  },
+  // @ts-ignore
+  setup: !gh ? undefined : function () {
+    var v3 = !!gh;
+    var kendoIntlService = inject('kendoIntlService', {});
+    return {
+      v3: v3,
+      kendoIntlService: kendoIntlService
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var intl = kendo_vue_intl_1.provideIntlService(this);
+    return h("div", {
+      "class": 'k-scheduler-cell k-heading-cell'
+    }, [h("span", {
+      "class": "k-link k-nav-day"
+    }, [intl.formatDate(this.$props.date, this.$props.format)])]);
+  }
+};
+exports.DateHeaderCellVue2 = DateHeaderCellVue2;
+var DateHeaderCell = DateHeaderCellVue2;
+exports.DateHeaderCell = DateHeaderCell;

package/dist/npm/components/SchedulerForm.d.ts

@@ -0,0 +1,86 @@
+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 { FormProps } from '@progress/kendo-vue-form';
+import { DataItem } from '../models';
+export interface SchedulerFormStateChangeEvent<T> {
+    target: SchedulerFormHandle;
+    value: T;
+    event: any;
+}
+/**
+ * Represents the props of the Kendo UI for Vue [SchedulerForm]({% slug api_scheduler_schedulerform %}) component.
+ */
+export interface SchedulerFormProps extends FormProps {
+    /**
+     * Specifies the `dataItem` to be visualized inside the form.
+     */
+    dataItem: DataItem;
+    /**
+     * Specifies the custom form.
+     */
+    renderForm: any;
+    /**
+     * Called when the `cancel` button is clicked.
+     */
+    onCancel?: (event: SchedulerFormStateChangeEvent<null>) => void;
+    /**
+     * Called when the `close` button is clicked.
+     */
+    onClose?: (event: SchedulerFormStateChangeEvent<null>) => void;
+    /**
+     * Overrides the component used for visualizing the `editor`.
+     * The [SchedulerFormEditor]({% slug api_scheduler_schedulerFormEditor %}) component is used, by default.
+     *
+     * For more information, please refer to the [`Scheduler Form Customization`]({% slug overview_customization_form_scheduler %}) article.
+     */
+    editor?: any;
+    /**
+     * Overrides the component used for visualizing the `dialog`.
+     * The [Kendo UI for Vue Dialog]({% slug api_dialogs_dialog %}) component is used, by default.
+     *
+     * For more information, please refer to the [`Scheduler Form Customization`]({% slug overview_customization_form_scheduler %}) article.
+     */
+    dialog?: any;
+}
+/**
+ * Represent the `ref` of the SchedulerForm component.
+ */
+export interface SchedulerFormHandle {
+    /**
+     * Represents the properties passed to the current instance of the `SchedulerForm`.
+     */
+    props: SchedulerFormProps;
+}
+/**
+ * @hidden
+ */
+export interface SchedulerFormState {
+}
+/**
+ * @hidden
+ */
+export interface SchedulerFormComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface SchedulerFormMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface SchedulerFormData {
+}
+/**
+ * @hidden
+ */
+export interface SchedulerFormAll extends Vue2type, SchedulerFormMethods, SchedulerFormData, SchedulerFormComputed, SchedulerFormState {
+}
+declare let SchedulerFormVue2: ComponentOptions<SchedulerFormAll, DefaultData<SchedulerFormData>, DefaultMethods<SchedulerFormAll>, SchedulerFormComputed, RecordPropsDefinition<SchedulerFormProps>>;
+declare const SchedulerForm: DefineComponent<SchedulerFormProps, any, SchedulerFormData, SchedulerFormComputed, SchedulerFormMethods, {}, {}, {}, string, SchedulerFormProps, SchedulerFormProps, {}>;
+export { SchedulerForm, SchedulerFormVue2 };