@progress/kendo-vue-scheduler 9.3.0-develop.5 → 9.3.0-develop.6

package/views/time/MultiDayTimelineView.mjs

@@ -5,32 +5,30 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as T, createVNode as r, isVNode as v } from "vue";
-import { BaseView as b } from "../../components/BaseView.mjs";
-import { Day as D, MS_PER_MINUTE as E, MS_PER_DAY as C, ZonedDate as g, getDate as x, addDays as A } from "@progress/kendo-date-math";
-import { HorizontalResourceIterator as S } from "../common/HorizontalResourceIterator.mjs";
-import { TimelineViewRowContent as O } from "./TimelineViewRowContent.mjs";
-import { TimelineViewAllEventsRowContent as M } from "./TimelineViewAllEventsRowContent.mjs";
-import { VerticalResourceIterator as y } from "../common/VerticalResourceIterator.mjs";
-import { orderSort as j, isInTimeRange as h, mapItemsToSlots as F, mapSlotsToItems as H, toUTCDateTime as w } from "../../utils/main.mjs";
-import { toRanges as N } from "../../services/rangeService.mjs";
-import { toSlots as V } from "../../services/slotsService.mjs";
-import { toOccurrences as W } from "../../services/occurrenceService.mjs";
-import { toItems as _ } from "../../services/itemsService.mjs";
-import { TimelineViewBody as B } from "./TimelineViewBody.mjs";
-import { BORDER_WIDTH as U } from "../../constants/main.mjs";
-import { provideIntlService as f } from "@progress/kendo-vue-intl";
-import { SchedulerEditItem as P } from "../../items/SchedulerEditItem.mjs";
-import { SchedulerResize as I } from "../common/SchedulerResize.mjs";
-import { SchedulerDrag as k } from "../common/SchedulerDrag.mjs";
-import { DateHeaderCell as G } from "../../components/DateHeaderCell.mjs";
-import { TimeHeaderCell as K } from "../../components/TimeHeaderCell.mjs";
-import { useCellSync as z } from "../../hooks/useCellSync.mjs";
-import { useRowSync as R } from "../../hooks/useRowSync.mjs";
-function $(t) {
-  return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !v(t);
+import { defineComponent as k, createVNode as i, isVNode as b } from "vue";
+import { BaseView as T } from "../../components/BaseView.mjs";
+import { Day as f, MS_PER_MINUTE as R, MS_PER_DAY as v, ZonedDate as p, getDate as I, addDays as z } from "@progress/kendo-date-math";
+import { HorizontalResourceIterator as g } from "../common/HorizontalResourceIterator.mjs";
+import { TimelineViewRowContent as $ } from "./TimelineViewRowContent.mjs";
+import { TimelineViewAllEventsRowContent as E } from "./TimelineViewAllEventsRowContent.mjs";
+import { VerticalResourceIterator as S } from "../common/VerticalResourceIterator.mjs";
+import { orderSort as O, isInTimeRange as h, mapItemsToSlots as C, mapSlotsToItems as x, toUTCDateTime as w } from "../../utils/main.mjs";
+import { toRanges as F } from "../../services/rangeService.mjs";
+import { toSlots as M } from "../../services/slotsService.mjs";
+import { toOccurrences as A } from "../../services/occurrenceService.mjs";
+import { toItems as j } from "../../services/itemsService.mjs";
+import { TimelineViewBody as H } from "./TimelineViewBody.mjs";
+import { BORDER_WIDTH as N } from "../../constants/main.mjs";
+import { provideIntlService as m } from "@progress/kendo-vue-intl";
+import { SchedulerEditItem as V } from "../../items/SchedulerEditItem.mjs";
+import { DateHeaderCell as W } from "../../components/DateHeaderCell.mjs";
+import { TimeHeaderCell as _ } from "../../components/TimeHeaderCell.mjs";
+import { useRowSync as B } from "../../hooks/useRowSync.mjs";
+import { useCellSync as y } from "../../hooks/useCellSync.mjs";
+function D(t) {
+  return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !b(t);
 }
-const L = "t", X = 0, Se = /* @__PURE__ */ T({
+const U = "t", q = 0, he = /* @__PURE__ */ k({
   name: "KendoMultiDayTimelineView",
   props: {
     name: {
@@ -62,16 +60,16 @@ const L = "t", X = 0, Se = /* @__PURE__ */ T({
     dateRange: {
       type: [Function, Object],
       default: function() {
-        return Y;
+        return L;
       }
     },
     selectedDateFormat: {
       type: String,
-      default: "{0:D} - {1:D}"
+      default: "{0:M}"
     },
     selectedShortDateFormat: {
       type: String,
-      default: "{0:d} - {1:d}"
+      default: "{0:m}"
     },
     step: {
       type: Number,
@@ -99,11 +97,11 @@ const L = "t", X = 0, Se = /* @__PURE__ */ T({
     },
     workWeekStart: {
       type: Number,
-      default: D.Monday
+      default: f.Monday
     },
     workWeekEnd: {
       type: Number,
-      default: D.Friday
+      default: f.Friday
     },
     slotDivisions: {
       type: Number,
@@ -138,7 +136,9 @@ const L = "t", X = 0, Se = /* @__PURE__ */ T({
     return {
       hasMounted: !1,
       currentDragItem: void 0,
-      currentResizeItem: void 0
+      currentResizeItem: void 0,
+      rowSyncTimeout: void 0,
+      rowSyncObserver: null
     };
   },
   inject: {
@@ -151,44 +151,44 @@ const L = "t", X = 0, Se = /* @__PURE__ */ T({
   },
   computed: {
     viewStart() {
-      this.intl = f(this);
-      const t = this.intl.parseDate(this.$props.workDayStart), i = this.intl.parseDate(this.$props.startTime);
-      return this.showWorkHours ? t : i;
+      this.intl = m(this);
+      const t = this.intl.parseDate(this.$props.workDayStart), r = this.intl.parseDate(this.$props.startTime);
+      return this.showWorkHours ? t : r;
     },
     viewEnd() {
-      this.intl = f(this);
-      const t = this.intl.parseDate(this.$props.workDayEnd), i = this.intl.parseDate(this.$props.endTime);
-      return this.showWorkHours ? t : i;
+      this.intl = m(this);
+      const t = this.intl.parseDate(this.$props.workDayEnd), r = this.intl.parseDate(this.$props.endTime);
+      return this.showWorkHours ? t : r;
     },
     ranges() {
-      return N(this.ks.dateRange, {
-        step: C,
+      return F(this.ks.dateRange, {
+        step: v,
         timezone: this.ks.timezone
       });
     },
     timelineSlots() {
-      return V(this.ks.dateRange, {
-        step: this.slotDuration / this.slotDivisions * E
+      return M(this.ks.dateRange, {
+        step: this.slotDuration / this.slotDivisions * R
       }, {
         groups: this.ks.groups,
         ranges: this.ranges
-      }).filter((i) => h(i.zonedStart, this.viewStart, this.viewEnd) || this.viewStart.getTime() === this.viewEnd.getTime());
+      }).filter((r) => h(r.zonedStart, this.viewStart, this.viewEnd) || this.viewStart.getTime() === this.viewEnd.getTime());
     },
     occurrences() {
-      return W(this.ks.dataItems, {
+      return A(this.ks.dataItems, {
         dateRange: this.ks.dateRange,
         fields: this.ks.fields,
         timezone: this.ks.timezone
       });
     },
     items() {
-      const t = _(this.occurrences, {
+      const t = j(this.occurrences, {
         timezone: this.ks.timezone
       }, {
         groups: this.ks.groups,
         ranges: this.ranges
-      }).filter((i) => this.viewStart.getTime() === this.viewEnd.getTime() || h(i.zonedStart, this.viewStart, this.viewEnd) || h(i.zonedEnd, this.viewStart, this.viewEnd) || h(new Date(i.zonedEnd.getTime() - (i.zonedEnd.getTime() - i.zonedStart.getTime()) / 2), this.viewStart, this.viewEnd));
-      return F(t, this.timelineSlots, !0), H(t, this.timelineSlots, !0), t;
+      }).filter((r) => this.viewStart.getTime() === this.viewEnd.getTime() || h(r.zonedStart, this.viewStart, this.viewEnd) || h(r.zonedEnd, this.viewStart, this.viewEnd) || h(new Date(r.zonedEnd.getTime() - (r.zonedEnd.getTime() - r.zonedStart.getTime()) / 2), this.viewStart, this.viewEnd));
+      return C(t, this.timelineSlots, !0), x(t, this.timelineSlots, !0), t;
     },
     compDragItem() {
       return this.dragItem !== void 0 ? this.dragItem : this.currentDragItem;
@@ -198,136 +198,101 @@ const L = "t", X = 0, Se = /* @__PURE__ */ T({
     }
   },
   mounted() {
-    this.timeRef = null, this.bodyRef = null, this.hasMounted = !0, z({
+    this.timeRef = null, this.bodyRef = null, this.hasMounted = !0, y({
       element: this.$el,
       selector: ".k-resource-cell",
       attribute: "data-depth-index",
       explicitDepth: !0
-    }), R({
-      element: this.$el
-    });
+    }), this.scheduleRowSync(), this.observeSlotChanges();
+  },
+  unmounted() {
+    this.rowSyncTimeout !== void 0 && window.cancelAnimationFrame(this.rowSyncTimeout), this.rowSyncObserver && (this.rowSyncObserver.disconnect(), this.rowSyncObserver = null);
   },
   updated() {
-    z({
+    y({
       element: this.$el,
       selector: ".k-resource-cell",
       attribute: "data-depth-index",
       explicitDepth: !0
-    }), R({
-      element: this.$el
-    });
+    }), this.scheduleRowSync();
   },
   render() {
-    const t = f(this), i = this.$props.slotDuration, l = t.parseDate(this.$props.workDayStart), u = t.parseDate(this.$props.workDayEnd), p = [...this.items], o = [...this.timelineSlots], d = (this.ks.orientation === "horizontal" ? o.length : o.length / this.ks.groups.length) * (this.$props.columnWidth + U), m = function(e) {
-      return this.compDragItem && this.$props.editable.drag && (Array.isArray(this.compDragItem) ? this.compDragItem.map(function(a, s) {
-        return r(k, {
-          key: s,
-          ignoreIsAllDay: !0,
-          dataItem: a,
-          vertical: e,
-          item: this.$props.dataItem
-        }, null);
-      }, this) : r(k, {
-        ignoreIsAllDay: !0,
-        dataItem: this.compDragItem,
-        vertical: e,
-        item: this.$props.dataItem
-      }, null));
-    }, c = function(e) {
-      return this.compResizeItem && this.editable.resize && (Array.isArray(this.compResizeItem) ? this.compResizeItem.map(function(a, s) {
-        return r(I, {
-          key: s,
-          format: this.$props.format,
-          ignoreIsAllDay: !0,
-          dataItem: a,
-          viewItem: this.$props.viewItem,
-          item: this.$props.item,
-          vertical: e
-        }, null);
-      }, this) : r(I, {
-        format: this.$props.format,
-        ignoreIsAllDay: !0,
-        dataItem: this.compResizeItem,
-        viewItem: this.$props.viewItem,
-        item: this.$props.item,
-        vertical: e
-      }, null));
-    }, n = [r("div", {
+    const t = m(this), r = this.$props.slotDuration, a = t.parseDate(this.$props.workDayStart), l = t.parseDate(this.$props.workDayEnd), c = [...this.items], s = [...this.timelineSlots], d = (this.ks.orientation === "horizontal" ? s.length : s.length / this.ks.groups.length) * (this.$props.columnWidth + N), n = [i("div", {
       class: "k-scheduler-row"
-    }, [this.ranges.map(function(e, a) {
-      return r(G, {
+    }, [this.ranges.map(function(e, u) {
+      return i(W, {
         as: this.$props.dateHeaderCell,
-        key: a,
+        key: u,
         date: e.zonedStart,
         start: e.start,
         end: e.end,
         format: "m"
       }, null);
-    }, this)]), r("div", {
+    }, this)]), i("div", {
       class: "k-scheduler-row",
       ref: "timeRef"
-    }, [this.ranges.map(function(e, a) {
-      return o.filter((s) => s.group.index === X && s.range.index === a).map(function(s) {
-        return s.zonedStart.getMinutes() % i === 0 ? r(K, {
-          key: s.index,
+    }, [this.ranges.map(function(e, u) {
+      return s.filter((o) => o.group.index === q && o.range.index === u).map(function(o) {
+        return o.zonedStart.getMinutes() % r === 0 ? i(_, {
+          key: o.index,
           as: this.$props.timeHeaderCell,
-          format: L,
-          date: s.zonedStart,
-          start: s.zonedStart,
-          end: s.zonedEnd
+          format: U,
+          date: o.zonedStart,
+          start: o.zonedStart,
+          end: o.zonedEnd
         }, null) : null;
       }, this);
     }, this)])];
-    return r(b, {
+    return i(T, {
       id: this.$props.id,
-      class: "k-scheduler-timeline-view",
+      class: "k-scheduler-timelineview",
       viewProps: {
         ...this.$props
       },
-      baseSlots: o,
+      baseSlots: s,
       ranges: this.ranges
     }, {
-      default: () => [r("div", {
+      default: () => [i("div", {
         class: "k-scheduler-head",
         style: {
           width: d + "px"
         }
-      }, [this.ks.orientation === "horizontal" ? r(S, {
+      }, [this.ks.orientation === "horizontal" ? i(g, {
         nested: !0,
         group: this.ks.props.group,
         resources: this.ks.props.resources,
-        rowContent: O
-      }, $(n) ? n : {
+        rowContent: $
+      }, D(n) ? n : {
         default: () => [n]
-      }) : r(y, {
+      }) : i(S, {
         wrapGroup: !0,
         group: this.ks.props.group,
         resources: this.ks.props.resources,
         editable: this.$props.editable
-      }, $(n) ? n : {
+      }, D(n) ? n : {
         default: () => [n]
-      })]), r("div", {
+      })]), i("div", {
         class: "k-scheduler-body",
         style: {
           width: d + "px"
         },
         ref: "bodyRef"
-      }, [this.ks.orientation === "horizontal" ? r(S, {
+      }, [this.ks.orientation === "horizontal" ? i(g, {
         group: this.ks.props.group,
         resources: this.ks.props.resources,
-        rowContent: M
+        rowContent: E
       }, {
-        default: () => [r(B, {
+        default: () => [i(H, {
           editable: this.$props.editable,
           slotRender: this.$props.slotRender,
           viewSlot: this.$props.viewSlot,
           ranges: this.ranges,
-          workDayStart: l,
-          workDayEnd: u,
-          timelineSlots: o,
+          workDayStart: a,
+          workDayEnd: l,
+          timelineSlots: s,
           onDataaction: this.handleDataAction
         }, null)]
-      }) : r(y, {
+      }) : i(S, {
         nested: !0,
         wrapGroup: !0,
         group: this.ks.props.group,
@@ -335,16 +300,16 @@ const L = "t", X = 0, Se = /* @__PURE__ */ T({
         onDataaction: this.handleDataAction,
         more: {
           ranges: this.ranges,
-          workDayStart: l,
-          workDayEnd: u,
-          timelineSlots: o,
+          workDayStart: a,
+          workDayEnd: l,
+          timelineSlots: s,
           slotRender: this.$props.slotRender,
           viewSlot: this.$props.viewSlot,
           editable: this.$props.editable,
           currentTimeMarker: this.$props.currentTimeMarker
         }
-      }, null), this.hasMounted && p.sort(j).map(function(e) {
-        return r(P, {
+      }, null), this.hasMounted && c.sort(O).map(function(e) {
+        return i(V, {
           key: e.isRecurring ? `${e.uid}:${e.group.index}:${e.range.index}:${e.originalStart}` : `${e.uid}:${e.group.index}:${e.range.index}`,
           uid: e.uid,
           start: e.start,
@@ -371,6 +336,7 @@ const L = "t", X = 0, Se = /* @__PURE__ */ T({
           range: e.range,
           isException: e.isException,
           isRecurring: e.isRecurring,
+          readonly: e.readonly,
           format: "t",
           form: this.$props.form,
           onDragitemchange: this.handleDragItemChange,
@@ -382,10 +348,37 @@ const L = "t", X = 0, Se = /* @__PURE__ */ T({
           ignoreIsAllDay: !0,
           vertical: !1
         }, null);
-      }, this), this.compDragItem && m.call(this, !1), this.compResizeItem && c.call(this, !1)])]
+      }, this)])]
     });
   },
   methods: {
+    scheduleRowSync() {
+      this.rowSyncTimeout !== void 0 && window.cancelAnimationFrame(this.rowSyncTimeout), this.rowSyncTimeout = window.requestAnimationFrame(() => {
+        this.rowSyncTimeout = window.requestAnimationFrame(() => {
+          this.runRowSync();
+        });
+      });
+    },
+    runRowSync() {
+      const t = this.$el ? this.$el.closest(".k-scheduler-layout") : null;
+      t && B({
+        element: t,
+        selector: ".k-resource-row",
+        horizontalAttribute: "data-depth-index",
+        verticalAttribute: "data-resource-index",
+        applyTo: ".k-resource-cell"
+      });
+    },
+    observeSlotChanges() {
+      const t = this.$el ? this.$el.querySelector(".k-scheduler-body") : null;
+      t && (this.rowSyncObserver = new MutationObserver((r) => {
+        r.some((l) => l.target instanceof HTMLElement && l.target.classList.contains("k-slot-cell")) && this.scheduleRowSync();
+      }), this.rowSyncObserver.observe(t, {
+        attributes: !0,
+        attributeFilter: ["style"],
+        subtree: !0
+      }));
+    },
     handleDataAction(t) {
       this.$emit("dataaction", t);
     },
@@ -396,19 +389,19 @@ const L = "t", X = 0, Se = /* @__PURE__ */ T({
       this.currentResizeItem = t;
     }
   }
-}), Y = ({
+}), L = ({
   date: t,
-  numberOfDays: i = 1,
-  timezone: l
+  numberOfDays: r = 1,
+  timezone: a
 }) => {
-  const u = g.fromLocalDate(t, l), p = x(u), o = A(p, i), d = g.fromUTCDate(w(p), l), m = g.fromUTCDate(w(o), l), c = new Date(d.getTime()), n = new Date(m.getTime());
+  const l = p.fromLocalDate(t, a), c = I(l), s = z(c, r), d = p.fromUTCDate(w(c), a), n = p.fromUTCDate(w(s), a), e = new Date(d.getTime()), u = new Date(n.getTime());
   return {
-    start: c,
-    end: n,
+    start: e,
+    end: u,
     zonedStart: d,
-    zonedEnd: m
+    zonedEnd: n
   };
 };
 export {
-  Se as MultiDayTimelineView
+  he as MultiDayTimelineView
 };

package/views/time/TimelineView.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),t=require("./MultiDayTimelineView.js"),r=require("@progress/kendo-date-math"),o=e.defineComponent({name:"KendoTimelineView",emits:{dataaction:null},props:{name:{type:String,default:"timeline"},title:{type:String,default:"Multi Day Timeline"},currentTimeMarker:{type:Boolean,default:!0},dateRange:{type:[Function,Object],default:function(){return t.MultiDayTimelineView.props.dateRange.default()}},showWorkHours:{type:Boolean,default:!0},selectedDateFormat:{type:String,default:"{0:D}"},selectedShortDateFormat:{type:String,default:"{0:d}"},step:{type:Number,default:1},numberOfDays:{type:Number,default:1},startTime:{type:String,default:"00:00"},endTime:{type:String,default:"00:00"},workDayStart:{type:String,default:"8:00"},workDayEnd:{type:String,default:"17:00"},workWeekStart:{type:Number,default:r.Day.Monday},workWeekEnd:{type:Number,default:r.Day.Friday},slotDivisions:{type:Number,default:2},slotDuration:{type:Number,default:60},defaultShowWorkHours:{type:Boolean,default:!0},columnWidth:{type:Number,default:100},dragItem:{type:Object,default:function(){}},resizeItem:{type:Object,default:function(){}},dateHeaderCell:[String,Function,Object],timeHeaderCell:[String,Function,Object],slotRender:[String,Function,Object],viewSlot:[String,Function,Object],resizeHint:[String,Function,Object],item:[String,Function,Object],viewItem:[String,Function,Object],editable:[Object,Boolean]},render(){return e.createVNode(t.MultiDayTimelineView,{name:this.$props.name,dragItem:this.$props.dragItem,resizeItem:this.$props.resizeItem,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,columnWidth:this.$props.columnWidth,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,timeHeaderCell:this.$props.timeHeaderCell,dateHeaderCell:this.$props.dateHeaderCell,slotRender:this.$props.slotRender,viewSlot:this.$props.viewSlot,resizeHint:this.$props.resizeHint,item:this.$props.item,viewItem:this.$props.viewItem,editable:this.$props.editable,onDataaction:this.handleDataAction},null)},methods:{handleDataAction(i){this.$emit("dataaction",i)}}});exports.TimelineView=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),t=require("./MultiDayTimelineView.js"),r=require("@progress/kendo-date-math"),o=e.defineComponent({name:"KendoTimelineView",emits:{dataaction:null},props:{name:{type:String,default:"timeline"},title:{type:String,default:"Multi Day Timeline"},currentTimeMarker:{type:Boolean,default:!0},dateRange:{type:[Function,Object],default:function(){return t.MultiDayTimelineView.props.dateRange.default()}},showWorkHours:{type:Boolean,default:!0},selectedDateFormat:{type:String,default:"{0:M}"},selectedShortDateFormat:{type:String,default:"{0:m}"},step:{type:Number,default:1},numberOfDays:{type:Number,default:1},startTime:{type:String,default:"00:00"},endTime:{type:String,default:"00:00"},workDayStart:{type:String,default:"8:00"},workDayEnd:{type:String,default:"17:00"},workWeekStart:{type:Number,default:r.Day.Monday},workWeekEnd:{type:Number,default:r.Day.Friday},slotDivisions:{type:Number,default:2},slotDuration:{type:Number,default:60},defaultShowWorkHours:{type:Boolean,default:!0},columnWidth:{type:Number,default:100},dragItem:{type:Object,default:function(){}},resizeItem:{type:Object,default:function(){}},dateHeaderCell:[String,Function,Object],timeHeaderCell:[String,Function,Object],slotRender:[String,Function,Object],viewSlot:[String,Function,Object],resizeHint:[String,Function,Object],item:[String,Function,Object],viewItem:[String,Function,Object],editable:[Object,Boolean]},render(){return e.createVNode(t.MultiDayTimelineView,{name:this.$props.name,dragItem:this.$props.dragItem,resizeItem:this.$props.resizeItem,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,columnWidth:this.$props.columnWidth,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,timeHeaderCell:this.$props.timeHeaderCell,dateHeaderCell:this.$props.dateHeaderCell,slotRender:this.$props.slotRender,viewSlot:this.$props.viewSlot,resizeHint:this.$props.resizeHint,item:this.$props.item,viewItem:this.$props.viewItem,editable:this.$props.editable,onDataaction:this.handleDataAction},null)},methods:{handleDataAction(i){this.$emit("dataaction",i)}}});exports.TimelineView=o;

package/views/time/TimelineView.mjs

@@ -38,11 +38,11 @@ const p = /* @__PURE__ */ i({
     },
     selectedDateFormat: {
       type: String,
-      default: "{0:D}"
+      default: "{0:M}"
     },
     selectedShortDateFormat: {
       type: String,
-      default: "{0:d}"
+      default: "{0:m}"
     },
     step: {
       type: Number,

package/views/week/WeekView.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("vue"),S=require("../day/MultiDayView.js"),i=require("../../constants/main.js"),e=require("@progress/kendo-date-math"),a=require("../../messages/main.js"),u=require("../../utils/main.js"),h=require("@progress/kendo-vue-intl"),k=d.defineComponent({name:"KendoWeekView",emits:{dataaction:null},props:{name:{type:String,default:"week"},slotDuration:{type:Number,default:60},slotDivisions:{type:Number,default:2},numberOfDays:{type:Number,default:i.DAYS_IN_WEEK_COUNT},dateRange:{type:[Function,Object],default:function(){return f}},title:String,selectedDateFormat:{type:String,default:"{0:D} - {1:D}"},selectedShortDateFormat:{type:String,default:"{0:d} - {1:d}"},showWorkHours:{type:Boolean,default:!0},currentTimeMarker:{type:Boolean,default:!0},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:e.Day.Monday},workWeekEnd:{type:Number,default:e.Day.Friday},defaultShowWorkHours:{type:Boolean,default:!0},dateHeaderCell:[String,Function,Object],timeHeaderCell:[String,Function,Object],slotRender:[String,Function,Object],viewSlot:[String,Function,Object],resizeHint:[String,Function,Object],item:[String,Function,Object],viewItem:[String,Function,Object],editable:{type:[Boolean,Object],default:!1},format:String},inject:{kendoLocalizationService:{default:null}},render(){const r=h.provideLocalizationService(this).toLanguageString(a.weekViewTitle,a.messages[a.weekViewTitle]);return d.createVNode(S.MultiDayView,{name:this.$props.name,dateRange:this.$props.dateRange,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:r,step:i.DAYS_IN_WEEK_COUNT,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,dateHeaderCell:this.$props.dateHeaderCell,timeHeaderCell:this.$props.timeHeaderCell,slotRender:this.$props.slotRender,viewSlot:this.$props.viewSlot,resizeHint:this.$props.resizeHint,item:this.$props.item,viewItem:this.$props.viewItem,editable:this.$props.editable,onDataaction:this.handleDataAction},null)},methods:{handleDataAction(t){this.$emit("dataaction",t)}}}),w=t=>e.getDate(t),y=(t,r)=>e.getDate(e.addDays(t,r)),f=({intl:t,date:r,timezone:o})=>{const p=e.ZonedDate.fromLocalDate(r,o),n=w(e.firstDayInWeek(p,t.firstDay())),c=y(n,i.DAYS_IN_WEEK_COUNT),s=e.ZonedDate.fromUTCDate(u.toUTCDateTime(n),o),l=e.ZonedDate.fromUTCDate(u.toUTCDateTime(c),o),D=new Date(s.getTime()),m=new Date(l.getTime());return{start:D,end:m,zonedStart:s,zonedEnd:l}};exports.WeekView=k;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("vue"),S=require("../day/MultiDayView.js"),i=require("../../constants/main.js"),e=require("@progress/kendo-date-math"),a=require("../../messages/main.js"),u=require("../../utils/main.js"),h=require("@progress/kendo-vue-intl"),k=d.defineComponent({name:"KendoWeekView",emits:{dataaction:null},props:{name:{type:String,default:"week"},slotDuration:{type:Number,default:60},slotDivisions:{type:Number,default:2},numberOfDays:{type:Number,default:i.DAYS_IN_WEEK_COUNT},dateRange:{type:[Function,Object],default:function(){return f}},title:String,selectedDateFormat:{type:String,default:"{0:M} - {1:M}"},selectedShortDateFormat:{type:String,default:"{0:m} - {1:m}"},showWorkHours:{type:Boolean,default:!0},currentTimeMarker:{type:Boolean,default:!0},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:e.Day.Monday},workWeekEnd:{type:Number,default:e.Day.Friday},defaultShowWorkHours:{type:Boolean,default:!0},dateHeaderCell:[String,Function,Object],timeHeaderCell:[String,Function,Object],slotRender:[String,Function,Object],viewSlot:[String,Function,Object],resizeHint:[String,Function,Object],item:[String,Function,Object],viewItem:[String,Function,Object],editable:{type:[Boolean,Object],default:!1},format:String},inject:{kendoLocalizationService:{default:null}},render(){const r=h.provideLocalizationService(this).toLanguageString(a.weekViewTitle,a.messages[a.weekViewTitle]);return d.createVNode(S.MultiDayView,{name:this.$props.name,dateRange:this.$props.dateRange,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:r,step:i.DAYS_IN_WEEK_COUNT,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,dateHeaderCell:this.$props.dateHeaderCell,timeHeaderCell:this.$props.timeHeaderCell,slotRender:this.$props.slotRender,viewSlot:this.$props.viewSlot,resizeHint:this.$props.resizeHint,item:this.$props.item,viewItem:this.$props.viewItem,editable:this.$props.editable,onDataaction:this.handleDataAction},null)},methods:{handleDataAction(t){this.$emit("dataaction",t)}}}),w=t=>e.getDate(t),y=(t,r)=>e.getDate(e.addDays(t,r)),f=({intl:t,date:r,timezone:o})=>{const p=e.ZonedDate.fromLocalDate(r,o),n=w(e.firstDayInWeek(p,t.firstDay())),c=y(n,i.DAYS_IN_WEEK_COUNT),s=e.ZonedDate.fromUTCDate(u.toUTCDateTime(n),o),l=e.ZonedDate.fromUTCDate(u.toUTCDateTime(c),o),m=new Date(s.getTime()),D=new Date(l.getTime());return{start:m,end:D,zonedStart:s,zonedEnd:l}};exports.WeekView=k;

package/views/week/WeekView.mjs

@@ -43,11 +43,11 @@ const N = /* @__PURE__ */ h({
     title: String,
     selectedDateFormat: {
       type: String,
-      default: "{0:D} - {1:D}"
+      default: "{0:M} - {1:M}"
     },
     selectedShortDateFormat: {
       type: String,
-      default: "{0:d} - {1:d}"
+      default: "{0:m} - {1:m}"
     },
     showWorkHours: {
       type: Boolean,

package/views/week/WorkWeekView.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("vue"),t=require("@progress/kendo-date-math"),p=require("../../constants/main.js"),g=require("../day/MultiDayView.js"),s=require("../../messages/main.js"),D=require("../../utils/main.js"),f=require("@progress/kendo-vue-intl"),h=u.defineComponent({name:"KendoWorkWeekView",emits:{dataaction:null},props:{name:{type:String,default:"work-week"},slotDuration:{type:Number,default:60},slotDivisions:{type:Number,default:2},numberOfDays:{type:Number,default:7},dateRange:{type:[Function,Object],default:function(){return b}},title:String,workWeekStart:{type:Number,default:t.Day.Monday},workWeekEnd:{type:Number,default:t.Day.Friday},selectedDateFormat:{type:String,default:"{0:D} - {1:D}"},selectedShortDateFormat:{type:String,default:"{0:d} - {1:d}"},showWorkHours:{type:Boolean,default:!0},dateHeaderCell:[String,Function,Object],timeHeaderCell:[String,Function,Object],slotRender:[String,Function,Object],viewSlot:[String,Function,Object],resizeHint:[String,Function,Object],item:[String,Function,Object],viewItem:[String,Function,Object],editable:{type:[Boolean,Object],default:!1}},inject:{kendoLocalizationService:{default:null},ks:{default:null}},render(){const a=f.provideLocalizationService(this).toLanguageString(s.workWeekViewTitle,s.messages[s.workWeekViewTitle]),e=this.ks.dateRange,o=Math.round((e.end.getTime()-e.start.getTime())/t.MS_PER_DAY);return u.createVNode(g.MultiDayView,{name:this.$props.name,dateRange:this.$props.dateRange,numberOfDays:o,slotDuration:this.$props.slotDuration,slotDivisions:this.$props.slotDivisions,selectedDateFormat:this.$props.selectedDateFormat,selectedShortDateFormat:this.$props.selectedShortDateFormat,showWorkHours:this.$props.showWorkHours,title:a,step:p.DAYS_IN_WEEK_COUNT,slotRender:this.$props.slotRender,viewSlot:this.$props.viewSlot,resizeHint:this.$props.resizeHint,item:this.$props.item,viewItem:this.$props.viewItem,editable:this.$props.editable,dateHeaderCell:this.$props.dateHeaderCell,timeHeaderCell:this.$props.timeHeaderCell,onDataaction:this.handleDataAction},null)},methods:{handleDataAction(n){this.$emit("dataaction",n)}}}),W=(n,a=t.Day.Sunday)=>{let e=n.clone();for(;e.getDay()!==a;)e=e.addDays(-1);return e},b=({intl:n,date:a,timezone:e,...o})=>{const m=t.ZonedDate.fromLocalDate(a,e),i=o.workWeekStart!==void 0?o.workWeekStart:t.Day.Monday,r=o.workWeekEnd!==void 0?o.workWeekEnd:t.Day.Friday,k=r<i?p.DAYS_IN_WEEK_COUNT+r-i+1:r-i+1,d=t.getDate(W(m,i)),w=t.addDays(d,k),l=t.ZonedDate.fromUTCDate(D.toUTCDateTime(d),e),c=t.ZonedDate.fromUTCDate(D.toUTCDateTime(w),e),y=new Date(l.getTime()),S=new Date(c.getTime());return{start:y,end:S,zonedStart:l,zonedEnd:c}};exports.WorkWeekView=h;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("vue"),t=require("@progress/kendo-date-math"),D=require("../../constants/main.js"),g=require("../day/MultiDayView.js"),s=require("../../messages/main.js"),p=require("../../utils/main.js"),f=require("@progress/kendo-vue-intl"),h=u.defineComponent({name:"KendoWorkWeekView",emits:{dataaction:null},props:{name:{type:String,default:"work-week"},slotDuration:{type:Number,default:60},slotDivisions:{type:Number,default:2},numberOfDays:{type:Number,default:7},dateRange:{type:[Function,Object],default:function(){return b}},title:String,workWeekStart:{type:Number,default:t.Day.Monday},workWeekEnd:{type:Number,default:t.Day.Friday},selectedDateFormat:{type:String,default:"{0:M} - {1:M}"},selectedShortDateFormat:{type:String,default:"{0:m} - {1:m}"},showWorkHours:{type:Boolean,default:!0},dateHeaderCell:[String,Function,Object],timeHeaderCell:[String,Function,Object],slotRender:[String,Function,Object],viewSlot:[String,Function,Object],resizeHint:[String,Function,Object],item:[String,Function,Object],viewItem:[String,Function,Object],editable:{type:[Boolean,Object],default:!1}},inject:{kendoLocalizationService:{default:null},ks:{default:null}},render(){const a=f.provideLocalizationService(this).toLanguageString(s.workWeekViewTitle,s.messages[s.workWeekViewTitle]),e=this.ks.dateRange,o=Math.round((e.end.getTime()-e.start.getTime())/t.MS_PER_DAY);return u.createVNode(g.MultiDayView,{name:this.$props.name,dateRange:this.$props.dateRange,numberOfDays:o,slotDuration:this.$props.slotDuration,slotDivisions:this.$props.slotDivisions,selectedDateFormat:this.$props.selectedDateFormat,selectedShortDateFormat:this.$props.selectedShortDateFormat,showWorkHours:this.$props.showWorkHours,title:a,step:D.DAYS_IN_WEEK_COUNT,slotRender:this.$props.slotRender,viewSlot:this.$props.viewSlot,resizeHint:this.$props.resizeHint,item:this.$props.item,viewItem:this.$props.viewItem,editable:this.$props.editable,dateHeaderCell:this.$props.dateHeaderCell,timeHeaderCell:this.$props.timeHeaderCell,onDataaction:this.handleDataAction},null)},methods:{handleDataAction(n){this.$emit("dataaction",n)}}}),W=(n,a=t.Day.Sunday)=>{let e=n.clone();for(;e.getDay()!==a;)e=e.addDays(-1);return e},b=({intl:n,date:a,timezone:e,...o})=>{const m=t.ZonedDate.fromLocalDate(a,e),i=o.workWeekStart!==void 0?o.workWeekStart:t.Day.Monday,r=o.workWeekEnd!==void 0?o.workWeekEnd:t.Day.Friday,k=r<i?D.DAYS_IN_WEEK_COUNT+r-i+1:r-i+1,l=t.getDate(W(m,i)),w=t.addDays(l,k),d=t.ZonedDate.fromUTCDate(p.toUTCDateTime(l),e),c=t.ZonedDate.fromUTCDate(p.toUTCDateTime(w),e),y=new Date(d.getTime()),S=new Date(c.getTime());return{start:y,end:S,zonedStart:d,zonedEnd:c}};exports.WorkWeekView=h;

package/views/week/WorkWeekView.mjs

@@ -9,10 +9,10 @@ import { defineComponent as g, createVNode as h } from "vue";
 import { Day as n, MS_PER_DAY as y, ZonedDate as s, getDate as b, addDays as W } from "@progress/kendo-date-math";
 import { DAYS_IN_WEEK_COUNT as u } from "../../constants/main.mjs";
 import { MultiDayView as F } from "../day/MultiDayView.mjs";
-import { workWeekViewTitle as p, messages as $ } from "../../messages/main.mjs";
-import { toUTCDateTime as m } from "../../utils/main.mjs";
+import { workWeekViewTitle as m, messages as $ } from "../../messages/main.mjs";
+import { toUTCDateTime as p } from "../../utils/main.mjs";
 import { provideLocalizationService as O } from "@progress/kendo-vue-intl";
-const V = /* @__PURE__ */ g({
+const M = /* @__PURE__ */ g({
   name: "KendoWorkWeekView",
   emits: {
     dataaction: null
@@ -51,11 +51,11 @@ const V = /* @__PURE__ */ g({
     },
     selectedDateFormat: {
       type: String,
-      default: "{0:D} - {1:D}"
+      default: "{0:M} - {1:M}"
     },
     selectedShortDateFormat: {
       type: String,
-      default: "{0:d} - {1:d}"
+      default: "{0:m} - {1:m}"
     },
     showWorkHours: {
       type: Boolean,
@@ -82,7 +82,7 @@ const V = /* @__PURE__ */ g({
     }
   },
   render() {
-    const a = O(this).toLanguageString(p, $[p]), e = this.ks.dateRange, t = Math.round((e.end.getTime() - e.start.getTime()) / y);
+    const a = O(this).toLanguageString(m, $[m]), e = this.ks.dateRange, t = Math.round((e.end.getTime() - e.start.getTime()) / y);
     return h(F, {
       name: this.$props.name,
       dateRange: this.$props.dateRange,
@@ -121,14 +121,14 @@ const V = /* @__PURE__ */ g({
   timezone: e,
   ...t
 }) => {
-  const D = s.fromLocalDate(a, e), i = t.workWeekStart !== void 0 ? t.workWeekStart : n.Monday, r = t.workWeekEnd !== void 0 ? t.workWeekEnd : n.Friday, f = r < i ? u + r - i + 1 : r - i + 1, d = b(v(D, i)), k = W(d, f), l = s.fromUTCDate(m(d), e), c = s.fromUTCDate(m(k), e), w = new Date(l.getTime()), S = new Date(c.getTime());
+  const D = s.fromLocalDate(a, e), i = t.workWeekStart !== void 0 ? t.workWeekStart : n.Monday, r = t.workWeekEnd !== void 0 ? t.workWeekEnd : n.Friday, f = r < i ? u + r - i + 1 : r - i + 1, l = b(v(D, i)), k = W(l, f), d = s.fromUTCDate(p(l), e), c = s.fromUTCDate(p(k), e), w = new Date(d.getTime()), S = new Date(c.getTime());
   return {
     start: w,
     end: S,
-    zonedStart: l,
+    zonedStart: d,
     zonedEnd: c
   };
 };
 export {
-  V as WorkWeekView
+  M as WorkWeekView
 };

package/components/header/navigation/DatePickerToggleButton.d.ts

@@ -1,16 +0,0 @@
-/**
- * @license
- *-------------------------------------------------------------------------------------------
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
- * Licensed under commercial license. See LICENSE.md in the package root for more information
- *-------------------------------------------------------------------------------------------
- */
-/**
- * @hidden
- */
-declare const DatePickerToggleButton: import('vue').DefineComponent<{}, {}, {}, {}, {
-    handleClick: (e: any) => void;
-}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {} | {
-    [x: string]: any;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-export { DatePickerToggleButton };

package/editors/FilterableComboBox.d.ts

@@ -1,38 +0,0 @@
-/**
- * @license
- *-------------------------------------------------------------------------------------------
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
- * Licensed under commercial license. See LICENSE.md in the package root for more information
- *-------------------------------------------------------------------------------------------
- */
-import { PropType } from 'vue';
-/**
- * @hidden
- */
-declare const FilterableComboBox: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
-    value: PropType<any>;
-    dataItems: PropType<any[]>;
-    validationMessage: PropType<string>;
-    touched: PropType<boolean>;
-    modified: PropType<boolean>;
-    visited: PropType<boolean>;
-    valid: PropType<boolean>;
-    name: PropType<string>;
-}>, {
-    kendoLocalizationService: {};
-}, {
-    filteredData: any[];
-}, {}, {
-    onValueChange(e: any): void;
-    onFilterChange(event: any): void;
-}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
-    value: PropType<any>;
-    dataItems: PropType<any[]>;
-    validationMessage: PropType<string>;
-    touched: PropType<boolean>;
-    modified: PropType<boolean>;
-    visited: PropType<boolean>;
-    valid: PropType<boolean>;
-    name: PropType<string>;
-}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-export { FilterableComboBox };

package/editors/FilterableComboBox.js

@@ -1,8 +0,0 @@
-/**
- * @license
- *-------------------------------------------------------------------------------------------
- * Copyright © 2026 Progress Software Corporation. All rights reserved.
- * Licensed under commercial license. See LICENSE.md in the package root for more information
- *-------------------------------------------------------------------------------------------
- */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),a=require("@progress/kendo-data-query"),i=require("@progress/kendo-vue-dropdowns"),n=t.defineComponent({name:"KendoFilterableComboBox",props:{value:[String,Number,Object],dataItems:Array,validationMessage:String,touched:Boolean,modified:Boolean,visited:Boolean,valid:Boolean,name:String},data(){return{filteredData:this.$props.dataItems}},setup(){return{kendoLocalizationService:t.inject("kendoLocalizationService",{})}},render(){const{data:e,validationMessage:o,visited:r,touched:s,modified:l,...d}=this.$props;return t.createVNode(i.ComboBox,{dataItems:this.filteredData,filterable:!0,onFilterchange:this.onFilterChange,onChange:this.onValueChange},null)},methods:{onValueChange(e){this.$emit("change",e)},onFilterChange(e){const o=a.filterBy(this.$props.dataItems||[],e.filter);this.filteredData=o}}});exports.FilterableComboBox=n;