@foblex/flow
Version:
An Angular library designed to simplify the creation and manipulation of dynamic flow. Provides components for flows, nodes, and connections, automating node manipulation and inter-node connections.
69 lines • 11.5 kB
JavaScript
import { ChangeDetectionStrategy, Component, DestroyRef, inject, Input, ViewChild, } from "@angular/core";
import { FMediator } from '@foblex/mediator';
import { FMinimapFlowDirective } from './f-minimap-flow.directive';
import { FMinimapCanvasDirective } from './f-minimap-canvas.directive';
import { FMinimapViewDirective } from './f-minimap-view.directive';
import { F_BEFORE_MAIN_PLUGIN } from '../f-draggable';
import { MinimapDragFinalizeRequest, MinimapDragPreparationRequest } from './domain';
import { ListenTransformChangesRequest } from '../f-storage';
import { debounceTime, notifyOnStart } from '../reactivity';
import { BrowserService } from '@foblex/platform';
import * as i0 from "@angular/core";
import * as i1 from "./f-minimap-canvas.directive";
import * as i2 from "./f-minimap-view.directive";
import * as i3 from "./f-minimap-flow.directive";
export class FMinimapComponent {
_destroyRef = inject(DestroyRef);
_fMediator = inject(FMediator);
_fBrowser = inject(BrowserService);
fMinimapCanvas;
fMinimapFlow;
fMinimapView;
fMinSize = 1000;
ngAfterViewInit() {
this._listenTransformChanges();
}
_listenTransformChanges() {
this._fMediator.execute(new ListenTransformChangesRequest()).pipe(notifyOnStart(), debounceTime(2)).listen(this._destroyRef, () => {
this._redraw();
});
}
_redraw() {
if (!this._fBrowser.isBrowser()) {
return;
}
this.fMinimapFlow.redraw();
this.fMinimapView.redraw();
this.fMinimapCanvas.redraw();
}
onPointerDown(event) {
this._fMediator.execute(new MinimapDragPreparationRequest(event, this.fMinimapFlow.model));
}
onPointerUp(event) {
this._fMediator.execute(new MinimapDragFinalizeRequest(event));
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FMinimapComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FMinimapComponent, selector: "f-minimap", inputs: { fMinSize: "fMinSize" }, host: { classAttribute: "f-component f-minimap" }, providers: [
{ provide: F_BEFORE_MAIN_PLUGIN, useExisting: FMinimapComponent },
], viewQueries: [{ propertyName: "fMinimapCanvas", first: true, predicate: FMinimapCanvasDirective, descendants: true, static: true }, { propertyName: "fMinimapFlow", first: true, predicate: FMinimapFlowDirective, descendants: true, static: true }, { propertyName: "fMinimapView", first: true, predicate: FMinimapViewDirective, descendants: true, static: true }], exportAs: ["fComponent"], ngImport: i0, template: "<svg fMinimapFlow width=\"100%\" height=\"100%\" fLockedContext [fMinSize]=\"fMinSize\">\n <g fMinimapCanvas></g>\n <rect fMinimapView x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" stroke=\"none\"/>\n</svg>\n\n", styles: [":host{display:block;position:absolute}:host svg{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1.FMinimapCanvasDirective, selector: "g[fMinimapCanvas]" }, { kind: "directive", type: i2.FMinimapViewDirective, selector: "rect[fMinimapView]" }, { kind: "directive", type: i3.FMinimapFlowDirective, selector: "svg[fMinimapFlow]", inputs: ["fMinSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FMinimapComponent, decorators: [{
type: Component,
args: [{ selector: 'f-minimap', exportAs: 'fComponent', host: {
'class': 'f-component f-minimap',
}, providers: [
{ provide: F_BEFORE_MAIN_PLUGIN, useExisting: FMinimapComponent },
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<svg fMinimapFlow width=\"100%\" height=\"100%\" fLockedContext [fMinSize]=\"fMinSize\">\n <g fMinimapCanvas></g>\n <rect fMinimapView x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" stroke=\"none\"/>\n</svg>\n\n", styles: [":host{display:block;position:absolute}:host svg{overflow:hidden}\n"] }]
}], propDecorators: { fMinimapCanvas: [{
type: ViewChild,
args: [FMinimapCanvasDirective, { static: true }]
}], fMinimapFlow: [{
type: ViewChild,
args: [FMinimapFlowDirective, { static: true }]
}], fMinimapView: [{
type: ViewChild,
args: [FMinimapViewDirective, { static: true }]
}], fMinSize: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZi1taW5pbWFwLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL2YtZmxvdy9zcmMvZi1taW5pbWFwL2YtbWluaW1hcC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9mLWZsb3cvc3JjL2YtbWluaW1hcC9mLW1pbmltYXAuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNVLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQzdELE1BQU0sRUFBRSxLQUFLLEVBQUUsU0FBUyxHQUN6QixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFDN0MsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFDbkUsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFDdkUsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFDbkUsT0FBTyxFQUFFLG9CQUFvQixFQUF1QixNQUFNLGdCQUFnQixDQUFDO0FBQzNFLE9BQU8sRUFBRSwwQkFBMEIsRUFBRSw2QkFBNkIsRUFBRSxNQUFNLFVBQVUsQ0FBQztBQUNyRixPQUFPLEVBQUUsNkJBQTZCLEVBQUUsTUFBTSxjQUFjLENBQUM7QUFDN0QsT0FBTyxFQUFFLFlBQVksRUFBZSxhQUFhLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekUsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLGtCQUFrQixDQUFDOzs7OztBQWdCbEQsTUFBTSxPQUFPLGlCQUFpQjtJQUVwQixXQUFXLEdBQUcsTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDO0lBQ2pDLFVBQVUsR0FBRyxNQUFNLENBQUMsU0FBUyxDQUFDLENBQUM7SUFDL0IsU0FBUyxHQUFHLE1BQU0sQ0FBQyxjQUFjLENBQUMsQ0FBQztJQUdwQyxjQUFjLENBQTJCO0lBR3pDLFlBQVksQ0FBeUI7SUFHckMsWUFBWSxDQUF5QjtJQUdyQyxRQUFRLEdBQVcsSUFBSSxDQUFDO0lBRXhCLGVBQWU7UUFDcEIsSUFBSSxDQUFDLHVCQUF1QixFQUFFLENBQUM7SUFDakMsQ0FBQztJQUVPLHVCQUF1QjtRQUM3QixJQUFJLENBQUMsVUFBVSxDQUFDLE9BQU8sQ0FBYyxJQUFJLDZCQUE2QixFQUFFLENBQUMsQ0FBQyxJQUFJLENBQzVFLGFBQWEsRUFBRSxFQUFFLFlBQVksQ0FBQyxDQUFDLENBQUMsQ0FDakMsQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxHQUFHLEVBQUU7WUFDOUIsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFBO1FBQ2hCLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVPLE9BQU87UUFDYixJQUFJLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxTQUFTLEVBQUUsRUFBRSxDQUFDO1lBQ2hDLE9BQU87UUFDVCxDQUFDO1FBQ0QsSUFBSSxDQUFDLFlBQVksQ0FBQyxNQUFNLEVBQUUsQ0FBQztRQUMzQixJQUFJLENBQUMsWUFBWSxDQUFDLE1BQU0sRUFBRSxDQUFDO1FBQzNCLElBQUksQ0FBQyxjQUFjLENBQUMsTUFBTSxFQUFFLENBQUM7SUFDL0IsQ0FBQztJQUVNLGFBQWEsQ0FBQyxLQUFvQjtRQUN2QyxJQUFJLENBQUMsVUFBVSxDQUFDLE9BQU8sQ0FBQyxJQUFJLDZCQUE2QixDQUFDLEtBQUssRUFBRSxJQUFJLENBQUMsWUFBWSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUM7SUFDN0YsQ0FBQztJQUVNLFdBQVcsQ0FBQyxLQUFvQjtRQUNyQyxJQUFJLENBQUMsVUFBVSxDQUFDLE9BQU8sQ0FBQyxJQUFJLDBCQUEwQixDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUM7SUFDakUsQ0FBQzt3R0E3Q1UsaUJBQWlCOzRGQUFqQixpQkFBaUIseUhBTGpCO1lBQ1QsRUFBRSxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsV0FBVyxFQUFFLGlCQUFpQixFQUFFO1NBQ2xFLDBFQVNVLHVCQUF1Qiw2RkFHdkIscUJBQXFCLDZGQUdyQixxQkFBcUIsd0ZDeENsQyx1TkFLQTs7NEZEdUJhLGlCQUFpQjtrQkFiN0IsU0FBUzsrQkFDRSxXQUFXLFlBR1gsWUFBWSxRQUNoQjt3QkFDSixPQUFPLEVBQUUsdUJBQXVCO3FCQUNqQyxhQUNVO3dCQUNULEVBQUUsT0FBTyxFQUFFLG9CQUFvQixFQUFFLFdBQVcsbUJBQW1CLEVBQUU7cUJBQ2xFLG1CQUNnQix1QkFBdUIsQ0FBQyxNQUFNOzhCQVN4QyxjQUFjO3NCQURwQixTQUFTO3VCQUFDLHVCQUF1QixFQUFFLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRTtnQkFJN0MsWUFBWTtzQkFEbEIsU0FBUzt1QkFBQyxxQkFBcUIsRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUU7Z0JBSTNDLFlBQVk7c0JBRGxCLFNBQVM7dUJBQUMscUJBQXFCLEVBQUUsRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFFO2dCQUkzQyxRQUFRO3NCQURkLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBBZnRlclZpZXdJbml0LCBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBEZXN0cm95UmVmLFxuICBpbmplY3QsIElucHV0LCBWaWV3Q2hpbGQsXG59IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBGTWVkaWF0b3IgfSBmcm9tICdAZm9ibGV4L21lZGlhdG9yJztcbmltcG9ydCB7IEZNaW5pbWFwRmxvd0RpcmVjdGl2ZSB9IGZyb20gJy4vZi1taW5pbWFwLWZsb3cuZGlyZWN0aXZlJztcbmltcG9ydCB7IEZNaW5pbWFwQ2FudmFzRGlyZWN0aXZlIH0gZnJvbSAnLi9mLW1pbmltYXAtY2FudmFzLmRpcmVjdGl2ZSc7XG5pbXBvcnQgeyBGTWluaW1hcFZpZXdEaXJlY3RpdmUgfSBmcm9tICcuL2YtbWluaW1hcC12aWV3LmRpcmVjdGl2ZSc7XG5pbXBvcnQgeyBGX0JFRk9SRV9NQUlOX1BMVUdJTiwgSUZEcmFnQW5kRHJvcFBsdWdpbiB9IGZyb20gJy4uL2YtZHJhZ2dhYmxlJztcbmltcG9ydCB7IE1pbmltYXBEcmFnRmluYWxpemVSZXF1ZXN0LCBNaW5pbWFwRHJhZ1ByZXBhcmF0aW9uUmVxdWVzdCB9IGZyb20gJy4vZG9tYWluJztcbmltcG9ydCB7IExpc3RlblRyYW5zZm9ybUNoYW5nZXNSZXF1ZXN0IH0gZnJvbSAnLi4vZi1zdG9yYWdlJztcbmltcG9ydCB7IGRlYm91bmNlVGltZSwgRkNoYW5uZWxIdWIsIG5vdGlmeU9uU3RhcnQgfSBmcm9tICcuLi9yZWFjdGl2aXR5JztcbmltcG9ydCB7IEJyb3dzZXJTZXJ2aWNlIH0gZnJvbSAnQGZvYmxleC9wbGF0Zm9ybSc7XG5pbXBvcnQge0lQb2ludGVyRXZlbnR9IGZyb20gXCIuLi9kcmFnLXRvb2xraXRcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZi1taW5pbWFwJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2YtbWluaW1hcC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWyAnLi9mLW1pbmltYXAuY29tcG9uZW50LnNjc3MnIF0sXG4gIGV4cG9ydEFzOiAnZkNvbXBvbmVudCcsXG4gIGhvc3Q6IHtcbiAgICAnY2xhc3MnOiAnZi1jb21wb25lbnQgZi1taW5pbWFwJyxcbiAgfSxcbiAgcHJvdmlkZXJzOiBbXG4gICAgeyBwcm92aWRlOiBGX0JFRk9SRV9NQUlOX1BMVUdJTiwgdXNlRXhpc3Rpbmc6IEZNaW5pbWFwQ29tcG9uZW50IH0sXG4gIF0sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBGTWluaW1hcENvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQsIElGRHJhZ0FuZERyb3BQbHVnaW4ge1xuXG4gIHByaXZhdGUgX2Rlc3Ryb3lSZWYgPSBpbmplY3QoRGVzdHJveVJlZik7XG4gIHByaXZhdGUgX2ZNZWRpYXRvciA9IGluamVjdChGTWVkaWF0b3IpO1xuICBwcml2YXRlIF9mQnJvd3NlciA9IGluamVjdChCcm93c2VyU2VydmljZSk7XG5cbiAgQFZpZXdDaGlsZChGTWluaW1hcENhbnZhc0RpcmVjdGl2ZSwgeyBzdGF0aWM6IHRydWUgfSlcbiAgcHVibGljIGZNaW5pbWFwQ2FudmFzITogRk1pbmltYXBDYW52YXNEaXJlY3RpdmU7XG5cbiAgQFZpZXdDaGlsZChGTWluaW1hcEZsb3dEaXJlY3RpdmUsIHsgc3RhdGljOiB0cnVlIH0pXG4gIHB1YmxpYyBmTWluaW1hcEZsb3chOiBGTWluaW1hcEZsb3dEaXJlY3RpdmU7XG5cbiAgQFZpZXdDaGlsZChGTWluaW1hcFZpZXdEaXJlY3RpdmUsIHsgc3RhdGljOiB0cnVlIH0pXG4gIHB1YmxpYyBmTWluaW1hcFZpZXchOiBGTWluaW1hcFZpZXdEaXJlY3RpdmU7XG5cbiAgQElucHV0KClcbiAgcHVibGljIGZNaW5TaXplOiBudW1iZXIgPSAxMDAwO1xuXG4gIHB1YmxpYyBuZ0FmdGVyVmlld0luaXQoKTogdm9pZCB7XG4gICAgdGhpcy5fbGlzdGVuVHJhbnNmb3JtQ2hhbmdlcygpO1xuICB9XG5cbiAgcHJpdmF0ZSBfbGlzdGVuVHJhbnNmb3JtQ2hhbmdlcygpOiB2b2lkIHtcbiAgICB0aGlzLl9mTWVkaWF0b3IuZXhlY3V0ZTxGQ2hhbm5lbEh1Yj4obmV3IExpc3RlblRyYW5zZm9ybUNoYW5nZXNSZXF1ZXN0KCkpLnBpcGUoXG4gICAgICBub3RpZnlPblN0YXJ0KCksIGRlYm91bmNlVGltZSgyKVxuICAgICkubGlzdGVuKHRoaXMuX2Rlc3Ryb3lSZWYsICgpID0+IHtcbiAgICAgIHRoaXMuX3JlZHJhdygpXG4gICAgfSk7XG4gIH1cblxuICBwcml2YXRlIF9yZWRyYXcoKTogdm9pZCB7XG4gICAgaWYgKCF0aGlzLl9mQnJvd3Nlci5pc0Jyb3dzZXIoKSkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB0aGlzLmZNaW5pbWFwRmxvdy5yZWRyYXcoKTtcbiAgICB0aGlzLmZNaW5pbWFwVmlldy5yZWRyYXcoKTtcbiAgICB0aGlzLmZNaW5pbWFwQ2FudmFzLnJlZHJhdygpO1xuICB9XG5cbiAgcHVibGljIG9uUG9pbnRlckRvd24oZXZlbnQ6IElQb2ludGVyRXZlbnQpOiB2b2lkIHtcbiAgICB0aGlzLl9mTWVkaWF0b3IuZXhlY3V0ZShuZXcgTWluaW1hcERyYWdQcmVwYXJhdGlvblJlcXVlc3QoZXZlbnQsIHRoaXMuZk1pbmltYXBGbG93Lm1vZGVsKSk7XG4gIH1cblxuICBwdWJsaWMgb25Qb2ludGVyVXAoZXZlbnQ6IElQb2ludGVyRXZlbnQpOiB2b2lkIHtcbiAgICB0aGlzLl9mTWVkaWF0b3IuZXhlY3V0ZShuZXcgTWluaW1hcERyYWdGaW5hbGl6ZVJlcXVlc3QoZXZlbnQpKTtcbiAgfVxufVxuIiwiPHN2ZyBmTWluaW1hcEZsb3cgd2lkdGg9XCIxMDAlXCIgaGVpZ2h0PVwiMTAwJVwiIGZMb2NrZWRDb250ZXh0IFtmTWluU2l6ZV09XCJmTWluU2l6ZVwiPlxuICA8ZyBmTWluaW1hcENhbnZhcz48L2c+XG4gIDxyZWN0IGZNaW5pbWFwVmlldyB4PVwiMFwiIHk9XCIwXCIgd2lkdGg9XCIxMDAlXCIgaGVpZ2h0PVwiMTAwJVwiIHN0cm9rZT1cIm5vbmVcIi8+XG48L3N2Zz5cblxuIl19