@progress/kendo-angular-utils 11.6.0 → 12.0.0-develop.10

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

@@ -0,0 +1,224 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* 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 { validatePackage } from '@progress/kendo-licensing';
+import { packageMetadata } from '../package-metadata';
+import { DragStateService } from './drag-state.service';
+import { DropTargetEvent } from './events/drop-target-event';
+import { isPresent, intersect } from './util';
+import * as i0 from "@angular/core";
+import * as i1 from "./drag-state.service";
+/**
+ * Represents the [Kendo UI DropTargetContainer directive for Angular]({% slug api_utils_droptargetcontainerdirective %}).
+ * Used to configure multiple elements as drop targets.
+ *
+ * @example
+ * ```ts-no-run
+ * <div kendoDropTargetContainer dropTargetFilter=".my-droptarget">
+ *    <div class="my-droptarget">foo</div>
+ * </div>
+ * ```
+ */
+export class DropTargetContainerDirective {
+    constructor(service, element, ngZone, cdr) {
+        this.service = service;
+        this.element = element;
+        this.ngZone = ngZone;
+        this.cdr = cdr;
+        /**
+         * Fires when a DragTarget element enters the DropTarget.
+         */
+        this.dragEnter = new EventEmitter();
+        /**
+         * Fires when a DragTarget element is being dragged over the DropTarget.
+         */
+        this.dragOver = new EventEmitter();
+        /**
+         * Fires when a DragTarget element leaves the DropTarget.
+         */
+        this.dragLeave = new EventEmitter();
+        /**
+         * Fires when a DragTarget element is dropped over the DropTarget.
+         */
+        this.drop = new EventEmitter();
+        this.currentDropTarget = null;
+        this.currentDropTargetElement = null;
+        this.previousDropTargets = [];
+        this._dropTargetFilter = null;
+        this._dropDisabled = false;
+        validatePackage(packageMetadata);
+    }
+    /**
+     * Specifies a selector for elements within a container which will be configured as drop targets
+     * ([see example]({% slug drop_target_container %})). The possible values include any
+     * DOM `selector`.
+     */
+    set dropTargetFilter(value) {
+        this._dropTargetFilter = value;
+        if (!this.dropDisabled) {
+            this.initializeDropTargets();
+        }
+    }
+    get dropTargetFilter() {
+        return this._dropTargetFilter;
+    }
+    /**
+     * Specifies whether the Drop Targets within the container will emit the corresponding events upon interaction with a Drag Target.
+     */
+    set dropDisabled(value) {
+        if (value) {
+            this.clearPreviousTargets();
+        }
+        else {
+            this.initializeDropTargets();
+        }
+    }
+    get dropDisabled() {
+        return this._dropDisabled;
+    }
+    /**
+     * Used for notifying the DropTargetContainer that its content has changed.
+     */
+    notify() {
+        this.cdr.detectChanges();
+        this.initializeDropTargets();
+    }
+    get nativeElement() {
+        return this.element.nativeElement;
+    }
+    ngAfterViewInit() {
+        !this.dropDisabled && this.initializeDropTargets();
+    }
+    get allDropTargets() {
+        if (isPresent(this.dropTargetFilter) && this.dropTargetFilter !== '') {
+            return Array.from(this.nativeElement.querySelectorAll(this.dropTargetFilter));
+        }
+    }
+    /**
+     * @hidden
+     */
+    handleDragEnter(event) {
+        if (!this.service.dragTarget) {
+            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;
+        this.service.dropIndex = this.getDropIndex();
+        this.emitZoneAwareEvent('dragEnter', event);
+    }
+    /**
+     * @hidden
+     */
+    handleDragLeave(event) {
+        this.service.dropTarget = null;
+        if (!this.service.dragTarget) {
+            return;
+        }
+        this.emitZoneAwareEvent('dragLeave', event);
+    }
+    /**
+     * @hidden
+     */
+    handleDragOver(event) {
+        if (!this.service.dragTarget) {
+            return;
+        }
+        this.emitZoneAwareEvent('dragOver', event);
+    }
+    /**
+     * @hidden
+     */
+    handleDrop(event) {
+        if (!this.service.dragTarget) {
+            return;
+        }
+        this.emitZoneAwareEvent('drop', event);
+        this.currentDropTarget = null;
+        this.currentDropTargetElement = null;
+        this.service.dropIndex = null;
+    }
+    initializeDropTargets() {
+        if (!isPresent(this.allDropTargets)) {
+            if (this.previousDropTargets.length > 0) {
+                this.clearPreviousTargets();
+            }
+            return;
+        }
+        this.allDropTargets.forEach(dropTargetEl => {
+            const isDropTargetInitialized = this.service.dropTargets.find(dt => dt.element === dropTargetEl);
+            if (!isDropTargetInitialized) {
+                this.service.dropTargets.push({
+                    element: dropTargetEl,
+                    onDragEnter: this.handleDragEnter.bind(this),
+                    onDragLeave: this.handleDragLeave.bind(this),
+                    onDragOver: this.handleDragOver.bind(this),
+                    onDrop: this.handleDrop.bind(this)
+                });
+            }
+        });
+        if (this.previousDropTargets.length > 0) {
+            const dropTargetsToRemove = this.previousDropTargets.filter(dt => !this.allDropTargets.includes(dt));
+            dropTargetsToRemove.forEach(dropTarget => {
+                const idx = this.service.dropTargets.findIndex(serviceDropTarget => serviceDropTarget.element === dropTarget);
+                if (idx > -1) {
+                    this.service.dropTargets.splice(idx, 1);
+                }
+            });
+        }
+        this.previousDropTargets = this.allDropTargets;
+    }
+    emitZoneAwareEvent(event, normalizedEvent) {
+        const eventProps = {
+            dragTarget: this.service.dragTarget,
+            dropTarget: this.currentDropTargetElement,
+            dragData: this.service.dragData,
+            dragEvent: normalizedEvent,
+            dropTargetIndex: this.service.dropIndex
+        };
+        if (isPresent(this.service.dragTarget?.hint)) {
+            eventProps.hintElement = this.service.dragTarget.hint;
+        }
+        const eventArgs = new DropTargetEvent(eventProps);
+        this.ngZone.run(() => {
+            this[event].emit(eventArgs);
+        });
+    }
+    getDropIndex() {
+        const allTargets = this.nativeElement.querySelectorAll(this.dropTargetFilter);
+        return Array.from(allTargets).indexOf(this.currentDropTargetElement);
+    }
+    clearPreviousTargets() {
+        this.previousDropTargets.forEach(dropTarget => {
+            const idx = this.service.dropTargets.findIndex(serviceDropTarget => serviceDropTarget.element === dropTarget);
+            if (idx > -1) {
+                this.service.dropTargets.splice(idx, 1);
+            }
+        });
+        this.previousDropTargets = [];
+    }
+}
+DropTargetContainerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: DropTargetContainerDirective, deps: [{ token: i1.DragStateService }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
+DropTargetContainerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: DropTargetContainerDirective, selector: "[kendoDropTargetContainer]", inputs: { dropTargetFilter: "dropTargetFilter", dropDisabled: "dropDisabled" }, outputs: { dragEnter: "dragEnter", dragOver: "dragOver", dragLeave: "dragLeave", drop: "drop" }, exportAs: ["kendoDropTargetContainer"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: DropTargetContainerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kendoDropTargetContainer]',
+                    exportAs: 'kendoDropTargetContainer'
+                }]
+        }], ctorParameters: function () { return [{ type: i1.DragStateService }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { dropTargetFilter: [{
+                type: Input
+            }], dropDisabled: [{
+                type: Input
+            }], dragEnter: [{
+                type: Output
+            }], dragOver: [{
+                type: Output
+            }], dragLeave: [{
+                type: Output
+            }], drop: [{
+                type: Output
+            }] } });

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

