@foblex/flow 12.6.6 → 14.0.0

package/fesm2015/{foblex-flow.js → foblex-flow.mjs}

@@ -1,23 +1,19 @@
-import { __decorate } from 'tslib';
-import { RoundedRect, RectExtensions, Point, PointExtensions, LineExtensions, SizeExtensions, GetIntersections, Line, TransformModelExtensions } from '@foblex/2d';
 import * as i0 from '@angular/core';
-import { Injectable, InjectionToken, Directive, Input, HostBinding, EventEmitter, Output, Inject, Component, ChangeDetectionStrategy, ViewChild, Optional, ContentChildren, NgZone, ContentChild, NgModule } from '@angular/core';
+import { InjectionToken, Injectable, Directive, Input, HostBinding, EventEmitter, Output, Inject, Component, ChangeDetectionStrategy, ViewChild, Optional, ContentChildren, NgZone, ContentChild, NgModule } from '@angular/core';
+import { RoundedRect, RectExtensions, TransformModelExtensions, PointExtensions, Point, SizeExtensions, LineExtensions, GetIntersections, Line } from '@foblex/2d';
+import { Subject, Observable, Subscription, merge } from 'rxjs';
+import { debounceTime, startWith } from 'rxjs/operators';
+import { __decorate } from 'tslib';
 import * as i2 from '@foblex/mediator';
 import { FExecutionRegister, FValidatorRegister, FMediator } from '@foblex/mediator';
 import { normalizeDomElementId, castToEnum, castToBoolean, flatMap, isClosestElementHasClass, getDataAttrValueFromClosestElementWithClass, deepCloneNode } from '@foblex/utils';
 import * as i1 from '@foblex/platform';
 import { EOperationSystem } from '@foblex/platform';
-import { Subject, Observable, Subscription, merge } from 'rxjs';
-import { debounceTime, startWith } from 'rxjs/operators';
-import * as i8 from '@angular/common';
+import * as i3 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { DragAndDropBase, EventExtensions } from '@foblex/drag-toolkit';
 
-class AddPatternToBackgroundRequest {
-    constructor(fPattern) {
-        this.fPattern = fPattern;
-    }
-}
+const F_BACKGROUND_PATTERN = new InjectionToken('F_BACKGROUND_PATTERN');
 
 class CreateConnectionMarkersRequest {
     constructor(fConnection) {
@@ -68,9 +64,9 @@ class FComponentsStore {
         this.componentsDataChanges.next();
     }
 }
-FComponentsStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FComponentsStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-FComponentsStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FComponentsStore });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FComponentsStore, decorators: [{
+FComponentsStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FComponentsStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+FComponentsStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FComponentsStore });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FComponentsStore, decorators: [{
             type: Injectable
         }] });
 
@@ -79,9 +75,9 @@ class FTransformStore {
         this.changes = new Subject();
     }
 }
-FTransformStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FTransformStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-FTransformStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FTransformStore });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FTransformStore, decorators: [{
+FTransformStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FTransformStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+FTransformStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FTransformStore });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FTransformStore, decorators: [{
             type: Injectable
         }] });
 
@@ -125,12 +121,12 @@ let CreateConnectionMarkersExecution = class CreateConnectionMarkersExecution {
         return markerElement;
     }
 };
-CreateConnectionMarkersExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionMarkersExecution, deps: [{ token: i1.BrowserService }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateConnectionMarkersExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionMarkersExecution });
+CreateConnectionMarkersExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionMarkersExecution, deps: [{ token: i1.BrowserService }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateConnectionMarkersExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionMarkersExecution });
 CreateConnectionMarkersExecution = __decorate([
     FExecutionRegister(CreateConnectionMarkersRequest)
 ], CreateConnectionMarkersExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionMarkersExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionMarkersExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.BrowserService }, { type: FComponentsStore }]; } });
 function createSVGElement$1(tag, fBrowser) {
@@ -165,12 +161,12 @@ let CreateRoundedRectFromElementExecution = class CreateRoundedRectFromElementEx
         return this.fBrowser.toPixels(value, element.clientWidth, element.clientHeight, fontSize) || 0;
     }
 };
-CreateRoundedRectFromElementExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateRoundedRectFromElementExecution, deps: [{ token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateRoundedRectFromElementExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateRoundedRectFromElementExecution });
+CreateRoundedRectFromElementExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateRoundedRectFromElementExecution, deps: [{ token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateRoundedRectFromElementExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateRoundedRectFromElementExecution });
 CreateRoundedRectFromElementExecution = __decorate([
     FExecutionRegister(CreateRoundedRectFromElementRequest)
 ], CreateRoundedRectFromElementExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateRoundedRectFromElementExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateRoundedRectFromElementExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.BrowserService }]; } });
 
@@ -185,183 +181,341 @@ let EmitTransformChangesExecution = class EmitTransformChangesExecution {
         this.fTransformStore.changes.next();
     }
 };
-EmitTransformChangesExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: EmitTransformChangesExecution, deps: [{ token: FTransformStore }], target: i0.ɵɵFactoryTarget.Injectable });
-EmitTransformChangesExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: EmitTransformChangesExecution });
+EmitTransformChangesExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EmitTransformChangesExecution, deps: [{ token: FTransformStore }], target: i0.ɵɵFactoryTarget.Injectable });
+EmitTransformChangesExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EmitTransformChangesExecution });
 EmitTransformChangesExecution = __decorate([
     FExecutionRegister(EmitTransformChangesRequest)
 ], EmitTransformChangesExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: EmitTransformChangesExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EmitTransformChangesExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FTransformStore }]; } });
 
-class ClearSelectionRequest {
-}
-
-class CanvasMoveFinalizeRequest {
-    constructor(event) {
-        this.event = event;
+class AddPatternToBackgroundRequest {
+    constructor(fPattern) {
+        this.fPattern = fPattern;
     }
 }
 
-class FDraggableDataContext {
-    constructor() {
-        this.selectedItems = [];
-        this.isSelectedChanged = false;
-        this.onPointerDownScale = 1;
-        this.onPointerDownPosition = new Point(0, 0);
-        this.draggableItems = [];
-    }
-    reset() {
-        this.draggableItems = [];
-        this.onPointerDownScale = 1;
-        this.onPointerDownPosition = new Point(0, 0);
-    }
-    markSelectionAsChanged() {
-        this.isSelectedChanged = true;
+let uniqueId$c = 0;
+let AddPatternToBackgroundExecution = class AddPatternToBackgroundExecution {
+    constructor(fComponentsStore, fBrowser) {
+        this.fComponentsStore = fComponentsStore;
+        this.fBrowser = fBrowser;
     }
-}
-FDraggableDataContext.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FDraggableDataContext, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-FDraggableDataContext.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FDraggableDataContext });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FDraggableDataContext, decorators: [{
-            type: Injectable
-        }] });
-
-let CanvasMoveFinalizeExecution = class CanvasMoveFinalizeExecution {
-    constructor(fDraggableDataContext) {
-        this.fDraggableDataContext = fDraggableDataContext;
+    get fBackground() {
+        return this.fComponentsStore.fBackground;
     }
     handle(request) {
-        this.fDraggableDataContext.draggableItems.forEach((x) => { var _a; return (_a = x.complete) === null || _a === void 0 ? void 0 : _a.call(x); });
+        var _a, _b, _c, _d, _e, _f, _g;
+        const children = ((_a = request.fPattern) === null || _a === void 0 ? void 0 : _a.hostElement.getElementsByTagName('pattern')) || [];
+        const pattern = children.length ? children[0] : undefined;
+        if (pattern) {
+            const defs = createSVGElement('defs', this.fBrowser);
+            pattern.id = 'f-background-pattern-' + uniqueId$c++;
+            (_b = request.fPattern) === null || _b === void 0 ? void 0 : _b.hostElement.remove();
+            defs.appendChild(pattern);
+            (_d = (_c = this.fBackground.hostElement) === null || _c === void 0 ? void 0 : _c.firstChild) === null || _d === void 0 ? void 0 : _d.appendChild(defs);
+            const rect = createSVGElement('rect', this.fBrowser);
+            rect.setAttribute('fill', 'url(#' + pattern.id + ')');
+            rect.setAttribute('width', '100%');
+            rect.setAttribute('height', '100%');
+            (_e = this.fBackground.hostElement.firstChild) === null || _e === void 0 ? void 0 : _e.appendChild(rect);
+            const transform = ((_f = this.fComponentsStore.fCanvas) === null || _f === void 0 ? void 0 : _f.transform) || TransformModelExtensions.default();
+            (_g = request.fPattern) === null || _g === void 0 ? void 0 : _g.setTransform(transform);
+        }
     }
 };
-CanvasMoveFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMoveFinalizeExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-CanvasMoveFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMoveFinalizeExecution });
-CanvasMoveFinalizeExecution = __decorate([
-    FExecutionRegister(CanvasMoveFinalizeRequest)
-], CanvasMoveFinalizeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMoveFinalizeExecution, decorators: [{
+AddPatternToBackgroundExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AddPatternToBackgroundExecution, deps: [{ token: FComponentsStore }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
+AddPatternToBackgroundExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AddPatternToBackgroundExecution });
+AddPatternToBackgroundExecution = __decorate([
+    FExecutionRegister(AddPatternToBackgroundRequest)
+], AddPatternToBackgroundExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AddPatternToBackgroundExecution, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
+        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i1.BrowserService }]; } });
 
-class CanvasDragHandler {
+const F_BACKGROUND_FEATURES = [
+    AddPatternToBackgroundExecution
+];
+
+class CenterGroupOrNodeRequest {
+    constructor(id, animated) {
+        this.id = id;
+        this.animated = animated;
+    }
+}
+
+let CenterGroupOrNodeExecution = class CenterGroupOrNodeExecution {
     constructor(fComponentsStore) {
         this.fComponentsStore = fComponentsStore;
-        this.onPointerDownPosition = PointExtensions.initialize();
-    }
-    initialize() {
-        this.onPointerDownPosition = this.fComponentsStore.fCanvas.transform.position;
     }
-    move(difference) {
-        this.fComponentsStore.fCanvas.setPosition(Point.fromPoint(this.onPointerDownPosition).add(difference));
-        this.fComponentsStore.fCanvas.redraw();
+    get transform() {
+        return this.fComponentsStore.fCanvas.transform;
     }
-    complete() {
+    handle(request) {
+        const fNode = this.getNode(request.id);
+        if (!fNode) {
+            return;
+        }
+        this.toCenter(this.getNodeRect(fNode), this.getFlowRect(), fNode.position);
+        request.animated ? this.fComponentsStore.fCanvas.redrawWithAnimation() : this.fComponentsStore.fCanvas.redraw();
         this.fComponentsStore.fCanvas.emitCanvasChangeEvent();
+        setTimeout(() => this.fComponentsStore.componentDataChanged(), F_CANVAS_ANIMATION_DURATION);
     }
-}
-
-let CanvasMoveFinalizeValidator = class CanvasMoveFinalizeValidator {
-    constructor(fDraggableDataContext) {
-        this.fDraggableDataContext = fDraggableDataContext;
+    toCenter(fNodeRect, fFlowRect, position) {
+        this.transform.scaledPosition = PointExtensions.initialize();
+        this.transform.position = PointExtensions.initialize((fFlowRect.width - fNodeRect.width) / 2 - position.x * this.transform.scale, (fFlowRect.height - fNodeRect.height) / 2 - position.y * this.transform.scale);
     }
-    handle(request) {
-        return this.fDraggableDataContext.draggableItems.some((x) => x instanceof CanvasDragHandler);
+    getNode(id) {
+        return this.fComponentsStore.fNodes.find((x) => x.fId === id);
+    }
+    getNodeRect(fNode) {
+        return RectExtensions.fromElement(fNode.hostElement);
+    }
+    getFlowRect() {
+        return RectExtensions.fromElement(this.fComponentsStore.fFlow.hostElement);
     }
 };
-CanvasMoveFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMoveFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-CanvasMoveFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMoveFinalizeValidator });
-CanvasMoveFinalizeValidator = __decorate([
-    FValidatorRegister(CanvasMoveFinalizeRequest)
-], CanvasMoveFinalizeValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMoveFinalizeValidator, decorators: [{
+CenterGroupOrNodeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CenterGroupOrNodeExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+CenterGroupOrNodeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CenterGroupOrNodeExecution });
+CenterGroupOrNodeExecution = __decorate([
+    FExecutionRegister(CenterGroupOrNodeRequest)
+], CenterGroupOrNodeExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CenterGroupOrNodeExecution, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
-
-const CANVAS_MOVE_FINALIZE_PROVIDERS = [
-    CanvasMoveFinalizeExecution,
-    CanvasMoveFinalizeValidator,
-];
+        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
-class CanvasMovePreparationRequest {
-    constructor(event) {
-        this.event = event;
+class FitToFlowRequest {
+    constructor(toCenter, animated) {
+        this.toCenter = toCenter;
+        this.animated = animated;
     }
 }
 
-let CanvasMovePreparationExecution = class CanvasMovePreparationExecution {
-    constructor(fComponentsStore, fDraggableDataContext) {
+let FitToFlowExecution = class FitToFlowExecution {
+    constructor(fComponentsStore, fMediator) {
         this.fComponentsStore = fComponentsStore;
-        this.fDraggableDataContext = fDraggableDataContext;
+        this.fMediator = fMediator;
     }
-    get flowHost() {
-        return this.fComponentsStore.fFlow.hostElement;
+    get transform() {
+        return this.fComponentsStore.fCanvas.transform;
     }
     handle(request) {
-        this.fDraggableDataContext.onPointerDownScale = 1;
-        this.fDraggableDataContext.onPointerDownPosition = Point.fromPoint(request.event.getPosition())
-            .elementTransform(this.flowHost);
-        this.fDraggableDataContext.draggableItems = [
-            new CanvasDragHandler(this.fComponentsStore)
-        ];
+        const fNodesRect = this.fMediator.send(new GetNodesRectRequest()) || RectExtensions.initialize();
+        if (fNodesRect.width === 0 || fNodesRect.height === 0) {
+            return;
+        }
+        this.fitToParent(fNodesRect, RectExtensions.fromElement(this.fComponentsStore.fFlow.hostElement), this.fComponentsStore.fNodes.map((x) => x.position), request.toCenter);
+        request.animated ? this.fComponentsStore.fCanvas.redrawWithAnimation() : this.fComponentsStore.fCanvas.redraw();
+        this.fComponentsStore.fCanvas.emitCanvasChangeEvent();
+        setTimeout(() => this.fComponentsStore.componentDataChanged(), F_CANVAS_ANIMATION_DURATION);
+    }
+    fitToParent(rect, parentRect, points, toCenter) {
+        this.transform.scaledPosition = PointExtensions.initialize();
+        this.transform.position = this.getZeroPositionWithoutScale(points);
+        const itemsContainerWidth = (rect.width / this.transform.scale) + toCenter.x;
+        const itemsContainerHeight = (rect.height / this.transform.scale) + toCenter.y;
+        if ((itemsContainerWidth > parentRect.width || itemsContainerHeight > parentRect.height) ||
+            itemsContainerWidth < parentRect.width && itemsContainerHeight < parentRect.height) {
+            this.transform.scale = Math.min(parentRect.width / itemsContainerWidth, parentRect.height / itemsContainerHeight);
+        }
+        const newX = (parentRect.width - itemsContainerWidth * this.transform.scale) / 2 - this.transform.position.x * this.transform.scale;
+        const newY = (parentRect.height - itemsContainerHeight * this.transform.scale) / 2 - this.transform.position.y * this.transform.scale;
+        this.transform.position = PointExtensions.initialize(newX + (toCenter.x / 2) * this.transform.scale, newY + (toCenter.y / 2) * this.transform.scale);
+    }
+    getZeroPositionWithoutScale(points) {
+        const xPoint = points.length ? Math.min(...points.map((point) => point.x)) : 0;
+        const yPoint = points.length ? Math.min(...points.map((point) => point.y)) : 0;
+        return PointExtensions.initialize(xPoint, yPoint);
     }
 };
-CanvasMovePreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMovePreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-CanvasMovePreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMovePreparationExecution });
-CanvasMovePreparationExecution = __decorate([
-    FExecutionRegister(CanvasMovePreparationRequest)
-], CanvasMovePreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMovePreparationExecution, decorators: [{
+FitToFlowExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FitToFlowExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+FitToFlowExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FitToFlowExecution });
+FitToFlowExecution = __decorate([
+    FExecutionRegister(FitToFlowRequest)
+], FitToFlowExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FitToFlowExecution, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
+        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
-let CanvasMovePreparationValidator = class CanvasMovePreparationValidator {
-    constructor(fComponentsStore, fDraggableDataContext) {
-        this.fComponentsStore = fComponentsStore;
-        this.fDraggableDataContext = fDraggableDataContext;
+class InputCanvasPositionRequest {
+    constructor(transform, position) {
+        this.transform = transform;
+        this.position = position;
     }
-    get flowHost() {
-        return this.fComponentsStore.fFlow.hostElement;
+}
+
+let InputCanvasPositionExecution = class InputCanvasPositionExecution {
+    constructor(fComponentsStore) {
+        this.fComponentsStore = fComponentsStore;
     }
     handle(request) {
-        return !this.fDraggableDataContext.draggableItems.length &&
-            (this.isBackgroundElement(request.event.targetElement) || this.isDragOnHost(request.event.targetElement));
-    }
-    isBackgroundElement(targetElement) {
         var _a;
-        return (_a = this.fComponentsStore.fBackground) === null || _a === void 0 ? void 0 : _a.isBackgroundElement(targetElement);
-    }
-    isDragOnHost(targetElement) {
-        return this.flowHost.contains(targetElement) && !this.getNode(targetElement);
-    }
-    getNode(targetElement) {
-        let result = this.fComponentsStore.findNode(targetElement);
-        if (result && result.fDraggingDisabled) {
-            result = undefined;
+        if (!request.position) {
+            return;
+        }
+        const position = PointExtensions.sum(request.transform.position, request.transform.scaledPosition);
+        if (!PointExtensions.isEqual(position, request.position)) {
+            request.transform.position = request.position;
+            request.transform.scaledPosition = PointExtensions.initialize();
+            (_a = this.fComponentsStore.fCanvas) === null || _a === void 0 ? void 0 : _a.redraw();
         }
-        return result;
     }
 };
-CanvasMovePreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMovePreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-CanvasMovePreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMovePreparationValidator });
-CanvasMovePreparationValidator = __decorate([
-    FValidatorRegister(CanvasMovePreparationRequest)
-], CanvasMovePreparationValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CanvasMovePreparationValidator, decorators: [{
+InputCanvasPositionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputCanvasPositionExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+InputCanvasPositionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputCanvasPositionExecution });
+InputCanvasPositionExecution = __decorate([
+    FExecutionRegister(InputCanvasPositionRequest)
+], InputCanvasPositionExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputCanvasPositionExecution, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
-
-const CANVAS_MOVE_PREPARATION_PROVIDERS = [
-    CanvasMovePreparationExecution,
-    CanvasMovePreparationValidator,
-];
+        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
-const CANVAS_PROVIDERS = [
-    ...CANVAS_MOVE_FINALIZE_PROVIDERS,
-    ...CANVAS_MOVE_PREPARATION_PROVIDERS,
-];
+class InputCanvasScaleRequest {
+    constructor(transform, scale) {
+        this.transform = transform;
+        this.scale = scale;
+    }
+}
 
-class FindClosestInputUsingSnapThresholdRequest {
-    constructor(position, canBeConnectedInputs, snapThreshold) {
+let InputCanvasScaleExecution = class InputCanvasScaleExecution {
+    constructor(fComponentsStore) {
+        this.fComponentsStore = fComponentsStore;
+    }
+    handle(request) {
+        var _a;
+        if (!request.scale) {
+            return;
+        }
+        request.transform.scale = request.scale;
+        (_a = this.fComponentsStore.fCanvas) === null || _a === void 0 ? void 0 : _a.redraw();
+    }
+};
+InputCanvasScaleExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputCanvasScaleExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+InputCanvasScaleExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputCanvasScaleExecution });
+InputCanvasScaleExecution = __decorate([
+    FExecutionRegister(InputCanvasScaleRequest)
+], InputCanvasScaleExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: InputCanvasScaleExecution, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
+
+class ResetScaleRequest {
+}
+
+let ResetScaleExecution = class ResetScaleExecution {
+    constructor(fComponentsStore) {
+        this.fComponentsStore = fComponentsStore;
+    }
+    get transform() {
+        return this.fComponentsStore.fCanvas.transform;
+    }
+    handle(request) {
+        this.transform.scale = 1;
+        this.transform.scaledPosition = PointExtensions.initialize();
+    }
+};
+ResetScaleExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ResetScaleExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+ResetScaleExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ResetScaleExecution });
+ResetScaleExecution = __decorate([
+    FExecutionRegister(ResetScaleRequest)
+], ResetScaleExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ResetScaleExecution, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
+
+class ResetScaleAndCenterRequest {
+    constructor(animated) {
+        this.animated = animated;
+    }
+}
+
+let ResetScaleAndCenterExecution = class ResetScaleAndCenterExecution {
+    constructor(fComponentsStore, fMediator) {
+        this.fComponentsStore = fComponentsStore;
+        this.fMediator = fMediator;
+    }
+    get transform() {
+        return this.fComponentsStore.fCanvas.transform;
+    }
+    handle(request) {
+        const fNodesRect = this.fMediator.send(new GetNodesRectRequest()) || RectExtensions.initialize();
+        if (fNodesRect.width === 0 || fNodesRect.height === 0) {
+            return;
+        }
+        this.oneToOneCentering(fNodesRect, RectExtensions.fromElement(this.fComponentsStore.fFlow.hostElement), this.fComponentsStore.fNodes.map((x) => x.position));
+        request.animated ? this.fComponentsStore.fCanvas.redrawWithAnimation() : this.fComponentsStore.fCanvas.redraw();
+        this.fComponentsStore.fCanvas.emitCanvasChangeEvent();
+        setTimeout(() => this.fComponentsStore.componentDataChanged(), F_CANVAS_ANIMATION_DURATION);
+    }
+    oneToOneCentering(rect, parentRect, points) {
+        this.transform.scaledPosition = PointExtensions.initialize();
+        this.transform.position = this.getZeroPositionWithoutScale(points);
+        const newX = (parentRect.width - rect.width / this.transform.scale) / 2 - this.transform.position.x;
+        const newY = (parentRect.height - rect.height / this.transform.scale) / 2 - this.transform.position.y;
+        this.transform.scale = 1;
+        this.transform.position = PointExtensions.initialize(newX, newY);
+    }
+    getZeroPositionWithoutScale(points) {
+        const xPoint = points.length ? Math.min(...points.map((point) => point.x)) : 0;
+        const yPoint = points.length ? Math.min(...points.map((point) => point.y)) : 0;
+        return PointExtensions.initialize(xPoint, yPoint);
+    }
+};
+ResetScaleAndCenterExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ResetScaleAndCenterExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+ResetScaleAndCenterExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ResetScaleAndCenterExecution });
+ResetScaleAndCenterExecution = __decorate([
+    FExecutionRegister(ResetScaleAndCenterRequest)
+], ResetScaleAndCenterExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ResetScaleAndCenterExecution, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
+
+class UpdateScaleRequest {
+    constructor(scale, toPosition) {
+        this.scale = scale;
+        this.toPosition = toPosition;
+    }
+}
+
+let UpdateScaleExecution = class UpdateScaleExecution {
+    constructor(fComponentsStore) {
+        this.fComponentsStore = fComponentsStore;
+    }
+    get transform() {
+        return this.fComponentsStore.fCanvas.transform;
+    }
+    handle(request) {
+        if (request.scale !== this.transform.scale) {
+            const summaryPosition = PointExtensions.sum(this.transform.scaledPosition, this.transform.position);
+            const newX = request.toPosition.x - (request.toPosition.x - summaryPosition.x) * request.scale / this.transform.scale;
+            const newY = request.toPosition.y - (request.toPosition.y - summaryPosition.y) * request.scale / this.transform.scale;
+            this.transform.scale = request.scale;
+            this.transform.scaledPosition = PointExtensions.sub(PointExtensions.initialize(newX, newY), this.transform.position);
+        }
+    }
+};
+UpdateScaleExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: UpdateScaleExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+UpdateScaleExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: UpdateScaleExecution });
+UpdateScaleExecution = __decorate([
+    FExecutionRegister(UpdateScaleRequest)
+], UpdateScaleExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: UpdateScaleExecution, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
+
+const F_CANVAS_FEATURES = [
+    CenterGroupOrNodeExecution,
+    FitToFlowExecution,
+    InputCanvasPositionExecution,
+    InputCanvasScaleExecution,
+    ResetScaleExecution,
+    ResetScaleAndCenterExecution,
+    UpdateScaleExecution
+];
+
+class FindClosestInputUsingSnapThresholdRequest {
+    constructor(position, canBeConnectedInputs, snapThreshold) {
         this.position = position;
         this.canBeConnectedInputs = canBeConnectedInputs;
         this.snapThreshold = snapThreshold;
@@ -392,12 +546,12 @@ let FindClosestInputUsingSnapThresholdExecution = class FindClosestInputUsingSna
         return Math.max(min, Math.min(max, value));
     }
 };
-FindClosestInputUsingSnapThresholdExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FindClosestInputUsingSnapThresholdExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-FindClosestInputUsingSnapThresholdExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FindClosestInputUsingSnapThresholdExecution });
+FindClosestInputUsingSnapThresholdExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FindClosestInputUsingSnapThresholdExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+FindClosestInputUsingSnapThresholdExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FindClosestInputUsingSnapThresholdExecution });
 FindClosestInputUsingSnapThresholdExecution = __decorate([
     FExecutionRegister(FindClosestInputUsingSnapThresholdRequest)
 ], FindClosestInputUsingSnapThresholdExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FindClosestInputUsingSnapThresholdExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FindClosestInputUsingSnapThresholdExecution, decorators: [{
             type: Injectable
         }] });
 
@@ -413,6 +567,45 @@ class GetConnectorWithRectRequest {
     }
 }
 
+class GetElementRectInFlowRequest {
+    constructor(element) {
+        this.element = element;
+    }
+}
+
+let GetElementRectInFlowExecution = class GetElementRectInFlowExecution {
+    constructor(fComponentsStore, fMediator) {
+        this.fComponentsStore = fComponentsStore;
+        this.fMediator = fMediator;
+    }
+    get transform() {
+        return this.fComponentsStore.transform;
+    }
+    get flowHost() {
+        return this.fComponentsStore.flowHost;
+    }
+    handle(request) {
+        const systemRect = this.fMediator.send(new CreateRoundedRectFromElementRequest(request.element));
+        const position = this.transformElementPositionInFlow(systemRect);
+        const size = this.transformElementSizeInFlow(systemRect);
+        return new RoundedRect(position.x, position.y, size.width, size.height, systemRect.radius1, systemRect.radius2, systemRect.radius3, systemRect.radius4);
+    }
+    transformElementPositionInFlow(rect) {
+        return Point.fromPoint(rect).elementTransform(this.flowHost).sub(this.transform.scaledPosition).sub(this.transform.position).div(this.transform.scale);
+    }
+    transformElementSizeInFlow(rect) {
+        return SizeExtensions.initialize(rect.width / this.transform.scale, rect.height / this.transform.scale);
+    }
+};
+GetElementRectInFlowExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetElementRectInFlowExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+GetElementRectInFlowExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetElementRectInFlowExecution });
+GetElementRectInFlowExecution = __decorate([
+    FExecutionRegister(GetElementRectInFlowRequest)
+], GetElementRectInFlowExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetElementRectInFlowExecution, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
+
 let GetConnectorWithRectExecution = class GetConnectorWithRectExecution {
     constructor(fMediator) {
         this.fMediator = fMediator;
@@ -424,12 +617,12 @@ let GetConnectorWithRectExecution = class GetConnectorWithRectExecution {
         };
     }
 };
-GetConnectorWithRectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetConnectorWithRectExecution, deps: [{ token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-GetConnectorWithRectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetConnectorWithRectExecution });
+GetConnectorWithRectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetConnectorWithRectExecution, deps: [{ token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+GetConnectorWithRectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetConnectorWithRectExecution });
 GetConnectorWithRectExecution = __decorate([
     FExecutionRegister(GetConnectorWithRectRequest)
 ], GetConnectorWithRectExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetConnectorWithRectExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetConnectorWithRectExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i2.FMediator }]; } });
 
@@ -470,162 +663,185 @@ let GetAllCanBeConnectedInputPositionsExecution = class GetAllCanBeConnectedInpu
         return this.fNodes.find((x) => x.isContains(connector.hostElement));
     }
 };
-GetAllCanBeConnectedInputPositionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetAllCanBeConnectedInputPositionsExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-GetAllCanBeConnectedInputPositionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetAllCanBeConnectedInputPositionsExecution });
+GetAllCanBeConnectedInputPositionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetAllCanBeConnectedInputPositionsExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+GetAllCanBeConnectedInputPositionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetAllCanBeConnectedInputPositionsExecution });
 GetAllCanBeConnectedInputPositionsExecution = __decorate([
     FExecutionRegister(GetAllCanBeConnectedInputPositionsRequest)
 ], GetAllCanBeConnectedInputPositionsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetAllCanBeConnectedInputPositionsExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetAllCanBeConnectedInputPositionsExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
-class GetInputUnderPointerRequest {
-    constructor(event, dragHandler) {
+const F_CONNECTION_FEATURES = [
+    FindClosestInputUsingSnapThresholdExecution,
+    GetAllCanBeConnectedInputPositionsExecution,
+    GetConnectorWithRectExecution,
+];
+
+class ClearSelectionRequest {
+}
+
+class CanvasMoveFinalizeRequest {
+    constructor(event) {
         this.event = event;
-        this.dragHandler = dragHandler;
     }
 }
 
-let GetInputUnderPointerExecution = class GetInputUnderPointerExecution {
-    constructor(fComponentsStore, fDraggableDataContext, fBrowser) {
-        this.fComponentsStore = fComponentsStore;
-        this.fDraggableDataContext = fDraggableDataContext;
-        this.fBrowser = fBrowser;
-    }
-    get fNodes() {
-        return this.fComponentsStore.fNodes;
+class FDraggableDataContext {
+    constructor() {
+        this.selectedItems = [];
+        this.isSelectedChanged = false;
+        this.onPointerDownScale = 1;
+        this.onPointerDownPosition = new Point(0, 0);
+        this.draggableItems = [];
     }
-    get fInputs() {
-        return this.fComponentsStore.fInputs;
+    reset() {
+        this.draggableItems = [];
+        this.onPointerDownScale = 1;
+        this.onPointerDownPosition = new Point(0, 0);
     }
-    handle(payload) {
-        const output = (this.getOutput(payload.dragHandler) || this.getOutlet(payload.dragHandler));
-        const inputsUnderPointer = this.getInputsUnderPointer(payload.event.getPosition(), payload.dragHandler);
-        const connectors = output.isSelfConnectable ?
-            inputsUnderPointer :
-            this.filterSelfConnectable(inputsUnderPointer, output);
-        return connectors.length > 0 ? connectors[0] : undefined;
+    markSelectionAsChanged() {
+        this.isSelectedChanged = true;
     }
-    getOutput(dragHandler) {
-        return this.fComponentsStore.fOutputs.find((x) => x.id === dragHandler.fConnection.fOutputId);
+}
+FDraggableDataContext.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FDraggableDataContext, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+FDraggableDataContext.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FDraggableDataContext });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FDraggableDataContext, decorators: [{
+            type: Injectable
+        }] });
+
+let CanvasMoveFinalizeExecution = class CanvasMoveFinalizeExecution {
+    constructor(fDraggableDataContext) {
+        this.fDraggableDataContext = fDraggableDataContext;
     }
-    getOutlet(dragHandler) {
-        return this.fComponentsStore.fOutlets.find((x) => x.id === dragHandler.fConnection.fOutputId);
+    handle(request) {
+        this.fDraggableDataContext.draggableItems.forEach((x) => { var _a; return (_a = x.complete) === null || _a === void 0 ? void 0 : _a.call(x); });
     }
-    getInputsUnderPointer(position, dragHandler) {
-        const result = this.getInputsInPosition(position);
-        const closestInput = dragHandler.getClosetInput(this.getDifference(position));
-        if (closestInput) {
-            result.push(closestInput.fConnector);
-        }
-        const input = this.getFirstConnectableInputOfNodeInPosition(position);
-        if (input) {
-            result.push(input);
-        }
-        return result;
+};
+CanvasMoveFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMoveFinalizeExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+CanvasMoveFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMoveFinalizeExecution });
+CanvasMoveFinalizeExecution = __decorate([
+    FExecutionRegister(CanvasMoveFinalizeRequest)
+], CanvasMoveFinalizeExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMoveFinalizeExecution, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
+
+class CanvasDragHandler {
+    constructor(fComponentsStore) {
+        this.fComponentsStore = fComponentsStore;
+        this.onPointerDownPosition = PointExtensions.initialize();
     }
-    getDifference(position) {
-        return Point.fromPoint(position).elementTransform(this.fComponentsStore.flowHost)
-            .div(this.fDraggableDataContext.onPointerDownScale).sub(this.fDraggableDataContext.onPointerDownPosition);
+    initialize() {
+        this.onPointerDownPosition = this.fComponentsStore.fCanvas.transform.position;
     }
-    getInputsInPosition(position) {
-        return this.getElementsFromPoint(position).map((element) => this.fInputs.find(x => x.isContains(element) && x.canBeConnected)).filter((x) => !!x);
+    move(difference) {
+        this.fComponentsStore.fCanvas.setPosition(Point.fromPoint(this.onPointerDownPosition).add(difference));
+        this.fComponentsStore.fCanvas.redraw();
     }
-    getElementsFromPoint(position) {
-        return this.fBrowser.document.elementsFromPoint(position.x, position.y);
+    complete() {
+        this.fComponentsStore.fCanvas.emitCanvasChangeEvent();
     }
-    getFirstConnectableInputOfNodeInPosition(position) {
-        return this.getNodesInPosition(position).map((x) => {
-            return this.fInputs.find((i) => x.isContains(i.hostElement) && i.canBeConnected);
-        }).find((x) => !!x);
-    }
-    getNodesInPosition(position) {
-        return this.getElementsFromPoint(position).map((element) => {
-            return this.fNodes.find((x) => x.isContains(element) && x.fConnectOnNode);
-        }).filter((x) => !!x);
+}
+
+let CanvasMoveFinalizeValidator = class CanvasMoveFinalizeValidator {
+    constructor(fDraggableDataContext) {
+        this.fDraggableDataContext = fDraggableDataContext;
     }
-    filterSelfConnectable(inputs, connector) {
-        return inputs.filter((x) => {
-            const targetNode = this.fNodes.find((k) => k.isContains(x.hostElement));
-            const sourceNode = this.fNodes.find((k) => k.isContains(connector.hostElement));
-            return (sourceNode === null || sourceNode === void 0 ? void 0 : sourceNode.hostElement) !== (targetNode === null || targetNode === void 0 ? void 0 : targetNode.hostElement);
-        });
+    handle(request) {
+        return this.fDraggableDataContext.draggableItems.some((x) => x instanceof CanvasDragHandler);
     }
 };
-GetInputUnderPointerExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetInputUnderPointerExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
-GetInputUnderPointerExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetInputUnderPointerExecution });
-GetInputUnderPointerExecution = __decorate([
-    FExecutionRegister(GetInputUnderPointerRequest)
-], GetInputUnderPointerExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetInputUnderPointerExecution, decorators: [{
+CanvasMoveFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMoveFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+CanvasMoveFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMoveFinalizeValidator });
+CanvasMoveFinalizeValidator = __decorate([
+    FValidatorRegister(CanvasMoveFinalizeRequest)
+], CanvasMoveFinalizeValidator);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMoveFinalizeValidator, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i1.BrowserService }]; } });
-
-function createErrorClass(impl) {
-    const _super = (instance) => {
-        Error.call(instance);
-    };
-    const constructor = impl(_super);
-    constructor.prototype = Object.create(Error.prototype);
-    constructor.prototype.constructor = constructor;
-    return constructor;
-}
-
-const NotFoundError = createErrorClass((_super) => function error(message) {
-    _super(this);
-    this.message = message || 'The requested resource was not found.';
-    this.code = 404;
-});
+        }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
-const ConflictError = createErrorClass((_super) => function error(message) {
-    _super(this);
-    this.message = message || 'Conflict error occurred.';
-    this.code = 409;
-});
+const CANVAS_MOVE_FINALIZE_PROVIDERS = [
+    CanvasMoveFinalizeExecution,
+    CanvasMoveFinalizeValidator,
+];
 
-function OutputNotFound(id) {
-    return new NotFoundError(`Output with fOutputId ${id} not found. Make sure there is no f-connection to a non-existent fOutput.`);
-}
-function InputNotFound(id) {
-    return new NotFoundError(`Input with fInputId ${id} not found. Make sure there is no f-connection to a non-existent fInput.`);
-}
-function RequiredOutput() {
-    return new ConflictError(`The fNode must contain at least one fOutput if there is an fOutlet`);
+class CanvasMovePreparationRequest {
+    constructor(event) {
+        this.event = event;
+    }
 }
 
-let GetInputUnderPointerValidator = class GetInputUnderPointerValidator {
-    constructor(fComponentsStore) {
+let CanvasMovePreparationExecution = class CanvasMovePreparationExecution {
+    constructor(fComponentsStore, fDraggableDataContext) {
         this.fComponentsStore = fComponentsStore;
+        this.fDraggableDataContext = fDraggableDataContext;
+    }
+    get flowHost() {
+        return this.fComponentsStore.fFlow.hostElement;
     }
     handle(request) {
-        let output = this.getOutput(request.dragHandler) || this.getOutlet(request.dragHandler);
-        if (!output) {
-            throw OutputNotFound(request.dragHandler.fConnection.fOutputId);
-        }
-        return true;
+        this.fDraggableDataContext.onPointerDownScale = 1;
+        this.fDraggableDataContext.onPointerDownPosition = Point.fromPoint(request.event.getPosition())
+            .elementTransform(this.flowHost);
+        this.fDraggableDataContext.draggableItems = [
+            new CanvasDragHandler(this.fComponentsStore)
+        ];
     }
-    getOutput(dragHandler) {
-        return this.fComponentsStore.fOutputs.find((x) => x.id === dragHandler.fConnection.fOutputId);
+};
+CanvasMovePreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMovePreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+CanvasMovePreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMovePreparationExecution });
+CanvasMovePreparationExecution = __decorate([
+    FExecutionRegister(CanvasMovePreparationRequest)
+], CanvasMovePreparationExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMovePreparationExecution, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
+
+let CanvasMovePreparationValidator = class CanvasMovePreparationValidator {
+    constructor(fComponentsStore, fDraggableDataContext) {
+        this.fComponentsStore = fComponentsStore;
+        this.fDraggableDataContext = fDraggableDataContext;
     }
-    getOutlet(dragHandler) {
-        return this.fComponentsStore.fOutlets.find((x) => x.id === dragHandler.fConnection.fOutputId);
+    get flowHost() {
+        return this.fComponentsStore.fFlow.hostElement;
+    }
+    handle(request) {
+        return !this.fDraggableDataContext.draggableItems.length &&
+            (this.isBackgroundElement(request.event.targetElement) || this.isDragOnHost(request.event.targetElement));
+    }
+    isBackgroundElement(targetElement) {
+        var _a;
+        return (_a = this.fComponentsStore.fBackground) === null || _a === void 0 ? void 0 : _a.isBackgroundElement(targetElement);
+    }
+    isDragOnHost(targetElement) {
+        return this.flowHost.contains(targetElement) && !this.getNode(targetElement);
+    }
+    getNode(targetElement) {
+        let result = this.fComponentsStore.findNode(targetElement);
+        if (result && result.fDraggingDisabled) {
+            result = undefined;
+        }
+        return result;
     }
 };
-GetInputUnderPointerValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetInputUnderPointerValidator, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetInputUnderPointerValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetInputUnderPointerValidator });
-GetInputUnderPointerValidator = __decorate([
-    FValidatorRegister(GetInputUnderPointerRequest)
-], GetInputUnderPointerValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetInputUnderPointerValidator, decorators: [{
+CanvasMovePreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMovePreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+CanvasMovePreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMovePreparationValidator });
+CanvasMovePreparationValidator = __decorate([
+    FValidatorRegister(CanvasMovePreparationRequest)
+], CanvasMovePreparationValidator);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CanvasMovePreparationValidator, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
+        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
 
-const CONNECTION_DRAG_COMMON_PROVIDERS = [
-    FindClosestInputUsingSnapThresholdExecution,
-    GetAllCanBeConnectedInputPositionsExecution,
-    GetConnectorWithRectExecution,
-    GetInputUnderPointerExecution,
-    GetInputUnderPointerValidator
+const CANVAS_MOVE_PREPARATION_PROVIDERS = [
+    CanvasMovePreparationExecution,
+    CanvasMovePreparationValidator,
+];
+
+const CANVAS_PROVIDERS = [
+    ...CANVAS_MOVE_FINALIZE_PROVIDERS,
+    ...CANVAS_MOVE_PREPARATION_PROVIDERS,
 ];
 
 var EFConnectableSide;
@@ -705,9 +921,9 @@ class FNodeInputBase extends FConnectorBase {
         return !this.disabled && (this.multiple ? true : !this.isConnected);
     }
 }
-FNodeInputBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeInputBase, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-FNodeInputBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FNodeInputBase, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeInputBase, decorators: [{
+FNodeInputBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeInputBase, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+FNodeInputBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FNodeInputBase, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeInputBase, decorators: [{
             type: Directive
         }] });
 
@@ -728,9 +944,9 @@ class FDragHandleDirective {
         return this.elementReference.nativeElement;
     }
 }
-FDragHandleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FDragHandleDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-FDragHandleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FDragHandleDirective, selector: "[fDragHandle]", host: { classAttribute: "f-drag-handle f-component" }, providers: [{ provide: F_DRAG_HANDLE, useExisting: FDragHandleDirective }], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FDragHandleDirective, decorators: [{
+FDragHandleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FDragHandleDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+FDragHandleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FDragHandleDirective, selector: "[fDragHandle]", host: { classAttribute: "f-drag-handle f-component" }, providers: [{ provide: F_DRAG_HANDLE, useExisting: FDragHandleDirective }], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FDragHandleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[fDragHandle]",
@@ -768,9 +984,9 @@ class FResizeHandleDirective {
         return this.elementReference.nativeElement;
     }
 }
-FResizeHandleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FResizeHandleDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-FResizeHandleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FResizeHandleDirective, selector: "[fResizeHandle]", inputs: { type: ["fResizeHandleType", "type"] }, host: { properties: { "attr.data-f-resize-handle-type": "type", "class": "this.typeClass" }, classAttribute: "f-resize-handle f-component" }, providers: [{ provide: F_RESIZE_HANDLE, useExisting: FResizeHandleDirective }], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FResizeHandleDirective, decorators: [{
+FResizeHandleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FResizeHandleDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+FResizeHandleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FResizeHandleDirective, selector: "[fResizeHandle]", inputs: { type: ["fResizeHandleType", "type"] }, host: { properties: { "attr.data-f-resize-handle-type": "type", "class": "this.typeClass" }, classAttribute: "f-resize-handle f-component" }, providers: [{ provide: F_RESIZE_HANDLE, useExisting: FResizeHandleDirective }], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FResizeHandleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[fResizeHandle]",
@@ -905,7 +1121,7 @@ class FResizeObserver extends Observable {
     }
 }
 
-let uniqueId$d = 0;
+let uniqueId$b = 0;
 class FGroupDirective extends FNodeBase {
     constructor(elementReference, renderer, fComponentsStore, fMediator, fBrowser) {
         super(elementReference.nativeElement);
@@ -914,7 +1130,7 @@ class FGroupDirective extends FNodeBase {
         this.fMediator = fMediator;
         this.fBrowser = fBrowser;
         this.subscriptions$ = new Subscription();
-        this.fId = `f-group-${uniqueId$d++}`;
+        this.fId = `f-group-${uniqueId$b++}`;
         this.fParentId = null;
         this.positionChange = new EventEmitter();
         this.sizeChange = new EventEmitter();
@@ -989,11 +1205,11 @@ class FGroupDirective extends FNodeBase {
         this.subscriptions$.unsubscribe();
     }
 }
-FGroupDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FGroupDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
-FGroupDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FGroupDirective, selector: "[fGroup]", inputs: { fId: ["fGroupId", "fId"], fParentId: ["fGroupParentId", "fParentId"], position: ["fGroupPosition", "position"], size: ["fGroupSize", "size"], fDraggingDisabled: ["fGroupDraggingDisabled", "fDraggingDisabled"], fSelectionDisabled: ["fGroupSelectionDisabled", "fSelectionDisabled"], fIncludePadding: "fIncludePadding", fConnectOnNode: "fConnectOnNode" }, outputs: { positionChange: "fGroupPositionChange", sizeChange: "fGroupSizeChange" }, host: { properties: { "attr.data-f-group-id": "fId", "class.f-group-dragging-disabled": "fDraggingDisabled", "class.f-group-selection-disabled": "fSelectionDisabled" }, classAttribute: "f-group f-component" }, providers: [
+FGroupDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FGroupDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
+FGroupDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FGroupDirective, selector: "[fGroup]", inputs: { fId: ["fGroupId", "fId"], fParentId: ["fGroupParentId", "fParentId"], position: ["fGroupPosition", "position"], size: ["fGroupSize", "size"], fDraggingDisabled: ["fGroupDraggingDisabled", "fDraggingDisabled"], fSelectionDisabled: ["fGroupSelectionDisabled", "fSelectionDisabled"], fIncludePadding: "fIncludePadding", fConnectOnNode: "fConnectOnNode" }, outputs: { positionChange: "fGroupPositionChange", sizeChange: "fGroupSizeChange" }, host: { properties: { "attr.data-f-group-id": "fId", "class.f-group-dragging-disabled": "fDraggingDisabled", "class.f-group-selection-disabled": "fSelectionDisabled" }, classAttribute: "f-group f-component" }, providers: [
         { provide: F_NODE, useExisting: FGroupDirective }
     ], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FGroupDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FGroupDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[fGroup]",
@@ -1038,7 +1254,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 type: Input
             }] } });
 
-let uniqueId$c = 0;
+let uniqueId$a = 0;
 class FNodeDirective extends FNodeBase {
     constructor(elementReference, renderer, fComponentsStore, fMediator, fBrowser) {
         super(elementReference.nativeElement);
@@ -1047,7 +1263,7 @@ class FNodeDirective extends FNodeBase {
         this.fMediator = fMediator;
         this.fBrowser = fBrowser;
         this.subscriptions$ = new Subscription();
-        this.fId = `f-node-${uniqueId$c++}`;
+        this.fId = `f-node-${uniqueId$a++}`;
         this.fParentId = null;
         this.positionChange = new EventEmitter();
         this.sizeChange = new EventEmitter();
@@ -1123,11 +1339,11 @@ class FNodeDirective extends FNodeBase {
         this.subscriptions$.unsubscribe();
     }
 }
-FNodeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
-FNodeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FNodeDirective, selector: "[fNode]", inputs: { fId: ["fNodeId", "fId"], fParentId: ["fNodeParentId", "fParentId"], position: ["fNodePosition", "position"], size: ["fNodeSize", "size"], fDraggingDisabled: ["fNodeDraggingDisabled", "fDraggingDisabled"], fSelectionDisabled: ["fNodeSelectionDisabled", "fSelectionDisabled"], fIncludePadding: "fIncludePadding", fConnectOnNode: "fConnectOnNode" }, outputs: { positionChange: "fNodePositionChange", sizeChange: "fNodeSizeChange" }, host: { properties: { "attr.data-f-node-id": "fId", "class.f-node-dragging-disabled": "fDraggingDisabled", "class.f-node-selection-disabled": "fSelectionDisabled" }, classAttribute: "f-node f-component" }, providers: [
+FNodeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
+FNodeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FNodeDirective, selector: "[fNode]", inputs: { fId: ["fNodeId", "fId"], fParentId: ["fNodeParentId", "fParentId"], position: ["fNodePosition", "position"], size: ["fNodeSize", "size"], fDraggingDisabled: ["fNodeDraggingDisabled", "fDraggingDisabled"], fSelectionDisabled: ["fNodeSelectionDisabled", "fSelectionDisabled"], fIncludePadding: "fIncludePadding", fConnectOnNode: "fConnectOnNode" }, outputs: { positionChange: "fNodePositionChange", sizeChange: "fNodeSizeChange" }, host: { properties: { "attr.data-f-node-id": "fId", "class.f-node-dragging-disabled": "fDraggingDisabled", "class.f-node-selection-disabled": "fSelectionDisabled" }, classAttribute: "f-node f-component" }, providers: [
         { provide: F_NODE, useExisting: FNodeDirective }
     ], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[fNode]",
@@ -1179,14 +1395,14 @@ const F_NODE_PROVIDERS = [
     FResizeHandleDirective,
 ];
 
-let uniqueId$b = 0;
+let uniqueId$9 = 0;
 class FNodeInputDirective extends FNodeInputBase {
     constructor(elementReference, fNode, fComponentsStore) {
         super();
         this.elementReference = elementReference;
         this.fNode = fNode;
         this.fComponentsStore = fComponentsStore;
-        this.id = `f-node-input-${uniqueId$b++}`;
+        this.id = `f-node-input-${uniqueId$9++}`;
         this.multiple = true;
         this.isDisabled = false;
         this._fConnectableSide = EFConnectableSide.AUTO;
@@ -1225,9 +1441,9 @@ class FNodeInputDirective extends FNodeInputBase {
         this.fComponentsStore.removeComponent(this.fComponentsStore.fInputs, this);
     }
 }
-FNodeInputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeInputDirective, deps: [{ token: i0.ElementRef }, { token: F_NODE }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
-FNodeInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FNodeInputDirective, selector: "[fNodeInput]", inputs: { id: ["fInputId", "id"], multiple: ["fInputMultiple", "multiple"], disabled: ["fInputDisabled", "disabled"], _fSide: ["fInputConnectableSide", "_fSide"] }, host: { properties: { "attr.data-f-input-id": "id", "class.f-node-input-multiple": "multiple", "class.f-node-input-disabled": "disabled", "class.f-node-input-not-connectable": "!canBeConnected" }, classAttribute: "f-component f-node-input" }, providers: [{ provide: F_NODE_INPUT, useExisting: FNodeInputDirective }], exportAs: ["fNodeInput"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeInputDirective, decorators: [{
+FNodeInputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeInputDirective, deps: [{ token: i0.ElementRef }, { token: F_NODE }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
+FNodeInputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FNodeInputDirective, selector: "[fNodeInput]", inputs: { id: ["fInputId", "id"], multiple: ["fInputMultiple", "multiple"], disabled: ["fInputDisabled", "disabled"], _fSide: ["fInputConnectableSide", "_fSide"] }, host: { properties: { "attr.data-f-input-id": "id", "class.f-node-input-multiple": "multiple", "class.f-node-input-disabled": "disabled", "class.f-node-input-not-connectable": "!canBeConnected" }, classAttribute: "f-component f-node-input" }, providers: [{ provide: F_NODE_INPUT, useExisting: FNodeInputDirective }], exportAs: ["fNodeInput"], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeInputDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[fNodeInput]",
@@ -1241,10 +1457,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     },
                     providers: [{ provide: F_NODE_INPUT, useExisting: FNodeInputDirective }],
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FNodeBase, decorators: [{
-                    type: Inject,
-                    args: [F_NODE]
-                }] }, { type: FComponentsStore }]; }, propDecorators: { id: [{
+        }], ctorParameters: function () {
+        return [{ type: i0.ElementRef }, { type: FNodeBase, decorators: [{
+                        type: Inject,
+                        args: [F_NODE]
+                    }] }, { type: FComponentsStore }];
+    }, propDecorators: { id: [{
                 type: Input,
                 args: ['fInputId']
             }], multiple: [{
@@ -1272,9 +1490,9 @@ class FNodeOutletBase extends FConnectorBase {
         this.outputs = outputs;
     }
 }
-FNodeOutletBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeOutletBase, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-FNodeOutletBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FNodeOutletBase, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeOutletBase, decorators: [{
+FNodeOutletBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeOutletBase, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+FNodeOutletBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FNodeOutletBase, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeOutletBase, decorators: [{
             type: Directive
         }] });
 
@@ -1282,14 +1500,14 @@ function isNodeOutlet(element) {
     return !!element.closest('[fNodeOutlet]');
 }
 
-let uniqueId$a = 0;
+let uniqueId$8 = 0;
 class FNodeOutletDirective extends FNodeOutletBase {
     constructor(elementReference, fNode, fComponentsStore) {
         super();
         this.elementReference = elementReference;
         this.fNode = fNode;
         this.fComponentsStore = fComponentsStore;
-        this.id = `f-node-outlet-${uniqueId$a++}`;
+        this.id = `f-node-outlet-${uniqueId$8++}`;
         this.isDisabled = false;
         this.fConnectableSide = EFConnectableSide.AUTO;
         this._fConnectableSide = EFConnectableSide.AUTO;
@@ -1318,9 +1536,9 @@ class FNodeOutletDirective extends FNodeOutletBase {
         this.fComponentsStore.removeComponent(this.fComponentsStore.fOutlets, this);
     }
 }
-FNodeOutletDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeOutletDirective, deps: [{ token: i0.ElementRef }, { token: F_NODE }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
-FNodeOutletDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FNodeOutletDirective, selector: "[fNodeOutlet]", inputs: { id: ["fOutletId", "id"], disabled: ["fOutletDisabled", "disabled"], isConnectionFromOutlet: "isConnectionFromOutlet" }, host: { properties: { "attr.data-f-outlet-id": "id", "class.f-node-outlet-disabled": "disabled" }, classAttribute: "f-component f-node-outlet" }, providers: [{ provide: F_NODE_OUTLET, useExisting: FNodeOutletDirective }], exportAs: ["fNodeOutlet"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeOutletDirective, decorators: [{
+FNodeOutletDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeOutletDirective, deps: [{ token: i0.ElementRef }, { token: F_NODE }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
+FNodeOutletDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FNodeOutletDirective, selector: "[fNodeOutlet]", inputs: { id: ["fOutletId", "id"], disabled: ["fOutletDisabled", "disabled"], isConnectionFromOutlet: "isConnectionFromOutlet" }, host: { properties: { "attr.data-f-outlet-id": "id", "class.f-node-outlet-disabled": "disabled" }, classAttribute: "f-component f-node-outlet" }, providers: [{ provide: F_NODE_OUTLET, useExisting: FNodeOutletDirective }], exportAs: ["fNodeOutlet"], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeOutletDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[fNodeOutlet]",
@@ -1332,10 +1550,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     },
                     providers: [{ provide: F_NODE_OUTLET, useExisting: FNodeOutletDirective }],
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FNodeBase, decorators: [{
-                    type: Inject,
-                    args: [F_NODE]
-                }] }, { type: FComponentsStore }]; }, propDecorators: { id: [{
+        }], ctorParameters: function () {
+        return [{ type: i0.ElementRef }, { type: FNodeBase, decorators: [{
+                        type: Inject,
+                        args: [F_NODE]
+                    }] }, { type: FComponentsStore }];
+    }, propDecorators: { id: [{
                 type: Input,
                 args: ['fOutletId']
             }], disabled: [{
@@ -1355,9 +1575,9 @@ class FNodeOutputBase extends FConnectorBase {
         return !this.disabled && (this.multiple ? true : !this.isConnected);
     }
 }
-FNodeOutputBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeOutputBase, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-FNodeOutputBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FNodeOutputBase, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeOutputBase, decorators: [{
+FNodeOutputBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeOutputBase, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+FNodeOutputBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FNodeOutputBase, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeOutputBase, decorators: [{
             type: Directive
         }] });
 
@@ -1365,14 +1585,14 @@ function isNodeOutput(element) {
     return !!element.closest('[fNodeOutput]');
 }
 
-let uniqueId$9 = 0;
+let uniqueId$7 = 0;
 class FNodeOutputDirective extends FNodeOutputBase {
     constructor(elementReference, fNode, fComponentsStore) {
         super();
         this.elementReference = elementReference;
         this.fNode = fNode;
         this.fComponentsStore = fComponentsStore;
-        this.id = `f-node-output-${uniqueId$9++}`;
+        this.id = `f-node-output-${uniqueId$7++}`;
         this.multiple = false;
         this.isDisabled = false;
         this._fConnectableSide = EFConnectableSide.AUTO;
@@ -1415,9 +1635,9 @@ class FNodeOutputDirective extends FNodeOutputBase {
         this.fComponentsStore.removeComponent(this.fComponentsStore.fOutputs, this);
     }
 }
-FNodeOutputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeOutputDirective, deps: [{ token: i0.ElementRef }, { token: F_NODE }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
-FNodeOutputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FNodeOutputDirective, selector: "[fNodeOutput]", inputs: { id: ["fOutputId", "id"], multiple: ["fOutputMultiple", "multiple"], disabled: ["fOutputDisabled", "disabled"], _fSide: ["fOutputConnectableSide", "_fSide"], isSelfConnectable: "isSelfConnectable" }, host: { properties: { "attr.data-f-output-id": "id", "class.f-node-output-multiple": "multiple", "class.f-node-output-disabled": "disabled", "class.f-node-output-not-connectable": "!canBeConnected", "class.f-node-output-self-connectable": "isSelfConnectable" }, classAttribute: "f-component f-node-output" }, providers: [{ provide: F_NODE_OUTPUT, useExisting: FNodeOutputDirective }], exportAs: ["fNodeOutput"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FNodeOutputDirective, decorators: [{
+FNodeOutputDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeOutputDirective, deps: [{ token: i0.ElementRef }, { token: F_NODE }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
+FNodeOutputDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FNodeOutputDirective, selector: "[fNodeOutput]", inputs: { id: ["fOutputId", "id"], multiple: ["fOutputMultiple", "multiple"], disabled: ["fOutputDisabled", "disabled"], _fSide: ["fOutputConnectableSide", "_fSide"], isSelfConnectable: "isSelfConnectable" }, host: { properties: { "attr.data-f-output-id": "id", "class.f-node-output-multiple": "multiple", "class.f-node-output-disabled": "disabled", "class.f-node-output-not-connectable": "!canBeConnected", "class.f-node-output-self-connectable": "isSelfConnectable" }, classAttribute: "f-component f-node-output" }, providers: [{ provide: F_NODE_OUTPUT, useExisting: FNodeOutputDirective }], exportAs: ["fNodeOutput"], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FNodeOutputDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[fNodeOutput]",
@@ -1432,10 +1652,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     },
                     providers: [{ provide: F_NODE_OUTPUT, useExisting: FNodeOutputDirective }],
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FNodeBase, decorators: [{
-                    type: Inject,
-                    args: [F_NODE]
-                }] }, { type: FComponentsStore }]; }, propDecorators: { id: [{
+        }], ctorParameters: function () {
+        return [{ type: i0.ElementRef }, { type: FNodeBase, decorators: [{
+                        type: Inject,
+                        args: [F_NODE]
+                    }] }, { type: FComponentsStore }];
+    }, propDecorators: { id: [{
                 type: Input,
                 args: ['fOutputId']
             }], multiple: [{
@@ -1463,6 +1685,38 @@ class CreateConnectionFinalizeRequest {
     }
 }
 
+function createErrorClass(impl) {
+    const _super = (instance) => {
+        Error.call(instance);
+    };
+    const constructor = impl(_super);
+    constructor.prototype = Object.create(Error.prototype);
+    constructor.prototype.constructor = constructor;
+    return constructor;
+}
+
+const NotFoundError = createErrorClass((_super) => function error(message) {
+    _super(this);
+    this.message = message || 'The requested resource was not found.';
+    this.code = 404;
+});
+
+const ConflictError = createErrorClass((_super) => function error(message) {
+    _super(this);
+    this.message = message || 'Conflict error occurred.';
+    this.code = 409;
+});
+
+function OutputNotFound(id) {
+    return new NotFoundError(`Output with fOutputId ${id} not found. Make sure there is no f-connection to a non-existent fOutput.`);
+}
+function InputNotFound(id) {
+    return new NotFoundError(`Input with fInputId ${id} not found. Make sure there is no f-connection to a non-existent fInput.`);
+}
+function RequiredOutput() {
+    return new ConflictError(`The fNode must contain at least one fOutput if there is an fOutlet`);
+}
+
 class GetCanBeConnectedOutputByOutletRequest {
     constructor(outlet) {
         this.outlet = outlet;
@@ -1495,12 +1749,12 @@ let GetCanBeConnectedOutputByOutletExecution = class GetCanBeConnectedOutputByOu
         return this.fNodes.find((x) => x.isContains(outlet.hostElement));
     }
 };
-GetCanBeConnectedOutputByOutletExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetCanBeConnectedOutputByOutletExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetCanBeConnectedOutputByOutletExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetCanBeConnectedOutputByOutletExecution });
+GetCanBeConnectedOutputByOutletExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetCanBeConnectedOutputByOutletExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetCanBeConnectedOutputByOutletExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetCanBeConnectedOutputByOutletExecution });
 GetCanBeConnectedOutputByOutletExecution = __decorate([
     FExecutionRegister(GetCanBeConnectedOutputByOutletRequest)
 ], GetCanBeConnectedOutputByOutletExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetCanBeConnectedOutputByOutletExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetCanBeConnectedOutputByOutletExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
@@ -1515,20 +1769,15 @@ let GetCanBeConnectedOutputByOutletValidator = class GetCanBeConnectedOutputByOu
         return !!this.fNodes.find((x) => x.isContains(request.outlet.hostElement));
     }
 };
-GetCanBeConnectedOutputByOutletValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetCanBeConnectedOutputByOutletValidator, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetCanBeConnectedOutputByOutletValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetCanBeConnectedOutputByOutletValidator });
+GetCanBeConnectedOutputByOutletValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetCanBeConnectedOutputByOutletValidator, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetCanBeConnectedOutputByOutletValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetCanBeConnectedOutputByOutletValidator });
 GetCanBeConnectedOutputByOutletValidator = __decorate([
     FValidatorRegister(GetCanBeConnectedOutputByOutletRequest)
 ], GetCanBeConnectedOutputByOutletValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetCanBeConnectedOutputByOutletValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetCanBeConnectedOutputByOutletValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
-const GET_CAN_BE_CONNECTED_OUTPUT_BY_OUTLET_PROVIDERS = [
-    GetCanBeConnectedOutputByOutletExecution,
-    GetCanBeConnectedOutputByOutletValidator,
-];
-
 class FCreateConnectionEvent {
     constructor(fOutputId, fInputId, fDropPosition) {
         this.fOutputId = fOutputId;
@@ -1537,45 +1786,154 @@ class FCreateConnectionEvent {
     }
 }
 
-let CreateConnectionFinalizeExecution = class CreateConnectionFinalizeExecution {
-    constructor(fComponentsStore, fDraggableDataContext, fMediator) {
+class GetInputUnderPointerRequest {
+    constructor(event, dragHandler) {
+        this.event = event;
+        this.dragHandler = dragHandler;
+    }
+}
+
+let GetInputUnderPointerExecution = class GetInputUnderPointerExecution {
+    constructor(fComponentsStore, fDraggableDataContext, fBrowser) {
         this.fComponentsStore = fComponentsStore;
         this.fDraggableDataContext = fDraggableDataContext;
-        this.fMediator = fMediator;
+        this.fBrowser = fBrowser;
     }
-    get dragHandler() {
-        return this.fDraggableDataContext.draggableItems[0];
+    get fNodes() {
+        return this.fComponentsStore.fNodes;
     }
-    handle(request) {
-        this.emitEvent(request.event);
-        this.dragHandler.complete();
+    get fInputs() {
+        return this.fComponentsStore.fInputs;
     }
-    getTargetOutput(output) {
-        if (!output) {
-            throw OutputNotFound(this.dragHandler.fConnection.fOutputId);
+    handle(payload) {
+        const output = (this.getOutput(payload.dragHandler) || this.getOutlet(payload.dragHandler));
+        const inputsUnderPointer = this.getInputsUnderPointer(payload.event.getPosition(), payload.dragHandler);
+        const connectors = output.isSelfConnectable ?
+            inputsUnderPointer :
+            this.filterSelfConnectable(inputsUnderPointer, output);
+        return connectors.length > 0 ? connectors[0] : undefined;
+    }
+    getOutput(dragHandler) {
+        return this.fComponentsStore.fOutputs.find((x) => x.id === dragHandler.fConnection.fOutputId);
+    }
+    getOutlet(dragHandler) {
+        return this.fComponentsStore.fOutlets.find((x) => x.id === dragHandler.fConnection.fOutputId);
+    }
+    getInputsUnderPointer(position, dragHandler) {
+        const result = this.getInputsInPosition(position);
+        const closestInput = dragHandler.getClosetInput(this.getDifference(position));
+        if (closestInput) {
+            result.push(closestInput.fConnector);
         }
-        return isNodeOutlet(output.hostElement) ? this.fMediator.send(new GetCanBeConnectedOutputByOutletRequest(output)) : output;
+        const input = this.getFirstConnectableInputOfNodeInPosition(position);
+        if (input) {
+            result.push(input);
+        }
+        return result;
     }
-    getOutput() {
-        return this.fComponentsStore.fOutputs.find((x) => x.id === this.dragHandler.fConnection.fOutputId);
+    getDifference(position) {
+        return Point.fromPoint(position).elementTransform(this.fComponentsStore.flowHost)
+            .div(this.fDraggableDataContext.onPointerDownScale).sub(this.fDraggableDataContext.onPointerDownPosition);
     }
-    getOutlet() {
-        return this.fComponentsStore.fOutlets.find((x) => x.id === this.dragHandler.fConnection.fOutputId);
+    getInputsInPosition(position) {
+        return this.getElementsFromPoint(position).map((element) => this.fInputs.find(x => x.isContains(element) && x.canBeConnected)).filter((x) => !!x);
     }
-    emitEvent(event) {
-        var _a, _b;
-        (_a = this.fComponentsStore.fDraggable) === null || _a === void 0 ? void 0 : _a.fCreateConnection.emit(new FCreateConnectionEvent(this.getTargetOutput(this.getOutput() || this.getOutlet()).id, (_b = this.getInputUnderPointer(event)) === null || _b === void 0 ? void 0 : _b.id, event.getPosition()));
+    getElementsFromPoint(position) {
+        return this.fBrowser.document.elementsFromPoint(position.x, position.y);
     }
-    getInputUnderPointer(event) {
-        return this.fMediator.send(new GetInputUnderPointerRequest(event, this.dragHandler));
+    getFirstConnectableInputOfNodeInPosition(position) {
+        return this.getNodesInPosition(position).map((x) => {
+            return this.fInputs.find((i) => x.isContains(i.hostElement) && i.canBeConnected);
+        }).find((x) => !!x);
     }
-};
-CreateConnectionFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFinalizeExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateConnectionFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFinalizeExecution });
-CreateConnectionFinalizeExecution = __decorate([
+    getNodesInPosition(position) {
+        return this.getElementsFromPoint(position).map((element) => {
+            return this.fNodes.find((x) => x.isContains(element) && x.fConnectOnNode);
+        }).filter((x) => !!x);
+    }
+    filterSelfConnectable(inputs, connector) {
+        return inputs.filter((x) => {
+            const targetNode = this.fNodes.find((k) => k.isContains(x.hostElement));
+            const sourceNode = this.fNodes.find((k) => k.isContains(connector.hostElement));
+            return (sourceNode === null || sourceNode === void 0 ? void 0 : sourceNode.hostElement) !== (targetNode === null || targetNode === void 0 ? void 0 : targetNode.hostElement);
+        });
+    }
+};
+GetInputUnderPointerExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetInputUnderPointerExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
+GetInputUnderPointerExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetInputUnderPointerExecution });
+GetInputUnderPointerExecution = __decorate([
+    FExecutionRegister(GetInputUnderPointerRequest)
+], GetInputUnderPointerExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetInputUnderPointerExecution, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i1.BrowserService }]; } });
+
+let GetInputUnderPointerValidator = class GetInputUnderPointerValidator {
+    constructor(fComponentsStore) {
+        this.fComponentsStore = fComponentsStore;
+    }
+    handle(request) {
+        let output = this.getOutput(request.dragHandler) || this.getOutlet(request.dragHandler);
+        if (!output) {
+            throw OutputNotFound(request.dragHandler.fConnection.fOutputId);
+        }
+        return true;
+    }
+    getOutput(dragHandler) {
+        return this.fComponentsStore.fOutputs.find((x) => x.id === dragHandler.fConnection.fOutputId);
+    }
+    getOutlet(dragHandler) {
+        return this.fComponentsStore.fOutlets.find((x) => x.id === dragHandler.fConnection.fOutputId);
+    }
+};
+GetInputUnderPointerValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetInputUnderPointerValidator, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetInputUnderPointerValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetInputUnderPointerValidator });
+GetInputUnderPointerValidator = __decorate([
+    FValidatorRegister(GetInputUnderPointerRequest)
+], GetInputUnderPointerValidator);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetInputUnderPointerValidator, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
+
+let CreateConnectionFinalizeExecution = class CreateConnectionFinalizeExecution {
+    constructor(fComponentsStore, fDraggableDataContext, fMediator) {
+        this.fComponentsStore = fComponentsStore;
+        this.fDraggableDataContext = fDraggableDataContext;
+        this.fMediator = fMediator;
+    }
+    get dragHandler() {
+        return this.fDraggableDataContext.draggableItems[0];
+    }
+    handle(request) {
+        this.emitEvent(request.event);
+        this.dragHandler.complete();
+    }
+    getTargetOutput(output) {
+        if (!output) {
+            throw OutputNotFound(this.dragHandler.fConnection.fOutputId);
+        }
+        return isNodeOutlet(output.hostElement) ? this.fMediator.send(new GetCanBeConnectedOutputByOutletRequest(output)) : output;
+    }
+    getOutput() {
+        return this.fComponentsStore.fOutputs.find((x) => x.id === this.dragHandler.fConnection.fOutputId);
+    }
+    getOutlet() {
+        return this.fComponentsStore.fOutlets.find((x) => x.id === this.dragHandler.fConnection.fOutputId);
+    }
+    emitEvent(event) {
+        var _a, _b;
+        (_a = this.fComponentsStore.fDraggable) === null || _a === void 0 ? void 0 : _a.fCreateConnection.emit(new FCreateConnectionEvent(this.getTargetOutput(this.getOutput() || this.getOutlet()).id, (_b = this.getInputUnderPointer(event)) === null || _b === void 0 ? void 0 : _b.id, event.getPosition()));
+    }
+    getInputUnderPointer(event) {
+        return this.fMediator.send(new GetInputUnderPointerRequest(event, this.dragHandler));
+    }
+};
+CreateConnectionFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFinalizeExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateConnectionFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFinalizeExecution });
+CreateConnectionFinalizeExecution = __decorate([
     FExecutionRegister(CreateConnectionFinalizeRequest)
 ], CreateConnectionFinalizeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFinalizeExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFinalizeExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -1647,20 +2005,15 @@ let CreateConnectionFinalizeValidator = class CreateConnectionFinalizeValidator
         return this.fDraggableDataContext.draggableItems.some((x) => x instanceof CreateConnectionDragHandler);
     }
 };
-CreateConnectionFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateConnectionFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFinalizeValidator });
+CreateConnectionFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateConnectionFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFinalizeValidator });
 CreateConnectionFinalizeValidator = __decorate([
     FValidatorRegister(CreateConnectionFinalizeRequest)
 ], CreateConnectionFinalizeValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFinalizeValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFinalizeValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
-const CREATE_CONNECTION_FINALIZE_PROVIDERS = [
-    CreateConnectionFinalizeExecution,
-    CreateConnectionFinalizeValidator,
-];
-
 class CreateConnectionDragHandlerRequest {
     constructor(onPointerDownPosition, connector) {
         this.onPointerDownPosition = onPointerDownPosition;
@@ -1692,19 +2045,15 @@ let CreateConnectionDragHandlerExecution = class CreateConnectionDragHandlerExec
         ];
     }
 };
-CreateConnectionDragHandlerExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionDragHandlerExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateConnectionDragHandlerExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionDragHandlerExecution });
+CreateConnectionDragHandlerExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionDragHandlerExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateConnectionDragHandlerExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionDragHandlerExecution });
 CreateConnectionDragHandlerExecution = __decorate([
     FExecutionRegister(CreateConnectionDragHandlerRequest)
 ], CreateConnectionDragHandlerExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionDragHandlerExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionDragHandlerExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
-const CREATE_CONNECTION_DRAG_HANDLER_PROVIDERS = [
-    CreateConnectionDragHandlerExecution,
-];
-
 class CreateConnectionFromOutletPreparationRequest {
     constructor(event) {
         this.event = event;
@@ -1744,19 +2093,15 @@ let CreateConnectionFromOutletPreparationExecution = class CreateConnectionFromO
         this.fMediator.send(new CreateConnectionDragHandlerRequest(position, output));
     }
 };
-CreateConnectionFromOutletPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFromOutletPreparationExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateConnectionFromOutletPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFromOutletPreparationExecution });
+CreateConnectionFromOutletPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFromOutletPreparationExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateConnectionFromOutletPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFromOutletPreparationExecution });
 CreateConnectionFromOutletPreparationExecution = __decorate([
     FExecutionRegister(CreateConnectionFromOutletPreparationRequest)
 ], CreateConnectionFromOutletPreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFromOutletPreparationExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFromOutletPreparationExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
-const CREATE_CONNECTION_FROM_OUTLET_PREPARATION_PROVIDERS = [
-    CreateConnectionFromOutletPreparationExecution,
-];
-
 class CreateConnectionFromOutputPreparationRequest {
     constructor(event) {
         this.event = event;
@@ -1784,12 +2129,12 @@ let CreateConnectionFromOutputPreparationExecution = class CreateConnectionFromO
         this.fMediator.send(new CreateConnectionDragHandlerRequest(position, output));
     }
 };
-CreateConnectionFromOutputPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFromOutputPreparationExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateConnectionFromOutputPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFromOutputPreparationExecution });
+CreateConnectionFromOutputPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFromOutputPreparationExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateConnectionFromOutputPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFromOutputPreparationExecution });
 CreateConnectionFromOutputPreparationExecution = __decorate([
     FExecutionRegister(CreateConnectionFromOutputPreparationRequest)
 ], CreateConnectionFromOutputPreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFromOutputPreparationExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFromOutputPreparationExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
@@ -1810,20 +2155,15 @@ let CreateConnectionFromOutputPreparationValidator = class CreateConnectionFromO
         return this.fComponentsStore.fOutlets.filter((x) => node.isContains(x.hostElement));
     }
 };
-CreateConnectionFromOutputPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFromOutputPreparationValidator, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateConnectionFromOutputPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFromOutputPreparationValidator });
+CreateConnectionFromOutputPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFromOutputPreparationValidator, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateConnectionFromOutputPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFromOutputPreparationValidator });
 CreateConnectionFromOutputPreparationValidator = __decorate([
     FValidatorRegister(CreateConnectionFromOutputPreparationRequest)
 ], CreateConnectionFromOutputPreparationValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionFromOutputPreparationValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionFromOutputPreparationValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
-const CREATE_CONNECTION_FROM_OUTPUT_PREPARATION_PROVIDERS = [
-    CreateConnectionFromOutputPreparationExecution,
-    CreateConnectionFromOutputPreparationValidator,
-];
-
 class CreateConnectionPreparationRequest {
     constructor(event) {
         this.event = event;
@@ -1853,12 +2193,12 @@ let CreateConnectionPreparationExecution = class CreateConnectionPreparationExec
         return this.fComponentsStore.fOutlets.filter((x) => node.isContains(x.hostElement));
     }
 };
-CreateConnectionPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionPreparationExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateConnectionPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionPreparationExecution });
+CreateConnectionPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionPreparationExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateConnectionPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionPreparationExecution });
 CreateConnectionPreparationExecution = __decorate([
     FExecutionRegister(CreateConnectionPreparationRequest)
 ], CreateConnectionPreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionPreparationExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionPreparationExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
@@ -1877,23 +2217,15 @@ let CreateConnectionPreparationValidator = class CreateConnectionPreparationVali
         return !this.fDraggableDataContext.draggableItems.length && !!this.fComponentsStore.fTempConnection;
     }
 };
-CreateConnectionPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionPreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateConnectionPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionPreparationValidator });
+CreateConnectionPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionPreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateConnectionPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionPreparationValidator });
 CreateConnectionPreparationValidator = __decorate([
     FValidatorRegister(CreateConnectionPreparationRequest)
 ], CreateConnectionPreparationValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateConnectionPreparationValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateConnectionPreparationValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
 
-const CREATE_CONNECTION_PREPARATION_PROVIDERS = [
-    ...CREATE_CONNECTION_DRAG_HANDLER_PROVIDERS,
-    ...CREATE_CONNECTION_FROM_OUTLET_PREPARATION_PROVIDERS,
-    ...CREATE_CONNECTION_FROM_OUTPUT_PREPARATION_PROVIDERS,
-    CreateConnectionPreparationExecution,
-    CreateConnectionPreparationValidator,
-];
-
 class ReassignConnectionFinalizeRequest {
     constructor(event) {
         this.event = event;
@@ -1939,12 +2271,12 @@ let ReassignConnectionFinalizeExecution = class ReassignConnectionFinalizeExecut
         return this.dragHandler.fConnection.fInputId !== inputsUnderPointer.id;
     }
 };
-ReassignConnectionFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionFinalizeExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-ReassignConnectionFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionFinalizeExecution });
+ReassignConnectionFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionFinalizeExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+ReassignConnectionFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionFinalizeExecution });
 ReassignConnectionFinalizeExecution = __decorate([
     FExecutionRegister(ReassignConnectionFinalizeRequest)
 ], ReassignConnectionFinalizeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionFinalizeExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionFinalizeExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -2014,20 +2346,15 @@ let ReassignConnectionFinalizeValidator = class ReassignConnectionFinalizeValida
         return this.fDraggableDataContext.draggableItems.some((x) => x instanceof ReassignConnectionDragHandler);
     }
 };
-ReassignConnectionFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-ReassignConnectionFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionFinalizeValidator });
+ReassignConnectionFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+ReassignConnectionFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionFinalizeValidator });
 ReassignConnectionFinalizeValidator = __decorate([
     FValidatorRegister(ReassignConnectionFinalizeRequest)
 ], ReassignConnectionFinalizeValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionFinalizeValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionFinalizeValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
-const REASSIGN_CONNECTION_FINALIZE_PROVIDERS = [
-    ReassignConnectionFinalizeExecution,
-    ReassignConnectionFinalizeValidator,
-];
-
 class ReassignConnectionPreparationRequest {
     constructor(event) {
         this.event = event;
@@ -2348,9 +2675,9 @@ class FConnectionTextPathDirective {
         return symbolWidth;
     }
 }
-FConnectionTextPathDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionTextPathDirective, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
-FConnectionTextPathDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FConnectionTextPathDirective, selector: "textPath[f-connection-text-path]", host: { properties: { "attr.href": "linkToConnection" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionTextPathDirective, decorators: [{
+FConnectionTextPathDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionTextPathDirective, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
+FConnectionTextPathDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FConnectionTextPathDirective, selector: "textPath[f-connection-text-path]", host: { properties: { "attr.href": "linkToConnection" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionTextPathDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'textPath[f-connection-text-path]',
@@ -2358,10 +2685,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                         '[attr.href]': 'linkToConnection'
                     }
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [F_CONNECTION]
-                }] }, { type: i1.BrowserService }]; } });
+        }], ctorParameters: function () {
+        return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [F_CONNECTION]
+                    }] }, { type: i1.BrowserService }];
+    } });
 
 const CONNECTION_TEXT = new InjectionToken('CONNECTION_TEXT');
 
@@ -2407,24 +2736,20 @@ class FConnectionTextComponent {
         return vectorLength / 2 - ((name || '').length * symbolWidth) / 2;
     }
 }
-FConnectionTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionTextComponent, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }], target: i0.ɵɵFactoryTarget.Component });
-FConnectionTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FConnectionTextComponent, selector: "text[f-connection-text]", host: { properties: { "attr.id": "textId" }, classAttribute: "f-component f-connection-text" }, providers: [{ provide: CONNECTION_TEXT, useExisting: FConnectionTextComponent }], viewQueries: [{ propertyName: "textPathDirective", first: true, predicate: FConnectionTextPathDirective, descendants: true, static: true }], ngImport: i0, template: "<ng-container xmlns:svg=\"http://www.w3.org/2000/svg\">\n    <svg:textPath f-connection-text-path>\n        {{ text }}\n    </svg:textPath>\n</ng-container>\n", directives: [{ type: FConnectionTextPathDirective, selector: "textPath[f-connection-text-path]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionTextComponent, decorators: [{
+FConnectionTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionTextComponent, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }], target: i0.ɵɵFactoryTarget.Component });
+FConnectionTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FConnectionTextComponent, selector: "text[f-connection-text]", host: { properties: { "attr.id": "textId" }, classAttribute: "f-component f-connection-text" }, providers: [{ provide: CONNECTION_TEXT, useExisting: FConnectionTextComponent }], viewQueries: [{ propertyName: "textPathDirective", first: true, predicate: FConnectionTextPathDirective, descendants: true, static: true }], ngImport: i0, template: "<ng-container xmlns:svg=\"http://www.w3.org/2000/svg\">\n    <svg:textPath f-connection-text-path>\n        {{ text }}\n    </svg:textPath>\n</ng-container>\n", dependencies: [{ kind: "directive", type: FConnectionTextPathDirective, selector: "textPath[f-connection-text-path]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionTextComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: "text[f-connection-text]",
-                    templateUrl: "./f-connection-text.component.html",
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    host: {
+            args: [{ selector: "text[f-connection-text]", changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: "f-component f-connection-text",
                         '[attr.id]': 'textId',
-                    },
-                    providers: [{ provide: CONNECTION_TEXT, useExisting: FConnectionTextComponent }],
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [F_CONNECTION]
-                }] }]; }, propDecorators: { textPathDirective: [{
+                    }, providers: [{ provide: CONNECTION_TEXT, useExisting: FConnectionTextComponent }], template: "<ng-container xmlns:svg=\"http://www.w3.org/2000/svg\">\n    <svg:textPath f-connection-text-path>\n        {{ text }}\n    </svg:textPath>\n</ng-container>\n" }]
+        }], ctorParameters: function () {
+        return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [F_CONNECTION]
+                    }] }];
+    }, propDecorators: { textPathDirective: [{
                 type: ViewChild,
                 args: [FConnectionTextPathDirective, { static: true }]
             }] } });
@@ -2451,9 +2776,9 @@ class FConnectionDragHandleComponent {
         return { x: end.x - scaledDirection.x, y: end.y - scaledDirection.y };
     }
 }
-FConnectionDragHandleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionDragHandleComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-FConnectionDragHandleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]", host: { properties: { "class": "class" } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionDragHandleComponent, decorators: [{
+FConnectionDragHandleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionDragHandleComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+FConnectionDragHandleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]", host: { properties: { "class": "class" } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionDragHandleComponent, decorators: [{
             type: Component,
             args: [{
                     selector: "circle[f-connection-drag-handle]",
@@ -2511,24 +2836,20 @@ class FConnectionGradientComponent {
         this.updateGradient();
     }
 }
-FConnectionGradientComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionGradientComponent, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }], target: i0.ɵɵFactoryTarget.Component });
-FConnectionGradientComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]", host: { properties: { "attr.id": "gradientId" }, classAttribute: "f-component f-connection-gradient" }, providers: [{ provide: CONNECTION_GRADIENT, useExisting: FConnectionGradientComponent }], ngImport: i0, template: "<ng-container xmlns:svg=\"http://www.w3.org/2000/svg\">\n    <svg:stop/>\n    <svg:stop/>\n</ng-container>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionGradientComponent, decorators: [{
+FConnectionGradientComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionGradientComponent, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }], target: i0.ɵɵFactoryTarget.Component });
+FConnectionGradientComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]", host: { properties: { "attr.id": "gradientId" }, classAttribute: "f-component f-connection-gradient" }, providers: [{ provide: CONNECTION_GRADIENT, useExisting: FConnectionGradientComponent }], ngImport: i0, template: "<ng-container xmlns:svg=\"http://www.w3.org/2000/svg\">\n    <svg:stop/>\n    <svg:stop/>\n</ng-container>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionGradientComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: "linearGradient[fConnectionGradient]",
-                    templateUrl: "./f-connection-gradient.component.html",
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    host: {
+            args: [{ selector: "linearGradient[fConnectionGradient]", changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: "f-component f-connection-gradient",
                         '[attr.id]': 'gradientId'
-                    },
-                    providers: [{ provide: CONNECTION_GRADIENT, useExisting: FConnectionGradientComponent }],
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [F_CONNECTION]
-                }] }]; } });
+                    }, providers: [{ provide: CONNECTION_GRADIENT, useExisting: FConnectionGradientComponent }], template: "<ng-container xmlns:svg=\"http://www.w3.org/2000/svg\">\n    <svg:stop/>\n    <svg:stop/>\n</ng-container>\n" }]
+        }], ctorParameters: function () {
+        return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [F_CONNECTION]
+                    }] }];
+    } });
 
 const CONNECTION_PATH = new InjectionToken('CONNECTION_PATH');
 
@@ -2577,9 +2898,9 @@ class FConnectionPathComponent {
         this.hostElement.setAttribute('marker-end', `url(#${getMarkerEndId(this.base.fId)})`);
     }
 }
-FConnectionPathComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionPathComponent, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }], target: i0.ɵɵFactoryTarget.Component });
-FConnectionPathComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FConnectionPathComponent, selector: "path[f-connection-path]", host: { properties: { "attr.id": "attrConnectionId", "attr.data-f-path-id": "fPathId", "attr.stroke": "linkToGradient" }, classAttribute: "f-component f-connection-path" }, providers: [{ provide: CONNECTION_PATH, useExisting: FConnectionPathComponent }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionPathComponent, decorators: [{
+FConnectionPathComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionPathComponent, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }], target: i0.ɵɵFactoryTarget.Component });
+FConnectionPathComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FConnectionPathComponent, selector: "path[f-connection-path]", host: { properties: { "attr.id": "attrConnectionId", "attr.data-f-path-id": "fPathId", "attr.stroke": "linkToGradient" }, classAttribute: "f-component f-connection-path" }, providers: [{ provide: CONNECTION_PATH, useExisting: FConnectionPathComponent }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionPathComponent, decorators: [{
             type: Component,
             args: [{
                     selector: "path[f-connection-path]",
@@ -2593,10 +2914,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     },
                     providers: [{ provide: CONNECTION_PATH, useExisting: FConnectionPathComponent }],
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [F_CONNECTION]
-                }] }]; } });
+        }], ctorParameters: function () {
+        return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [F_CONNECTION]
+                    }] }];
+    } });
 
 class FConnectionSelectionComponent {
     constructor(elementReference, base) {
@@ -2613,9 +2936,9 @@ class FConnectionSelectionComponent {
         this.hostElement.setAttribute("d", `${path}`);
     }
 }
-FConnectionSelectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionSelectionComponent, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }], target: i0.ɵɵFactoryTarget.Component });
-FConnectionSelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]", host: { properties: { "attr.id": "connectionForSelectionId" }, classAttribute: "f-component f-connection-selection" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionSelectionComponent, decorators: [{
+FConnectionSelectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionSelectionComponent, deps: [{ token: i0.ElementRef }, { token: F_CONNECTION }], target: i0.ɵɵFactoryTarget.Component });
+FConnectionSelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]", host: { properties: { "attr.id": "connectionForSelectionId" }, classAttribute: "f-component f-connection-selection" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionSelectionComponent, decorators: [{
             type: Component,
             args: [{
                     selector: "path[fConnectionSelection]",
@@ -2626,10 +2949,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                         '[attr.id]': 'connectionForSelectionId',
                     },
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [F_CONNECTION]
-                }] }]; } });
+        }], ctorParameters: function () {
+        return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [F_CONNECTION]
+                    }] }];
+    } });
 
 const F_CONNECTION_BUILDERS = new InjectionToken('F_CONNECTION_BUILDERS');
 
@@ -2652,16 +2977,18 @@ class FConnectionFactory {
         return builder.handle(request.payload);
     }
 }
-FConnectionFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionFactory, deps: [{ token: F_CONNECTION_BUILDERS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-FConnectionFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionFactory });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionFactory, decorators: [{
+FConnectionFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionFactory, deps: [{ token: F_CONNECTION_BUILDERS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+FConnectionFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionFactory });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionFactory, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [F_CONNECTION_BUILDERS]
-                }] }]; } });
+        }], ctorParameters: function () {
+        return [{ type: undefined, decorators: [{
+                        type: Optional
+                    }, {
+                        type: Inject,
+                        args: [F_CONNECTION_BUILDERS]
+                    }] }];
+    } });
 
 const MIXIN_BASE = mixinChangeSelection(mixinChangeVisibility(class {
     constructor(hostElement) {
@@ -2684,7 +3011,7 @@ class FConnectionBase extends MIXIN_BASE {
     }
     isContains(element) {
         var _a;
-        return ((_a = this.hostElement.firstChild) === null || _a === void 0 ? void 0 : _a.lastChild).contains(element);
+        return (_a = this.hostElement.firstChild) === null || _a === void 0 ? void 0 : _a.lastChild.contains(element);
     }
     setLine(source, sourceSide, target, targetSide) {
         var _a, _b;
@@ -2719,9 +3046,9 @@ class FConnectionBase extends MIXIN_BASE {
         this.fTextComponent.redraw(this.line);
     }
 }
-FConnectionBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionBase, deps: [{ token: i0.ElementRef }, { token: FConnectionFactory }], target: i0.ɵɵFactoryTarget.Directive });
-FConnectionBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FConnectionBase, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionBase, decorators: [{
+FConnectionBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionBase, deps: [{ token: i0.ElementRef }, { token: FConnectionFactory }], target: i0.ɵɵFactoryTarget.Directive });
+FConnectionBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FConnectionBase, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionBase, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FConnectionFactory }]; } });
 
