@progress/kendo-vue-scheduler 3.1.3 → 3.1.5-dev.202204110939

package/dist/npm/items/SchedulerItem.js

@@ -231,110 +231,119 @@ var SchedulerItemVue2 = {
     //     onRelease: this.handleResizeRelease
     // });
 
-    return h("div", {
-      id: this.$props.id,
-      attrs: this.v3 ? undefined : {
+    return (//   <Draggable
+      //   onPress={this.handlePress}
+      //   onDrag={this.handleDrag}
+      //   onRelease={this.handleRelease}
+      //   ref={'draggable'}
+      //   >
+      // @ts-ignore  function children
+      h("div", {
         id: this.$props.id,
+        attrs: this.v3 ? undefined : {
+          id: this.$props.id,
+          tabIndex: this.currentTabIndex,
+          // Aria
+          "aria-label": this.eventLabel,
+          "aria-selected": this.$props.selected // Focus
+          ,
+          "data-group-index": this.$props.group.index,
+          "data-range-index": this.$props.range.index
+        },
+        style: this.computedStyle,
         tabIndex: this.currentTabIndex,
-        // Aria
+        "class": this.itemClassName,
         "aria-label": this.eventLabel,
-        "aria-selected": this.$props.selected // Focus
+        "aria-selected": this.$props.selected,
+        onFocus: this.handleFocus,
+        on: this.v3 ? undefined : {
+          "focus": this.handleFocus,
+          "blur": this.handleBlur,
+          "mouseup": this.handleMouseUp,
+          "mousedown": this.handleMouseDown,
+          "click": this.handleClick,
+          "mouseover": this.handleMouseOver,
+          "mouseout": this.handleMouseOut,
+          "mouseenter": this.handleMouseEnter,
+          "mouseleave": this.handleMouseLeave,
+          "dblclick": this.handleDoubleClick,
+          "keydown": this.handleKeyDown,
+          "keypress": this.handleKeyPress,
+          "keyup": this.handleKeyUp
+        },
+        onBlur: this.handleBlur // Mouse
         ,
+        onMouseup: this.handleMouseUp,
+        onMousedown: this.handleMouseDown,
+        onClick: this.handleClick,
+        onMouseover: this.handleMouseOver,
+        onMouseout: this.handleMouseOut,
+        onMouseenter: this.handleMouseEnter,
+        onMouseleave: this.handleMouseLeave,
+        onDblclick: this.handleDoubleClick // Keyboard
+        ,
+        onKeydown: this.handleKeyDown,
+        onKeypress: this.handleKeyPress,
+        onKeyup: this.handleKeyUp,
         "data-group-index": this.$props.group.index,
         "data-range-index": this.$props.range.index
-      },
-      style: this.computedStyle,
-      tabIndex: this.currentTabIndex,
-      "class": this.itemClassName,
-      "aria-label": this.eventLabel,
-      "aria-selected": this.$props.selected,
-      onFocus: this.handleFocus,
-      on: this.v3 ? undefined : {
-        "focus": this.handleFocus,
-        "blur": this.handleBlur,
-        "mouseup": this.handleMouseUp,
-        "mousedown": this.handleMouseDown,
-        "click": this.handleClick,
-        "mouseover": this.handleMouseOver,
-        "mouseout": this.handleMouseOut,
-        "mouseenter": this.handleMouseEnter,
-        "mouseleave": this.handleMouseLeave,
-        "dblclick": this.handleDoubleClick,
-        "keydown": this.handleKeyDown,
-        "keypress": this.handleKeyPress,
-        "keyup": this.handleKeyUp
-      },
-      onBlur: this.handleBlur // Mouse
-      ,
-      onMouseup: this.handleMouseUp,
-      onMousedown: this.handleMouseDown,
-      onClick: this.handleClick,
-      onMouseover: this.handleMouseOver,
-      onMouseout: this.handleMouseOut,
-      onMouseenter: this.handleMouseEnter,
-      onMouseleave: this.handleMouseLeave,
-      onDblclick: this.handleDoubleClick // Keyboard
-      ,
-      onKeydown: this.handleKeyDown,
-      onKeypress: this.handleKeyPress,
-      onKeyup: this.handleKeyUp,
-      "data-group-index": this.$props.group.index,
-      "data-range-index": this.$props.range.index
-    }, [!this.$props.resizeHint && h("span", {
-      "class": "k-event-actions"
-    }, [this.$props.tail && h("span", {
-      "class": "k-icon k-i-arrow-60-left"
-    }), this.$props.isRecurring && !this.$props.isException && h("span", {
-      "class": "k-icon k-i-reload"
-    }), !this.$props.isRecurring && this.$props.isException && h("span", {
-      "class": "k-icon k-i-non-recurrence"
-    })]), defaultSlot, !this.$props.resizeHint && h("span", {
-      "class": "k-event-actions"
-    }, [editable.remove && h("a", {
-      tabIndex: -1,
-      attrs: this.v3 ? undefined : {
+      }, [!this.$props.resizeHint && h("span", {
+        "class": "k-event-actions"
+      }, [this.$props.tail && h("span", {
+        "class": "k-icon k-i-arrow-60-left"
+      }), this.$props.isRecurring && !this.$props.isException && h("span", {
+        "class": "k-icon k-i-reload"
+      }), !this.$props.isRecurring && this.$props.isException && h("span", {
+        "class": "k-icon k-i-non-recurrence"
+      })]), defaultSlot, !this.$props.resizeHint && h("span", {
+        "class": "k-event-actions"
+      }, [editable.remove && h("a", {
         tabIndex: -1,
+        attrs: this.v3 ? undefined : {
+          tabIndex: -1,
+          "aria-hidden": "true",
+          title: deleteMessage,
+          "aria-label": deleteMessage
+        },
         "aria-hidden": "true",
+        "class": "k-link k-event-delete",
         title: deleteMessage,
-        "aria-label": deleteMessage
-      },
-      "aria-hidden": "true",
-      "class": "k-link k-event-delete",
-      title: deleteMessage,
-      "aria-label": deleteMessage,
-      onClick: this.handleRemoveClick,
-      on: this.v3 ? undefined : {
-        "click": this.handleRemoveClick
-      }
-    }, [h("span", {
-      "class": "k-icon k-i-close"
-    })]), this.$props.head && h("span", {
-      "class": "k-icon k-i-arrow-60-right"
-    })]), editable.resize && this.$props.vertical && [h("span", {
-      "class": "k-resize-handle k-resize-n",
-      ref: this.resizeNorth
-    }), h("span", {
-      "class": "k-resize-handle k-resize-s",
-      ref: this.resizeSouth
-    })], editable.resize && !this.$props.vertical && [h("span", {
-      "class": "k-resize-handle k-resize-w",
-      ref: this.resizeWest
-    }), h("span", {
-      "class": "k-resize-handle k-resize-e",
-      ref: this.resizeEast
-    })], this.$props.resizeHint && [h("div", {
-      "class": "k-marquee-color",
-      style: {
-        borderColor: this.color,
-        backgroundColor: this.color
-      }
-    }), h("div", {
-      "class": "k-marquee-text"
-    }, [!this.$props.tail && h("div", {
-      "class": "k-label-top"
-    }, [this.intl.formatDate(this.$props.zonedStart, this.$props.format)]), !this.$props.head && h("div", {
-      "class": "k-label-bottom"
-    }, [this.intl.formatDate(this.$props.zonedEnd, this.$props.format)])])]]);
+        "aria-label": deleteMessage,
+        onClick: this.handleRemoveClick,
+        on: this.v3 ? undefined : {
+          "click": this.handleRemoveClick
+        }
+      }, [h("span", {
+        "class": "k-icon k-i-close"
+      })]), this.$props.head && h("span", {
+        "class": "k-icon k-i-arrow-60-right"
+      })]), editable.resize && this.$props.vertical && [h("span", {
+        "class": "k-resize-handle k-resize-n",
+        ref: this.resizeNorth
+      }), h("span", {
+        "class": "k-resize-handle k-resize-s",
+        ref: this.resizeSouth
+      })], editable.resize && !this.$props.vertical && [h("span", {
+        "class": "k-resize-handle k-resize-w",
+        ref: this.resizeWest
+      }), h("span", {
+        "class": "k-resize-handle k-resize-e",
+        ref: this.resizeEast
+      })], this.$props.resizeHint && [h("div", {
+        "class": "k-marquee-color",
+        style: {
+          borderColor: this.color,
+          backgroundColor: this.color
+        }
+      }), h("div", {
+        "class": "k-marquee-text"
+      }, [!this.$props.tail && h("div", {
+        "class": "k-label-top"
+      }, [this.intl.formatDate(this.$props.zonedStart, this.$props.format)]), !this.$props.head && h("div", {
+        "class": "k-label-bottom"
+      }, [this.intl.formatDate(this.$props.zonedEnd, this.$props.format)])])]]) // </Draggable>
+
+    );
   },
   methods: {
     // Focus Handlers

package/dist/npm/items/SchedulerItemContent.js

@@ -14,7 +14,9 @@ var gh = allVue.h; // tslint:enable:max-line-length
 
 var SchedulerItemContentVue2 = {
   name: 'KendoSchedulerItemContent',
-  props: {},
+  props: {
+    title: String
+  },
   // @ts-ignore
   setup: !gh ? undefined : function () {
     var v3 = !!gh;
@@ -28,7 +30,7 @@ var SchedulerItemContentVue2 = {
     var defaultSlot = kendo_vue_common_1.getDefaultSlots(this);
     return h("div", {
       "class": 'k-event-template'
-    }, [defaultSlot]);
+    }, [this.title, defaultSlot]);
   }
 };
 exports.SchedulerItemContentVue2 = SchedulerItemContentVue2;