@@ -2,12 +2,12 @@
 * Copyright © 2023 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { Directive, ElementRef, EventEmitter, Input, NgZone, Output } from "@angular/core";
+import { Directive, ElementRef, EventEmitter, NgZone, Output } from "@angular/core";
 import { validatePackage } from '@progress/kendo-licensing';
 import { packageMetadata } from '../package-metadata';
 import { DragStateService } from "./drag-state.service";
-import { DropTargetDragEnterEvent, DropTargetDragOverEvent, DropTargetDragLeaveEvent, DropTargetDropEvent } from './events/drop-target';
-import { isPresent } from './util';
+import { DropTargetEvent } from './events/drop-target-event';
+import { isPresent } from "./util";
 import * as i0 from "@angular/core";
 import * as i1 from "./drag-state.service";
 /**
@@ -20,22 +20,18 @@ export class DropTargetDirective {
         this.ngZone = ngZone;
         /**
          * Fires when a DragTarget element enters the DropTarget.
-         * This event is preventable. Preventing it allows full logic customization.
          */
         this.dragEnter = new EventEmitter();
         /**
          * Fires when a DragTarget element is being dragged over the DropTarget.
-         * This event is preventable. Preventing it allows full logic customization.
          */
         this.dragOver = new EventEmitter();
         /**
          * Fires when a DragTarget element leaves the DropTarget.
-         * This event is preventable. Preventing it allows full logic customization.
          */
         this.dragLeave = new EventEmitter();
         /**
          * Fires when a DragTarget element is dropped over the DropTarget.
-         * This event is preventable. Preventing it allows full logic customization.
          */
         this.drop = new EventEmitter();
         validatePackage(packageMetadata);