@@ -2741,21 +3068,21 @@ var EFConnectionType;
 
 class FConnectionCenterDirective {
 }
-FConnectionCenterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionCenterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-FConnectionCenterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FConnectionCenterDirective, selector: "[fConnectionCenter]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionCenterDirective, decorators: [{
+FConnectionCenterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionCenterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+FConnectionCenterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FConnectionCenterDirective, selector: "[fConnectionCenter]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionCenterDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[fConnectionCenter]"
                 }]
         }] });
 
-let uniqueId$8 = 0;
+let uniqueId$6 = 0;
 class FConnectionForCreateComponent extends FConnectionBase {
     constructor(elementReference, fConnectionFactory, fComponentsStore) {
         super(elementReference, fConnectionFactory);
         this.fComponentsStore = fComponentsStore;
-        this.fId = `f-connection-for-create-${uniqueId$8++}`;
+        this.fId = `f-connection-for-create-${uniqueId$6++}`;
         this.fText = '';
         this._fStartColor = 'black';
         this._fEndColor = 'black';
@@ -2821,20 +3148,13 @@ class FConnectionForCreateComponent extends FConnectionBase {
         this.fComponentsStore.fTempConnection = undefined;
     }
 }
-FConnectionForCreateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionForCreateComponent, deps: [{ token: i0.ElementRef }, { token: FConnectionFactory }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Component });
-FConnectionForCreateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FConnectionForCreateComponent, selector: "f-connection-for-create", inputs: { fStartColor: "fStartColor", fEndColor: "fEndColor", fRadius: "fRadius", fOffset: "fOffset", fBehavior: "fBehavior", fType: "fType" }, host: { classAttribute: "f-component f-connection f-connection-for-create" }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionForCreateComponent }], queries: [{ propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, static: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, static: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, static: true }, { propertyName: "fDragHandle", first: true, predicate: FConnectionDragHandleComponent, descendants: true, static: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, static: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, static: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center{pointer-events:all}\n"], components: [{ type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]" }, { type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]" }, { type: FConnectionPathComponent, selector: "path[f-connection-path]" }, { type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]" }, { type: FConnectionTextComponent, selector: "text[f-connection-text]" }], directives: [{ type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionForCreateComponent, decorators: [{
+FConnectionForCreateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionForCreateComponent, deps: [{ token: i0.ElementRef }, { token: FConnectionFactory }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Component });
+FConnectionForCreateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FConnectionForCreateComponent, selector: "f-connection-for-create", inputs: { fStartColor: "fStartColor", fEndColor: "fEndColor", fRadius: "fRadius", fOffset: "fOffset", fBehavior: "fBehavior", fType: "fType" }, host: { classAttribute: "f-component f-connection f-connection-for-create" }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionForCreateComponent }], queries: [{ propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, static: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, static: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, static: true }, { propertyName: "fDragHandle", first: true, predicate: FConnectionDragHandleComponent, descendants: true, static: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, static: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, static: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center{pointer-events:all}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]" }, { kind: "component", type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]" }, { kind: "component", type: FConnectionPathComponent, selector: "path[f-connection-path]" }, { kind: "component", type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionForCreateComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: "f-connection-for-create",
-                    templateUrl: "./f-connection-for-create.component.html",
-                    styleUrls: ["./f-connection-for-create.component.scss"],
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    host: {
+            args: [{ selector: "f-connection-for-create", changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: "f-component f-connection f-connection-for-create"
-                    },
-                    providers: [{ provide: F_CONNECTION, useExisting: FConnectionForCreateComponent }],
-                }]
+                    }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionForCreateComponent }], template: "<svg xmlns=\"http://www.w3.org/2000/svg\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center{pointer-events:all}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FConnectionFactory }, { type: FComponentsStore }]; }, propDecorators: { fStartColor: [{
                 type: Input
             }], fEndColor: [{
@@ -2873,12 +3193,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 args: [FConnectionCenterDirective, { descendants: true }]
             }] } });
 
-let uniqueId$7 = 0;
+let uniqueId$5 = 0;
 class FConnectionComponent extends FConnectionBase {
     constructor(elementReference, fConnectionFactory, fComponentsStore) {
         super(elementReference, fConnectionFactory);
         this.fComponentsStore = fComponentsStore;
-        this.fId = `f-connection-${uniqueId$7++}`;
+        this.fId = `f-connection-${uniqueId$5++}`;
         this._fText = '';
         this._fStartColor = 'black';
         this._fEndColor = 'black';
@@ -2962,24 +3282,16 @@ class FConnectionComponent extends FConnectionBase {
         this.fComponentsStore.removeComponent(this.fComponentsStore.fConnections, this);
     }
 }
-FConnectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionComponent, deps: [{ token: i0.ElementRef }, { token: FConnectionFactory }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Component });
-FConnectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FConnectionComponent, selector: "f-connection", inputs: { fId: ["fConnectionId", "fId"], fText: "fText", fStartColor: "fStartColor", fEndColor: "fEndColor", fOutputId: "fOutputId", fInputId: "fInputId", fRadius: "fRadius", fOffset: "fOffset", fBehavior: "fBehavior", fType: "fType", fDraggingDisabled: ["fReassignDisabled", "fDraggingDisabled"], fSelectionDisabled: "fSelectionDisabled" }, host: { properties: { "attr.id": "fId", "class.f-connection-selection-disabled": "fSelectionDisabled", "class.f-connection-reassign-disabled": "fDraggingDisabled" }, classAttribute: "f-component f-connection" }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionComponent }], queries: [{ propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, static: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, static: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, static: true }, { propertyName: "fDragHandle", first: true, predicate: FConnectionDragHandleComponent, descendants: true, static: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, static: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, static: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true }], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\" style=\"overflow: visible; display: block; vertical-align: middle;\">\n  <defs #defs></defs>\n  <ng-content></ng-content>\n  <g class=\"f-connection-group\">\n    <linearGradient fConnectionGradient></linearGradient>\n    <path fConnectionSelection [attr.d]=\"path\"></path>\n    <g>\n      <path f-connection-path [attr.d]=\"path\"></path>\n      <circle f-connection-drag-handle r=\"8\"></circle>\n    </g>\n    <text f-connection-text></text>\n  </g>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n  <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center{pointer-events:all}\n"], components: [{ type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]" }, { type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]" }, { type: FConnectionPathComponent, selector: "path[f-connection-path]" }, { type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]" }, { type: FConnectionTextComponent, selector: "text[f-connection-text]" }], directives: [{ type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FConnectionComponent, decorators: [{
+FConnectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionComponent, deps: [{ token: i0.ElementRef }, { token: FConnectionFactory }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Component });
+FConnectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FConnectionComponent, selector: "f-connection", inputs: { fId: ["fConnectionId", "fId"], fText: "fText", fStartColor: "fStartColor", fEndColor: "fEndColor", fOutputId: "fOutputId", fInputId: "fInputId", fRadius: "fRadius", fOffset: "fOffset", fBehavior: "fBehavior", fType: "fType", fDraggingDisabled: ["fReassignDisabled", "fDraggingDisabled"], fSelectionDisabled: "fSelectionDisabled" }, host: { properties: { "attr.id": "fId", "class.f-connection-selection-disabled": "fSelectionDisabled", "class.f-connection-reassign-disabled": "fDraggingDisabled" }, classAttribute: "f-component f-connection" }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionComponent }], queries: [{ propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, static: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, static: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, static: true }, { propertyName: "fDragHandle", first: true, predicate: FConnectionDragHandleComponent, descendants: true, static: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, static: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, static: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true }], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\" style=\"overflow: visible; display: block; vertical-align: middle;\">\n  <defs #defs></defs>\n  <ng-content></ng-content>\n  <g class=\"f-connection-group\">\n    <linearGradient fConnectionGradient></linearGradient>\n    <path fConnectionSelection [attr.d]=\"path\"></path>\n    <g>\n      <path f-connection-path [attr.d]=\"path\"></path>\n      <circle f-connection-drag-handle r=\"8\"></circle>\n    </g>\n    <text f-connection-text></text>\n  </g>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n  <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center{pointer-events:all}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]" }, { kind: "component", type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]" }, { kind: "component", type: FConnectionPathComponent, selector: "path[f-connection-path]" }, { kind: "component", type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FConnectionComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: "f-connection",
-                    exportAs: 'fComponent',
-                    templateUrl: "./f-connection.component.html",
-                    styleUrls: ["./f-connection.component.scss"],
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    host: {
+            args: [{ selector: "f-connection", exportAs: 'fComponent', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[attr.id]': 'fId',
                         class: "f-component f-connection",
                         '[class.f-connection-selection-disabled]': 'fSelectionDisabled',
                         '[class.f-connection-reassign-disabled]': 'fDraggingDisabled',
-                    },
-                    providers: [{ provide: F_CONNECTION, useExisting: FConnectionComponent }],
-                }]
+                    }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionComponent }], template: "<svg xmlns=\"http://www.w3.org/2000/svg\" style=\"overflow: visible; display: block; vertical-align: middle;\">\n  <defs #defs></defs>\n  <ng-content></ng-content>\n  <g class=\"f-connection-group\">\n    <linearGradient fConnectionGradient></linearGradient>\n    <path fConnectionSelection [attr.d]=\"path\"></path>\n    <g>\n      <path f-connection-path [attr.d]=\"path\"></path>\n      <circle f-connection-drag-handle r=\"8\"></circle>\n    </g>\n    <text f-connection-text></text>\n  </g>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n  <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center{pointer-events:all}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FConnectionFactory }, { type: FComponentsStore }]; }, propDecorators: { fId: [{
                 type: Input,
                 args: ['fConnectionId']
@@ -3043,9 +3355,9 @@ var EFMarkerType;
 const F_MARKER = new InjectionToken('F_MARKER');
 class FMarkerBase {
 }
-FMarkerBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMarkerBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-FMarkerBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FMarkerBase, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMarkerBase, decorators: [{
+FMarkerBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMarkerBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+FMarkerBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FMarkerBase, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMarkerBase, decorators: [{
             type: Directive
         }] });
 
@@ -3073,9 +3385,9 @@ class FMarkerDirective extends FMarkerBase {
         this.fComponentsStore.removeComponent(this.fComponentsStore.fMarkers, this);
     }
 }
-FMarkerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMarkerDirective, deps: [{ token: FComponentsStore }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-FMarkerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FMarkerDirective, selector: "svg[fMarker]", inputs: { hostElement: "hostElement", width: "width", height: "height", refX: "refX", refY: "refY", type: "type", orient: "orient", markerUnits: "markerUnits" }, host: { classAttribute: "f-component f-marker" }, providers: [{ provide: F_MARKER, useExisting: FMarkerDirective }], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMarkerDirective, decorators: [{
+FMarkerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMarkerDirective, deps: [{ token: FComponentsStore }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+FMarkerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FMarkerDirective, selector: "svg[fMarker]", inputs: { hostElement: "hostElement", width: "width", height: "height", refX: "refX", refY: "refY", type: "type", orient: "orient", markerUnits: "markerUnits" }, host: { classAttribute: "f-component f-marker" }, providers: [{ provide: F_MARKER, useExisting: FMarkerDirective }], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMarkerDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "svg[fMarker]",
@@ -3102,12 +3414,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 type: Input
             }] } });
 
-let uniqueId$6 = 0;
+let uniqueId$4 = 0;
 class FSnapConnectionComponent extends FConnectionBase {
     constructor(elementReference, fConnectionFactory, fComponentsStore) {
         super(elementReference, fConnectionFactory);
         this.fComponentsStore = fComponentsStore;
-        this.fId = `f-snap-connection-${uniqueId$6++}`;
+        this.fId = `f-snap-connection-${uniqueId$4++}`;
         this.fText = '';
         this._fStartColor = 'black';
         this._fEndColor = 'black';
@@ -3174,20 +3486,13 @@ class FSnapConnectionComponent extends FConnectionBase {
         this.fComponentsStore.fSnapConnection = undefined;
     }
 }
-FSnapConnectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FSnapConnectionComponent, deps: [{ token: i0.ElementRef }, { token: FConnectionFactory }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Component });
-FSnapConnectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FSnapConnectionComponent, selector: "f-snap-connection", inputs: { fStartColor: "fStartColor", fEndColor: "fEndColor", fSnapThreshold: "fSnapThreshold", fRadius: "fRadius", fOffset: "fOffset", fBehavior: "fBehavior", fType: "fType" }, host: { classAttribute: "f-component f-connection f-snap-connection" }, providers: [{ provide: F_CONNECTION, useExisting: FSnapConnectionComponent }], queries: [{ propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, static: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, static: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, static: true }, { propertyName: "fDragHandle", first: true, predicate: FConnectionDragHandleComponent, descendants: true, static: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, static: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, static: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center{pointer-events:all}\n"], components: [{ type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]" }, { type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]" }, { type: FConnectionPathComponent, selector: "path[f-connection-path]" }, { type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]" }, { type: FConnectionTextComponent, selector: "text[f-connection-text]" }], directives: [{ type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FSnapConnectionComponent, decorators: [{
+FSnapConnectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FSnapConnectionComponent, deps: [{ token: i0.ElementRef }, { token: FConnectionFactory }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Component });
+FSnapConnectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FSnapConnectionComponent, selector: "f-snap-connection", inputs: { fStartColor: "fStartColor", fEndColor: "fEndColor", fSnapThreshold: "fSnapThreshold", fRadius: "fRadius", fOffset: "fOffset", fBehavior: "fBehavior", fType: "fType" }, host: { classAttribute: "f-component f-connection f-snap-connection" }, providers: [{ provide: F_CONNECTION, useExisting: FSnapConnectionComponent }], queries: [{ propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, static: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, static: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, static: true }, { propertyName: "fDragHandle", first: true, predicate: FConnectionDragHandleComponent, descendants: true, static: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, static: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, static: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center{pointer-events:all}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]" }, { kind: "component", type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]" }, { kind: "component", type: FConnectionPathComponent, selector: "path[f-connection-path]" }, { kind: "component", type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FSnapConnectionComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: "f-snap-connection",
-                    templateUrl: "./f-snap-connection.component.html",
-                    styleUrls: ["./f-snap-connection.component.scss"],
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    host: {
+            args: [{ selector: "f-snap-connection", changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: "f-component f-connection f-snap-connection"
-                    },
-                    providers: [{ provide: F_CONNECTION, useExisting: FSnapConnectionComponent }],
-                }]
+                    }, providers: [{ provide: F_CONNECTION, useExisting: FSnapConnectionComponent }], template: "<svg xmlns=\"http://www.w3.org/2000/svg\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center{pointer-events:all}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FConnectionFactory }, { type: FComponentsStore }]; }, propDecorators: { fStartColor: [{
                 type: Input
             }], fEndColor: [{
@@ -3283,12 +3588,12 @@ let ReassignConnectionPreparationExecution = class ReassignConnectionPreparation
         return this.fConnections.find(c => c.isContains(element));
     }
 };
-ReassignConnectionPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionPreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
-ReassignConnectionPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionPreparationExecution });
+ReassignConnectionPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionPreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
+ReassignConnectionPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionPreparationExecution });
 ReassignConnectionPreparationExecution = __decorate([
     FExecutionRegister(ReassignConnectionPreparationRequest)
 ], ReassignConnectionPreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionPreparationExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionPreparationExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }, { type: i1.BrowserService }]; } });
 
@@ -3317,29 +3622,34 @@ let ReassignConnectionPreparationValidator = class ReassignConnectionPreparation
         return this.fConnections.find(c => c.isContains(element));
     }
 };
-ReassignConnectionPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionPreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
-ReassignConnectionPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionPreparationValidator });
+ReassignConnectionPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionPreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
+ReassignConnectionPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionPreparationValidator });
 ReassignConnectionPreparationValidator = __decorate([
     FValidatorRegister(ReassignConnectionPreparationRequest)
 ], ReassignConnectionPreparationValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ReassignConnectionPreparationValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReassignConnectionPreparationValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i1.BrowserService }]; } });
 
-const REASSIGN_CONNECTION_PREPARATION_PROVIDERS = [
+const CONNECTIONS_PROVIDERS = [
+    GetInputUnderPointerExecution,
+    GetInputUnderPointerValidator,
+    CreateConnectionFinalizeExecution,
+    CreateConnectionFinalizeValidator,
+    CreateConnectionDragHandlerExecution,
+    CreateConnectionFromOutletPreparationExecution,
+    GetCanBeConnectedOutputByOutletExecution,
+    GetCanBeConnectedOutputByOutletValidator,
+    CreateConnectionFromOutputPreparationExecution,
+    CreateConnectionFromOutputPreparationValidator,
+    CreateConnectionPreparationExecution,
+    CreateConnectionPreparationValidator,
+    ReassignConnectionFinalizeExecution,
+    ReassignConnectionFinalizeValidator,
     ReassignConnectionPreparationExecution,
     ReassignConnectionPreparationValidator,
 ];
 
-const CONNECTIONS_PROVIDERS = [
-    ...CONNECTION_DRAG_COMMON_PROVIDERS,
-    ...CREATE_CONNECTION_FINALIZE_PROVIDERS,
-    ...CREATE_CONNECTION_PREPARATION_PROVIDERS,
-    ...GET_CAN_BE_CONNECTED_OUTPUT_BY_OUTLET_PROVIDERS,
-    ...REASSIGN_CONNECTION_FINALIZE_PROVIDERS,
-    ...REASSIGN_CONNECTION_PREPARATION_PROVIDERS,
-];
-
 class GetNodePaddingRequest {
     constructor(fNode, rect) {
         this.fNode = fNode;
@@ -3364,12 +3674,12 @@ let GetNodePaddingExecution = class GetNodePaddingExecution {
         ];
     }
 };
-GetNodePaddingExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodePaddingExecution, deps: [{ token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
-GetNodePaddingExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodePaddingExecution });
+GetNodePaddingExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodePaddingExecution, deps: [{ token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
+GetNodePaddingExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodePaddingExecution });
 GetNodePaddingExecution = __decorate([
     FExecutionRegister(GetNodePaddingRequest)
 ], GetNodePaddingExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodePaddingExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodePaddingExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.BrowserService }]; } });
 
@@ -3391,12 +3701,12 @@ let GetNormalizedNodeRectExecution = class GetNormalizedNodeRectExecution {
         return RectExtensions.initialize(position.x, position.y, rect.width, rect.height);
     }
 };
-GetNormalizedNodeRectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNormalizedNodeRectExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetNormalizedNodeRectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNormalizedNodeRectExecution });
+GetNormalizedNodeRectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNormalizedNodeRectExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetNormalizedNodeRectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNormalizedNodeRectExecution });
 GetNormalizedNodeRectExecution = __decorate([
     FExecutionRegister(GetNormalizedNodeRectRequest)
 ], GetNormalizedNodeRectExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNormalizedNodeRectExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNormalizedNodeRectExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
@@ -3434,12 +3744,12 @@ let GetNormalizedParentNodeRectExecution = class GetNormalizedParentNodeRectExec
         return this.fMediator.send(new GetNodePaddingRequest(node, rect));
     }
 };
-GetNormalizedParentNodeRectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNormalizedParentNodeRectExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-GetNormalizedParentNodeRectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNormalizedParentNodeRectExecution });
+GetNormalizedParentNodeRectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNormalizedParentNodeRectExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+GetNormalizedParentNodeRectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNormalizedParentNodeRectExecution });
 GetNormalizedParentNodeRectExecution = __decorate([
     FExecutionRegister(GetNormalizedParentNodeRectRequest)
 ], GetNormalizedParentNodeRectExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNormalizedParentNodeRectExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNormalizedParentNodeRectExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
@@ -3469,12 +3779,12 @@ let GetParentNodesExecution = class GetParentNodesExecution {
         return this.getParentNodes(parent, visited, result);
     }
 };
-GetParentNodesExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetParentNodesExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetParentNodesExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetParentNodesExecution });
+GetParentNodesExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetParentNodesExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetParentNodesExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetParentNodesExecution });
 GetParentNodesExecution = __decorate([
     FExecutionRegister(GetParentNodesRequest)
 ], GetParentNodesExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetParentNodesExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetParentNodesExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
@@ -3502,12 +3812,12 @@ let IsArrayHasParentNodeExecution = class IsArrayHasParentNodeExecution {
         return fNodes.some((x) => parentNodeIds.includes(x.fId));
     }
 };
-IsArrayHasParentNodeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IsArrayHasParentNodeExecution, deps: [{ token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-IsArrayHasParentNodeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IsArrayHasParentNodeExecution });
+IsArrayHasParentNodeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IsArrayHasParentNodeExecution, deps: [{ token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+IsArrayHasParentNodeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IsArrayHasParentNodeExecution });
 IsArrayHasParentNodeExecution = __decorate([
     FExecutionRegister(IsArrayHasParentNodeRequest)
 ], IsArrayHasParentNodeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IsArrayHasParentNodeExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IsArrayHasParentNodeExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i2.FMediator }]; } });
 
@@ -3554,9 +3864,9 @@ class ConnectionBaseDragHandler {
         this.connection.redraw();
     }
 }
-ConnectionBaseDragHandler.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ConnectionBaseDragHandler, deps: [{ token: i2.FMediator }, { token: FComponentsStore }, { token: FConnectionBase }], target: i0.ɵɵFactoryTarget.Directive });
-ConnectionBaseDragHandler.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: ConnectionBaseDragHandler, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ConnectionBaseDragHandler, decorators: [{
+ConnectionBaseDragHandler.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConnectionBaseDragHandler, deps: [{ token: i2.FMediator }, { token: FComponentsStore }, { token: FConnectionBase }], target: i0.ɵɵFactoryTarget.Directive });
+ConnectionBaseDragHandler.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: ConnectionBaseDragHandler, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConnectionBaseDragHandler, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i2.FMediator }, { type: FComponentsStore }, { type: FConnectionBase }]; } });
 
@@ -3643,12 +3953,12 @@ let PutInputConnectionHandlersToArrayExecution = class PutInputConnectionHandler
         return new ConnectionTargetDragHandler(this.fMediator, this.fComponentsStore, connection, nodeDragHandler.minDistance, nodeDragHandler.maxDistance);
     }
 };
-PutInputConnectionHandlersToArrayExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PutInputConnectionHandlersToArrayExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-PutInputConnectionHandlersToArrayExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PutInputConnectionHandlersToArrayExecution });
+PutInputConnectionHandlersToArrayExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PutInputConnectionHandlersToArrayExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+PutInputConnectionHandlersToArrayExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PutInputConnectionHandlersToArrayExecution });
 PutInputConnectionHandlersToArrayExecution = __decorate([
     FExecutionRegister(PutInputConnectionHandlersToArrayRequest)
 ], PutInputConnectionHandlersToArrayExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PutInputConnectionHandlersToArrayExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PutInputConnectionHandlersToArrayExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
@@ -3725,12 +4035,12 @@ let PutOutputConnectionHandlersToArrayExecution = class PutOutputConnectionHandl
         return new ConnectionSourceDragHandler(this.fMediator, this.fComponentsStore, connection, nodeDragHandler.minDistance, nodeDragHandler.maxDistance);
     }
 };
-PutOutputConnectionHandlersToArrayExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PutOutputConnectionHandlersToArrayExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-PutOutputConnectionHandlersToArrayExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PutOutputConnectionHandlersToArrayExecution });
+PutOutputConnectionHandlersToArrayExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PutOutputConnectionHandlersToArrayExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+PutOutputConnectionHandlersToArrayExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PutOutputConnectionHandlersToArrayExecution });
 PutOutputConnectionHandlersToArrayExecution = __decorate([
     FExecutionRegister(PutOutputConnectionHandlersToArrayRequest)
 ], PutOutputConnectionHandlersToArrayExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PutOutputConnectionHandlersToArrayExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PutOutputConnectionHandlersToArrayExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
@@ -3763,12 +4073,12 @@ let GetNodeMoveRestrictionsExecution = class GetNodeMoveRestrictionsExecution {
         return this.fMediator.send(new GetNormalizedParentNodeRectRequest(fNode));
     }
 };
-GetNodeMoveRestrictionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodeMoveRestrictionsExecution, deps: [{ token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-GetNodeMoveRestrictionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodeMoveRestrictionsExecution });
+GetNodeMoveRestrictionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodeMoveRestrictionsExecution, deps: [{ token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+GetNodeMoveRestrictionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodeMoveRestrictionsExecution });
 GetNodeMoveRestrictionsExecution = __decorate([
     FExecutionRegister(GetNodeMoveRestrictionsRequest)
 ], GetNodeMoveRestrictionsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodeMoveRestrictionsExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodeMoveRestrictionsExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i2.FMediator }]; } });
 const DEFAULT_RESTRICTIONS = {
@@ -3883,12 +4193,12 @@ let CreateMoveNodesDragModelFromSelectionExecution = class CreateMoveNodesDragMo
         return result;
     }
 };
-CreateMoveNodesDragModelFromSelectionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateMoveNodesDragModelFromSelectionExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-CreateMoveNodesDragModelFromSelectionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateMoveNodesDragModelFromSelectionExecution });
+CreateMoveNodesDragModelFromSelectionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateMoveNodesDragModelFromSelectionExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+CreateMoveNodesDragModelFromSelectionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateMoveNodesDragModelFromSelectionExecution });
 CreateMoveNodesDragModelFromSelectionExecution = __decorate([
     FExecutionRegister(CreateMoveNodesDragModelFromSelectionRequest)
 ], CreateMoveNodesDragModelFromSelectionExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreateMoveNodesDragModelFromSelectionExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CreateMoveNodesDragModelFromSelectionExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -3943,12 +4253,12 @@ let NodeMovePreparationExecution = class NodeMovePreparationExecution {
         return items.filter((x) => x instanceof NodeDragHandler).map(x => x.fNode);
     }
 };
-NodeMovePreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMovePreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-NodeMovePreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMovePreparationExecution });
+NodeMovePreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMovePreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+NodeMovePreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMovePreparationExecution });
 NodeMovePreparationExecution = __decorate([
     FExecutionRegister(NodeMovePreparationRequest)
 ], NodeMovePreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMovePreparationExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMovePreparationExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -3975,12 +4285,12 @@ let NodeMovePreparationValidator = class NodeMovePreparationValidator {
         return isClosestElementHasClass(targetElement, '.f-drag-handle');
     }
 };
-NodeMovePreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMovePreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-NodeMovePreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMovePreparationValidator });
+NodeMovePreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMovePreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+NodeMovePreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMovePreparationValidator });
 NodeMovePreparationValidator = __decorate([
     FValidatorRegister(NodeMovePreparationRequest)
 ], NodeMovePreparationValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMovePreparationValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMovePreparationValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
 
@@ -4032,12 +4342,12 @@ let NodeMoveFinalizeExecution = class NodeMoveFinalizeExecution {
         return difference;
     }
 };
-NodeMoveFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMoveFinalizeExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-NodeMoveFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMoveFinalizeExecution });
+NodeMoveFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMoveFinalizeExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+NodeMoveFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMoveFinalizeExecution });
 NodeMoveFinalizeExecution = __decorate([
     FExecutionRegister(NodeMoveFinalizeRequest)
 ], NodeMoveFinalizeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMoveFinalizeExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMoveFinalizeExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -4049,12 +4359,12 @@ let NodeMoveFinalizeValidator = class NodeMoveFinalizeValidator {
         return this.fDraggableDataContext.draggableItems.some((x) => x instanceof NodeDragHandler);
     }
 };
-NodeMoveFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMoveFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-NodeMoveFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMoveFinalizeValidator });
+NodeMoveFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMoveFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+NodeMoveFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMoveFinalizeValidator });
 NodeMoveFinalizeValidator = __decorate([
     FValidatorRegister(NodeMoveFinalizeRequest)
 ], NodeMoveFinalizeValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeMoveFinalizeValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeMoveFinalizeValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
@@ -4110,12 +4420,12 @@ let ApplyChildResizeRestrictionsExecution = class ApplyChildResizeRestrictionsEx
         }
     }
 };
-ApplyChildResizeRestrictionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ApplyChildResizeRestrictionsExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-ApplyChildResizeRestrictionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ApplyChildResizeRestrictionsExecution });
+ApplyChildResizeRestrictionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ApplyChildResizeRestrictionsExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ApplyChildResizeRestrictionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ApplyChildResizeRestrictionsExecution });
 ApplyChildResizeRestrictionsExecution = __decorate([
     FExecutionRegister(ApplyChildResizeRestrictionsRequest)
 ], ApplyChildResizeRestrictionsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ApplyChildResizeRestrictionsExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ApplyChildResizeRestrictionsExecution, decorators: [{
             type: Injectable
         }] });
 
@@ -4160,12 +4470,12 @@ let ApplyParentResizeRestrictionsExecution = class ApplyParentResizeRestrictions
         }
     }
 };
-ApplyParentResizeRestrictionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ApplyParentResizeRestrictionsExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-ApplyParentResizeRestrictionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ApplyParentResizeRestrictionsExecution });
+ApplyParentResizeRestrictionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ApplyParentResizeRestrictionsExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ApplyParentResizeRestrictionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ApplyParentResizeRestrictionsExecution });
 ApplyParentResizeRestrictionsExecution = __decorate([
     FExecutionRegister(ApplyParentResizeRestrictionsRequest)
 ], ApplyParentResizeRestrictionsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ApplyParentResizeRestrictionsExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ApplyParentResizeRestrictionsExecution, decorators: [{
             type: Injectable
         }] });
 
@@ -4193,12 +4503,12 @@ let CalculateChangedPositionExecution = class CalculateChangedPositionExecution
         return RectExtensions.initialize(originalRect.x + (direction.x === -1 ? difference.x : 0) + changedRect.x, originalRect.y + (direction.y === -1 ? difference.y : 0) + changedRect.y, changedRect.width, changedRect.height);
     }
 };
-CalculateChangedPositionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CalculateChangedPositionExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-CalculateChangedPositionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CalculateChangedPositionExecution });
+CalculateChangedPositionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalculateChangedPositionExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+CalculateChangedPositionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalculateChangedPositionExecution });
 CalculateChangedPositionExecution = __decorate([
     FExecutionRegister(CalculateChangedPositionRequest)
 ], CalculateChangedPositionExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CalculateChangedPositionExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalculateChangedPositionExecution, decorators: [{
             type: Injectable
         }] });
 
