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

package/dist/es/views/common/VerticalResourceIterator.js

@@ -0,0 +1,266 @@
+// @ts-ignore
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var inject = allVue.inject;
+import { toGroupResources } from './utils';
+import { SchedulerResourceIteratorContext } from '../../context/SchedulerResourceIteratorContext';
+import { getDefaultSlots } from '@progress/kendo-vue-common'; // tslint:enable:max-line-length
+
+var VerticalResourceIteratorVue2 = {
+  name: 'KendoVerticalResourceIterator',
+  props: {
+    group: Object,
+    resources: Array,
+    nested: Boolean,
+    wrapGroup: Boolean,
+    cellContent: Object,
+    emptyCell: Boolean
+  },
+  // @ts-ignore
+  setup: !gh ? undefined : function () {
+    var v3 = !!gh;
+    return {
+      v3: v3
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var defaultSlot = getDefaultSlots(this);
+    var _a = this.$props,
+        nested = _a.nested,
+        wrapGroup = _a.wrapGroup;
+    var cellContent = this.$props.cellContent || DefaultCellContent;
+    var resources = toGroupResources(this.$props.group, this.$props.resources);
+    var depth = 0;
+    var groupIndex = 0;
+
+    var renderResourcesWrapped = function renderResourcesWrapped(args) {
+      return h("div", {
+        "class": "k-scheduler-row"
+      }, [h("div", {
+        "class": "k-scheduler-row"
+      }, [args.resources.map(function (_, index) {
+        return h("div", {
+          key: index,
+          "class": "k-scheduler-cell k-resource-cell k-heading-cell",
+          "data-depth-index": index,
+          attrs: this.v3 ? undefined : {
+            "data-depth-index": index
+          }
+        });
+      }, this)])]);
+    };
+
+    var renderResourcesRecursively = function renderResourcesRecursively(args, headers) {
+      if (headers === void 0) {
+        headers = true;
+      }
+
+      var children = args.children;
+      var hasGroups = args.resources.length > 0;
+
+      if (args.depth === args.resources.length || !hasGroups) {
+        return (// @ts-ignore  function children
+          h(SchedulerResourceIteratorContext, {
+            resource: args.resources[args.depth],
+            attrs: this.v3 ? undefined : {
+              resource: args.resources[args.depth],
+              groupIndex: hasGroups ? args.groupIndex : 0
+            },
+            groupIndex: hasGroups ? args.groupIndex : 0
+          }, this.v3 ? function () {
+            return [children];
+          } : [children])
+        );
+      }
+
+      var dataLength = args.resources[args.depth].data.length;
+      return args.resources[args.depth].data.map(function (dataItem, dataIndex) {
+        return h("div", {
+          key: dataIndex,
+          "class": "k-scheduler-row"
+        }, [headers && h("div", {
+          "class": "k-scheduler-cell k-group-cell k-heading-cell",
+          "data-depth-index": args.depth,
+          attrs: this.v3 ? undefined : {
+            "data-depth-index": args.depth
+          }
+        }, [dataItem.text]), h("div", {
+          "class": "k-scheduler-cell k-group-content k-resource-row",
+          "data-depth-index": args.depth,
+          attrs: this.v3 ? undefined : {
+            "data-depth-index": args.depth,
+            "data-resource-index": dataLength * args.groupIndex + dataIndex
+          },
+          "data-resource-index": dataLength * args.groupIndex + dataIndex
+        }, [renderResourcesRecursively.call(this, {
+          resources: args.resources,
+          children: children,
+          cellContent: args.cellContent,
+          groupIndex: dataLength * args.groupIndex + dataIndex,
+          depth: args.depth + 1
+        }, headers)])]);
+      }, this);
+    };
+
+    var renderResourcesRecursivelyWrapped = function renderResourcesRecursivelyWrapped(args) {
+      var _this = this;
+
+      var children = args.children;
+      var dataLength = args.resources.length ? args.resources[args.depth].data.length : 0;
+
+      if (!args.resources[args.depth]) {
+        return null;
+      }
+
+      return args.resources[args.depth].data.map(function (dataItem, dataIndex) {
+        return h("div", {
+          key: dataIndex,
+          "class": "k-scheduler-row"
+        }, [h("div", {
+          "class": "k-scheduler-cell k-resource-cell k-resource-row k-heading-cell",
+          "data-depth-index": args.depth,
+          attrs: this.v3 ? undefined : {
+            "data-depth-index": args.depth,
+            "data-resource-index": dataLength * args.groupIndex + dataIndex
+          },
+          "data-resource-index": dataLength * args.groupIndex + dataIndex
+        }, [dataItem.text]), args.depth + 1 !== resources.length && h("div", {
+          "class": "k-scheduler-cell k-resource-content"
+        }, [renderResourcesRecursivelyWrapped.call(_this, {
+          resources: resources,
+          children: children,
+          cellContent: args.cellContent,
+          groupIndex: dataLength * args.groupIndex + dataIndex,
+          depth: args.depth + 1
+        })])]);
+      });
+    };
+
+    var renderGroupContentRecursively = function renderGroupContentRecursively(args) {
+      var children = args.children;
+      var hasGroups = args.resources.length > 0;
+
+      if (args.depth === args.resources.length || !hasGroups) {
+        return (// @ts-ignore  function children
+          h(SchedulerResourceIteratorContext, {
+            resource: args.resources[args.depth],
+            attrs: this.v3 ? undefined : {
+              resource: args.resources[args.depth],
+              groupIndex: hasGroups ? args.groupIndex : undefined
+            },
+            groupIndex: hasGroups ? args.groupIndex : undefined
+          }, this.v3 ? function () {
+            return [children];
+          } : [children])
+        );
+      }
+
+      var dataLength = args.resources[args.depth].data.length;
+      return args.resources[args.depth].data.map(function (_dataItem, dataIndex) {
+        return h("div", {
+          key: dataIndex,
+          "class": "k-scheduler-row"
+        }, [h("div", {
+          "class": "k-scheduler-cell k-group-content"
+        }, [renderGroupContentRecursively.call(this, {
+          resources: args.resources,
+          children: children,
+          cellContent: args.cellContent,
+          groupIndex: dataLength * args.groupIndex + dataIndex,
+          depth: args.depth + 1
+        })])]);
+      }, this);
+    };
+
+    var renderResources = function renderResources(args) {
+      var children = args.children;
+      return h("div", {
+        "class": "k-scheduler-row"
+      }, [cellPrefix.call(this, args.resources), this.emptyCell && h("div", {
+        "class": "k-scheduler-cell k-side-cell"
+      }), cellChildren.call(this, children, args.resources, args.groupIndex)]);
+    };
+
+    var cellChildren = function cellChildren(children, currentResources, currentGroupIndex) {
+      var hasGroups = currentResources.length > 0;
+      return h("div", {
+        "class": "k-scheduler-cell k-group-content"
+      }, [// @ts-ignore  function children
+      h(SchedulerResourceIteratorContext, {
+        resource: currentResources[currentGroupIndex],
+        attrs: this.v3 ? undefined : {
+          resource: currentResources[currentGroupIndex],
+          groupIndex: hasGroups ? currentGroupIndex : undefined
+        },
+        groupIndex: hasGroups ? currentGroupIndex : undefined
+      }, this.v3 ? function () {
+        return [children];
+      } : [children])]);
+    };
+
+    var cellPrefix = function cellPrefix(currentResources) {
+      return currentResources.map(function (_, index) {
+        return h("div", {
+          key: index,
+          "class": "k-scheduler-cell k-group-cell k-heading-cell",
+          "data-depth-index": index,
+          attrs: this.v3 ? undefined : {
+            "data-depth-index": index
+          }
+        });
+      }, this);
+    };
+
+    return h("div", {
+      "class": "k-scheduler-group"
+    }, [nested ? wrapGroup ? h("div", {
+      "class": "k-scheduler-row"
+    }, [h("div", {
+      "class": "k-sticky-cell"
+    }, [renderResourcesRecursivelyWrapped.call(this, {
+      resources: resources,
+      children: defaultSlot,
+      cellContent: cellContent,
+      depth: depth,
+      groupIndex: groupIndex
+    })]), h("div", {
+      "class": "k-scheduler-cell k-group-content"
+    }, [renderResourcesRecursively.call(this, {
+      resources: resources,
+      children: defaultSlot,
+      cellContent: cellContent,
+      depth: depth,
+      groupIndex: groupIndex
+    }, false)])]) : renderResourcesRecursively.call(this, {
+      resources: resources,
+      children: defaultSlot,
+      cellContent: cellContent,
+      depth: depth,
+      groupIndex: groupIndex
+    }, true) : wrapGroup ? h("div", {
+      "class": "k-scheduler-row"
+    }, [h("div", {
+      "class": "k-sticky-cell"
+    }, [renderResourcesWrapped.call(this, {
+      resources: resources,
+      children: defaultSlot,
+      cellContent: cellContent,
+      depth: depth,
+      groupIndex: groupIndex
+    })]), h("div", {
+      "class": "k-scheduler-cell k-group-content"
+    }, [defaultSlot])]) : renderResources.call(this, {
+      resources: resources,
+      children: defaultSlot,
+      cellContent: cellContent,
+      depth: depth,
+      groupIndex: groupIndex
+    })]);
+  }
+};
+var DefaultCellContent = null;
+var VerticalResourceIterator = VerticalResourceIteratorVue2;
+export { VerticalResourceIterator, VerticalResourceIteratorVue2 };

package/dist/es/views/common/utils.d.ts

@@ -0,0 +1,34 @@
+import { Rect, SchedulerGroup, OptionalRect, Slot } from '../../models';
+import { SchedulerResource } from '../../models/SchedulerResource';
+/** @hidden */
+export declare const last: (arr: any[]) => any;
+/** @hidden */
+export declare const toFlatGroupResources: (resources: SchedulerResource[], index?: number, depth?: number, parents?: any) => any[];
+/** @hidden */
+export declare const calculateEventRect: (slots: Slot[], vertical: any) => Rect;
+/**
+ * @hidden
+ */
+export declare function toGroupResources(group?: SchedulerGroup, resources?: SchedulerResource[]): any[];
+/**
+ * @hidden
+ * TODO Move to date-math
+ */
+export declare function addUTCDays(date: Date, offset: number): Date;
+/**
+ * @hidden
+ * ResourceIterator:
+ */
+export declare const expandResources: (resources: any[], lastIndex?: number) => any[];
+/**
+ * @hidden
+ */
+export declare const resourcesByIndex: (index: number, taskResources: any[], spans: any[]) => any[];
+/** @hidden */
+export declare const getRect: (el: HTMLElement | null) => Rect;
+/** @hidden */
+export declare const getPadding: (el: HTMLElement, horizontal?: boolean) => number;
+/** @hidden */
+export declare const getBorders: (el: HTMLElement, horizontal?: boolean) => number;
+/** @hidden */
+export declare const setRect: (el: HTMLElement | null, rect: OptionalRect, minHeightInsteadOfHeight?: boolean) => void;

package/dist/es/views/common/utils.js

@@ -0,0 +1,187 @@
+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;
+};
+/** @hidden */
+export var last = function (arr) { return arr[arr.length - 1]; };
+/** @hidden */
+export var toFlatGroupResources = function (resources, index, depth, parents) {
+    if (index === void 0) { index = 0; }
+    if (depth === void 0) { depth = 0; }
+    if (parents === void 0) { parents = []; }
+    if (resources.length <= index) {
+        return [parents];
+    }
+    var result = [];
+    resources[index].data.map(function (item) {
+        result.push.apply(result, toFlatGroupResources(resources, index + 1, depth + 1, __spreadArrays(parents, [__assign(__assign({}, item), { field: resources[index].field, valueField: resources[index].valueField, colorField: resources[index].colorField, multiple: resources[index].multiple })])));
+    });
+    return result;
+};
+/** @hidden */
+export var calculateEventRect = function (slots, vertical) {
+    if (slots.length < 1 || !slots[0].refTo || !slots[0].refTo.current) {
+        return null;
+    }
+    var firstSlotRect = getRect(slots[0].refTo.current.element);
+    var rect = {
+        top: firstSlotRect.top,
+        left: firstSlotRect.left,
+        right: firstSlotRect.right,
+        width: firstSlotRect.width,
+        height: 0
+    };
+    slots.forEach(function (slot) {
+        if (!slot.refTo.current) {
+            return;
+        }
+        var height = getRect(slot.refTo.current.element).height;
+        if (height !== undefined) {
+            if (!vertical && height >= rect.height) {
+                rect.height = height;
+            }
+            else {
+                rect.height += height;
+            }
+        }
+    });
+    return rect;
+};
+/**
+ * @hidden
+ */
+export function toGroupResources(group, resources) {
+    var result = [];
+    if (!resources || !resources.length) {
+        return result;
+    }
+    if (group && group.resources && group.resources.length) {
+        var groups_1 = group.resources;
+        var _loop_1 = function (idx) {
+            var resource = resources.find(function (r) { return r.name === groups_1[idx]; });
+            result.push(resource);
+        };
+        for (var idx = 0; idx < groups_1.length; idx++) {
+            _loop_1(idx);
+        }
+    }
+    return result;
+}
+/**
+ * @hidden
+ * TODO Move to date-math
+ */
+export function addUTCDays(date, offset) {
+    var newDate = new Date(date.getTime());
+    newDate.setUTCDate(newDate.getUTCDate() + offset);
+    return newDate;
+}
+/**
+ * @hidden
+ * ResourceIterator:
+ */
+export var expandResources = function (resources, lastIndex) {
+    if (lastIndex === void 0) { lastIndex = resources.length - 1; }
+    var currentLastIndex = Math.max(0, lastIndex);
+    var data = [];
+    if (!(resources && resources.length)) {
+        resources = [{}];
+    }
+    var lastData = (resources[currentLastIndex].data || []).map(function (d) { return (__assign(__assign({}, d), { text: d[resources[currentLastIndex].textField] })); }) || [];
+    var length = lastData.length;
+    var count = 1;
+    for (var idx = 0; idx <= currentLastIndex; idx++) {
+        count *= (resources[idx].data || []).length || 1;
+    }
+    for (var idx = 0; idx < count; idx++) {
+        if (lastData[idx % length]) {
+            data.push(lastData[idx % length]);
+        }
+    }
+    return data;
+};
+/**
+ * @hidden
+ */
+export var resourcesByIndex = function (index, taskResources, spans) {
+    // TODO: introduce cache mechanism
+    // if (!this.resourcesCache[index]) {
+    var resources = taskResources;
+    var result = [];
+    var currentIndex = index;
+    for (var idx = 0; idx < resources.length; idx++) {
+        var data = resources[idx].data || [];
+        var dataIdx = Math.floor(currentIndex / spans[idx]);
+        result.push(data[dataIdx]);
+        currentIndex -= dataIdx * spans[idx];
+    }
+    return result;
+};
+/** @hidden */
+export var getRect = function (el) {
+    if (!el) {
+        return { top: 0, left: 0, width: 0, height: 0, right: 0 };
+    }
+    var top = el.offsetTop;
+    var left = el.offsetLeft;
+    var right = el.offsetParent
+        ? el.offsetParent.offsetWidth - (el.offsetLeft + el.offsetWidth)
+        : 0;
+    var width = el.offsetWidth;
+    var height = el.offsetHeight;
+    return {
+        top: top,
+        left: left,
+        right: right,
+        width: width,
+        height: height
+    };
+};
+/** @hidden */
+export var getPadding = function (el, horizontal) {
+    if (horizontal === void 0) { horizontal = false; }
+    return parseFloat(window.getComputedStyle(el)[horizontal ? 'paddingLeft' : 'paddingTop'] || '0')
+        + parseFloat(window.getComputedStyle(el)[horizontal ? 'paddingRight' : 'paddingBottom'] || '0');
+};
+/** @hidden */
+export var getBorders = function (el, horizontal) {
+    if (horizontal === void 0) { horizontal = false; }
+    return parseFloat(window.getComputedStyle(el)[horizontal ? 'borderLeftWidth' : 'borderTopWidth'] || '0')
+        + parseFloat(window.getComputedStyle(el)[horizontal ? 'borderRightWidth' : 'borderBottomWidth'] || '0');
+};
+/** @hidden */
+export var setRect = function (el, rect, minHeightInsteadOfHeight) {
+    if (minHeightInsteadOfHeight === void 0) { minHeightInsteadOfHeight = false; }
+    if (!el) {
+        return;
+    }
+    if (rect.top !== undefined) {
+        el.style.top = rect.top + "px";
+    }
+    if (rect.left !== undefined) {
+        el.style.left = rect.left + "px";
+    }
+    if (rect.width !== undefined) {
+        el.style.width = rect.width + "px";
+    }
+    if (rect.height !== undefined && !minHeightInsteadOfHeight) {
+        el.style.height = typeof rect.height === 'number' ? rect.height + "px" : rect.height;
+    }
+    if (minHeightInsteadOfHeight) {
+        el.style.minHeight = rect.height !== undefined && rect.height > 0 ? rect.height + "px" : '';
+    }
+};