@@ -51,29 +47,10 @@ export class DropTargetDirective {
         if (!this.service.dragTarget) {
             return;
         }
-        let allowed = true;
-        if (isPresent(this.allowedDragTargets)) {
-            switch (typeof this.allowedDragTargets) {
-                case 'function': {
-                    allowed = this.allowedDragTargets(this.service.dragTargetDirective);
-                    break;
-                }
-                case 'string': {
-                    allowed = this.service.dragTargetDirective.link === this.allowedDragTargets;
-                    break;
-                }
-                default: {
-                    allowed = this.allowedDragTargets.some(dt => dt === this.service.dragTargetDirective.link);
-                }
-            }
-        }
-        if (allowed) {
-            this.service.dropTarget = this.dropTarget;
-            this.ngZone.run(() => {
-                const eventArgs = new DropTargetDragEnterEvent({ normalizedEvent: event, hostElement: this.element.nativeElement });
-                this.dragEnter.emit(eventArgs);
-            });
-        }
+        this.service.dropTarget = this.dropTarget;
+        this.ngZone.run(() => {
+            this.emitEvent('dragEnter', event);
+        });
     }
     /**
      * @hidden
@@ -84,8 +61,7 @@ export class DropTargetDirective {
             return;
         }
         this.ngZone.run(() => {
-            const eventArgs = new DropTargetDragLeaveEvent({ normalizedEvent: event, hostElement: this.element.nativeElement });
-            this.dragLeave.emit(eventArgs);
+            this.emitEvent('dragLeave', event);
         });
     }
     /**
@@ -96,8 +72,7 @@ export class DropTargetDirective {
             return;
         }
         this.ngZone.run(() => {
-            const eventArgs = new DropTargetDragOverEvent({ normalizedEvent: event, hostElement: this.element.nativeElement });
-            this.dragOver.emit(eventArgs);
+            this.emitEvent('dragOver', event);
         });
     }
     /**
@@ -105,13 +80,9 @@ export class DropTargetDirective {
      */
     handleDrop(event) {
         this.ngZone.run(() => {
-            const eventArgs = new DropTargetDropEvent({ normalizedEvent: event, hostElement: this.element.nativeElement });
-            this.drop.emit(eventArgs);
+            this.emitEvent('drop', event);
         });
     }
-    /**
-     * @hidden
-     */
     initializeDropTarget() {
         this.dropTarget = {
             element: this.element.nativeElement,
@@ -121,18 +92,29 @@ export class DropTargetDirective {
             onDrop: this.handleDrop.bind(this)
         };
     }
+    emitEvent(event, normalizedEvent) {
+        const eventProps = {
+            dropTarget: this.element.nativeElement,
+            dragTarget: this.service.dragTarget?.element,
+            dragEvent: normalizedEvent,
+            dragData: this.service.dragData
+        };
+        if (isPresent(this.service.dragTarget?.hint)) {
+            eventProps.hintElement = this.service.dragTarget.element;
+        }
+        const eventArgs = new DropTargetEvent(eventProps);
+        this[event].emit(eventArgs);
+    }
 }
 DropTargetDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: DropTargetDirective, deps: [{ token: i1.DragStateService }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
-DropTargetDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: DropTargetDirective, selector: "[kendoDropTarget]", inputs: { allowedDragTargets: "allowedDragTargets" }, outputs: { dragEnter: "dragEnter", dragOver: "dragOver", dragLeave: "dragLeave", drop: "drop" }, exportAs: ["kendoDropTarget"], ngImport: i0 });
+DropTargetDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: DropTargetDirective, selector: "[kendoDropTarget]", outputs: { dragEnter: "dragEnter", dragOver: "dragOver", dragLeave: "dragLeave", drop: "drop" }, exportAs: ["kendoDropTarget"], ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: DropTargetDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoDropTarget]',
                     exportAs: 'kendoDropTarget'
                 }]
