import { Component, ChangeDetectionStrategy, Input, Inject, ChangeDetectorRef, ViewChild, Optional } from '@angular/core';
import { DragDropModule } from '@angular/cdk/drag-drop';
import { HostDisplayFlexStyle } from '@anglr/common';
import { EditorHotkeys, MetadataHistoryManager, PackageManagerModule } from '@anglr/dynamic';
import { nameof } from '@jscrpt/common';
import { Subscription } from 'rxjs';
import { NodesPaletteSAComponent } from '../nodesPalette/nodesPalette.component';
import { RelationsCanvasSAComponent } from '../relationsCanvas/relationsCanvas.component';
import { RELATIONS_HISTORY_MANAGER } from '../../misc/tokens';
import * as i0 from "@angular/core";
import * as i1 from "@anglr/dynamic";
import * as i2 from "@angular/cdk/drag-drop";
import * as i3 from "../../../../src/modules/packageManager/components/packageManager/packageManager.component";
/**
 * Component that represents relations editor with palette and canvas
 */
export class RelationsEditorSAComponent {
    //######################### constructor #########################
    constructor(history, changeDetector, hotkeys) {
        this.history = history;
        this.changeDetector = changeDetector;
        this.hotkeys = hotkeys;
        //######################### protected properties #########################
        /**
         * Subscriptions created during initialization
         */
        this.initSubscriptions = new Subscription();
        //######################### public properties - inputs #########################
        /**
         * Metadata used for rendering relations in canvas
         */
        this.metadata = [];
        hotkeys === null || hotkeys === void 0 ? void 0 : hotkeys.init();
    }
    //######################### public methods - implementation of OnInit #########################
    /**
     * Initialize component
     */
    ngOnInit() {
        this.initSubscriptions.add(this.history.pop.subscribe(metadata => {
            this.metadata = metadata;
            this.changeDetector.detectChanges();
        }));
        if (this.hotkeys) {
            this.initSubscriptions.add(this.hotkeys.undo.subscribe(() => this.history.undo()));
            this.initSubscriptions.add(this.hotkeys.redo.subscribe(() => this.history.redo()));
        }
    }
    //######################### public methods - implementation of OnChanges #########################
    /**
     * Called when input value changes
     */
    ngOnChanges(changes) {
        if (nameof('metadata') in changes) {
            this.history.clean();
            if (this.metadata) {
                this.history.setInitialState(this.metadata);
            }
        }
    }
    //######################### public methods - implementation of OnDestroy #########################
    /**
     * Called when component is destroyed
     */
    ngOnDestroy() {
        var _a;
        this.initSubscriptions.unsubscribe();
        (_a = this.hotkeys) === null || _a === void 0 ? void 0 : _a.destroy();
    }
    //######################### protected methods - template bindings #########################
    /**
     * Adds new node into canvas and metadata
     * @param event - Drop event that occured
     */
    addNode(event) {
        var _a, _b;
        if ((_a = event.item.data.metadata.nodeMetadata) === null || _a === void 0 ? void 0 : _a.coordinates) {
            const coordinates = (_b = this.relationCanvas) === null || _b === void 0 ? void 0 : _b.getPositionInCanvas(event.dropPoint);
            if (coordinates) {
                event.item.data.metadata.nodeMetadata.coordinates.x = coordinates.x;
                event.item.data.metadata.nodeMetadata.coordinates.y = coordinates.y;
            }
        }
        this.metadata =
            [
                ...this.metadata,
                event.item.data.metadata,
            ];
        this.history.getNewState();
    }
}
RelationsEditorSAComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: RelationsEditorSAComponent, deps: [{ token: RELATIONS_HISTORY_MANAGER }, { token: i0.ChangeDetectorRef }, { token: i1.EditorHotkeys, optional: true }], target: i0.ɵɵFactoryTarget.Component });
RelationsEditorSAComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: RelationsEditorSAComponent, isStandalone: true, selector: "relations-editor", inputs: { metadata: "metadata", packages: "packages", whiteList: "whiteList", blackList: "blackList" }, viewQueries: [{ propertyName: "relationCanvas", first: true, predicate: RelationsCanvasSAComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"dynamic-flex-row dynamic-flex-1\">\n    <div class=\"overflow-vertical-scroll dynamic-thin-scrollbar\">\n        <package-manager></package-manager>\n        <nodes-palette [canvasDropList]=\"dropList\" [packages]=\"packages\" [whiteList]=\"whiteList\" [blackList]=\"blackList\" style=\"width: 250px;\"></nodes-palette>\n    </div>\n\n    <relations-canvas #dropList=\"cdkDropList\" [nodeDefinitions]=\"metadata\" class=\"dynamic-flex-1\" cdkDropList (cdkDropListDropped)=\"addNode($event)\"></relations-canvas>\n</div>", styles: [":host{display: flex;}"], dependencies: [{ kind: "component", type: NodesPaletteSAComponent, selector: "nodes-palette", inputs: ["canvasDropList", "packages", "whiteList", "blackList"] }, { kind: "component", type: RelationsCanvasSAComponent, selector: "relations-canvas", inputs: ["nodeDefinitions"], outputs: ["convasPositionChanged"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "ngmodule", type: PackageManagerModule }, { kind: "component", type: i3.PackageManagerComponent, selector: "package-manager" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: RelationsEditorSAComponent, decorators: [{
            type: Component,
            args: [{ selector: 'relations-editor', standalone: true, imports: [
                        NodesPaletteSAComponent,
                        RelationsCanvasSAComponent,
                        DragDropModule,
                        PackageManagerModule,
                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dynamic-flex-row dynamic-flex-1\">\n    <div class=\"overflow-vertical-scroll dynamic-thin-scrollbar\">\n        <package-manager></package-manager>\n        <nodes-palette [canvasDropList]=\"dropList\" [packages]=\"packages\" [whiteList]=\"whiteList\" [blackList]=\"blackList\" style=\"width: 250px;\"></nodes-palette>\n    </div>\n\n    <relations-canvas #dropList=\"cdkDropList\" [nodeDefinitions]=\"metadata\" class=\"dynamic-flex-1\" cdkDropList (cdkDropListDropped)=\"addNode($event)\"></relations-canvas>\n</div>", styles: [":host{display: flex;}"] }]
        }], ctorParameters: () => [{ type: i1.MetadataHistoryManager, decorators: [{
                    type: Inject,
                    args: [RELATIONS_HISTORY_MANAGER]
                }] }, { type: i0.ChangeDetectorRef }, { type: i1.EditorHotkeys, decorators: [{
                    type: Optional
                }] }], propDecorators: { relationCanvas: [{
                type: ViewChild,
                args: [RelationsCanvasSAComponent]
            }], metadata: [{
                type: Input
            }], packages: [{
                type: Input
            }], whiteList: [{
                type: Input
            }], blackList: [{
                type: Input
            }] } });
//# sourceMappingURL=relationsEditor.component.js.map