package/dist/es/views/day/DayView.d.ts

@@ -0,0 +1,41 @@
+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 { MultiDayViewProps } from '../day/MultiDayView';
+/**
+ * Represents the properties of the [DayView]({% slug api_scheduler_dayviewprops %}) Component.
+ */
+export interface DayViewProps extends MultiDayViewProps {
+}
+/**
+ * @hidden
+ */
+export interface DayViewState {
+}
+/**
+ * @hidden
+ */
+export interface DayViewComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface DayViewMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface DayViewData {
+}
+/**
+ * @hidden
+ */
+export interface DayViewAll extends Vue2type, DayViewMethods, DayViewData, DayViewComputed, DayViewState {
+}
+declare let DayViewVue2: ComponentOptions<DayViewAll, DefaultData<DayViewData>, DefaultMethods<DayViewAll>, DayViewComputed, RecordPropsDefinition<DayViewProps>>;
+declare const DayView: DefineComponent<DayViewProps, any, DayViewData, DayViewComputed, DayViewMethods, {}, {}, {}, string, DayViewProps, DayViewProps, {}>;
+export { DayView, DayViewVue2 };

package/dist/es/views/day/DayView.js

@@ -0,0 +1,149 @@
+// @ts-ignore
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var inject = allVue.inject;
+import { MultiDayView } from '../day/MultiDayView';
+import { dayViewTitle, messages } from '../../messages';
+import { provideLocalizationService } from '@progress/kendo-vue-intl';
+import { Day } from '@progress/kendo-date-math'; // tslint:enable:max-line-length
+
+var DayViewVue2 = {
+  name: 'KendoDayView',
+  props: {
+    name: {
+      type: String,
+      default: 'day'
+    },
+    title: String,
+    dateRange: {
+      type: [Function, Object],
+      default: function _default() {
+        return MultiDayView.props.dateRange.default();
+      }
+    },
+    showWorkHours: {
+      type: Boolean,
+      default: true
+    },
+    step: {
+      type: Number,
+      default: 1
+    },
+    numberOfDays: {
+      type: Number,
+      default: 1
+    },
+    slotDuration: {
+      type: Number,
+      default: 60
+    },
+    slotDivisions: {
+      type: Number,
+      default: 2
+    },
+    selectedDateFormat: {
+      type: String,
+      default: '{0:D}'
+    },
+    selectedShortDateFormat: {
+      type: String,
+      default: '{0:d}'
+    },
+    currentTimeMarker: {
+      type: Boolean,
+      default: true
+    },
+    startTime: {
+      type: String,
+      default: '00:00'
+    },
+    endTime: {
+      type: String,
+      default: '23:59'
+    },
+    workDayStart: {
+      type: String,
+      default: '08:00'
+    },
+    workDayEnd: {
+      type: String,
+      default: '17:00'
+    },
+    workWeekStart: {
+      type: Number,
+      default: Day.Monday
+    },
+    workWeekEnd: {
+      type: Number,
+      default: Day.Friday
+    },
+    defaultShowWorkHours: {
+      type: Boolean,
+      default: true
+    },
+    timeHeaderCell: String
+  },
+  inject: {
+    kendoLocalizationService: {
+      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 localization = provideLocalizationService(this);
+    var title = localization.toLanguageString(dayViewTitle, messages[dayViewTitle]);
+    return h(MultiDayView, {
+      name: this.$props.name,
+      attrs: this.v3 ? undefined : {
+        name: this.$props.name,
+        dateRange: this.$props.dateRange,
+        step: this.$props.step,
+        numberOfDays: this.$props.numberOfDays,
+        slotDuration: this.$props.slotDuration,
+        slotDivisions: this.$props.slotDivisions,
+        selectedDateFormat: this.$props.selectedDateFormat,
+        selectedShortDateFormat: this.$props.selectedShortDateFormat,
+        showWorkHours: this.$props.showWorkHours,
+        title: this.$props.title,
+        currentTimeMarker: this.$props.currentTimeMarker,
+        startTime: this.$props.startTime,
+        endTime: this.$props.endTime,
+        workDayStart: this.$props.workDayStart,
+        workDayEnd: this.$props.workDayEnd,
+        workWeekStart: this.$props.workWeekStart,
+        workWeekEnd: this.$props.workWeekEnd,
+        defaultShowWorkHours: this.$props.defaultShowWorkHours,
+        timeHeaderCell: this.$props.timeHeaderCell
+      },
+      dateRange: this.$props.dateRange,
+      step: this.$props.step,
+      numberOfDays: this.$props.numberOfDays,
+      slotDuration: this.$props.slotDuration,
+      slotDivisions: this.$props.slotDivisions,
+      selectedDateFormat: this.$props.selectedDateFormat,
+      selectedShortDateFormat: this.$props.selectedShortDateFormat,
+      showWorkHours: this.$props.showWorkHours,
+      title: this.$props.title,
+      currentTimeMarker: this.$props.currentTimeMarker,
+      startTime: this.$props.startTime,
+      endTime: this.$props.endTime,
+      workDayStart: this.$props.workDayStart,
+      workDayEnd: this.$props.workDayEnd,
+      workWeekStart: this.$props.workWeekStart,
+      workWeekEnd: this.$props.workWeekEnd,
+      defaultShowWorkHours: this.$props.defaultShowWorkHours,
+      timeHeaderCell: this.$props.timeHeaderCell
+    });
+  }
+};
+var DayView = DayViewVue2;
+export { DayView, DayViewVue2 };