@@ -4227,12 +4537,12 @@ let CalculateChangedSizeExecution = class CalculateChangedSizeExecution {
         return RectExtensions.copy(result);
     }
 };
-CalculateChangedSizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CalculateChangedSizeExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-CalculateChangedSizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CalculateChangedSizeExecution });
+CalculateChangedSizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalculateChangedSizeExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+CalculateChangedSizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalculateChangedSizeExecution });
 CalculateChangedSizeExecution = __decorate([
     FExecutionRegister(CalculateChangedSizeRequest)
 ], CalculateChangedSizeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CalculateChangedSizeExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalculateChangedSizeExecution, decorators: [{
             type: Injectable
         }] });
 
@@ -4265,12 +4575,12 @@ let GetNormalizedChildrenNodesRectExecution = class GetNormalizedChildrenNodesRe
         return RectExtensions.initialize(rect.x - padding[0], rect.y - padding[1], rect.width + padding[0] + padding[2], rect.height + +padding[1] + padding[3]);
     }
 };
-GetNormalizedChildrenNodesRectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNormalizedChildrenNodesRectExecution, deps: [{ token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-GetNormalizedChildrenNodesRectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNormalizedChildrenNodesRectExecution });
+GetNormalizedChildrenNodesRectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNormalizedChildrenNodesRectExecution, deps: [{ token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+GetNormalizedChildrenNodesRectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNormalizedChildrenNodesRectExecution });
 GetNormalizedChildrenNodesRectExecution = __decorate([
     FExecutionRegister(GetNormalizedChildrenNodesRectRequest)
 ], GetNormalizedChildrenNodesRectExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNormalizedChildrenNodesRectExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNormalizedChildrenNodesRectExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i2.FMediator }]; } });
 
@@ -4294,12 +4604,12 @@ let GetNodeResizeRestrictionsExecution = class GetNodeResizeRestrictionsExecutio
         };
     }
 };
-GetNodeResizeRestrictionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodeResizeRestrictionsExecution, deps: [{ token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-GetNodeResizeRestrictionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodeResizeRestrictionsExecution });
+GetNodeResizeRestrictionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodeResizeRestrictionsExecution, deps: [{ token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+GetNodeResizeRestrictionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodeResizeRestrictionsExecution });
 GetNodeResizeRestrictionsExecution = __decorate([
     FExecutionRegister(GetNodeResizeRestrictionsRequest)
 ], GetNodeResizeRestrictionsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodeResizeRestrictionsExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodeResizeRestrictionsExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i2.FMediator }]; } });
 
@@ -4320,12 +4630,12 @@ let NodeResizeFinalizeExecution = class NodeResizeFinalizeExecution {
         });
     }
 };
-NodeResizeFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizeFinalizeExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-NodeResizeFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizeFinalizeExecution });
+NodeResizeFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizeFinalizeExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+NodeResizeFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizeFinalizeExecution });
 NodeResizeFinalizeExecution = __decorate([
     FExecutionRegister(NodeResizeFinalizeRequest)
 ], NodeResizeFinalizeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizeFinalizeExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizeFinalizeExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
@@ -4378,12 +4688,12 @@ let NodeResizeFinalizeValidator = class NodeResizeFinalizeValidator {
         return this.fDraggableDataContext.draggableItems.some((x) => x instanceof NodeResizeDragHandler);
     }
 };
-NodeResizeFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizeFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-NodeResizeFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizeFinalizeValidator });
+NodeResizeFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizeFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+NodeResizeFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizeFinalizeValidator });
 NodeResizeFinalizeValidator = __decorate([
     FValidatorRegister(NodeResizeFinalizeRequest)
 ], NodeResizeFinalizeValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizeFinalizeValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizeFinalizeValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
@@ -4428,12 +4738,12 @@ let NodeResizePreparationExecution = class NodeResizePreparationExecution {
         return this.fComponentsStore.findNode(targetElement);
     }
 };
-NodeResizePreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizePreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-NodeResizePreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizePreparationExecution });
+NodeResizePreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizePreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+NodeResizePreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizePreparationExecution });
 NodeResizePreparationExecution = __decorate([
     FExecutionRegister(NodeResizePreparationRequest)
 ], NodeResizePreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizePreparationExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizePreparationExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -4460,12 +4770,12 @@ let NodeResizePreparationValidator = class NodeResizePreparationValidator {
         return isClosestElementHasClass(targetElement, '.f-resize-handle');
     }
 };
-NodeResizePreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizePreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-NodeResizePreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizePreparationValidator });
+NodeResizePreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizePreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+NodeResizePreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizePreparationValidator });
 NodeResizePreparationValidator = __decorate([
     FValidatorRegister(NodeResizePreparationRequest)
 ], NodeResizePreparationValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NodeResizePreparationValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NodeResizePreparationValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
 
@@ -4559,12 +4869,12 @@ let SingleSelectExecution = class SingleSelectExecution {
         this.fDraggableDataContext.selectedItems = [];
     }
 };
-SingleSelectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SingleSelectExecution, deps: [{ token: i1.PlatformService }, { token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-SingleSelectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SingleSelectExecution });
+SingleSelectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SingleSelectExecution, deps: [{ token: i1.PlatformService }, { token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+SingleSelectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SingleSelectExecution });
 SingleSelectExecution = __decorate([
     FExecutionRegister(SingleSelectRequest)
 ], SingleSelectExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SingleSelectExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SingleSelectExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1.PlatformService }, { type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -4578,12 +4888,12 @@ let SingleSelectValidator = class SingleSelectValidator {
             && !this.fDraggableDataContext.draggableItems.length;
     }
 };
-SingleSelectValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SingleSelectValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-SingleSelectValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SingleSelectValidator });
+SingleSelectValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SingleSelectValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+SingleSelectValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SingleSelectValidator });
 SingleSelectValidator = __decorate([
     FValidatorRegister(SingleSelectRequest)
 ], SingleSelectValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SingleSelectValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SingleSelectValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
 
@@ -4597,9 +4907,9 @@ class FDraggableBase extends DragAndDropBase {
         super(ngZone);
     }
 }
-FDraggableBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FDraggableBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
-FDraggableBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FDraggableBase, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FDraggableBase, decorators: [{
+FDraggableBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FDraggableBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
+FDraggableBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FDraggableBase, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FDraggableBase, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: undefined }]; } });
 
@@ -4652,12 +4962,12 @@ let ExternalItemFinalizeExecution = class ExternalItemFinalizeExecution {
         return this.fMediator.send(new GetElementRectInFlowRequest(this.dragHandler.placeholder));
     }
 };
-ExternalItemFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemFinalizeExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
-ExternalItemFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemFinalizeExecution });
+ExternalItemFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemFinalizeExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
+ExternalItemFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemFinalizeExecution });
 ExternalItemFinalizeExecution = __decorate([
     FExecutionRegister(ExternalItemFinalizeRequest)
 ], ExternalItemFinalizeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemFinalizeExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemFinalizeExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }, { type: i1.BrowserService }]; } });
 
@@ -4703,12 +5013,12 @@ let ExternalItemFinalizeValidator = class ExternalItemFinalizeValidator {
         return this.fDraggableDataContext.draggableItems.some((x) => x instanceof ExternalItemDragHandler);
     }
 };
-ExternalItemFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-ExternalItemFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemFinalizeValidator });
+ExternalItemFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+ExternalItemFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemFinalizeValidator });
 ExternalItemFinalizeValidator = __decorate([
     FValidatorRegister(ExternalItemFinalizeRequest)
 ], ExternalItemFinalizeValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemFinalizeValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemFinalizeValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
@@ -4744,12 +5054,12 @@ let ExternalItemPreparationExecution = class ExternalItemPreparationExecution {
         return this.fExternalItemService.getItem(getExternalItem(targetElement));
     }
 };
-ExternalItemPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemPreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: FExternalItemService }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
-ExternalItemPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemPreparationExecution });
+ExternalItemPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemPreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: FExternalItemService }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
+ExternalItemPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemPreparationExecution });
 ExternalItemPreparationExecution = __decorate([
     FExecutionRegister(ExternalItemPreparationRequest)
 ], ExternalItemPreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemPreparationExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemPreparationExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: FExternalItemService }, { type: i1.BrowserService }]; } });
 
@@ -4765,12 +5075,12 @@ let ExternalItemPreparationValidator = class ExternalItemPreparationValidator {
         return this.fExternalItemService.getItem(getExternalItem(targetElement));
     }
 };
-ExternalItemPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemPreparationValidator, deps: [{ token: FExternalItemService }], target: i0.ɵɵFactoryTarget.Injectable });
-ExternalItemPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemPreparationValidator });
+ExternalItemPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemPreparationValidator, deps: [{ token: FExternalItemService }], target: i0.ɵɵFactoryTarget.Injectable });
+ExternalItemPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemPreparationValidator });
 ExternalItemPreparationValidator = __decorate([
     FValidatorRegister(ExternalItemPreparationRequest)
 ], ExternalItemPreparationValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ExternalItemPreparationValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalItemPreparationValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FExternalItemService }]; } });
 
@@ -4787,9 +5097,9 @@ const F_EXTERNAL_ITEM_DRAG_AND_DROP_PROVIDERS = [
 const F_EXTERNAL_ITEM = new InjectionToken('F_EXTERNAL_ITEM');
 class FExternalItemBase {
 }
-FExternalItemBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FExternalItemBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-FExternalItemBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FExternalItemBase, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FExternalItemBase, decorators: [{
+FExternalItemBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FExternalItemBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+FExternalItemBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FExternalItemBase, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FExternalItemBase, decorators: [{
             type: Directive
         }] });
 
@@ -4817,22 +5127,22 @@ class FExternalItemService {
         }
     }
 }
-FExternalItemService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FExternalItemService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-FExternalItemService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FExternalItemService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FExternalItemService, decorators: [{
+FExternalItemService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FExternalItemService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+FExternalItemService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FExternalItemService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FExternalItemService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
         }] });
 
-let uniqueId$5 = 0;
+let uniqueId$3 = 0;
 class FExternalItemDirective extends FExternalItemBase {
     constructor(elementReference, fExternalItemService) {
         super();
         this.elementReference = elementReference;
         this.fExternalItemService = fExternalItemService;
-        this.fExternalItemId = `f-external-item-${uniqueId$5++}`;
+        this.fExternalItemId = `f-external-item-${uniqueId$3++}`;
         this.fDisabled = false;
     }
     get hostElement() {
@@ -4852,11 +5162,11 @@ class FExternalItemDirective extends FExternalItemBase {
         this.fExternalItemService.removeItem(this);
     }
 }
-FExternalItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FExternalItemDirective, deps: [{ token: i0.ElementRef }, { token: FExternalItemService }], target: i0.ɵɵFactoryTarget.Directive });
-FExternalItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FExternalItemDirective, selector: "[fExternalItem]", inputs: { fExternalItemId: "fExternalItemId", fData: "fData", fDisabled: "fDisabled" }, host: { properties: { "attr.id": "fExternalItemId", "class.f-external-item-disabled": "fDisabled" }, classAttribute: "f-component f-external-item" }, providers: [
+FExternalItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FExternalItemDirective, deps: [{ token: i0.ElementRef }, { token: FExternalItemService }], target: i0.ɵɵFactoryTarget.Directive });
+FExternalItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FExternalItemDirective, selector: "[fExternalItem]", inputs: { fExternalItemId: "fExternalItemId", fData: "fData", fDisabled: "fDisabled" }, host: { properties: { "attr.id": "fExternalItemId", "class.f-external-item-disabled": "fDisabled" }, classAttribute: "f-component f-external-item" }, providers: [
         { provide: F_EXTERNAL_ITEM, useExisting: FExternalItemDirective }
     ], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FExternalItemDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FExternalItemDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[fExternalItem]",
@@ -5002,20 +5312,22 @@ class FDraggableDirective extends FDraggableBase {
         this.subscriptions$.unsubscribe();
     }
 }
-FDraggableDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FDraggableDirective, deps: [{ token: i0.ElementRef }, { token: FDraggableDataContext }, { token: NgZone, optional: true }, { token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
-FDraggableDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FDraggableDirective, selector: "f-flow[fDraggable]", inputs: { disabled: ["fDraggableDisabled", "disabled"] }, outputs: { fSelectionChange: "fSelectionChange", fCreateNode: "fCreateNode", fReassignConnection: "fReassignConnection", fCreateConnection: "fCreateConnection" }, queries: [{ propertyName: "plugins", predicate: F_DRAG_AND_DROP_PLUGIN, descendants: true }], exportAs: ["fDraggable"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FDraggableDirective, decorators: [{
+FDraggableDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FDraggableDirective, deps: [{ token: i0.ElementRef }, { token: FDraggableDataContext }, { token: NgZone, optional: true }, { token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
+FDraggableDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FDraggableDirective, selector: "f-flow[fDraggable]", inputs: { disabled: ["fDraggableDisabled", "disabled"] }, outputs: { fSelectionChange: "fSelectionChange", fCreateNode: "fCreateNode", fReassignConnection: "fReassignConnection", fCreateConnection: "fCreateConnection" }, queries: [{ propertyName: "plugins", predicate: F_DRAG_AND_DROP_PLUGIN, descendants: true }], exportAs: ["fDraggable"], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FDraggableDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "f-flow[fDraggable]",
                     exportAs: 'fDraggable'
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FDraggableDataContext }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [NgZone]
-                }, {
-                    type: Optional
-                }] }, { type: FComponentsStore }, { type: i2.FMediator }, { type: i1.BrowserService }]; }, propDecorators: { disabled: [{
+        }], ctorParameters: function () {
+        return [{ type: i0.ElementRef }, { type: FDraggableDataContext }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [NgZone]
+                    }, {
+                        type: Optional
+                    }] }, { type: FComponentsStore }, { type: i2.FMediator }, { type: i1.BrowserService }];
+    }, propDecorators: { disabled: [{
                 type: Input,
                 args: ['fDraggableDisabled']
             }], fSelectionChange: [{
@@ -5038,13 +5350,6 @@ class FSelectionChangeEvent {
     }
 }
 
-class MinimapDragPreparationRequest {
-    constructor(event, minimap) {
-        this.event = event;
-        this.minimap = minimap;
-    }
-}
-
 class CalculateFlowPointFromMinimapPointRequest {
     constructor(flowRect, canvasPosition, eventPoint, minimap) {
         this.flowRect = flowRect;
@@ -5079,15 +5384,41 @@ let CalculateFlowPointFromMinimapPointExecution = class CalculateFlowPointFromMi
         return Point.fromPoint(eventPoint).elementTransform(minimap.element);
     }
 };
-CalculateFlowPointFromMinimapPointExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CalculateFlowPointFromMinimapPointExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-CalculateFlowPointFromMinimapPointExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CalculateFlowPointFromMinimapPointExecution });
+CalculateFlowPointFromMinimapPointExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalculateFlowPointFromMinimapPointExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+CalculateFlowPointFromMinimapPointExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalculateFlowPointFromMinimapPointExecution });
 CalculateFlowPointFromMinimapPointExecution = __decorate([
     FExecutionRegister(CalculateFlowPointFromMinimapPointRequest)
 ], CalculateFlowPointFromMinimapPointExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CalculateFlowPointFromMinimapPointExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalculateFlowPointFromMinimapPointExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
+class MinimapDragFinalizeRequest {
+    constructor(event) {
+        this.event = event;
+    }
+}
+
+let MinimapDragFinalizeExecution = class MinimapDragFinalizeExecution {
+    constructor(fDraggableDataContext) {
+        this.fDraggableDataContext = fDraggableDataContext;
+    }
+    handle(request) {
+        this.fDraggableDataContext.draggableItems.forEach((x) => {
+            var _a;
+            (_a = x.complete) === null || _a === void 0 ? void 0 : _a.call(x);
+        });
+    }
+};
+MinimapDragFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragFinalizeExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+MinimapDragFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragFinalizeExecution });
+MinimapDragFinalizeExecution = __decorate([
+    FExecutionRegister(MinimapDragFinalizeRequest)
+], MinimapDragFinalizeExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragFinalizeExecution, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
+
 class FMinimapDragHandler {
     constructor(fComponentsStore, fMediator, flowRect, canvasPosition, eventPoint, minimap) {
         this.fComponentsStore = fComponentsStore;
@@ -5123,6 +5454,35 @@ class FMinimapDragHandler {
     }
 }
 
+let MinimapDragFinalizeValidator = class MinimapDragFinalizeValidator {
+    constructor(fDraggableDataContext) {
+        this.fDraggableDataContext = fDraggableDataContext;
+    }
+    handle(request) {
+        return this.fDraggableDataContext.draggableItems.some((x) => x instanceof FMinimapDragHandler);
+    }
+};
+MinimapDragFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+MinimapDragFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragFinalizeValidator });
+MinimapDragFinalizeValidator = __decorate([
+    FValidatorRegister(MinimapDragFinalizeRequest)
+], MinimapDragFinalizeValidator);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragFinalizeValidator, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
+
+const MINIMAP_DRAG_FINALIZE_PROVIDERS = [
+    MinimapDragFinalizeExecution,
+    MinimapDragFinalizeValidator,
+];
+
+class MinimapDragPreparationRequest {
+    constructor(event, minimap) {
+        this.event = event;
+        this.minimap = minimap;
+    }
+}
+
 let MinimapDragPreparationExecution = class MinimapDragPreparationExecution {
     constructor(fComponentsStore, fMediator, fDraggableDataContext) {
         this.fComponentsStore = fComponentsStore;
@@ -5151,12 +5511,12 @@ let MinimapDragPreparationExecution = class MinimapDragPreparationExecution {
         return RectExtensions.fromElement(this.flowHost);
     }
 };
-MinimapDragPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragPreparationExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-MinimapDragPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragPreparationExecution });
+MinimapDragPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragPreparationExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+MinimapDragPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragPreparationExecution });
 MinimapDragPreparationExecution = __decorate([
     FExecutionRegister(MinimapDragPreparationRequest)
 ], MinimapDragPreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragPreparationExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragPreparationExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }, { type: FDraggableDataContext }]; } });
 
@@ -5171,12 +5531,12 @@ let MinimapDragPreparationValidator = class MinimapDragPreparationValidator {
             this.fComponentsStore.flowHost.contains(request.event.targetElement);
     }
 };
-MinimapDragPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragPreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-MinimapDragPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragPreparationValidator });
+MinimapDragPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragPreparationValidator, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+MinimapDragPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragPreparationValidator });
 MinimapDragPreparationValidator = __decorate([
     FValidatorRegister(MinimapDragPreparationRequest)
 ], MinimapDragPreparationValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragPreparationValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MinimapDragPreparationValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
 
@@ -5185,53 +5545,20 @@ const MINIMAP_DRAG_PREPARATION_PROVIDERS = [
     MinimapDragPreparationValidator,
 ];
 
-class MinimapDragFinalizeRequest {
-    constructor(event) {
-        this.event = event;
+function checkRectIsFinite(rect) {
+    if (!Number.isFinite(rect.width) || !Number.isFinite(rect.height) || !Number.isFinite(rect.x) || !Number.isFinite(rect.y)) {
+        return RectExtensions.initialize(0, 0, 0, 0);
     }
+    return rect;
 }
 
-let MinimapDragFinalizeExecution = class MinimapDragFinalizeExecution {
-    constructor(fDraggableDataContext) {
-        this.fDraggableDataContext = fDraggableDataContext;
-    }
-    handle(request) {
-        this.fDraggableDataContext.draggableItems.forEach((x) => {
-            var _a;
-            (_a = x.complete) === null || _a === void 0 ? void 0 : _a.call(x);
-        });
-    }
-};
-MinimapDragFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragFinalizeExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-MinimapDragFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragFinalizeExecution });
-MinimapDragFinalizeExecution = __decorate([
-    FExecutionRegister(MinimapDragFinalizeRequest)
-], MinimapDragFinalizeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragFinalizeExecution, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
-
-let MinimapDragFinalizeValidator = class MinimapDragFinalizeValidator {
-    constructor(fDraggableDataContext) {
-        this.fDraggableDataContext = fDraggableDataContext;
-    }
-    handle(request) {
-        return this.fDraggableDataContext.draggableItems.some((x) => x instanceof FMinimapDragHandler);
+class FMinimapData {
+    constructor(element, scale = 1, viewBox = RectExtensions.initialize(0, 0, 0, 0)) {
+        this.element = element;
+        this.scale = scale;
+        this.viewBox = viewBox;
     }
-};
-MinimapDragFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-MinimapDragFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragFinalizeValidator });
-MinimapDragFinalizeValidator = __decorate([
-    FValidatorRegister(MinimapDragFinalizeRequest)
-], MinimapDragFinalizeValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MinimapDragFinalizeValidator, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
-
-const MINIMAP_DRAG_FINALIZE_PROVIDERS = [
-    MinimapDragFinalizeExecution,
-    MinimapDragFinalizeValidator,
-];
+}
 
 const F_MINIMAP_DRAG_AND_DROP_PROVIDERS = [
     CalculateFlowPointFromMinimapPointExecution,
@@ -5256,12 +5583,12 @@ let SelectionAreaFinalizeExecution = class SelectionAreaFinalizeExecution {
         });
     }
 };
-SelectionAreaFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaFinalizeExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-SelectionAreaFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaFinalizeExecution });
+SelectionAreaFinalizeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaFinalizeExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+SelectionAreaFinalizeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaFinalizeExecution });
 SelectionAreaFinalizeExecution = __decorate([
     FExecutionRegister(SelectionAreaFinalizeRequest)
 ], SelectionAreaFinalizeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaFinalizeExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaFinalizeExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
@@ -5321,12 +5648,12 @@ let SelectionAreaFinalizeValidator = class SelectionAreaFinalizeValidator {
         return this.fDraggableDataContext.draggableItems.some((x) => x instanceof SelectionAreaDragHandle);
     }
 };
-SelectionAreaFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-SelectionAreaFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaFinalizeValidator });
+SelectionAreaFinalizeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaFinalizeValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+SelectionAreaFinalizeValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaFinalizeValidator });
 SelectionAreaFinalizeValidator = __decorate([
     FValidatorRegister(SelectionAreaFinalizeRequest)
 ], SelectionAreaFinalizeValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaFinalizeValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaFinalizeValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
@@ -5360,12 +5687,12 @@ let SelectionAreaPreparationExecution = class SelectionAreaPreparationExecution
             .elementTransform(this.flowHost);
     }
 };
-SelectionAreaPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaPreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-SelectionAreaPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaPreparationExecution });
+SelectionAreaPreparationExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaPreparationExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+SelectionAreaPreparationExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaPreparationExecution });
 SelectionAreaPreparationExecution = __decorate([
     FExecutionRegister(SelectionAreaPreparationRequest)
 ], SelectionAreaPreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaPreparationExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaPreparationExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -5384,12 +5711,12 @@ let SelectionAreaPreparationValidator = class SelectionAreaPreparationValidator
         return event.shiftKey;
     }
 };
-SelectionAreaPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaPreparationValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-SelectionAreaPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaPreparationValidator });
+SelectionAreaPreparationValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaPreparationValidator, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+SelectionAreaPreparationValidator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaPreparationValidator });
 SelectionAreaPreparationValidator = __decorate([
     FValidatorRegister(SelectionAreaPreparationRequest)
 ], SelectionAreaPreparationValidator);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectionAreaPreparationValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectionAreaPreparationValidator, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
@@ -5403,9 +5730,66 @@ const F_SELECTION_AREA_DRAG_AND_DROP_PROVIDERS = [
     ...SELECTION_AREA_PREPARATION_PROVIDERS
 ];
 
-const F_DRAGGABLE_PROVIDERS = [
-    ...CANVAS_PROVIDERS,
-    ...CONNECTIONS_PROVIDERS,
+class FSelectionAreaBase {
+}
+FSelectionAreaBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FSelectionAreaBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+FSelectionAreaBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FSelectionAreaBase, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FSelectionAreaBase, decorators: [{
+            type: Directive
+        }] });
+
+class FSelectionAreaComponent extends FSelectionAreaBase {
+    constructor(elementReference, fMediator) {
+        super();
+        this.elementReference = elementReference;
+        this.fMediator = fMediator;
+    }
+    get hostElement() {
+        return this.elementReference.nativeElement;
+    }
+    ngOnInit() {
+        this.hostElement.style.display = 'none';
+    }
+    hide() {
+        this.hostElement.style.display = 'none';
+    }
+    show() {
+        this.hostElement.style.display = 'block';
+    }
+    draw(object) {
+        const style = this.hostElement.style;
+        style.left = object.x + 'px';
+        style.top = object.y + 'px';
+        style.width = object.width + 'px';
+        style.height = object.height + 'px';
+    }
+    onPointerDown(event) {
+        this.fMediator.send(new SelectionAreaPreparationRequest(event, this));
+    }
+    onPointerUp(event) {
+        this.fMediator.send(new SelectionAreaFinalizeRequest(event));
+    }
+}
+FSelectionAreaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FSelectionAreaComponent, deps: [{ token: i0.ElementRef }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Component });
+FSelectionAreaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FSelectionAreaComponent, selector: "f-selection-area", host: { classAttribute: "f-selection-area f-component" }, providers: [
+        { provide: F_DRAG_AND_DROP_PLUGIN, useExisting: FSelectionAreaComponent },
+    ], usesInheritance: true, ngImport: i0, template: ``, isInline: true, styles: [":host{position:absolute}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FSelectionAreaComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "f-selection-area", template: ``, host: {
+                        'class': 'f-selection-area f-component'
+                    }, providers: [
+                        { provide: F_DRAG_AND_DROP_PLUGIN, useExisting: FSelectionAreaComponent },
+                    ], styles: [":host{position:absolute}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i2.FMediator }]; } });
+
+const F_SELECTION_AREA_PROVIDERS = [
+    FSelectionAreaComponent
+];
+
+const F_DRAGGABLE_PROVIDERS = [
+    ...CANVAS_PROVIDERS,
+    ...CONNECTIONS_PROVIDERS,
     ...DRAG_AND_DROP_COMMON_PROVIDERS,
     ...SINGLE_SELECT_PROVIDERS,
     ...F_EXTERNAL_ITEM_DRAG_AND_DROP_PROVIDERS,
@@ -5425,12 +5809,12 @@ let ClearSelectionExecution = class ClearSelectionExecution {
         this.fDraggableDataContext.isSelectedChanged = true;
     }
 };
-ClearSelectionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ClearSelectionExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-ClearSelectionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ClearSelectionExecution });
+ClearSelectionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ClearSelectionExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+ClearSelectionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ClearSelectionExecution });
 ClearSelectionExecution = __decorate([
     FExecutionRegister(ClearSelectionRequest)
 ], ClearSelectionExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ClearSelectionExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ClearSelectionExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
@@ -5455,12 +5839,12 @@ let GetSelectionExecution = class GetSelectionExecution {
         return new FSelectionChangeEvent(selectedNodes, selectedConnections);
     }
 };
-GetSelectionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetSelectionExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-GetSelectionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetSelectionExecution });
+GetSelectionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetSelectionExecution, deps: [{ token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+GetSelectionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetSelectionExecution });
 GetSelectionExecution = __decorate([
     FExecutionRegister(GetSelectionRequest)
 ], GetSelectionExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetSelectionExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetSelectionExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }]; } });
 
@@ -5498,12 +5882,12 @@ let SelectExecution = class SelectExecution {
         this.fDraggableDataContext.isSelectedChanged = true;
     }
 };
-SelectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-SelectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectExecution });
+SelectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+SelectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectExecution });
 SelectExecution = __decorate([
     FExecutionRegister(SelectRequest)
 ], SelectExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
 
@@ -5531,12 +5915,12 @@ let SelectAllExecution = class SelectAllExecution {
         this.fDraggableDataContext.isSelectedChanged = true;
     }
 };
-SelectAllExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectAllExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
-SelectAllExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectAllExecution });
+SelectAllExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectAllExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }], target: i0.ɵɵFactoryTarget.Injectable });
+SelectAllExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectAllExecution });
 SelectAllExecution = __decorate([
     FExecutionRegister(SelectAllRequest)
 ], SelectAllExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectAllExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectAllExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }]; } });
 
@@ -5571,12 +5955,12 @@ let MoveFrontElementsBeforeTargetElementExecution = class MoveFrontElementsBefor
         });
     }
 };
-MoveFrontElementsBeforeTargetElementExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MoveFrontElementsBeforeTargetElementExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-MoveFrontElementsBeforeTargetElementExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MoveFrontElementsBeforeTargetElementExecution });
+MoveFrontElementsBeforeTargetElementExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MoveFrontElementsBeforeTargetElementExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+MoveFrontElementsBeforeTargetElementExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MoveFrontElementsBeforeTargetElementExecution });
 MoveFrontElementsBeforeTargetElementExecution = __decorate([
     FExecutionRegister(MoveFrontElementsBeforeTargetElementRequest)
 ], MoveFrontElementsBeforeTargetElementExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MoveFrontElementsBeforeTargetElementExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MoveFrontElementsBeforeTargetElementExecution, decorators: [{
             type: Injectable
         }] });
 
@@ -5612,12 +5996,12 @@ let GetDeepChildrenNodesAndGroupsExecution = class GetDeepChildrenNodesAndGroups
         return result;
     }
 };
-GetDeepChildrenNodesAndGroupsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetDeepChildrenNodesAndGroupsExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetDeepChildrenNodesAndGroupsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetDeepChildrenNodesAndGroupsExecution });
+GetDeepChildrenNodesAndGroupsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetDeepChildrenNodesAndGroupsExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetDeepChildrenNodesAndGroupsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetDeepChildrenNodesAndGroupsExecution });
 GetDeepChildrenNodesAndGroupsExecution = __decorate([
     FExecutionRegister(GetDeepChildrenNodesAndGroupsRequest)
 ], GetDeepChildrenNodesAndGroupsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetDeepChildrenNodesAndGroupsExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetDeepChildrenNodesAndGroupsExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
@@ -5696,12 +6080,12 @@ let UpdateItemAndChildrenLayersExecution = class UpdateItemAndChildrenLayersExec
         return this.fMediator.send(new GetDeepChildrenNodesAndGroupsRequest(fId)).map((x) => x.hostElement);
     }
 };
-UpdateItemAndChildrenLayersExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: UpdateItemAndChildrenLayersExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-UpdateItemAndChildrenLayersExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: UpdateItemAndChildrenLayersExecution });
+UpdateItemAndChildrenLayersExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: UpdateItemAndChildrenLayersExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+UpdateItemAndChildrenLayersExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: UpdateItemAndChildrenLayersExecution });
 UpdateItemAndChildrenLayersExecution = __decorate([
     FExecutionRegister(UpdateItemAndChildrenLayersRequest)
 ], UpdateItemAndChildrenLayersExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: UpdateItemAndChildrenLayersExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: UpdateItemAndChildrenLayersExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
@@ -5722,12 +6106,12 @@ let SelectAndUpdateNodeLayerExecution = class SelectAndUpdateNodeLayerExecution
         }
     }
 };
-SelectAndUpdateNodeLayerExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectAndUpdateNodeLayerExecution, deps: [{ token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-SelectAndUpdateNodeLayerExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectAndUpdateNodeLayerExecution });
+SelectAndUpdateNodeLayerExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectAndUpdateNodeLayerExecution, deps: [{ token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+SelectAndUpdateNodeLayerExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectAndUpdateNodeLayerExecution });
 SelectAndUpdateNodeLayerExecution = __decorate([
     FExecutionRegister(SelectAndUpdateNodeLayerRequest)
 ], SelectAndUpdateNodeLayerExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SelectAndUpdateNodeLayerExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectAndUpdateNodeLayerExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -5739,45 +6123,6 @@ const F_SELECTION_FEATURES = [
     SelectAndUpdateNodeLayerExecution
 ];
 
-class GetElementRectInFlowRequest {
-    constructor(element) {
-        this.element = element;
-    }
-}
-
-let GetElementRectInFlowExecution = class GetElementRectInFlowExecution {
-    constructor(fComponentsStore, fMediator) {
-        this.fComponentsStore = fComponentsStore;
-        this.fMediator = fMediator;
-    }
-    get transform() {
-        return this.fComponentsStore.transform;
-    }
-    get flowHost() {
-        return this.fComponentsStore.flowHost;
-    }
-    handle(request) {
-        const systemRect = this.fMediator.send(new CreateRoundedRectFromElementRequest(request.element));
-        const position = this.transformElementPositionInFlow(systemRect);
-        const size = this.transformElementSizeInFlow(systemRect);
-        return new RoundedRect(position.x, position.y, size.width, size.height, systemRect.radius1, systemRect.radius2, systemRect.radius3, systemRect.radius4);
-    }
-    transformElementPositionInFlow(rect) {
-        return Point.fromPoint(rect).elementTransform(this.flowHost).sub(this.transform.scaledPosition).sub(this.transform.position).div(this.transform.scale);
-    }
-    transformElementSizeInFlow(rect) {
-        return SizeExtensions.initialize(rect.width / this.transform.scale, rect.height / this.transform.scale);
-    }
-};
-GetElementRectInFlowExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetElementRectInFlowExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-GetElementRectInFlowExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetElementRectInFlowExecution });
-GetElementRectInFlowExecution = __decorate([
-    FExecutionRegister(GetElementRectInFlowRequest)
-], GetElementRectInFlowExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetElementRectInFlowExecution, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
-
 let GetCanBeSelectedItemsExecution = class GetCanBeSelectedItemsExecution {
     constructor(fComponentsStore, fDraggableDataContext, fMediator) {
         this.fComponentsStore = fComponentsStore;
@@ -5815,12 +6160,12 @@ let GetCanBeSelectedItemsExecution = class GetCanBeSelectedItemsExecution {
         });
     }
 };
-GetCanBeSelectedItemsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetCanBeSelectedItemsExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-GetCanBeSelectedItemsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetCanBeSelectedItemsExecution });
+GetCanBeSelectedItemsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetCanBeSelectedItemsExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+GetCanBeSelectedItemsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetCanBeSelectedItemsExecution });
 GetCanBeSelectedItemsExecution = __decorate([
     FExecutionRegister(GetCanBeSelectedItemsRequest)
 ], GetCanBeSelectedItemsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetCanBeSelectedItemsExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetCanBeSelectedItemsExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -5857,12 +6202,12 @@ let GetConnectionLineExecution = class GetConnectionLineExecution {
         return new Line(positionFixedOutbound[payload.outputSide === EFConnectableSide.AUTO ? EFConnectableSide.BOTTOM : payload.outputSide](payload.outputRect), positionFixedOutbound[payload.inputSide === EFConnectableSide.AUTO ? EFConnectableSide.TOP : payload.inputSide](payload.inputRect));
     }
 };
-GetConnectionLineExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetConnectionLineExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-GetConnectionLineExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetConnectionLineExecution });
+GetConnectionLineExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetConnectionLineExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+GetConnectionLineExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetConnectionLineExecution });
 GetConnectionLineExecution = __decorate([
     FExecutionRegister(GetConnectionLineRequest)
 ], GetConnectionLineExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetConnectionLineExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetConnectionLineExecution, decorators: [{
             type: Injectable
         }] });
 const positionFixedOutbound = {
@@ -5912,12 +6257,12 @@ let GetFlowStateConnectionsExecution = class GetFlowStateConnectionsExecution {
         });
     }
 };
-GetFlowStateConnectionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetFlowStateConnectionsExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetFlowStateConnectionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetFlowStateConnectionsExecution });
+GetFlowStateConnectionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetFlowStateConnectionsExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetFlowStateConnectionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetFlowStateConnectionsExecution });
 GetFlowStateConnectionsExecution = __decorate([
     FExecutionRegister(GetFlowStateConnectionsRequest)
 ], GetFlowStateConnectionsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetFlowStateConnectionsExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetFlowStateConnectionsExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
@@ -5961,12 +6306,12 @@ let GetFlowStateNodesExecution = class GetFlowStateNodesExecution {
         });
     }
 };
-GetFlowStateNodesExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetFlowStateNodesExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetFlowStateNodesExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetFlowStateNodesExecution });
+GetFlowStateNodesExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetFlowStateNodesExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetFlowStateNodesExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetFlowStateNodesExecution });
 GetFlowStateNodesExecution = __decorate([
     FExecutionRegister(GetFlowStateNodesRequest)
 ], GetFlowStateNodesExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetFlowStateNodesExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetFlowStateNodesExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
@@ -5991,12 +6336,12 @@ let GetFlowStateExecution = class GetFlowStateExecution {
         return PointExtensions.sum(transform.position, transform.scaledPosition);
     }
 };
-GetFlowStateExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetFlowStateExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-GetFlowStateExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetFlowStateExecution });
+GetFlowStateExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetFlowStateExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+GetFlowStateExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetFlowStateExecution });
 GetFlowStateExecution = __decorate([
     FExecutionRegister(GetFlowStateRequest)
 ], GetFlowStateExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetFlowStateExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetFlowStateExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
@@ -6026,12 +6371,12 @@ let GetScaledNodeRectsWithFlowPositionExecution = class GetScaledNodeRectsWithFl
         return this.fComponentsStore.fNodes;
     }
 };
-GetScaledNodeRectsWithFlowPositionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetScaledNodeRectsWithFlowPositionExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetScaledNodeRectsWithFlowPositionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetScaledNodeRectsWithFlowPositionExecution });
+GetScaledNodeRectsWithFlowPositionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetScaledNodeRectsWithFlowPositionExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetScaledNodeRectsWithFlowPositionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetScaledNodeRectsWithFlowPositionExecution });
 GetScaledNodeRectsWithFlowPositionExecution = __decorate([
     FExecutionRegister(GetScaledNodeRectsWithFlowPositionRequest)
 ], GetScaledNodeRectsWithFlowPositionExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetScaledNodeRectsWithFlowPositionExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetScaledNodeRectsWithFlowPositionExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
@@ -6052,12 +6397,12 @@ let GetNodesRectExecution = class GetNodesRectExecution {
         return this.fComponentsStore.fNodes;
     }
 };
-GetNodesRectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodesRectExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetNodesRectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodesRectExecution });
+GetNodesRectExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodesRectExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetNodesRectExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodesRectExecution });
 GetNodesRectExecution = __decorate([
     FExecutionRegister(GetNodesRectRequest)
 ], GetNodesRectExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetNodesRectExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetNodesRectExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
@@ -6082,12 +6427,12 @@ let GetPositionInFlowExecution = class GetPositionInFlowExecution {
             .sub(this.transform.scaledPosition).sub(this.transform.position).div(this.transform.scale);
     }
 };
-GetPositionInFlowExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetPositionInFlowExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-GetPositionInFlowExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetPositionInFlowExecution });
+GetPositionInFlowExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetPositionInFlowExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+GetPositionInFlowExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetPositionInFlowExecution });
 GetPositionInFlowExecution = __decorate([
     FExecutionRegister(GetPositionInFlowRequest)
 ], GetPositionInFlowExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: GetPositionInFlowExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetPositionInFlowExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
@@ -6147,12 +6492,12 @@ let IsConnectionUnderNodeExecution = class IsConnectionUnderNodeExecution {
         });
     }
 };
-IsConnectionUnderNodeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IsConnectionUnderNodeExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-IsConnectionUnderNodeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IsConnectionUnderNodeExecution });
+IsConnectionUnderNodeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IsConnectionUnderNodeExecution, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+IsConnectionUnderNodeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IsConnectionUnderNodeExecution });
 IsConnectionUnderNodeExecution = __decorate([
     FExecutionRegister(IsConnectionUnderNodeRequest)
 ], IsConnectionUnderNodeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IsConnectionUnderNodeExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IsConnectionUnderNodeExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }]; } });
 
@@ -6202,12 +6547,12 @@ let RedrawConnectionsExecution = class RedrawConnectionsExecution {
         this.fMediator.send(new CreateConnectionMarkersRequest(connection));
     }
 };
-RedrawConnectionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RedrawConnectionsExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-RedrawConnectionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RedrawConnectionsExecution });
+RedrawConnectionsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RedrawConnectionsExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
+RedrawConnectionsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RedrawConnectionsExecution });
 RedrawConnectionsExecution = __decorate([
     FExecutionRegister(RedrawConnectionsRequest)
 ], RedrawConnectionsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RedrawConnectionsExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RedrawConnectionsExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
 
@@ -6224,12 +6569,12 @@ let ShowConnectionsAfterCalculationsExecution = class ShowConnectionsAfterCalcul
         });
     }
 };
-ShowConnectionsAfterCalculationsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ShowConnectionsAfterCalculationsExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-ShowConnectionsAfterCalculationsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ShowConnectionsAfterCalculationsExecution });
+ShowConnectionsAfterCalculationsExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ShowConnectionsAfterCalculationsExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+ShowConnectionsAfterCalculationsExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ShowConnectionsAfterCalculationsExecution });
 ShowConnectionsAfterCalculationsExecution = __decorate([
     FExecutionRegister(ShowConnectionsAfterCalculationsRequest)
 ], ShowConnectionsAfterCalculationsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ShowConnectionsAfterCalculationsExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ShowConnectionsAfterCalculationsExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
 
@@ -6276,12 +6621,12 @@ let SortNodeLayersExecution = class SortNodeLayersExecution {
         this.fNodesContainer.appendChild(fragment);
     }
 };
-SortNodeLayersExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SortNodeLayersExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
-SortNodeLayersExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SortNodeLayersExecution });
+SortNodeLayersExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortNodeLayersExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
+SortNodeLayersExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortNodeLayersExecution });
 SortNodeLayersExecution = __decorate([
     FExecutionRegister(SortNodeLayersRequest)
 ], SortNodeLayersExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SortNodeLayersExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortNodeLayersExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }, { type: i1.BrowserService }]; } });
 
@@ -6330,12 +6675,12 @@ let SortItemsByParentExecution = class SortItemsByParentExecution {
         this.fItemsContainer.insertBefore(fragment, nextSibling);
     }
 };
-SortItemsByParentExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SortItemsByParentExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
-SortItemsByParentExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SortItemsByParentExecution });
+SortItemsByParentExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortItemsByParentExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
+SortItemsByParentExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortItemsByParentExecution });
 SortItemsByParentExecution = __decorate([
     FExecutionRegister(SortItemsByParentRequest)
 ], SortItemsByParentExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SortItemsByParentExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortItemsByParentExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }, { type: i1.BrowserService }]; } });
 
@@ -6353,12 +6698,12 @@ let SortItemLayersExecution = class SortItemLayersExecution {
         this.fMediator.send(new SortItemsByParentRequest(this.fComponentsStore.fCanvas.fNodesContainer.nativeElement));
     }
 };
-SortItemLayersExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SortItemLayersExecution, deps: [{ token: i2.FMediator }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-SortItemLayersExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SortItemLayersExecution });
+SortItemLayersExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortItemLayersExecution, deps: [{ token: i2.FMediator }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+SortItemLayersExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortItemLayersExecution });
 SortItemLayersExecution = __decorate([
     FExecutionRegister(SortItemLayersRequest)
 ], SortItemLayersExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SortItemLayersExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SortItemLayersExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i2.FMediator }, { type: FComponentsStore }]; } });
 
@@ -6374,424 +6719,24 @@ let SubscribeOnTransformChangesExecution = class SubscribeOnTransformChangesExec
         return merge(this.fTransformStore.changes, this.fComponentsStore.componentsData$, this.fComponentsStore.componentsCount$);
     }
 };
-SubscribeOnTransformChangesExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SubscribeOnTransformChangesExecution, deps: [{ token: FTransformStore }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-SubscribeOnTransformChangesExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SubscribeOnTransformChangesExecution });
+SubscribeOnTransformChangesExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SubscribeOnTransformChangesExecution, deps: [{ token: FTransformStore }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
+SubscribeOnTransformChangesExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SubscribeOnTransformChangesExecution });
 SubscribeOnTransformChangesExecution = __decorate([
     FExecutionRegister(SubscribeOnTransformChangesRequest)
 ], SubscribeOnTransformChangesExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SubscribeOnTransformChangesExecution, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SubscribeOnTransformChangesExecution, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: FTransformStore }, { type: FComponentsStore }]; } });
 
-const F_CANVAS_ANIMATION_DURATION = 150;
-
-function createSVGElement(tag, fBrowser) {
-    return fBrowser.document.createElementNS('http://www.w3.org/2000/svg', tag);
-}
-
-class CenterGroupOrNodeRequest {
-    constructor(id, animated) {
-        this.id = id;
-        this.animated = animated;
-    }
-}
-
-let CenterGroupOrNodeExecution = class CenterGroupOrNodeExecution {
-    constructor(fComponentsStore) {
-        this.fComponentsStore = fComponentsStore;
-    }
-    get transform() {
-        return this.fComponentsStore.fCanvas.transform;
-    }
-    handle(request) {
-        const fNode = this.getNode(request.id);
-        if (!fNode) {
-            return;
-        }
-        this.toCenter(this.getNodeRect(fNode), this.getFlowRect(), fNode.position);
-        request.animated ? this.fComponentsStore.fCanvas.redrawWithAnimation() : this.fComponentsStore.fCanvas.redraw();
-        this.fComponentsStore.fCanvas.emitCanvasChangeEvent();
-        setTimeout(() => this.fComponentsStore.componentDataChanged(), F_CANVAS_ANIMATION_DURATION);
-    }
-    toCenter(fNodeRect, fFlowRect, position) {
-        this.transform.scaledPosition = PointExtensions.initialize();
-        this.transform.position = PointExtensions.initialize((fFlowRect.width - fNodeRect.width) / 2 - position.x * this.transform.scale, (fFlowRect.height - fNodeRect.height) / 2 - position.y * this.transform.scale);
-    }
-    getNode(id) {
-        return this.fComponentsStore.fNodes.find((x) => x.fId === id);
-    }
-    getNodeRect(fNode) {
-        return RectExtensions.fromElement(fNode.hostElement);
-    }
-    getFlowRect() {
-        return RectExtensions.fromElement(this.fComponentsStore.fFlow.hostElement);
-    }
-};
-CenterGroupOrNodeExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CenterGroupOrNodeExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-CenterGroupOrNodeExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CenterGroupOrNodeExecution });
-CenterGroupOrNodeExecution = __decorate([
-    FExecutionRegister(CenterGroupOrNodeRequest)
-], CenterGroupOrNodeExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CenterGroupOrNodeExecution, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
-
-class FitToFlowRequest {
-    constructor(toCenter, animated) {
-        this.toCenter = toCenter;
-        this.animated = animated;
-    }
-}
-
-let FitToFlowExecution = class FitToFlowExecution {
-    constructor(fComponentsStore, fMediator) {
-        this.fComponentsStore = fComponentsStore;
-        this.fMediator = fMediator;
-    }
-    get transform() {
-        return this.fComponentsStore.fCanvas.transform;
-    }
-    handle(request) {
-        const fNodesRect = this.fMediator.send(new GetNodesRectRequest()) || RectExtensions.initialize();
-        if (fNodesRect.width === 0 || fNodesRect.height === 0) {
-            return;
-        }
-        this.fitToParent(fNodesRect, RectExtensions.fromElement(this.fComponentsStore.fFlow.hostElement), this.fComponentsStore.fNodes.map((x) => x.position), request.toCenter);
-        request.animated ? this.fComponentsStore.fCanvas.redrawWithAnimation() : this.fComponentsStore.fCanvas.redraw();
-        this.fComponentsStore.fCanvas.emitCanvasChangeEvent();
-        setTimeout(() => this.fComponentsStore.componentDataChanged(), F_CANVAS_ANIMATION_DURATION);
-    }
-    fitToParent(rect, parentRect, points, toCenter) {
-        this.transform.scaledPosition = PointExtensions.initialize();
-        this.transform.position = this.getZeroPositionWithoutScale(points);
-        const itemsContainerWidth = (rect.width / this.transform.scale) + toCenter.x;
-        const itemsContainerHeight = (rect.height / this.transform.scale) + toCenter.y;
-        if ((itemsContainerWidth > parentRect.width || itemsContainerHeight > parentRect.height) ||
-            itemsContainerWidth < parentRect.width && itemsContainerHeight < parentRect.height) {
-            this.transform.scale = Math.min(parentRect.width / itemsContainerWidth, parentRect.height / itemsContainerHeight);
-        }
-        const newX = (parentRect.width - itemsContainerWidth * this.transform.scale) / 2 - this.transform.position.x * this.transform.scale;
-        const newY = (parentRect.height - itemsContainerHeight * this.transform.scale) / 2 - this.transform.position.y * this.transform.scale;
-        this.transform.position = PointExtensions.initialize(newX + (toCenter.x / 2) * this.transform.scale, newY + (toCenter.y / 2) * this.transform.scale);
-    }
-    getZeroPositionWithoutScale(points) {
-        const xPoint = points.length ? Math.min(...points.map((point) => point.x)) : 0;
-        const yPoint = points.length ? Math.min(...points.map((point) => point.y)) : 0;
-        return PointExtensions.initialize(xPoint, yPoint);
-    }
-};
-FitToFlowExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FitToFlowExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-FitToFlowExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FitToFlowExecution });
-FitToFlowExecution = __decorate([
-    FExecutionRegister(FitToFlowRequest)
-], FitToFlowExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FitToFlowExecution, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
-
-class InputCanvasPositionRequest {
-    constructor(transform, position) {
-        this.transform = transform;
-        this.position = position;
-    }
-}
-
-let InputCanvasPositionExecution = class InputCanvasPositionExecution {
-    constructor(fComponentsStore) {
-        this.fComponentsStore = fComponentsStore;
-    }
-    handle(request) {
-        var _a;
-        if (!request.position) {
-            return;
-        }
-        const position = PointExtensions.sum(request.transform.position, request.transform.scaledPosition);
-        if (!PointExtensions.isEqual(position, request.position)) {
-            request.transform.position = request.position;
-            request.transform.scaledPosition = PointExtensions.initialize();
-            (_a = this.fComponentsStore.fCanvas) === null || _a === void 0 ? void 0 : _a.redraw();
-        }
-    }
-};
-InputCanvasPositionExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: InputCanvasPositionExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-InputCanvasPositionExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: InputCanvasPositionExecution });
-InputCanvasPositionExecution = __decorate([
-    FExecutionRegister(InputCanvasPositionRequest)
-], InputCanvasPositionExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: InputCanvasPositionExecution, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
-
-class InputCanvasScaleRequest {
-    constructor(transform, scale) {
-        this.transform = transform;
-        this.scale = scale;
-    }
-}
-
-let InputCanvasScaleExecution = class InputCanvasScaleExecution {
-    constructor(fComponentsStore) {
-        this.fComponentsStore = fComponentsStore;
-    }
-    handle(request) {
-        var _a;
-        if (!request.scale) {
-            return;
-        }
-        request.transform.scale = request.scale;
-        (_a = this.fComponentsStore.fCanvas) === null || _a === void 0 ? void 0 : _a.redraw();
-    }
-};
-InputCanvasScaleExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: InputCanvasScaleExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-InputCanvasScaleExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: InputCanvasScaleExecution });
-InputCanvasScaleExecution = __decorate([
-    FExecutionRegister(InputCanvasScaleRequest)
-], InputCanvasScaleExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: InputCanvasScaleExecution, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
-
-class ResetScaleRequest {
-}
-
-let ResetScaleExecution = class ResetScaleExecution {
-    constructor(fComponentsStore) {
-        this.fComponentsStore = fComponentsStore;
-    }
-    get transform() {
-        return this.fComponentsStore.fCanvas.transform;
-    }
-    handle(request) {
-        this.transform.scale = 1;
-        this.transform.scaledPosition = PointExtensions.initialize();
-    }
-};
-ResetScaleExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ResetScaleExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-ResetScaleExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ResetScaleExecution });
-ResetScaleExecution = __decorate([
-    FExecutionRegister(ResetScaleRequest)
-], ResetScaleExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ResetScaleExecution, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
-
-class ResetScaleAndCenterRequest {
-    constructor(animated) {
-        this.animated = animated;
-    }
-}
-
-let ResetScaleAndCenterExecution = class ResetScaleAndCenterExecution {
-    constructor(fComponentsStore, fMediator) {
-        this.fComponentsStore = fComponentsStore;
-        this.fMediator = fMediator;
-    }
-    get transform() {
-        return this.fComponentsStore.fCanvas.transform;
-    }
-    handle(request) {
-        const fNodesRect = this.fMediator.send(new GetNodesRectRequest()) || RectExtensions.initialize();
-        if (fNodesRect.width === 0 || fNodesRect.height === 0) {
-            return;
-        }
-        this.oneToOneCentering(fNodesRect, RectExtensions.fromElement(this.fComponentsStore.fFlow.hostElement), this.fComponentsStore.fNodes.map((x) => x.position));
-        request.animated ? this.fComponentsStore.fCanvas.redrawWithAnimation() : this.fComponentsStore.fCanvas.redraw();
-        this.fComponentsStore.fCanvas.emitCanvasChangeEvent();
-        setTimeout(() => this.fComponentsStore.componentDataChanged(), F_CANVAS_ANIMATION_DURATION);
-    }
-    oneToOneCentering(rect, parentRect, points) {
-        this.transform.scaledPosition = PointExtensions.initialize();
-        this.transform.position = this.getZeroPositionWithoutScale(points);
-        const newX = (parentRect.width - rect.width / this.transform.scale) / 2 - this.transform.position.x;
-        const newY = (parentRect.height - rect.height / this.transform.scale) / 2 - this.transform.position.y;
-        this.transform.scale = 1;
-        this.transform.position = PointExtensions.initialize(newX, newY);
-    }
-    getZeroPositionWithoutScale(points) {
-        const xPoint = points.length ? Math.min(...points.map((point) => point.x)) : 0;
-        const yPoint = points.length ? Math.min(...points.map((point) => point.y)) : 0;
-        return PointExtensions.initialize(xPoint, yPoint);
-    }
-};
-ResetScaleAndCenterExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ResetScaleAndCenterExecution, deps: [{ token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Injectable });
-ResetScaleAndCenterExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ResetScaleAndCenterExecution });
-ResetScaleAndCenterExecution = __decorate([
-    FExecutionRegister(ResetScaleAndCenterRequest)
-], ResetScaleAndCenterExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ResetScaleAndCenterExecution, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i2.FMediator }]; } });
-
-class UpdateScaleRequest {
-    constructor(scale, toPosition) {
-        this.scale = scale;
-        this.toPosition = toPosition;
-    }
-}
-
-let UpdateScaleExecution = class UpdateScaleExecution {
-    constructor(fComponentsStore) {
-        this.fComponentsStore = fComponentsStore;
-    }
-    get transform() {
-        return this.fComponentsStore.fCanvas.transform;
-    }
-    handle(request) {
-        if (request.scale !== this.transform.scale) {
-            const summaryPosition = PointExtensions.sum(this.transform.scaledPosition, this.transform.position);
-            const newX = request.toPosition.x - (request.toPosition.x - summaryPosition.x) * request.scale / this.transform.scale;
-            const newY = request.toPosition.y - (request.toPosition.y - summaryPosition.y) * request.scale / this.transform.scale;
-            this.transform.scale = request.scale;
-            this.transform.scaledPosition = PointExtensions.sub(PointExtensions.initialize(newX, newY), this.transform.position);
-        }
-    }
-};
-UpdateScaleExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: UpdateScaleExecution, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-UpdateScaleExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: UpdateScaleExecution });
-UpdateScaleExecution = __decorate([
-    FExecutionRegister(UpdateScaleRequest)
-], UpdateScaleExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: UpdateScaleExecution, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }]; } });
-
-class FCanvasChangeEvent {
-    constructor(position, scale) {
-        this.position = position;
-        this.scale = scale;
-    }
-}
-
-const F_CANVAS_FEATURES = [
-    CenterGroupOrNodeExecution,
-    FitToFlowExecution,
-    InputCanvasPositionExecution,
-    InputCanvasScaleExecution,
-    ResetScaleExecution,
-    ResetScaleAndCenterExecution,
-    UpdateScaleExecution
-];
-
-const F_CANVAS = new InjectionToken('F_CANVAS');
-class FCanvasBase {
-    constructor() {
-        this.transform = TransformModelExtensions.default();
-    }
-    getPosition() {
-        return this.transform.position;
-    }
-    setPosition(position) {
-        this.transform.position = position;
-    }
-    emitCanvasChangeEvent() {
-        this.fCanvasChange.emit(new FCanvasChangeEvent(PointExtensions.sum(this.transform.position, this.transform.scaledPosition), this.transform.scale));
-    }
-}
-FCanvasBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FCanvasBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-FCanvasBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FCanvasBase, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FCanvasBase, decorators: [{
-            type: Directive
-        }] });
-
-class FCanvasComponent extends FCanvasBase {
-    constructor(elementReference, fMediator, fComponentsStore) {
-        super();
-        this.elementReference = elementReference;
-        this.fMediator = fMediator;
-        this.fComponentsStore = fComponentsStore;
-        this.fCanvasChange = new EventEmitter();
-    }
-    set position(value) {
-        this.fMediator.send(new InputCanvasPositionRequest(this.transform, value));
-    }
-    set scale(value) {
-        this.fMediator.send(new InputCanvasScaleRequest(this.transform, value));
-    }
-    get fNodes() {
-        return this.fComponentsStore.fNodes;
-    }
-    get hostElement() {
-        return this.elementReference.nativeElement;
-    }
-    ngOnInit() {
-        this.fComponentsStore.fCanvas = this;
-    }
-    redraw() {
-        var _a;
-        (_a = this.fComponentsStore.fBackground) === null || _a === void 0 ? void 0 : _a.setTransform(this.transform);
-        this.hostElement.setAttribute("style", `transform: ${TransformModelExtensions.toString(this.transform)}`);
-        this.fMediator.send(new EmitTransformChangesRequest());
-    }
-    redrawWithAnimation() {
-        var _a;
-        (_a = this.fComponentsStore.fBackground) === null || _a === void 0 ? void 0 : _a.setTransform(this.transform);
-        this.hostElement.setAttribute("style", `transition: transform ${F_CANVAS_ANIMATION_DURATION}ms ease-in-out; transform: ${TransformModelExtensions.toString(this.transform)}`);
-        setTimeout(() => {
-            this.redraw();
-        }, F_CANVAS_ANIMATION_DURATION);
-    }
-    centerGroupOrNode(id, animated = true) {
-        this.fMediator.send(new CenterGroupOrNodeRequest(id, animated));
-    }
-    fitToScreen(toCenter = PointExtensions.initialize(), animated = true) {
-        this.fMediator.send(new FitToFlowRequest(toCenter, animated));
-    }
-    resetScaleAndCenter(animated = true) {
-        this.fMediator.send(new ResetScaleAndCenterRequest(animated));
-    }
-    setZoom(scale, toPosition = PointExtensions.initialize()) {
-        this.fMediator.send(new UpdateScaleRequest(scale, toPosition));
-    }
-    resetZoom() {
-        this.fMediator.send(new ResetScaleRequest());
-    }
-}
-FCanvasComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FCanvasComponent, deps: [{ token: i0.ElementRef }, { token: i2.FMediator }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Component });
-FCanvasComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FCanvasComponent, selector: "f-canvas", inputs: { position: "position", scale: "scale" }, outputs: { fCanvasChange: "fCanvasChange" }, host: { classAttribute: "f-component f-canvas" }, providers: [
-        { provide: F_CANVAS, useExisting: FCanvasComponent }
-    ], viewQueries: [{ propertyName: "fGroupsContainer", first: true, predicate: ["fGroupsContainer"], descendants: true, static: true }, { propertyName: "fNodesContainer", first: true, predicate: ["fNodesContainer"], descendants: true, static: true }, { propertyName: "fConnectionsContainer", first: true, predicate: ["fConnectionsContainer"], descendants: true, static: true }], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0, template: "<ng-container>\n  <div #fGroupsContainer>\n    <ng-content select=\"[fGroup]\"></ng-content>\n  </div>\n  <div #fConnectionsContainer>\n    <ng-content select=\"f-snap-connection\"></ng-content>\n    <ng-content select=\"f-connection\"></ng-content>\n    <ng-content select=\"f-connection-for-create\"></ng-content>\n  </div>\n\n  <div #fNodesContainer>\n    <ng-content select=\"[fNode]\"></ng-content>\n  </div>\n</ng-container>\n", styles: [":host{position:absolute;overflow:visible;width:100%;height:100%;left:0;top:0;transform-origin:0 0;pointer-events:none}:host.f-scaled-animate{transition:transform .09s}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FCanvasComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'f-canvas',
-                    templateUrl: './f-canvas.component.html',
-                    styleUrls: ['./f-canvas.component.scss'],
-                    exportAs: 'fComponent',
-                    host: {
-                        'class': 'f-component f-canvas',
-                    },
-                    providers: [
-                        { provide: F_CANVAS, useExisting: FCanvasComponent }
-                    ],
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i2.FMediator }, { type: FComponentsStore }]; }, propDecorators: { fCanvasChange: [{
-                type: Output
-            }], position: [{
-                type: Input
-            }], scale: [{
-                type: Input
-            }], fGroupsContainer: [{
-                type: ViewChild,
-                args: ['fGroupsContainer', { static: true }]
-            }], fNodesContainer: [{
-                type: ViewChild,
-                args: ['fNodesContainer', { static: true }]
-            }], fConnectionsContainer: [{
-                type: ViewChild,
-                args: ['fConnectionsContainer', { static: true }]
-            }] } });
-
-const F_CANVAS_PROVIDERS = [
-    FCanvasComponent,
-];
-
-const F_BACKGROUND_FEATURES = [
-    AddPatternToBackgroundExecution
-];
+const F_CANVAS_ANIMATION_DURATION = 150;
+
+function createSVGElement(tag, fBrowser) {
+    return fBrowser.document.createElementNS('http://www.w3.org/2000/svg', tag);
+}
 
 const COMMON_PROVIDERS = [
     ...F_CANVAS_FEATURES,
+    ...F_CONNECTION_FEATURES,
     ...F_BACKGROUND_FEATURES,
     CreateConnectionMarkersExecution,
     CreateRoundedRectFromElementExecution,
@@ -6816,54 +6761,14 @@ const COMMON_PROVIDERS = [
     MoveFrontElementsBeforeTargetElementExecution,
 ];
 
-let uniqueId$4 = 0;
-let AddPatternToBackgroundExecution = class AddPatternToBackgroundExecution {
-    constructor(fComponentsStore, fBrowser) {
-        this.fComponentsStore = fComponentsStore;
-        this.fBrowser = fBrowser;
-    }
-    get fBackground() {
-        return this.fComponentsStore.fBackground;
-    }
-    handle(request) {
-        var _a, _b, _c, _d, _e, _f, _g;
-        const children = ((_a = request.fPattern) === null || _a === void 0 ? void 0 : _a.hostElement.getElementsByTagName('pattern')) || [];
-        const pattern = children.length ? children[0] : undefined;
-        if (pattern) {
-            const defs = createSVGElement('defs', this.fBrowser);
-            pattern.id = 'f-background-pattern-' + uniqueId$4++;
-            (_b = request.fPattern) === null || _b === void 0 ? void 0 : _b.hostElement.remove();
-            defs.appendChild(pattern);
-            (_d = (_c = this.fBackground.hostElement) === null || _c === void 0 ? void 0 : _c.firstChild) === null || _d === void 0 ? void 0 : _d.appendChild(defs);
-            const rect = createSVGElement('rect', this.fBrowser);
-            rect.setAttribute('fill', 'url(#' + pattern.id + ')');
-            rect.setAttribute('width', '100%');
-            rect.setAttribute('height', '100%');
-            (_e = this.fBackground.hostElement.firstChild) === null || _e === void 0 ? void 0 : _e.appendChild(rect);
-            const transform = ((_f = this.fComponentsStore.fCanvas) === null || _f === void 0 ? void 0 : _f.transform) || TransformModelExtensions.default();
-            (_g = request.fPattern) === null || _g === void 0 ? void 0 : _g.setTransform(transform);
-        }
-    }
-};
-AddPatternToBackgroundExecution.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: AddPatternToBackgroundExecution, deps: [{ token: FComponentsStore }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Injectable });
-AddPatternToBackgroundExecution.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: AddPatternToBackgroundExecution });
-AddPatternToBackgroundExecution = __decorate([
-    FExecutionRegister(AddPatternToBackgroundRequest)
-], AddPatternToBackgroundExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: AddPatternToBackgroundExecution, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FComponentsStore }, { type: i1.BrowserService }]; } });
-
-const F_BACKGROUND_PATTERN = new InjectionToken('F_BACKGROUND_PATTERN');
-
-let uniqueId$3 = 0;
+let uniqueId$2 = 0;
 class FRectPatternComponent {
     constructor(elementReference, fBrowser) {
         this.elementReference = elementReference;
         this.fBrowser = fBrowser;
         this._subscription$ = new Subscription();
         this._stateChanges = new Subject();
-        this.id = `f-pattern-${uniqueId$3++}`;
+        this.id = `f-pattern-${uniqueId$2++}`;
         this._vColor = 'rgba(0,0,0,0.1)';
         this._hColor = 'rgba(0,0,0,0.1)';
         this._vSize = 20;
@@ -6941,11 +6846,11 @@ class FRectPatternComponent {
         this._subscription$.unsubscribe();
     }
 }
-FRectPatternComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FRectPatternComponent, deps: [{ token: i0.ElementRef }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Component });
-FRectPatternComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FRectPatternComponent, selector: "f-rect-pattern", inputs: { id: "id", vColor: "vColor", hColor: "hColor", vSize: "vSize", hSize: "hSize" }, host: { properties: { "attr.id": "id" } }, providers: [
+FRectPatternComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FRectPatternComponent, deps: [{ token: i0.ElementRef }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Component });
+FRectPatternComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FRectPatternComponent, selector: "f-rect-pattern", inputs: { id: "id", vColor: "vColor", hColor: "hColor", vSize: "vSize", hSize: "hSize" }, host: { properties: { "attr.id": "id" } }, providers: [
         { provide: F_BACKGROUND_PATTERN, useExisting: FRectPatternComponent }
     ], ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FRectPatternComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FRectPatternComponent, decorators: [{
             type: Component,
             args: [{
                     selector: "f-rect-pattern",
@@ -6970,14 +6875,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 type: Input
             }] } });
 