-        }], ctorParameters: function () { return [{ type: i1.DragStateService }, { type: i0.ElementRef }, { type: i0.NgZone }]; }, propDecorators: { allowedDragTargets: [{
-                type: Input
-            }], dragEnter: [{
+        }], ctorParameters: function () { return [{ type: i1.DragStateService }, { type: i0.ElementRef }, { type: i0.NgZone }]; }, propDecorators: { dragEnter: [{
                 type: Output
             }], dragOver: [{
                 type: Output

package/esm2020/drag-and-drop/events/drag-target/drag-event.mjs

@@ -4,7 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import { PreventableEvent } from '@progress/kendo-angular-common';
 /**
- * Arguments for the drag event of the DragTarget.
+ * Arguments for the drag event of the DragTarget and DragTargetContainer.
  */
 export class DragTargetDragEvent extends PreventableEvent {
     /**
@@ -14,4 +14,18 @@ export class DragTargetDragEvent extends PreventableEvent {
         super();
         Object.assign(this, args);
     }
+    /**
+     * Left for backward compatibility for the DragTarget deprecated events.
+     * @hidden
+     */
+    get normalizedEvent() {
+        return this.dragEvent;
+    }
+    /**
+     * Left for backward compatibility for the DragTarget deprecated events.
+     * @hidden
+     */
+    get hostElement() {
+        return this.dragTarget;
+    }
 }

package/esm2020/drag-and-drop/events/{drop-target/enter-event.mjs → drag-target/dragready-event.mjs}

@@ -3,9 +3,9 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 /**
- * Arguments for the dragEnter event of the DropTarget.
+ * Arguments for the dragReady event of the DragTarget and DragTargetContainer.
  */
-export class DropTargetDragEnterEvent {
+export class DragTargetDragReadyEvent {
     /**
      * @hidden
      */

package/esm2020/drag-and-drop/events/drag-target/end-event.mjs

@@ -3,7 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 /**
- * Arguments for the dragEnd event of the DragTarget.
+ * Arguments for the dragEnd event of the DragTarget and DragTargetContainer.
  */
 export class DragTargetDragEndEvent {
     /**
@@ -12,4 +12,18 @@ export class DragTargetDragEndEvent {
     constructor(args) {
         Object.assign(this, args);
     }
+    /**
+     * Left for backward compatibility for the DragTarget deprecated events.
+     * @hidden
+     */
+    get normalizedEvent() {
+        return this.dragEvent;
+    }
+    /**
+     * Left for backward compatibility for the DragTarget deprecated events.
+     * @hidden
+     */
+    get hostElement() {
+        return this.dragTarget;
+    }
 }

package/esm2020/drag-and-drop/events/drag-target/index.mjs

@@ -3,6 +3,8 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 export { DragTargetPressEvent } from './press-event';
+export { DragTargetDragReadyEvent } from './dragready-event';
 export { DragTargetDragStartEvent } from './start-event';
 export { DragTargetDragEndEvent } from './end-event';
 export { DragTargetDragEvent } from './drag-event';
+export { DragTargetReleaseEvent } from './release-event';

package/esm2020/drag-and-drop/events/drag-target/press-event.mjs

@@ -3,7 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 /**
- * Arguments for the press event of the DragTarget.
+ * Arguments for the press event of the DragTarget and DragTargetContainer.
  */
 export class DragTargetPressEvent {
     /**
@@ -12,4 +12,18 @@ export class DragTargetPressEvent {
     constructor(args) {
         Object.assign(this, args);
     }
+    /**
+     * Left for backward compatibility for the DragTarget deprecated events.
+     * @hidden
+     */
+    get normalizedEvent() {
+        return this.dragEvent;
+    }
+    /**
+     * Left for backward compatibility for the DragTarget deprecated events.
+     * @hidden
+     */
+    get hostElement() {
+        return this.dragTarget;
+    }
 }

package/esm2020/drag-and-drop/events/{drop-target/leave-event.mjs → drag-target/release-event.mjs}

@@ -3,13 +3,27 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 /**
- * Arguments for the dragLeave event of the DropTarget.
+ * Arguments for the release event of the DragTarget and DragTargetContainer.
  */
-export class DropTargetDragLeaveEvent {
+export class DragTargetReleaseEvent {
     /**
      * @hidden
      */
     constructor(args) {
         Object.assign(this, args);
     }
+    /**
+     * Left for backward compatibility for the DragTarget deprecated events.
+     * @hidden
+     */
+    get normalizedEvent() {
+        return this.dragEvent;
+    }
+    /**
+     * Left for backward compatibility for the DragTarget deprecated events.
+     * @hidden
+     */
+    get hostElement() {
+        return this.dragTarget;
+    }
 }

package/esm2020/drag-and-drop/events/drag-target/start-event.mjs

@@ -4,7 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import { PreventableEvent } from '@progress/kendo-angular-common';
 /**
- * Arguments for the dragStart event of the DragTarget.
+ * Arguments for the dragStart event of the DragTarget and DragTargetContainer.
  */
 export class DragTargetDragStartEvent extends PreventableEvent {
     /**
@@ -14,4 +14,18 @@ export class DragTargetDragStartEvent extends PreventableEvent {
         super();
         Object.assign(this, args);
     }
+    /**
+     * Left for backward compatibility for the DragTarget deprecated events.
+     * @hidden
+     */
+    get normalizedEvent() {
+        return this.dragEvent;
+    }
+    /**
+     * Left for backward compatibility for the DragTarget deprecated events.
+     * @hidden
+     */
+    get hostElement() {
+        return this.dragTarget;
+    }
 }

package/esm2020/drag-and-drop/events/drop-target-event.mjs

@@ -0,0 +1,29 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * Arguments for the drag events of the DropTarget and DropTargetContainer directives.
+ */
+export class DropTargetEvent {
+    /**
+     * @hidden
+     */
+    constructor(args) {
+        Object.assign(this, args);
+    }
+    /**
+     * Left for backward compatibility for the DropTarget deprecated events.
+     * @hidden
+     */
+    get normalizedEvent() {
+        return this.dragEvent;
+    }
+    /**
+     * Left for backward compatibility for the DropTarget deprecated events.
+     * @hidden
+     */
+    get hostElement() {
+        return this.dropTarget;
+    }
+}

package/esm2020/drag-and-drop/events/index.mjs

@@ -0,0 +1,6 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export { DropTargetEvent } from './drop-target-event';
+export * from './drag-target';

package/esm2020/drag-and-drop/hint.component.mjs

@@ -2,31 +2,28 @@
 * Copyright © 2023 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { Component, ElementRef, HostBinding, Input, TemplateRef } from "@angular/core";
+import { Component, ElementRef, Input, TemplateRef } from "@angular/core";
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
-const DEFAULT_ZINDEX = 10;
 /**
  * @hidden
  */
 export class HintComponent {
     constructor(element) {
         this.element = element;
-        this.hostClasses = true;
-        this.zIndex = DEFAULT_ZINDEX;
-        this.touchAction = 'none';
     }
 }
 HintComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: HintComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-HintComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: HintComponent, selector: "ng-component", inputs: { template: "template", directive: "directive" }, host: { properties: { "class.k-pos-absolute": "this.hostClasses", "class.k-cursor-grab": "this.hostClasses", "style.zIndex": "this.zIndex", "style.touch-action": "this.touchAction" } }, ngImport: i0, template: `
-        <ng-container *ngTemplateOutlet="template; context: { $implicit: directive }">
+HintComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: HintComponent, selector: "kendo-draghint", inputs: { template: "template", directive: "directive", targetIndex: "targetIndex", contextData: "contextData" }, ngImport: i0, template: `
+        <ng-container *ngTemplateOutlet="template; context: { $implicit: directive, index: targetIndex, data: contextData }">
         </ng-container>
     `, isInline: true, directives: [{ type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: HintComponent, decorators: [{
             type: Component,
             args: [{
+                    selector: 'kendo-draghint',
                     template: `
-        <ng-container *ngTemplateOutlet="template; context: { $implicit: directive }">
+        <ng-container *ngTemplateOutlet="template; context: { $implicit: directive, index: targetIndex, data: contextData }">
         </ng-container>
     `
                 }]
@@ -34,16 +31,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 type: Input
             }], directive: [{
                 type: Input
-            }], hostClasses: [{
-                type: HostBinding,
-                args: ['class.k-pos-absolute']
-            }, {
-                type: HostBinding,
-                args: ['class.k-cursor-grab']
-            }], zIndex: [{
-                type: HostBinding,
-                args: ['style.zIndex']
-            }], touchAction: [{
-                type: HostBinding,
-                args: ['style.touch-action']
+            }], targetIndex: [{
+                type: Input
+            }], contextData: [{
+                type: Input
             }] } });

package/esm2020/drag-and-drop/models/functions.mjs

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export {};

package/esm2020/drag-and-drop/models/hint-settings.mjs

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export {};