package/dist/npm/items/SchedulerViewItem.js

@@ -245,7 +245,44 @@ var SchedulerViewItemVue2 = {
       style: __assign({
         visibility: this.visible ? undefined : 'hidden',
         display: this.display ? undefined : 'none'
-      }, this.$props.style)
+      }, this.$props.style) // Keyboard
+      ,
+      onKeydown: this.handleKeyDown,
+      on: this.v3 ? undefined : {
+        "keydown": this.handleKeyDown,
+        "keyup": this.handleKeyUp,
+        "focus": this.handleFocus,
+        "mouseup": this.handleMouseUp,
+        "mousedown": this.handleMouseDown,
+        "click": this.handleClick,
+        "doubleclick": this.handleDoubleClick,
+        "removeclick": this.handleRemoveClick,
+        "press": this.handlePress,
+        "drag": this.handleDrag,
+        "release": this.handleRelease,
+        "resizepress": this.handleResizePress,
+        "resizeenddrag": this.handleResizeEndDrag,
+        "resizestartdrag": this.handleResizeStartDrag,
+        "resizeselease": this.handleResizeRelease
+      },
+      onKeyup: this.handleKeyUp // Focus
+      ,
+      onFocus: this.handleFocus // Mouse
+      ,
+      onMouseup: this.handleMouseUp,
+      onMousedown: this.handleMouseDown,
+      onClick: this.handleClick,
+      onDoubleclick: this.handleDoubleClick,
+      onRemoveclick: this.handleRemoveClick // Drag
+      ,
+      onPress: this.handlePress,
+      onDrag: this.handleDrag,
+      onRelease: this.handleRelease // Resize
+      ,
+      onResizepress: this.handleResizePress,
+      onResizeenddrag: this.handleResizeEndDrag,
+      onResizestartdrag: this.handleResizeStartDrag,
+      onResizeselease: this.handleResizeRelease
     }, this.v3 ? function () {
       return [!_this2.$props.resizeHint && h("div", {
         title: _this2.itemTitle,
@@ -254,29 +291,45 @@ var SchedulerViewItemVue2 = {
         }
       }, [!_this2.$props.isAllDay && // @ts-ignore  function children
       h(SchedulerItemContent_1.SchedulerItemContent, {
+        title: _this2.itemTitle,
+        attrs: _this2.v3 ? undefined : {
+          title: _this2.itemTitle
+        },
         "class": "k-event-template k-event-time "
       }, _this2.v3 ? function () {
-        return [_this2.itemTitle];
-      } : [_this2.itemTitle]), // @ts-ignore  function children
+        return [defaultSlot];
+      } : [defaultSlot]), // @ts-ignore  function children
       h(SchedulerItemContent_1.SchedulerItemContent, {
+        title: _this2.$props.title,
+        attrs: _this2.v3 ? undefined : {
+          title: _this2.$props.title
+        },
         "class": "k-event-template"
       }, _this2.v3 ? function () {
-        return [_this2.$props.title];
-      } : [_this2.$props.title])])];
+        return [defaultSlot];
+      } : [defaultSlot])])];
     } : [!_this2.$props.resizeHint && h("div", {
       title: _this2.itemTitle,
       attrs: _this2.v3 ? undefined : {
         title: _this2.itemTitle
       }
     }, [!_this2.$props.isAllDay && h(SchedulerItemContent_1.SchedulerItemContent, {
+      title: _this2.itemTitle,
+      attrs: _this2.v3 ? undefined : {
+        title: _this2.itemTitle
+      },
       "class": "k-event-template k-event-time "
     }, _this2.v3 ? function () {
-      return [_this2.itemTitle];
-    } : [_this2.itemTitle]), h(SchedulerItemContent_1.SchedulerItemContent, {
+      return [defaultSlot];
+    } : [defaultSlot]), h(SchedulerItemContent_1.SchedulerItemContent, {
+      title: _this2.$props.title,
+      attrs: _this2.v3 ? undefined : {
+        title: _this2.$props.title
+      },
       "class": "k-event-template"
     }, _this2.v3 ? function () {
-      return [_this2.$props.title];
-    } : [_this2.$props.title])])]);
+      return [defaultSlot];
+    } : [defaultSlot])])]);
     itemRender = kendo_vue_common_1.getTemplate.call(this, {
       h: h,
       template: this.$props.item,
@@ -286,6 +339,73 @@ var SchedulerViewItemVue2 = {
     return itemRender;
   },
   methods: {
+    // Focus Handlers
+    handleFocus: function handleFocus(e) {
+      this.$emit('focus', e);
+    },
+    handleBlur: function handleBlur(e) {
+      this.$emit('blur', e);
+    },
+    // Mouse Handlers
+    handleMouseDown: function handleMouseDown(e) {
+      this.$emit('mousedown', e);
+    },
+    handleClick: function handleClick(e) {
+      this.$emit('click', e);
+    },
+    handleMouseUp: function handleMouseUp(e) {
+      this.$emit('mouseup', e);
+    },
+    handleMouseOver: function handleMouseOver(e) {
+      this.$emit('mouseover', e);
+    },
+    handleMouseOut: function handleMouseOut(e) {
+      this.$emit('mouseout', e);
+    },
+    handleMouseEnter: function handleMouseEnter(e) {
+      this.$emit('mouseenter', e);
+    },
+    handleMouseLeave: function handleMouseLeave(e) {
+      this.$emit('mouseleave', e);
+    },
+    handleDoubleClick: function handleDoubleClick(e) {
+      this.$emit('doubleclick', e);
+    },
+    handleRemoveClick: function handleRemoveClick(e) {
+      this.$emit('removeclick', e);
+    },
+    // Keyboard Handlers
+    handleKeyDown: function handleKeyDown(e) {
+      this.$emit('keydown', e);
+    },
+    handleKeyPress: function handleKeyPress(e) {
+      this.$emit('keypress', e);
+    },
+    handleKeyUp: function handleKeyUp(e) {
+      this.$emit('keyup', e);
+    },
+    // Drag Handlers
+    handlePress: function handlePress(e) {
+      this.$emit('press', e);
+    },
+    handleDrag: function handleDrag(e) {
+      this.$emit('drag', e);
+    },
+    handleRelease: function handleRelease(e) {
+      this.$emit('release', e);
+    },
+    handleResizePress: function handleResizePress(e) {
+      this.$emit('resizepress', e);
+    },
+    handleResizeStartDrag: function handleResizeStartDrag(e) {
+      this.$emit('resizestartdrag', e);
+    },
+    handleResizeEndDrag: function handleResizeEndDrag(e) {
+      this.$emit('resizeenddrag', e);
+    },
+    handleResizeRelease: function handleResizeRelease(e) {
+      this.$emit('resizerelease', e);
+    },
     calculateMostSiblings: function calculateMostSiblings(slots, items) {
       var _this = this;
 
@@ -317,6 +437,12 @@ var SchedulerViewItemVue2 = {
     align: function align() {
       var _this = this;
 
+      var element = this.$el.nodeType === 8 ? this.$el.parentElement : this.$el;
+
+      if (!element) {
+        return;
+      }
+
       var slots = (this.bv.slots || []).filter(function (slot) {
         return slot && _this.inSlot(slot.$props, _this.$props);
       });
@@ -339,12 +465,12 @@ var SchedulerViewItemVue2 = {
       }
 
       var rect = utils_2.getRect(firstSlot.$el);
-      utils_2.setRect(this.$el, rect);
+      utils_2.setRect(element, rect);
     },
     position: function position() {
       var _this = this;
 
-      var element = this.$el;
+      var element = this.$el.nodeType === 8 ? this.$el.parentElement : this.$el;
 
       if (!element) {
         return;

package/dist/npm/items/hooks/use-drag-item.d.ts

@@ -1,4 +1,5 @@
 import { DataItem } from '../../models';
+import { SchedulerEditItemAll } from '../SchedulerEditItem';
 /**
  * Represents the available `action` types for the `SchedulerItemDragItemAction` objects.
  *
@@ -30,9 +31,4 @@ export interface SchedulerItemDragItemAction {
     payload?: DataItem;
 }
 /** @hidden */
-export declare const useDragItem: (_config: {
-    dataItem: DataItem;
-    ignoreIsAllDay?: boolean;
-    isAllDay?: boolean;
-    onDataaction?: any;
-}, _state: [DataItem, DataItem, any]) => any[];
+export declare const useDragItem: (this: SchedulerEditItemAll, action: SchedulerItemDragItemAction) => void;