-let uniqueId$2 = 0;
+let uniqueId$1 = 0;
 class FCirclePatternComponent {
     constructor(elementReference, fBrowser) {
         this.elementReference = elementReference;
         this.fBrowser = fBrowser;
         this._subscription$ = new Subscription();
         this._stateChanges = new Subject();
-        this.id = `f-pattern-${uniqueId$2++}`;
+        this.id = `f-pattern-${uniqueId$1++}`;
         this._color = 'rgba(0,0,0,0.1)';
         this._radius = 20;
         this._scaledRadius = 20;
@@ -7041,11 +6946,11 @@ class FCirclePatternComponent {
         this._subscription$.unsubscribe();
     }
 }
-FCirclePatternComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FCirclePatternComponent, deps: [{ token: i0.ElementRef }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Component });
-FCirclePatternComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FCirclePatternComponent, selector: "f-circle-pattern", inputs: { id: "id", color: "color", radius: "radius" }, host: { properties: { "attr.id": "id" } }, providers: [
+FCirclePatternComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FCirclePatternComponent, deps: [{ token: i0.ElementRef }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Component });
+FCirclePatternComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FCirclePatternComponent, selector: "f-circle-pattern", inputs: { id: "id", color: "color", radius: "radius" }, host: { properties: { "attr.id": "id" } }, providers: [
         { provide: F_BACKGROUND_PATTERN, useExisting: FCirclePatternComponent }
     ], ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FCirclePatternComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FCirclePatternComponent, decorators: [{
             type: Component,
             args: [{
                     selector: "f-circle-pattern",
@@ -7069,13 +6974,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 const F_BACKGROUND = new InjectionToken('F_BACKGROUND');
 class FBackgroundBase {
 }
-FBackgroundBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FBackgroundBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-FBackgroundBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FBackgroundBase, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FBackgroundBase, decorators: [{
+FBackgroundBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FBackgroundBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+FBackgroundBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FBackgroundBase, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FBackgroundBase, decorators: [{
             type: Directive
         }] });
 
-let uniqueId$1 = 0;
 class FBackgroundComponent extends FBackgroundBase {
     constructor(elementReference, fComponentsStore, fMediator) {
         super();
@@ -7103,20 +7007,13 @@ class FBackgroundComponent extends FBackgroundBase {
         this.fComponentsStore.fBackground = undefined;
     }
 }
-FBackgroundComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FBackgroundComponent, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Component });
-FBackgroundComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FBackgroundComponent, selector: "f-background", host: { classAttribute: "f-component f-background" }, providers: [{ provide: F_BACKGROUND, useExisting: FBackgroundComponent }], queries: [{ propertyName: "fBackgroundPattern", first: true, predicate: F_BACKGROUND_PATTERN, descendants: true }], usesInheritance: true, ngImport: i0, template: "<svg><ng-content></ng-content></svg>", isInline: true, styles: [":host{position:absolute;width:100%;height:100%;left:0;top:0;transform-origin:0 0;pointer-events:none}:host svg{width:100%;height:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FBackgroundComponent, decorators: [{
+FBackgroundComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FBackgroundComponent, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Component });
+FBackgroundComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FBackgroundComponent, selector: "f-background", host: { classAttribute: "f-component f-background" }, providers: [{ provide: F_BACKGROUND, useExisting: FBackgroundComponent }], queries: [{ propertyName: "fBackgroundPattern", first: true, predicate: F_BACKGROUND_PATTERN, descendants: true }], usesInheritance: true, ngImport: i0, template: "<svg><ng-content></ng-content></svg>", isInline: true, styles: [":host{position:absolute;width:100%;height:100%;left:0;top:0;transform-origin:0 0;pointer-events:none}:host svg{width:100%;height:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FBackgroundComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: "f-background",
-                    template: "<svg><ng-content></ng-content></svg>",
-                    styleUrls: ["./f-background.component.scss"],
-                    host: {
+            args: [{ selector: "f-background", template: "<svg><ng-content></ng-content></svg>", host: {
                         'class': 'f-component f-background'
-                    },
-                    providers: [{ provide: F_BACKGROUND, useExisting: FBackgroundComponent }],
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
+                    }, providers: [{ provide: F_BACKGROUND, useExisting: FBackgroundComponent }], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{position:absolute;width:100%;height:100%;left:0;top:0;transform-origin:0 0;pointer-events:none}:host svg{width:100%;height:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FComponentsStore }, { type: i2.FMediator }]; }, propDecorators: { fBackgroundPattern: [{
                 type: ContentChild,
                 args: [F_BACKGROUND_PATTERN, { static: false }]
@@ -7128,6 +7025,119 @@ const F_BACKGROUND_PROVIDERS = [
     FCirclePatternComponent
 ];
 
+class FCanvasChangeEvent {
+    constructor(position, scale) {
+        this.position = position;
+        this.scale = scale;
+    }
+}
+
+const F_CANVAS = new InjectionToken('F_CANVAS');
+class FCanvasBase {
+    constructor() {
+        this.transform = TransformModelExtensions.default();
+    }
+    getPosition() {
+        return this.transform.position;
+    }
+    setPosition(position) {
+        this.transform.position = position;
+    }
+    emitCanvasChangeEvent() {
+        this.fCanvasChange.emit(new FCanvasChangeEvent(PointExtensions.sum(this.transform.position, this.transform.scaledPosition), this.transform.scale));
+    }
+}
+FCanvasBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FCanvasBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+FCanvasBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FCanvasBase, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FCanvasBase, decorators: [{
+            type: Directive
+        }] });
+
+class FCanvasComponent extends FCanvasBase {
+    constructor(elementReference, fMediator, fComponentsStore) {
+        super();
+        this.elementReference = elementReference;
+        this.fMediator = fMediator;
+        this.fComponentsStore = fComponentsStore;
+        this.fCanvasChange = new EventEmitter();
+    }
+    set position(value) {
+        this.fMediator.send(new InputCanvasPositionRequest(this.transform, value));
+    }
+    set scale(value) {
+        this.fMediator.send(new InputCanvasScaleRequest(this.transform, value));
+    }
+    get fNodes() {
+        return this.fComponentsStore.fNodes;
+    }
+    get hostElement() {
+        return this.elementReference.nativeElement;
+    }
+    ngOnInit() {
+        this.fComponentsStore.fCanvas = this;
+    }
+    redraw() {
+        var _a;
+        (_a = this.fComponentsStore.fBackground) === null || _a === void 0 ? void 0 : _a.setTransform(this.transform);
+        this.hostElement.setAttribute("style", `transform: ${TransformModelExtensions.toString(this.transform)}`);
+        this.fMediator.send(new EmitTransformChangesRequest());
+    }
+    redrawWithAnimation() {
+        var _a;
+        (_a = this.fComponentsStore.fBackground) === null || _a === void 0 ? void 0 : _a.setTransform(this.transform);
+        this.hostElement.setAttribute("style", `transition: transform ${F_CANVAS_ANIMATION_DURATION}ms ease-in-out; transform: ${TransformModelExtensions.toString(this.transform)}`);
+        setTimeout(() => {
+            this.redraw();
+        }, F_CANVAS_ANIMATION_DURATION);
+    }
+    centerGroupOrNode(id, animated = true) {
+        this.fMediator.send(new CenterGroupOrNodeRequest(id, animated));
+    }
+    fitToScreen(toCenter = PointExtensions.initialize(), animated = true) {
+        this.fMediator.send(new FitToFlowRequest(toCenter, animated));
+    }
+    resetScaleAndCenter(animated = true) {
+        this.fMediator.send(new ResetScaleAndCenterRequest(animated));
+    }
+    setZoom(scale, toPosition = PointExtensions.initialize()) {
+        this.fMediator.send(new UpdateScaleRequest(scale, toPosition));
+    }
+    resetZoom() {
+        this.fMediator.send(new ResetScaleRequest());
+    }
+}
+FCanvasComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FCanvasComponent, deps: [{ token: i0.ElementRef }, { token: i2.FMediator }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Component });
+FCanvasComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FCanvasComponent, selector: "f-canvas", inputs: { position: "position", scale: "scale" }, outputs: { fCanvasChange: "fCanvasChange" }, host: { classAttribute: "f-component f-canvas" }, providers: [
+        { provide: F_CANVAS, useExisting: FCanvasComponent }
+    ], viewQueries: [{ propertyName: "fGroupsContainer", first: true, predicate: ["fGroupsContainer"], descendants: true, static: true }, { propertyName: "fNodesContainer", first: true, predicate: ["fNodesContainer"], descendants: true, static: true }, { propertyName: "fConnectionsContainer", first: true, predicate: ["fConnectionsContainer"], descendants: true, static: true }], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0, template: "<ng-container>\n  <div #fGroupsContainer>\n    <ng-content select=\"[fGroup]\"></ng-content>\n  </div>\n  <div #fConnectionsContainer>\n    <ng-content select=\"f-snap-connection\"></ng-content>\n    <ng-content select=\"f-connection\"></ng-content>\n    <ng-content select=\"f-connection-for-create\"></ng-content>\n  </div>\n\n  <div #fNodesContainer>\n    <ng-content select=\"[fNode]\"></ng-content>\n  </div>\n</ng-container>\n", styles: [":host{position:absolute;overflow:visible;width:100%;height:100%;left:0;top:0;transform-origin:0 0;pointer-events:none}:host.f-scaled-animate{transition:transform .09s}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FCanvasComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'f-canvas', exportAs: 'fComponent', host: {
+                        'class': 'f-component f-canvas',
+                    }, providers: [
+                        { provide: F_CANVAS, useExisting: FCanvasComponent }
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container>\n  <div #fGroupsContainer>\n    <ng-content select=\"[fGroup]\"></ng-content>\n  </div>\n  <div #fConnectionsContainer>\n    <ng-content select=\"f-snap-connection\"></ng-content>\n    <ng-content select=\"f-connection\"></ng-content>\n    <ng-content select=\"f-connection-for-create\"></ng-content>\n  </div>\n\n  <div #fNodesContainer>\n    <ng-content select=\"[fNode]\"></ng-content>\n  </div>\n</ng-container>\n", styles: [":host{position:absolute;overflow:visible;width:100%;height:100%;left:0;top:0;transform-origin:0 0;pointer-events:none}:host.f-scaled-animate{transition:transform .09s}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i2.FMediator }, { type: FComponentsStore }]; }, propDecorators: { fCanvasChange: [{
+                type: Output
+            }], position: [{
+                type: Input
+            }], scale: [{
+                type: Input
+            }], fGroupsContainer: [{
+                type: ViewChild,
+                args: ['fGroupsContainer', { static: true }]
+            }], fNodesContainer: [{
+                type: ViewChild,
+                args: ['fNodesContainer', { static: true }]
+            }], fConnectionsContainer: [{
+                type: ViewChild,
+                args: ['fConnectionsContainer', { static: true }]
+            }] } });
+
+const F_CANVAS_PROVIDERS = [
+    FCanvasComponent,
+];
+
 class LineElement {
     constructor(fBrowser, hostElement) {
         this.hostElement = hostElement;
@@ -7288,9 +7298,9 @@ class NearestCoordinateFinder {
 const F_LINE_ALIGNMENT = new InjectionToken('F_LINE_ALIGNMENT');
 class FLineAlignmentBase {
 }
-FLineAlignmentBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FLineAlignmentBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-FLineAlignmentBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FLineAlignmentBase, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FLineAlignmentBase, decorators: [{
+FLineAlignmentBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FLineAlignmentBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+FLineAlignmentBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FLineAlignmentBase, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FLineAlignmentBase, decorators: [{
             type: Directive
         }] });
 
@@ -7361,24 +7371,17 @@ class FLineAlignmentComponent extends FLineAlignmentBase {
         this.lineService.hideHorizontalLine();
     }
 }
-FLineAlignmentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FLineAlignmentComponent, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Component });
-FLineAlignmentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FLineAlignmentComponent, selector: "f-line-alignment", inputs: { fAlignThreshold: "fAlignThreshold" }, host: { classAttribute: "f-line-alignment f-component" }, providers: [
+FLineAlignmentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FLineAlignmentComponent, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }, { token: FDraggableDataContext }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Component });
+FLineAlignmentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FLineAlignmentComponent, selector: "f-line-alignment", inputs: { fAlignThreshold: "fAlignThreshold" }, host: { classAttribute: "f-line-alignment f-component" }, providers: [
         { provide: F_LINE_ALIGNMENT, useExisting: FLineAlignmentComponent }
     ], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0, template: "", isInline: true, styles: [":host{display:block;position:absolute;left:0;top:0;width:100%;height:100%;overflow:hidden;pointer-events:none;-webkit-user-select:none;user-select:none}\n"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FLineAlignmentComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FLineAlignmentComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: "f-line-alignment",
-                    template: "",
-                    styleUrls: ["./f-line-alignment.component.scss"],
-                    exportAs: "fComponent",
-                    host: {
+            args: [{ selector: "f-line-alignment", template: "", exportAs: "fComponent", host: {
                         'class': 'f-line-alignment f-component'
-                    },
-                    providers: [
+                    }, providers: [
                         { provide: F_LINE_ALIGNMENT, useExisting: FLineAlignmentComponent }
-                    ],
-                }]
+                    ], styles: [":host{display:block;position:absolute;left:0;top:0;width:100%;height:100%;overflow:hidden;pointer-events:none;-webkit-user-select:none;user-select:none}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FComponentsStore }, { type: FDraggableDataContext }, { type: i2.FMediator }, { type: i1.BrowserService }]; }, propDecorators: { fAlignThreshold: [{
                 type: Input
             }] } });
@@ -7387,21 +7390,6 @@ const F_LINE_ALIGNMENT_PROVIDERS = [
     FLineAlignmentComponent
 ];
 
