@progress/kendo-angular-utils 15.0.1 → 15.0.2-develop.10

package/drag-and-drop/drag-state.service.d.ts

@@ -48,6 +48,8 @@ export declare class DragStateService implements OnDestroy {
     setInitialClientOffset(initialClientOffset: Coordinates): void;
     setScrollOffset(scrollOffset: Coordinates): void;
     setInitialScrollOffset(initialScrollOffset: Coordinates): void;
+    get dragTargetPresent(): boolean;
+    get dropTargetPresent(): boolean;
     private updateState;
     private setCallbacks;
     ngOnDestroy(): void;

package/drag-and-drop/droptarget-container.directive.d.ts

@@ -56,7 +56,6 @@ export declare class DropTargetContainerDirective implements AfterViewInit {
      */
     notify(): void;
     constructor(service: DragStateService, element: ElementRef, ngZone: NgZone, cdr: ChangeDetectorRef);
-    private currentDropTarget;
     private currentDropTargetElement;
     private previousDropTargets;
     private _dropTargetFilter;

package/esm2020/drag-and-drop/drag-state.service.mjs

@@ -4,6 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import { Injectable } from '@angular/core';
 import { dispatchDragAndDrop, getScrollableParent, autoScroll } from '@progress/kendo-draggable-common';
+import { isPresent } from './util';
 import * as i0 from "@angular/core";
 /**
  * @hidden
@@ -77,6 +78,12 @@ export class DragStateService {
     setInitialScrollOffset(initialScrollOffset) {
         this.initialScrollOffset = initialScrollOffset;
     }
+    get dragTargetPresent() {
+        return isPresent(this.dragTarget?.element);
+    }
+    get dropTargetPresent() {
+        return isPresent(this.dropTarget?.element);
+    }
     updateState() {
         this.state = {
             drag: this.dragTarget,

package/esm2020/drag-and-drop/droptarget-container.directive.mjs

@@ -3,7 +3,6 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { ChangeDetectorRef, Directive, ElementRef, EventEmitter, Input, NgZone, Output } from '@angular/core';
-import { contains } from '@progress/kendo-angular-common';
 import { validatePackage } from '@progress/kendo-licensing';
 import { packageMetadata } from '../package-metadata';
 import { DragStateService } from './drag-state.service';
@@ -44,7 +43,6 @@ export class DropTargetContainerDirective {
          * Fires when a DragTarget element is dropped over the DropTarget.
          */
         this.onDrop = new EventEmitter();
-        this.currentDropTarget = null;
         this.currentDropTargetElement = null;
         this.previousDropTargets = [];
         this._dropTargetFilter = null;
@@ -102,13 +100,17 @@ export class DropTargetContainerDirective {
      * @hidden
      */
     handleDragEnter(event) {
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || this.service.dropTargetPresent) {
             return;
         }
         const eventTarget = event.originalEvent.target;
-        this.currentDropTargetElement = intersect(eventTarget, this.allDropTargets);
-        this.currentDropTarget = this.service.dropTargets.find(dt => dt.element === this.currentDropTargetElement);
-        this.service.dropTarget = this.currentDropTarget;
+        const currDropTargetElem = intersect(eventTarget, this.allDropTargets);
+        const currDropTarget = this.service.dropTargets.find(dt => dt.element === currDropTargetElem);
+        if (!isPresent(currDropTargetElem) || !isPresent(currDropTarget)) {
+            return;
+        }
+        this.currentDropTargetElement = currDropTargetElem;
+        this.service.dropTarget = currDropTarget;
         this.service.dropIndex = this.getDropIndex();
         this.emitZoneAwareEvent('onDragEnter', event);
     }
@@ -116,21 +118,19 @@ export class DropTargetContainerDirective {
      * @hidden
      */
     handleDragLeave(event) {
-        const containsEventTarget = isPresent(this.service.dropTarget) && contains(this.service.dropTarget?.element, event.originalEvent.target, false);
-        if (containsEventTarget) {
-            return;
-        }
-        this.service.dropTarget = null;
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || !this.service.dropTargetPresent) {
             return;
         }
         this.emitZoneAwareEvent('onDragLeave', event);
+        this.currentDropTargetElement = null;
+        this.service.dropTarget = null;
+        this.service.dropIndex = null;
     }
     /**
      * @hidden
      */
     handleDragOver(event) {
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || !this.service.dropTargetPresent) {
             return;
         }
         this.emitZoneAwareEvent('onDragOver', event);
@@ -139,12 +139,12 @@ export class DropTargetContainerDirective {
      * @hidden
      */
     handleDrop(event) {
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || !this.service.dropTargetPresent) {
             return;
         }
         this.emitZoneAwareEvent('onDrop', event);
-        this.currentDropTarget = null;
         this.currentDropTargetElement = null;
+        this.service.dropTarget = null;
         this.service.dropIndex = null;
     }
     initializeDropTargets() {
@@ -194,8 +194,7 @@ export class DropTargetContainerDirective {
         });
     }
     getDropIndex() {
-        const allTargets = this.nativeElement.querySelectorAll(this.dropTargetFilter);
-        return Array.from(allTargets).indexOf(this.currentDropTargetElement);
+        return this.allDropTargets.indexOf(this.currentDropTargetElement);
     }
     clearPreviousTargets() {
         this.previousDropTargets.forEach(dropTarget => {

package/esm2020/package-metadata.mjs

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-utils',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1706873907,
-    version: '15.0.1',
+    publishDate: 1708097498,
+    version: '15.0.2-develop.10',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/fesm2015/progress-kendo-angular-utils.mjs

@@ -19,8 +19,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-utils',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1706873907,
-    version: '15.0.1',
+    publishDate: 1708097498,
+    version: '15.0.2-develop.10',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -394,6 +394,14 @@ class DragStateService {
     setInitialScrollOffset(initialScrollOffset) {
         this.initialScrollOffset = initialScrollOffset;
     }
+    get dragTargetPresent() {
+        var _a;
+        return isPresent((_a = this.dragTarget) === null || _a === void 0 ? void 0 : _a.element);
+    }
+    get dropTargetPresent() {
+        var _a;
+        return isPresent((_a = this.dropTarget) === null || _a === void 0 ? void 0 : _a.element);
+    }
     updateState() {
         this.state = {
             drag: this.dragTarget,
@@ -1716,7 +1724,6 @@ class DropTargetContainerDirective {
          * Fires when a DragTarget element is dropped over the DropTarget.
          */
         this.onDrop = new EventEmitter();
-        this.currentDropTarget = null;
         this.currentDropTargetElement = null;
         this.previousDropTargets = [];
         this._dropTargetFilter = null;
@@ -1774,13 +1781,17 @@ class DropTargetContainerDirective {
      * @hidden
      */
     handleDragEnter(event) {
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || this.service.dropTargetPresent) {
             return;
         }
         const eventTarget = event.originalEvent.target;
-        this.currentDropTargetElement = intersect(eventTarget, this.allDropTargets);
-        this.currentDropTarget = this.service.dropTargets.find(dt => dt.element === this.currentDropTargetElement);
-        this.service.dropTarget = this.currentDropTarget;
+        const currDropTargetElem = intersect(eventTarget, this.allDropTargets);
+        const currDropTarget = this.service.dropTargets.find(dt => dt.element === currDropTargetElem);
+        if (!isPresent(currDropTargetElem) || !isPresent(currDropTarget)) {
+            return;
+        }
+        this.currentDropTargetElement = currDropTargetElem;
+        this.service.dropTarget = currDropTarget;
         this.service.dropIndex = this.getDropIndex();
         this.emitZoneAwareEvent('onDragEnter', event);
     }
@@ -1788,22 +1799,19 @@ class DropTargetContainerDirective {
      * @hidden
      */
     handleDragLeave(event) {
-        var _a;
-        const containsEventTarget = isPresent(this.service.dropTarget) && contains((_a = this.service.dropTarget) === null || _a === void 0 ? void 0 : _a.element, event.originalEvent.target, false);
-        if (containsEventTarget) {
-            return;
-        }
-        this.service.dropTarget = null;
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || !this.service.dropTargetPresent) {
             return;
         }
         this.emitZoneAwareEvent('onDragLeave', event);
+        this.currentDropTargetElement = null;
+        this.service.dropTarget = null;
+        this.service.dropIndex = null;
     }
     /**
      * @hidden
      */
     handleDragOver(event) {
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || !this.service.dropTargetPresent) {
             return;
         }
         this.emitZoneAwareEvent('onDragOver', event);
@@ -1812,12 +1820,12 @@ class DropTargetContainerDirective {
      * @hidden
      */
     handleDrop(event) {
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || !this.service.dropTargetPresent) {
             return;
         }
         this.emitZoneAwareEvent('onDrop', event);
-        this.currentDropTarget = null;
         this.currentDropTargetElement = null;
+        this.service.dropTarget = null;
         this.service.dropIndex = null;
     }
     initializeDropTargets() {
@@ -1868,8 +1876,7 @@ class DropTargetContainerDirective {
         });
     }
     getDropIndex() {
-        const allTargets = this.nativeElement.querySelectorAll(this.dropTargetFilter);
-        return Array.from(allTargets).indexOf(this.currentDropTargetElement);
+        return this.allDropTargets.indexOf(this.currentDropTargetElement);
     }
     clearPreviousTargets() {
         this.previousDropTargets.forEach(dropTarget => {

package/fesm2020/progress-kendo-angular-utils.mjs

@@ -19,8 +19,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-utils',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1706873907,
-    version: '15.0.1',
+    publishDate: 1708097498,
+    version: '15.0.2-develop.10',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -47,6 +47,101 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 args: ['style.cursor']
             }] } });
 
+function isDocumentNode(container) {
+    return container.nodeType === 9;
+}
+/**
+ * @hidden
+ */
+const getAction = (event, draggable) => {
+    return {
+        event: event,
+        payload: draggable
+    };
+};
+/**
+ * @hidden
+ */
+const dragTargetTransition = 'transform .3s ease-in-out';
+/**
+ * @hidden
+ */
+const isPresent = (value) => value !== null && value !== undefined;
+/**
+ * @hidden
+ */
+function closestBySelector(element, selector) {
+    if (element.closest) {
+        return element.closest(selector);
+    }
+    const matches = Element.prototype.matches ?
+        (el, sel) => el.matches(sel)
+        : (el, sel) => el.msMatchesSelector(sel);
+    let node = element;
+    while (node && !isDocumentNode(node)) {
+        if (matches(node, selector)) {
+            return node;
+        }
+        node = node.parentNode;
+    }
+}
+/**
+ * @hidden
+ */
+const intersect = (element, candidates) => {
+    let max = 0;
+    let result = null;
+    candidates.forEach((candidate) => {
+        if (candidate && element) {
+            const ration = getRatio(element, candidate);
+            if (ration > max) {
+                max = ration;
+                result = candidate;
+            }
+        }
+    });
+    return result;
+};
+const getRatio = (element, target) => {
+    const elementRect = element.getBoundingClientRect();
+    const targetRect = target.getBoundingClientRect();
+    const top = Math.max(targetRect.top, elementRect.top);
+    const left = Math.max(targetRect.left, elementRect.left);
+    const right = Math.min(targetRect.left + targetRect.width, elementRect.left + elementRect.width);
+    const bottom = Math.min(targetRect.top + targetRect.height, elementRect.top + elementRect.height);
+    const width = right - left;
+    const height = bottom - top;
+    if (left < right && top < bottom) {
+        const targetArea = targetRect.width * targetRect.height;
+        const entryArea = elementRect.width * elementRect.height;
+        const intersectionArea = width * height;
+        const intersectionRatio = intersectionArea / (targetArea + entryArea - intersectionArea);
+        return Number(intersectionRatio.toFixed(4));
+    }
+    return 0;
+};
+/**
+ * @hidden
+ */
+const setElementStyles = (renderer, elem, styles) => {
+    const props = Object.keys(styles);
+    props.forEach(p => {
+        renderer.setStyle(elem, p, styles[p]);
+    });
+};
+/**
+ * @hidden
+ */
+const allPointerDownEvents = ['pointerdown', 'mousedown', 'touchstart'];
+/**
+ * @hidden
+ */
+const allPointerMoveEvents = ['pointermove', 'mousemove', 'touchmove'];
+/**
+ * @hidden
+ */
+const allPointerUpEvents = ['pointerup', 'pointercancel', 'mouseup', 'contextmenu', 'touchend', 'touchcancel'];
+
 /**
  * @hidden
  */
@@ -119,6 +214,12 @@ class DragStateService {
     setInitialScrollOffset(initialScrollOffset) {
         this.initialScrollOffset = initialScrollOffset;
     }
+    get dragTargetPresent() {
+        return isPresent(this.dragTarget?.element);
+    }
+    get dropTargetPresent() {
+        return isPresent(this.dropTarget?.element);
+    }
     updateState() {
         this.state = {
             drag: this.dragTarget,
@@ -169,101 +270,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 }]
         }], ctorParameters: function () { return []; } });
 
-function isDocumentNode(container) {
-    return container.nodeType === 9;
-}
-/**
- * @hidden
- */
-const getAction = (event, draggable) => {
-    return {
-        event: event,
-        payload: draggable
-    };
-};
-/**
- * @hidden
- */
-const dragTargetTransition = 'transform .3s ease-in-out';
-/**
- * @hidden
- */
-const isPresent = (value) => value !== null && value !== undefined;
-/**
- * @hidden
- */
-function closestBySelector(element, selector) {
-    if (element.closest) {
-        return element.closest(selector);
-    }
-    const matches = Element.prototype.matches ?
-        (el, sel) => el.matches(sel)
-        : (el, sel) => el.msMatchesSelector(sel);
-    let node = element;
-    while (node && !isDocumentNode(node)) {
-        if (matches(node, selector)) {
-            return node;
-        }
-        node = node.parentNode;
-    }
-}
-/**
- * @hidden
- */
-const intersect = (element, candidates) => {
-    let max = 0;
-    let result = null;
-    candidates.forEach((candidate) => {
-        if (candidate && element) {
-            const ration = getRatio(element, candidate);
-            if (ration > max) {
-                max = ration;
-                result = candidate;
-            }
-        }
-    });
-    return result;
-};
-const getRatio = (element, target) => {
-    const elementRect = element.getBoundingClientRect();
-    const targetRect = target.getBoundingClientRect();
-    const top = Math.max(targetRect.top, elementRect.top);
-    const left = Math.max(targetRect.left, elementRect.left);
-    const right = Math.min(targetRect.left + targetRect.width, elementRect.left + elementRect.width);
-    const bottom = Math.min(targetRect.top + targetRect.height, elementRect.top + elementRect.height);
-    const width = right - left;
-    const height = bottom - top;
-    if (left < right && top < bottom) {
-        const targetArea = targetRect.width * targetRect.height;
-        const entryArea = elementRect.width * elementRect.height;
-        const intersectionArea = width * height;
-        const intersectionRatio = intersectionArea / (targetArea + entryArea - intersectionArea);
-        return Number(intersectionRatio.toFixed(4));
-    }
-    return 0;
-};
-/**
- * @hidden
- */
-const setElementStyles = (renderer, elem, styles) => {
-    const props = Object.keys(styles);
-    props.forEach(p => {
-        renderer.setStyle(elem, p, styles[p]);
-    });
-};
-/**
- * @hidden
- */
-const allPointerDownEvents = ['pointerdown', 'mousedown', 'touchstart'];
-/**
- * @hidden
- */
-const allPointerMoveEvents = ['pointermove', 'mousemove', 'touchmove'];
-/**
- * @hidden
- */
-const allPointerUpEvents = ['pointerup', 'pointercancel', 'mouseup', 'contextmenu', 'touchend', 'touchcancel'];
-
 /**
  * @hidden
  */
@@ -1713,7 +1719,6 @@ class DropTargetContainerDirective {
          * Fires when a DragTarget element is dropped over the DropTarget.
          */
         this.onDrop = new EventEmitter();
-        this.currentDropTarget = null;
         this.currentDropTargetElement = null;
         this.previousDropTargets = [];
         this._dropTargetFilter = null;
@@ -1771,13 +1776,17 @@ class DropTargetContainerDirective {
      * @hidden
      */
     handleDragEnter(event) {
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || this.service.dropTargetPresent) {
             return;
         }
         const eventTarget = event.originalEvent.target;
-        this.currentDropTargetElement = intersect(eventTarget, this.allDropTargets);
-        this.currentDropTarget = this.service.dropTargets.find(dt => dt.element === this.currentDropTargetElement);
-        this.service.dropTarget = this.currentDropTarget;
+        const currDropTargetElem = intersect(eventTarget, this.allDropTargets);
+        const currDropTarget = this.service.dropTargets.find(dt => dt.element === currDropTargetElem);
+        if (!isPresent(currDropTargetElem) || !isPresent(currDropTarget)) {
+            return;
+        }
+        this.currentDropTargetElement = currDropTargetElem;
+        this.service.dropTarget = currDropTarget;
         this.service.dropIndex = this.getDropIndex();
         this.emitZoneAwareEvent('onDragEnter', event);
     }
@@ -1785,21 +1794,19 @@ class DropTargetContainerDirective {
      * @hidden
      */
     handleDragLeave(event) {
-        const containsEventTarget = isPresent(this.service.dropTarget) && contains(this.service.dropTarget?.element, event.originalEvent.target, false);
-        if (containsEventTarget) {
-            return;
-        }
-        this.service.dropTarget = null;
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || !this.service.dropTargetPresent) {
             return;
         }
         this.emitZoneAwareEvent('onDragLeave', event);
+        this.currentDropTargetElement = null;
+        this.service.dropTarget = null;
+        this.service.dropIndex = null;
     }
     /**
      * @hidden
      */
     handleDragOver(event) {
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || !this.service.dropTargetPresent) {
             return;
         }
         this.emitZoneAwareEvent('onDragOver', event);
@@ -1808,12 +1815,12 @@ class DropTargetContainerDirective {
      * @hidden
      */
     handleDrop(event) {
-        if (!this.service.dragTarget) {
+        if (!this.service.dragTargetPresent || !this.service.dropTargetPresent) {
             return;
         }
         this.emitZoneAwareEvent('onDrop', event);
-        this.currentDropTarget = null;
         this.currentDropTargetElement = null;
+        this.service.dropTarget = null;
         this.service.dropIndex = null;
     }
     initializeDropTargets() {
@@ -1863,8 +1870,7 @@ class DropTargetContainerDirective {
         });
     }
     getDropIndex() {
-        const allTargets = this.nativeElement.querySelectorAll(this.dropTargetFilter);
-        return Array.from(allTargets).indexOf(this.currentDropTargetElement);
+        return this.allDropTargets.indexOf(this.currentDropTargetElement);
     }
     clearPreviousTargets() {
         this.previousDropTargets.forEach(dropTarget => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-utils",
-  "version": "15.0.1",
+  "version": "15.0.2-develop.10",
   "description": "Kendo UI Angular utils component",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -23,12 +23,12 @@
     "@angular/core": "13 - 17",
     "@angular/platform-browser": "13 - 17",
     "@progress/kendo-licensing": "^1.0.2",
-    "@progress/kendo-angular-common": "15.0.1",
+    "@progress/kendo-angular-common": "15.0.2-develop.10",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "15.0.1",
+    "@progress/kendo-angular-schematics": "15.0.2-develop.10",
     "@progress/kendo-draggable-common": "^0.2.3"
   },
   "schematics": "./schematics/collection.json",