@progress/kendo-angular-treeview/esm2022/drag-and-drop/drag-clue/drag-clue.component.mjs

Kendo UI TreeView for Angular

/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { Component, HostBinding, ChangeDetectorRef, ChangeDetectionStrategy } from "@angular/core";
import { DropAction } from '../models';
import { cancelIcon, insertBottomIcon, insertMiddleIcon, insertTopIcon, plusIcon } from "@progress/kendo-svg-icons";
import { NgTemplateOutlet } from "@angular/common";
import { IconWrapperComponent } from "@progress/kendo-angular-icons";
import * as i0 from "@angular/core";
/**
 * @hidden
 */
export class DragClueComponent {
    cdr;
    hostClasses = true;
    /**
     * The text value of the dragged TreeView item.
     */
    text;
    /**
     * The attempted operation according to the current drop target.
     */
    action;
    /**
     * The look-up info for the currently dragged item.
     */
    sourceItem;
    /**
     * The look-up info for the destination item (if hovering a valid drop target).
     */
    destinationItem;
    /**
     * Defines the drag clue content template.
     */
    template;
    posistionStyle = 'fixed';
    get statusIconClass() {
        switch (this.action) {
            case DropAction.Add: return 'plus';
            case DropAction.InsertTop: return 'insert-top';
            case DropAction.InsertBottom: return 'insert-bottom';
            case DropAction.InsertMiddle: return 'insert-middle';
            case DropAction.Invalid:
            default: return 'cancel';
        }
    }
    get statusSVGIcon() {
        switch (this.action) {
            case DropAction.Add: return plusIcon;
            case DropAction.InsertTop: return insertTopIcon;
            case DropAction.InsertBottom: return insertBottomIcon;
            case DropAction.InsertMiddle: return insertMiddleIcon;
            case DropAction.Invalid:
            default: return cancelIcon;
        }
    }
    constructor(cdr) {
        this.cdr = cdr;
    }
    // exposed as a public method that can be called from outside as the component uses `OnPush` strategy
    detectChanges() {
        this.cdr.detectChanges();
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DragClueComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: DragClueComponent, isStandalone: true, selector: "kendo-treeview-drag-clue", host: { properties: { "class.k-header": "this.hostClasses", "class.k-drag-clue": "this.hostClasses", "style.position": "this.posistionStyle" } }, ngImport: i0, template: `
        @if (!template) {
          <kendo-icon-wrapper
            innerCssClass="k-drag-status"
            [name]="statusIconClass"
            [svgIcon]="statusSVGIcon"
            >
          </kendo-icon-wrapper>
          <span>{{text}}</span>
        }
        
        @if (template) {
          <ng-template
            [ngTemplateOutlet]="template"
            [ngTemplateOutletContext]="{
                text: text,
                action: action,
                sourceItem: sourceItem,
                destinationItem: destinationItem
            }"
            >
          </ng-template>
        }
        `, isInline: true, dependencies: [{ kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DragClueComponent, decorators: [{
            type: Component,
            args: [{
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    selector: 'kendo-treeview-drag-clue',
                    template: `
        @if (!template) {
          <kendo-icon-wrapper
            innerCssClass="k-drag-status"
            [name]="statusIconClass"
            [svgIcon]="statusSVGIcon"
            >
          </kendo-icon-wrapper>
          <span>{{text}}</span>
        }
        
        @if (template) {
          <ng-template
            [ngTemplateOutlet]="template"
            [ngTemplateOutletContext]="{
                text: text,
                action: action,
                sourceItem: sourceItem,
                destinationItem: destinationItem
            }"
            >
          </ng-template>
        }
        `,
                    standalone: true,
                    imports: [IconWrapperComponent, NgTemplateOutlet]
                }]
        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { hostClasses: [{
                type: HostBinding,
                args: ['class.k-header']
            }, {
                type: HostBinding,
                args: ['class.k-drag-clue']
            }], posistionStyle: [{
                type: HostBinding,
                args: ['style.position']
            }] } });