-function checkRectIsFinite(rect) {
-    if (!Number.isFinite(rect.width) || !Number.isFinite(rect.height) || !Number.isFinite(rect.x) || !Number.isFinite(rect.y)) {
-        return RectExtensions.initialize(0, 0, 0, 0);
-    }
-    return rect;
-}
-
-class FMinimapData {
-    constructor(element, scale = 1, viewBox = RectExtensions.initialize(0, 0, 0, 0)) {
-        this.element = element;
-        this.scale = scale;
-        this.viewBox = viewBox;
-    }
-}
-
 class FMinimapFlowDirective {
     constructor(elementReference, fMediator, fComponentsStore) {
         this.elementReference = elementReference;
@@ -7460,9 +7448,9 @@ class FMinimapFlowDirective {
         this.hostElement.setAttribute('viewBox', `${viewBox.x} ${viewBox.y} ${viewBox.width} ${viewBox.height}`);
     }
 }
-FMinimapFlowDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMinimapFlowDirective, deps: [{ token: i0.ElementRef }, { token: i2.FMediator }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
-FMinimapFlowDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FMinimapFlowDirective, selector: "svg[fMinimapFlow]", inputs: { fMinSize: "fMinSize" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMinimapFlowDirective, decorators: [{
+FMinimapFlowDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMinimapFlowDirective, deps: [{ token: i0.ElementRef }, { token: i2.FMediator }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
+FMinimapFlowDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FMinimapFlowDirective, selector: "svg[fMinimapFlow]", inputs: { fMinSize: "fMinSize" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMinimapFlowDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'svg[fMinimapFlow]'
@@ -7520,9 +7508,9 @@ class FMinimapCanvasDirective {
         }
     }
 }
-FMinimapCanvasDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMinimapCanvasDirective, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
-FMinimapCanvasDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FMinimapCanvasDirective, selector: "g[fMinimapCanvas]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMinimapCanvasDirective, decorators: [{
+FMinimapCanvasDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMinimapCanvasDirective, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Directive });
+FMinimapCanvasDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FMinimapCanvasDirective, selector: "g[fMinimapCanvas]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMinimapCanvasDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'g[fMinimapCanvas]'
@@ -7552,9 +7540,9 @@ class FMinimapViewDirective {
         this.hostElement.setAttribute('height', viewBox.height.toString());
     }
 }
-FMinimapViewDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMinimapViewDirective, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
-FMinimapViewDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FMinimapViewDirective, selector: "rect[fMinimapView]", host: { classAttribute: "f-component f-minimap-view" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMinimapViewDirective, decorators: [{
+FMinimapViewDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMinimapViewDirective, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
+FMinimapViewDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FMinimapViewDirective, selector: "rect[fMinimapView]", host: { classAttribute: "f-component f-minimap-view" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMinimapViewDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'rect[fMinimapView]',
@@ -7594,25 +7582,17 @@ class FMinimapComponent {
         this.subscriptions$.unsubscribe();
     }
 }
-FMinimapComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMinimapComponent, deps: [{ token: i0.ElementRef }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Component });
-FMinimapComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FMinimapComponent, selector: "f-minimap", inputs: { fMinSize: "fMinSize" }, host: { classAttribute: "f-component f-minimap" }, providers: [
+FMinimapComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMinimapComponent, deps: [{ token: i0.ElementRef }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Component });
+FMinimapComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FMinimapComponent, selector: "f-minimap", inputs: { fMinSize: "fMinSize" }, host: { classAttribute: "f-component f-minimap" }, providers: [
         { provide: F_DRAG_AND_DROP_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"], directives: [{ type: FMinimapFlowDirective, selector: "svg[fMinimapFlow]", inputs: ["fMinSize"] }, { type: FMinimapCanvasDirective, selector: "g[fMinimapCanvas]" }, { type: FMinimapViewDirective, selector: "rect[fMinimapView]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FMinimapComponent, decorators: [{
+    ], 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: FMinimapCanvasDirective, selector: "g[fMinimapCanvas]" }, { kind: "directive", type: FMinimapViewDirective, selector: "rect[fMinimapView]" }, { kind: "directive", type: FMinimapFlowDirective, selector: "svg[fMinimapFlow]", inputs: ["fMinSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FMinimapComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: 'f-minimap',
-                    templateUrl: './f-minimap.component.html',
-                    styleUrls: ['./f-minimap.component.scss'],
-                    exportAs: 'fComponent',
-                    host: {
+            args: [{ selector: 'f-minimap', exportAs: 'fComponent', host: {
                         'class': 'f-component f-minimap',
-                    },
-                    providers: [
+                    }, providers: [
                         { provide: F_DRAG_AND_DROP_PLUGIN, useExisting: FMinimapComponent },
-                    ],
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
+                    ], 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"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i2.FMediator }]; }, propDecorators: { fMinimapCanvas: [{
                 type: ViewChild,
                 args: [FMinimapCanvasDirective, { static: true }]
@@ -7633,69 +7613,6 @@ const F_MINIMAP_PROVIDERS = [
     FMinimapFlowDirective,
 ];
 
-class FSelectionAreaBase {
-}
-FSelectionAreaBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FSelectionAreaBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-FSelectionAreaBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FSelectionAreaBase, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FSelectionAreaBase, decorators: [{
-            type: Directive
-        }] });
-
-class FSelectionAreaComponent extends FSelectionAreaBase {
-    constructor(elementReference, fMediator) {
-        super();
-        this.elementReference = elementReference;
-        this.fMediator = fMediator;
-    }
-    get hostElement() {
-        return this.elementReference.nativeElement;
-    }
-    ngOnInit() {
-        this.hostElement.style.display = 'none';
-    }
-    hide() {
-        this.hostElement.style.display = 'none';
-    }
-    show() {
-        this.hostElement.style.display = 'block';
-    }
-    draw(object) {
-        const style = this.hostElement.style;
-        style.left = object.x + 'px';
-        style.top = object.y + 'px';
-        style.width = object.width + 'px';
-        style.height = object.height + 'px';
-    }
-    onPointerDown(event) {
-        this.fMediator.send(new SelectionAreaPreparationRequest(event, this));
-    }
-    onPointerUp(event) {
-        this.fMediator.send(new SelectionAreaFinalizeRequest(event));
-    }
-}
-FSelectionAreaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FSelectionAreaComponent, deps: [{ token: i0.ElementRef }, { token: i2.FMediator }], target: i0.ɵɵFactoryTarget.Component });
-FSelectionAreaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FSelectionAreaComponent, selector: "f-selection-area", host: { classAttribute: "f-selection-area f-component" }, providers: [
-        { provide: F_DRAG_AND_DROP_PLUGIN, useExisting: FSelectionAreaComponent },
-    ], usesInheritance: true, ngImport: i0, template: ``, isInline: true, styles: [":host{position:absolute}\n"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FSelectionAreaComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: "f-selection-area",
-                    template: ``,
-                    styleUrls: ['./f-selection-area.component.scss'],
-                    host: {
-                        'class': 'f-selection-area f-component'
-                    },
-                    providers: [
-                        { provide: F_DRAG_AND_DROP_PLUGIN, useExisting: FSelectionAreaComponent },
-                    ],
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i2.FMediator }]; } });
-
-const F_SELECTION_AREA_PROVIDERS = [
-    FSelectionAreaComponent
-];
-
 const F_FLOW = new InjectionToken('F_FLOW');
 class FFlowBase {
 }
@@ -7735,7 +7652,6 @@ class FFlowComponent extends FFlowBase {
         return this.fComponentsStore.componentsData$.pipe(startWith(null), debounceTime(1)).subscribe(() => {
             this.fMediator.send(new RedrawConnectionsRequest());
             if (!this.isLoaded) {
-                // this.fMediator.send(new ShowConnectionsAfterCalculationsRequest());
                 this.isLoaded = true;
                 this.fLoaded.emit();
             }
@@ -7772,39 +7688,32 @@ class FFlowComponent extends FFlowBase {
         this.subscription$.unsubscribe();
     }
 }
-FFlowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FFlowComponent, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Component });
-FFlowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FFlowComponent, selector: "f-flow", inputs: { fFlowId: "fFlowId" }, outputs: { fLoaded: "fLoaded" }, host: { properties: { "attr.id": "fFlowId" }, classAttribute: "f-component f-flow" }, providers: [
+FFlowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FFlowComponent, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }, { token: i2.FMediator }, { token: i1.BrowserService }], target: i0.ɵɵFactoryTarget.Component });
+FFlowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FFlowComponent, selector: "f-flow", inputs: { fFlowId: "fFlowId" }, outputs: { fLoaded: "fLoaded" }, host: { properties: { "attr.id": "fFlowId" }, classAttribute: "f-component f-flow" }, providers: [
         FMediator,
         FComponentsStore,
         FTransformStore,
         FDraggableDataContext,
         FConnectionFactory,
-        ...F_DRAGGABLE_PROVIDERS,
         ...COMMON_PROVIDERS,
+        ...F_DRAGGABLE_PROVIDERS,
         { provide: F_FLOW, useExisting: FFlowComponent },
     ], usesInheritance: true, ngImport: i0, template: "<ng-container>\n  <ng-content select=\"[fDefinitions]\"></ng-content>\n\n  <ng-content select=\"f-background\"></ng-content>\n\n  <ng-content select=\"f-line-alignment\"></ng-content>\n\n  <ng-content select=\"f-canvas\"></ng-content>\n\n  <ng-content select=\"f-selection-area\"></ng-content>\n\n  <ng-content select=\"f-minimap\"></ng-content>\n</ng-container>\n", styles: [":host{display:block;position:relative;width:100%;height:100%;overflow:hidden;pointer-events:all;-webkit-user-select:none;user-select:none;touch-action:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FFlowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FFlowComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: 'f-flow',
-                    templateUrl: './f-flow.component.html',
-                    styleUrls: ['./f-flow.component.scss'],
-                    host: {
+            args: [{ selector: 'f-flow', host: {
                         '[attr.id]': 'fFlowId',
                         class: "f-component f-flow",
-                    },
-                    providers: [
+                    }, providers: [
                         FMediator,
                         FComponentsStore,
                         FTransformStore,
                         FDraggableDataContext,
                         FConnectionFactory,
-                        ...F_DRAGGABLE_PROVIDERS,
                         ...COMMON_PROVIDERS,
+                        ...F_DRAGGABLE_PROVIDERS,
                         { provide: F_FLOW, useExisting: FFlowComponent },
-                    ],
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container>\n  <ng-content select=\"[fDefinitions]\"></ng-content>\n\n  <ng-content select=\"f-background\"></ng-content>\n\n  <ng-content select=\"f-line-alignment\"></ng-content>\n\n  <ng-content select=\"f-canvas\"></ng-content>\n\n  <ng-content select=\"f-selection-area\"></ng-content>\n\n  <ng-content select=\"f-minimap\"></ng-content>\n</ng-container>\n", styles: [":host{display:block;position:relative;width:100%;height:100%;overflow:hidden;pointer-events:all;-webkit-user-select:none;user-select:none;touch-action:none}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: FComponentsStore }, { type: i2.FMediator }, { type: i1.BrowserService }]; }, propDecorators: { fFlowId: [{
                 type: Input
             }], fLoaded: [{
@@ -7935,9 +7844,9 @@ class FZoomDirective extends FZoomBase {
         super.unsubscribe();
     }
 }
-FZoomDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FZoomDirective, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
-FZoomDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: FZoomDirective, selector: "f-canvas[fZoom]", inputs: { fFlowZoom: ["fZoom", "fFlowZoom"], minimum: ["fZoomMinimum", "minimum"], maximum: ["fZoomMaximum", "maximum"], step: ["fZoomStep", "step"], dblClickStep: ["fZoomDblClickStep", "dblClickStep"] }, host: { classAttribute: "f-zoom f-component" }, providers: [{ provide: F_ZOOM, useExisting: FZoomDirective }], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FZoomDirective, decorators: [{
+FZoomDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FZoomDirective, deps: [{ token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive });
+FZoomDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FZoomDirective, selector: "f-canvas[fZoom]", inputs: { fFlowZoom: ["fZoom", "fFlowZoom"], minimum: ["fZoomMinimum", "minimum"], maximum: ["fZoomMaximum", "maximum"], step: ["fZoomStep", "step"], dblClickStep: ["fZoomDblClickStep", "dblClickStep"] }, host: { classAttribute: "f-zoom f-component" }, providers: [{ provide: F_ZOOM, useExisting: FZoomDirective }], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FZoomDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "f-canvas[fZoom]",
@@ -7970,12 +7879,10 @@ const F_ZOOM_PROVIDERS = [
 
 class FFlowModule {
 }
-FFlowModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FFlowModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-FFlowModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FFlowModule, declarations: [FBackgroundComponent, FRectPatternComponent, FCirclePatternComponent, FCanvasComponent, FZoomDirective, FConnectionTextComponent, FConnectionTextPathDirective, FConnectionDragHandleComponent, FConnectionGradientComponent, FConnectionPathComponent, FConnectionSelectionComponent, FConnectionComponent, FConnectionCenterDirective, FConnectionForCreateComponent, FMarkerDirective, FSnapConnectionComponent, FNodeInputDirective, FNodeOutletDirective, FNodeOutputDirective, FExternalItemDirective, FFlowComponent, FLineAlignmentComponent, FMinimapComponent, FMinimapCanvasDirective, FMinimapViewDirective, FMinimapFlowDirective, FGroupDirective, FNodeDirective, FDragHandleDirective, FResizeHandleDirective, FSelectionAreaComponent, FDraggableDirective], imports: [CommonModule], exports: [FBackgroundComponent, FRectPatternComponent, FCirclePatternComponent, FCanvasComponent, FZoomDirective, FConnectionTextComponent, FConnectionTextPathDirective, FConnectionDragHandleComponent, FConnectionGradientComponent, FConnectionPathComponent, FConnectionSelectionComponent, FConnectionComponent, FConnectionCenterDirective, FConnectionForCreateComponent, FMarkerDirective, FSnapConnectionComponent, FNodeInputDirective, FNodeOutletDirective, FNodeOutputDirective, FExternalItemDirective, FFlowComponent, FLineAlignmentComponent, FMinimapComponent, FMinimapCanvasDirective, FMinimapViewDirective, FMinimapFlowDirective, FGroupDirective, FNodeDirective, FDragHandleDirective, FResizeHandleDirective, FSelectionAreaComponent, FDraggableDirective] });
-FFlowModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FFlowModule, imports: [[
-            CommonModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FFlowModule, decorators: [{
+FFlowModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FFlowModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+FFlowModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: FFlowModule, declarations: [FBackgroundComponent, FRectPatternComponent, FCirclePatternComponent, FCanvasComponent, FZoomDirective, FConnectionTextComponent, FConnectionTextPathDirective, FConnectionDragHandleComponent, FConnectionGradientComponent, FConnectionPathComponent, FConnectionSelectionComponent, FConnectionComponent, FConnectionCenterDirective, FConnectionForCreateComponent, FMarkerDirective, FSnapConnectionComponent, FNodeInputDirective, FNodeOutletDirective, FNodeOutputDirective, FExternalItemDirective, FFlowComponent, FLineAlignmentComponent, FMinimapComponent, FMinimapCanvasDirective, FMinimapViewDirective, FMinimapFlowDirective, FGroupDirective, FNodeDirective, FDragHandleDirective, FResizeHandleDirective, FSelectionAreaComponent, FDraggableDirective], imports: [CommonModule], exports: [FBackgroundComponent, FRectPatternComponent, FCirclePatternComponent, FCanvasComponent, FZoomDirective, FConnectionTextComponent, FConnectionTextPathDirective, FConnectionDragHandleComponent, FConnectionGradientComponent, FConnectionPathComponent, FConnectionSelectionComponent, FConnectionComponent, FConnectionCenterDirective, FConnectionForCreateComponent, FMarkerDirective, FSnapConnectionComponent, FNodeInputDirective, FNodeOutletDirective, FNodeOutputDirective, FExternalItemDirective, FFlowComponent, FLineAlignmentComponent, FMinimapComponent, FMinimapCanvasDirective, FMinimapViewDirective, FMinimapFlowDirective, FGroupDirective, FNodeDirective, FDragHandleDirective, FResizeHandleDirective, FSelectionAreaComponent, FDraggableDirective] });
+FFlowModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FFlowModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FFlowModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -8016,5 +7923,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AddPatternToBackgroundExecution, AddPatternToBackgroundRequest, ApplyChildResizeRestrictionsExecution, ApplyChildResizeRestrictionsRequest, ApplyParentResizeRestrictionsExecution, ApplyParentResizeRestrictionsRequest, CANVAS_MOVE_FINALIZE_PROVIDERS, CANVAS_MOVE_PREPARATION_PROVIDERS, CANVAS_PROVIDERS, COMMON_PROVIDERS, CONNECTIONS_PROVIDERS, CONNECTION_DRAG_COMMON_PROVIDERS, CONNECTION_GRADIENT, CONNECTION_PATH, CONNECTION_TEXT, CREATE_CONNECTION_DRAG_HANDLER_PROVIDERS, CREATE_CONNECTION_FINALIZE_PROVIDERS, CREATE_CONNECTION_FROM_OUTLET_PREPARATION_PROVIDERS, CREATE_CONNECTION_FROM_OUTPUT_PREPARATION_PROVIDERS, CREATE_CONNECTION_PREPARATION_PROVIDERS, CREATE_MOVE_NODE_DRAG_MODEL_FROM_SELECTION_PROVIDERS, CalculateCenterBetweenPointsHandler, CalculateCenterBetweenPointsRequest, CalculateChangedPositionExecution, CalculateChangedPositionRequest, CalculateChangedSizeExecution, CalculateChangedSizeRequest, CalculateConnectionCenterHandler, CalculateConnectionCenterRequest, CalculateConnectorConnectableSideHandler, CalculateConnectorConnectableSideRequest, CalculateFlowPointFromMinimapPointExecution, CalculateFlowPointFromMinimapPointRequest, CanvasDragHandler, CanvasMoveFinalizeExecution, CanvasMoveFinalizeRequest, CanvasMoveFinalizeValidator, CanvasMovePreparationExecution, CanvasMovePreparationRequest, CanvasMovePreparationValidator, CenterGroupOrNodeExecution, CenterGroupOrNodeRequest, ClearSelectionExecution, ClearSelectionRequest, ConnectionBaseDragHandler, ConnectionDragHandler, ConnectionSourceDragHandler, ConnectionTargetDragHandler, CreateConnectionDragHandler, CreateConnectionDragHandlerExecution, CreateConnectionDragHandlerRequest, CreateConnectionFinalizeExecution, CreateConnectionFinalizeRequest, CreateConnectionFinalizeValidator, CreateConnectionFromOutletPreparationExecution, CreateConnectionFromOutletPreparationRequest, CreateConnectionFromOutputPreparationExecution, CreateConnectionFromOutputPreparationRequest, CreateConnectionFromOutputPreparationValidator, CreateConnectionMarkersExecution, CreateConnectionMarkersRequest, CreateConnectionPreparationExecution, CreateConnectionPreparationRequest, CreateConnectionPreparationValidator, CreateMoveNodesDragModelFromSelectionExecution, CreateMoveNodesDragModelFromSelectionRequest, CreateRoundedRectFromElementExecution, CreateRoundedRectFromElementRequest, DRAG_AND_DROP_COMMON_PROVIDERS, EFConnectableSide, EFConnectionBehavior, EFConnectionType, EFMarkerType, EFResizeHandleType, EXTERNAL_ITEM_FINALIZE_PROVIDERS, EXTERNAL_ITEM_PREPARATION_PROVIDERS, EmitTransformChangesExecution, EmitTransformChangesRequest, ExternalItemDragHandler, ExternalItemFinalizeExecution, ExternalItemFinalizeRequest, ExternalItemFinalizeValidator, ExternalItemPreparationExecution, ExternalItemPreparationRequest, ExternalItemPreparationValidator, FBackgroundBase, FBackgroundComponent, FBezierPathBuilder, FCanvasBase, FCanvasChangeEvent, FCanvasComponent, FCirclePatternComponent, FComponentsStore, FConnectionBase, FConnectionCenterDirective, FConnectionComponent, FConnectionDragHandleComponent, FConnectionFactory, FConnectionForCreateComponent, FConnectionGradientComponent, FConnectionPathComponent, FConnectionSelectionComponent, FConnectionTextComponent, FConnectionTextPathDirective, FConnectorBase, FCreateConnectionEvent, FCreateNodeEvent, FDragHandleDirective, FDraggableBase, FDraggableDataContext, FDraggableDirective, FExternalItemBase, FExternalItemDirective, FExternalItemService, FFlowBase, FFlowComponent, FFlowModule, FGroupDirective, FLineAlignmentBase, FLineAlignmentComponent, FMarkerBase, FMarkerDirective, FMinimapCanvasDirective, FMinimapComponent, FMinimapData, FMinimapDragHandler, FMinimapFlowDirective, FMinimapViewDirective, FNodeBase, FNodeDirective, FNodeInputBase, FNodeInputDirective, FNodeOutletBase, FNodeOutletDirective, FNodeOutputBase, FNodeOutputDirective, FReassignConnectionEvent, FRectPatternComponent, FResizeHandleDirective, FResizeObserver, FRotateHandleDirective, FSegmentPathBuilder, FSelectionAreaBase, FSelectionAreaComponent, FSelectionChangeEvent, FSnapConnectionComponent, FStraightPathBuilder, FTransformStore, FZoomBase, FZoomDirective, F_BACKGROUND, F_BACKGROUND_FEATURES, F_BACKGROUND_PATTERN, F_BACKGROUND_PROVIDERS, F_CANVAS, F_CANVAS_ANIMATION_DURATION, F_CANVAS_FEATURES, F_CANVAS_PROVIDERS, F_CONNECTION_BUILDERS, F_CONNECTION_DRAG_HANDLE_CLASS, F_CONNECTION_IDENTIFIERS, F_CONNECTION_PROVIDERS, F_CONNECTORS_PROVIDERS, F_DRAGGABLE_PROVIDERS, F_DRAG_AND_DROP_PLUGIN, F_DRAG_HANDLE, F_EXTERNAL_ITEM, F_EXTERNAL_ITEM_DRAG_AND_DROP_PROVIDERS, F_EXTERNAL_ITEM_PROVIDERS, F_FLOW, F_FLOW_PROVIDERS, F_LINE_ALIGNMENT, F_LINE_ALIGNMENT_PROVIDERS, F_MARKER, F_MINIMAP_DRAG_AND_DROP_PROVIDERS, F_MINIMAP_PROVIDERS, F_NODE, F_NODE_INPUT, F_NODE_OUTLET, F_NODE_OUTPUT, F_NODE_PROVIDERS, F_RESIZE_HANDLE, F_SELECTED_CLASS, F_SELECTION_AREA_DRAG_AND_DROP_PROVIDERS, F_SELECTION_AREA_PROVIDERS, F_SELECTION_FEATURES, F_ZOOM, F_ZOOM_PROVIDERS, FindClosestInputUsingSnapThresholdExecution, FindClosestInputUsingSnapThresholdRequest, FitToFlowExecution, FitToFlowRequest, GET_CAN_BE_CONNECTED_OUTPUT_BY_OUTLET_PROVIDERS, GET_FLOW_STATE_PROVIDERS, GetAllCanBeConnectedInputPositionsExecution, GetAllCanBeConnectedInputPositionsRequest, GetCanBeConnectedOutputByOutletExecution, GetCanBeConnectedOutputByOutletRequest, GetCanBeConnectedOutputByOutletValidator, GetCanBeSelectedItemsExecution, GetConnectionLineExecution, GetConnectionLineRequest, GetConnectorWithRectExecution, GetConnectorWithRectRequest, GetDeepChildrenNodesAndGroupsExecution, GetDeepChildrenNodesAndGroupsRequest, GetElementRectInFlowExecution, GetElementRectInFlowRequest, GetFlowStateConnectionsExecution, GetFlowStateConnectionsRequest, GetFlowStateExecution, GetFlowStateNodesExecution, GetFlowStateNodesRequest, GetFlowStateRequest, GetInputUnderPointerExecution, GetInputUnderPointerRequest, GetInputUnderPointerValidator, GetNodeMoveRestrictionsExecution, GetNodeMoveRestrictionsRequest, GetNodePaddingExecution, GetNodePaddingRequest, GetNodeResizeRestrictionsExecution, GetNodeResizeRestrictionsRequest, GetNodesRectExecution, GetNodesRectRequest, GetNormalizedChildrenNodesRectExecution, GetNormalizedChildrenNodesRectRequest, GetNormalizedNodeRectExecution, GetNormalizedNodeRectRequest, GetNormalizedParentNodeRectExecution, GetNormalizedParentNodeRectRequest, GetParentNodesExecution, GetParentNodesRequest, GetPositionInFlowExecution, GetPositionInFlowRequest, GetScaledNodeRectsWithFlowPositionExecution, GetScaledNodeRectsWithFlowPositionRequest, GetSelectionExecution, GetSelectionRequest, InputCanvasPositionExecution, InputCanvasPositionRequest, InputCanvasScaleExecution, InputCanvasScaleRequest, IsArrayHasParentNodeExecution, IsArrayHasParentNodeRequest, IsConnectionUnderNodeExecution, LineElement, LineService, MINIMAP_DRAG_FINALIZE_PROVIDERS, MINIMAP_DRAG_PREPARATION_PROVIDERS, MinimapDragFinalizeExecution, MinimapDragFinalizeRequest, MinimapDragFinalizeValidator, MinimapDragPreparationExecution, MinimapDragPreparationRequest, MinimapDragPreparationValidator, MoveFrontElementsBeforeTargetElementExecution, MoveFrontElementsBeforeTargetElementRequest, NODE_MOVE_FINALIZE_PROVIDERS, NODE_MOVE_PREPARATION_PROVIDERS, NODE_PROVIDERS, NODE_RESIZE_FINALIZE_PROVIDERS, NODE_RESIZE_PREPARATION_PROVIDERS, NODE_RESIZE_PROVIDERS, NearestCoordinateFinder, NodeDragHandler, NodeMoveFinalizeExecution, NodeMoveFinalizeRequest, NodeMoveFinalizeValidator, NodeMovePreparationExecution, NodeMovePreparationRequest, NodeMovePreparationValidator, NodeResizeByChildDragHandler, NodeResizeDragHandler, NodeResizeFinalizeExecution, NodeResizeFinalizeRequest, NodeResizeFinalizeValidator, NodeResizePreparationExecution, NodeResizePreparationRequest, NodeResizePreparationValidator, PutInputConnectionHandlersToArrayExecution, PutInputConnectionHandlersToArrayRequest, PutOutputConnectionHandlersToArrayExecution, PutOutputConnectionHandlersToArrayRequest, REASSIGN_CONNECTION_FINALIZE_PROVIDERS, REASSIGN_CONNECTION_PREPARATION_PROVIDERS, RESIZE_DIRECTIONS, ReassignConnectionDragHandler, ReassignConnectionFinalizeExecution, ReassignConnectionFinalizeRequest, ReassignConnectionFinalizeValidator, ReassignConnectionPreparationExecution, ReassignConnectionPreparationRequest, ReassignConnectionPreparationValidator, RedrawConnectionsExecution, RedrawConnectionsRequest, ResetScaleAndCenterExecution, ResetScaleAndCenterRequest, ResetScaleExecution, ResetScaleRequest, SELECTION_AREA_FINALIZE_PROVIDERS, SELECTION_AREA_PREPARATION_PROVIDERS, SINGLE_SELECT_PROVIDERS, SelectAllExecution, SelectAllRequest, SelectAndUpdateNodeLayerExecution, SelectAndUpdateNodeLayerRequest, SelectExecution, SelectRequest, SelectionAreaDragHandle, SelectionAreaFinalizeExecution, SelectionAreaFinalizeRequest, SelectionAreaFinalizeValidator, SelectionAreaPreparationExecution, SelectionAreaPreparationRequest, SelectionAreaPreparationValidator, ShowConnectionsAfterCalculationsExecution, ShowConnectionsAfterCalculationsRequest, SingleSelectExecution, SingleSelectRequest, SingleSelectValidator, SortItemLayersExecution, SortItemLayersRequest, SortItemsByParentExecution, SortItemsByParentRequest, SortNodeLayersExecution, SortNodeLayersRequest, SubscribeOnTransformChangesExecution, SubscribeOnTransformChangesRequest, UpdateItemAndChildrenLayersExecution, UpdateItemAndChildrenLayersRequest, UpdateScaleExecution, UpdateScaleRequest, checkRectIsFinite, createSVGElement, getExternalItem, getMarkerEndId, getMarkerSelectedEndId, getMarkerSelectedStartId, getMarkerStartId, isExternalItem, isGroup, isNode, isNodeOutlet, isNodeOutput, mixinChangeSelection, mixinChangeVisibility };
-//# sourceMappingURL=foblex-flow.js.map
+export { AddPatternToBackgroundExecution, AddPatternToBackgroundRequest, ApplyChildResizeRestrictionsExecution, ApplyChildResizeRestrictionsRequest, ApplyParentResizeRestrictionsExecution, ApplyParentResizeRestrictionsRequest, CANVAS_MOVE_FINALIZE_PROVIDERS, CANVAS_MOVE_PREPARATION_PROVIDERS, CANVAS_PROVIDERS, COMMON_PROVIDERS, CONNECTIONS_PROVIDERS, CONNECTION_GRADIENT, CONNECTION_PATH, CONNECTION_TEXT, CREATE_MOVE_NODE_DRAG_MODEL_FROM_SELECTION_PROVIDERS, CalculateCenterBetweenPointsHandler, CalculateCenterBetweenPointsRequest, CalculateChangedPositionExecution, CalculateChangedPositionRequest, CalculateChangedSizeExecution, CalculateChangedSizeRequest, CalculateConnectionCenterHandler, CalculateConnectionCenterRequest, CalculateConnectorConnectableSideHandler, CalculateConnectorConnectableSideRequest, CalculateFlowPointFromMinimapPointExecution, CalculateFlowPointFromMinimapPointRequest, CanvasDragHandler, CanvasMoveFinalizeExecution, CanvasMoveFinalizeRequest, CanvasMoveFinalizeValidator, CanvasMovePreparationExecution, CanvasMovePreparationRequest, CanvasMovePreparationValidator, CenterGroupOrNodeExecution, CenterGroupOrNodeRequest, ClearSelectionExecution, ClearSelectionRequest, ConnectionBaseDragHandler, ConnectionDragHandler, ConnectionSourceDragHandler, ConnectionTargetDragHandler, CreateConnectionDragHandler, CreateConnectionDragHandlerExecution, CreateConnectionDragHandlerRequest, CreateConnectionFinalizeExecution, CreateConnectionFinalizeRequest, CreateConnectionFinalizeValidator, CreateConnectionFromOutletPreparationExecution, CreateConnectionFromOutletPreparationRequest, CreateConnectionFromOutputPreparationExecution, CreateConnectionFromOutputPreparationRequest, CreateConnectionFromOutputPreparationValidator, CreateConnectionMarkersExecution, CreateConnectionMarkersRequest, CreateConnectionPreparationExecution, CreateConnectionPreparationRequest, CreateConnectionPreparationValidator, CreateMoveNodesDragModelFromSelectionExecution, CreateMoveNodesDragModelFromSelectionRequest, CreateRoundedRectFromElementExecution, CreateRoundedRectFromElementRequest, DRAG_AND_DROP_COMMON_PROVIDERS, EFConnectableSide, EFConnectionBehavior, EFConnectionType, EFMarkerType, EFResizeHandleType, EXTERNAL_ITEM_FINALIZE_PROVIDERS, EXTERNAL_ITEM_PREPARATION_PROVIDERS, EmitTransformChangesExecution, EmitTransformChangesRequest, ExternalItemDragHandler, ExternalItemFinalizeExecution, ExternalItemFinalizeRequest, ExternalItemFinalizeValidator, ExternalItemPreparationExecution, ExternalItemPreparationRequest, ExternalItemPreparationValidator, FBackgroundBase, FBackgroundComponent, FBezierPathBuilder, FCanvasBase, FCanvasChangeEvent, FCanvasComponent, FCirclePatternComponent, FComponentsStore, FConnectionBase, FConnectionCenterDirective, FConnectionComponent, FConnectionDragHandleComponent, FConnectionFactory, FConnectionForCreateComponent, FConnectionGradientComponent, FConnectionPathComponent, FConnectionSelectionComponent, FConnectionTextComponent, FConnectionTextPathDirective, FConnectorBase, FCreateConnectionEvent, FCreateNodeEvent, FDragHandleDirective, FDraggableBase, FDraggableDataContext, FDraggableDirective, FExternalItemBase, FExternalItemDirective, FExternalItemService, FFlowBase, FFlowComponent, FFlowModule, FGroupDirective, FLineAlignmentBase, FLineAlignmentComponent, FMarkerBase, FMarkerDirective, FMinimapCanvasDirective, FMinimapComponent, FMinimapData, FMinimapDragHandler, FMinimapFlowDirective, FMinimapViewDirective, FNodeBase, FNodeDirective, FNodeInputBase, FNodeInputDirective, FNodeOutletBase, FNodeOutletDirective, FNodeOutputBase, FNodeOutputDirective, FReassignConnectionEvent, FRectPatternComponent, FResizeHandleDirective, FResizeObserver, FRotateHandleDirective, FSegmentPathBuilder, FSelectionAreaBase, FSelectionAreaComponent, FSelectionChangeEvent, FSnapConnectionComponent, FStraightPathBuilder, FTransformStore, FZoomBase, FZoomDirective, F_BACKGROUND, F_BACKGROUND_FEATURES, F_BACKGROUND_PATTERN, F_BACKGROUND_PROVIDERS, F_CANVAS, F_CANVAS_ANIMATION_DURATION, F_CANVAS_FEATURES, F_CANVAS_PROVIDERS, F_CONNECTION_BUILDERS, F_CONNECTION_DRAG_HANDLE_CLASS, F_CONNECTION_FEATURES, F_CONNECTION_IDENTIFIERS, F_CONNECTION_PROVIDERS, F_CONNECTORS_PROVIDERS, F_DRAGGABLE_PROVIDERS, F_DRAG_AND_DROP_PLUGIN, F_DRAG_HANDLE, F_EXTERNAL_ITEM, F_EXTERNAL_ITEM_DRAG_AND_DROP_PROVIDERS, F_EXTERNAL_ITEM_PROVIDERS, F_FLOW, F_FLOW_PROVIDERS, F_LINE_ALIGNMENT, F_LINE_ALIGNMENT_PROVIDERS, F_MARKER, F_MINIMAP_DRAG_AND_DROP_PROVIDERS, F_MINIMAP_PROVIDERS, F_NODE, F_NODE_INPUT, F_NODE_OUTLET, F_NODE_OUTPUT, F_NODE_PROVIDERS, F_RESIZE_HANDLE, F_SELECTED_CLASS, F_SELECTION_AREA_DRAG_AND_DROP_PROVIDERS, F_SELECTION_AREA_PROVIDERS, F_SELECTION_FEATURES, F_ZOOM, F_ZOOM_PROVIDERS, FindClosestInputUsingSnapThresholdExecution, FindClosestInputUsingSnapThresholdRequest, FitToFlowExecution, FitToFlowRequest, GET_FLOW_STATE_PROVIDERS, GetAllCanBeConnectedInputPositionsExecution, GetAllCanBeConnectedInputPositionsRequest, GetCanBeConnectedOutputByOutletExecution, GetCanBeConnectedOutputByOutletRequest, GetCanBeConnectedOutputByOutletValidator, GetCanBeSelectedItemsExecution, GetConnectionLineExecution, GetConnectionLineRequest, GetConnectorWithRectExecution, GetConnectorWithRectRequest, GetDeepChildrenNodesAndGroupsExecution, GetDeepChildrenNodesAndGroupsRequest, GetElementRectInFlowExecution, GetElementRectInFlowRequest, GetFlowStateConnectionsExecution, GetFlowStateConnectionsRequest, GetFlowStateExecution, GetFlowStateNodesExecution, GetFlowStateNodesRequest, GetFlowStateRequest, GetInputUnderPointerExecution, GetInputUnderPointerRequest, GetInputUnderPointerValidator, GetNodeMoveRestrictionsExecution, GetNodeMoveRestrictionsRequest, GetNodePaddingExecution, GetNodePaddingRequest, GetNodeResizeRestrictionsExecution, GetNodeResizeRestrictionsRequest, GetNodesRectExecution, GetNodesRectRequest, GetNormalizedChildrenNodesRectExecution, GetNormalizedChildrenNodesRectRequest, GetNormalizedNodeRectExecution, GetNormalizedNodeRectRequest, GetNormalizedParentNodeRectExecution, GetNormalizedParentNodeRectRequest, GetParentNodesExecution, GetParentNodesRequest, GetPositionInFlowExecution, GetPositionInFlowRequest, GetScaledNodeRectsWithFlowPositionExecution, GetScaledNodeRectsWithFlowPositionRequest, GetSelectionExecution, GetSelectionRequest, InputCanvasPositionExecution, InputCanvasPositionRequest, InputCanvasScaleExecution, InputCanvasScaleRequest, IsArrayHasParentNodeExecution, IsArrayHasParentNodeRequest, IsConnectionUnderNodeExecution, LineElement, LineService, MINIMAP_DRAG_FINALIZE_PROVIDERS, MINIMAP_DRAG_PREPARATION_PROVIDERS, MinimapDragFinalizeExecution, MinimapDragFinalizeRequest, MinimapDragFinalizeValidator, MinimapDragPreparationExecution, MinimapDragPreparationRequest, MinimapDragPreparationValidator, MoveFrontElementsBeforeTargetElementExecution, MoveFrontElementsBeforeTargetElementRequest, NODE_MOVE_FINALIZE_PROVIDERS, NODE_MOVE_PREPARATION_PROVIDERS, NODE_PROVIDERS, NODE_RESIZE_FINALIZE_PROVIDERS, NODE_RESIZE_PREPARATION_PROVIDERS, NODE_RESIZE_PROVIDERS, NearestCoordinateFinder, NodeDragHandler, NodeMoveFinalizeExecution, NodeMoveFinalizeRequest, NodeMoveFinalizeValidator, NodeMovePreparationExecution, NodeMovePreparationRequest, NodeMovePreparationValidator, NodeResizeByChildDragHandler, NodeResizeDragHandler, NodeResizeFinalizeExecution, NodeResizeFinalizeRequest, NodeResizeFinalizeValidator, NodeResizePreparationExecution, NodeResizePreparationRequest, NodeResizePreparationValidator, PutInputConnectionHandlersToArrayExecution, PutInputConnectionHandlersToArrayRequest, PutOutputConnectionHandlersToArrayExecution, PutOutputConnectionHandlersToArrayRequest, RESIZE_DIRECTIONS, ReassignConnectionDragHandler, ReassignConnectionFinalizeExecution, ReassignConnectionFinalizeRequest, ReassignConnectionFinalizeValidator, ReassignConnectionPreparationExecution, ReassignConnectionPreparationRequest, ReassignConnectionPreparationValidator, RedrawConnectionsExecution, RedrawConnectionsRequest, ResetScaleAndCenterExecution, ResetScaleAndCenterRequest, ResetScaleExecution, ResetScaleRequest, SELECTION_AREA_FINALIZE_PROVIDERS, SELECTION_AREA_PREPARATION_PROVIDERS, SINGLE_SELECT_PROVIDERS, SelectAllExecution, SelectAllRequest, SelectAndUpdateNodeLayerExecution, SelectAndUpdateNodeLayerRequest, SelectExecution, SelectRequest, SelectionAreaDragHandle, SelectionAreaFinalizeExecution, SelectionAreaFinalizeRequest, SelectionAreaFinalizeValidator, SelectionAreaPreparationExecution, SelectionAreaPreparationRequest, SelectionAreaPreparationValidator, ShowConnectionsAfterCalculationsExecution, ShowConnectionsAfterCalculationsRequest, SingleSelectExecution, SingleSelectRequest, SingleSelectValidator, SortItemLayersExecution, SortItemLayersRequest, SortItemsByParentExecution, SortItemsByParentRequest, SortNodeLayersExecution, SortNodeLayersRequest, SubscribeOnTransformChangesExecution, SubscribeOnTransformChangesRequest, UpdateItemAndChildrenLayersExecution, UpdateItemAndChildrenLayersRequest, UpdateScaleExecution, UpdateScaleRequest, checkRectIsFinite, createSVGElement, getExternalItem, getMarkerEndId, getMarkerSelectedEndId, getMarkerSelectedStartId, getMarkerStartId, isExternalItem, isGroup, isNode, isNodeOutlet, isNodeOutput, mixinChangeSelection, mixinChangeVisibility };
+//# sourceMappingURL=foblex-flow.mjs.map