@foblex/flow 17.8.4 → 17.8.6

package/fesm2022/foblex-flow.mjs

@@ -1,10 +1,11 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, Injectable, Directive, input, computed, signal, Injector, Renderer2, effect, untracked, DestroyRef, model, output, booleanAttribute, ElementRef, Input, viewChild, Component, ChangeDetectionStrategy, Optional, Inject, isDevMode, contentChildren, numberAttribute, ViewContainerRef, TemplateRef, EventEmitter, NgZone, Output, ContentChildren, contentChild, NgModule } from '@angular/core';
+import { InjectionToken, inject, Injectable, Directive, input, computed, signal, Injector, Renderer2, effect, untracked, DestroyRef, model, output, booleanAttribute, ElementRef, Input, viewChild, Component, ChangeDetectionStrategy, isDevMode, contentChildren, numberAttribute, ViewContainerRef, TemplateRef, EventEmitter, NgZone, Output, ContentChildren, contentChild, NgModule } from '@angular/core';
 import { RectExtensions, RoundedRect, TransformModelExtensions, PointExtensions, Point, LineExtensions, GetIntersections, SizeExtensions, findClosestAlignment, setRectToElement, adjustRectToMinSize, setRectToViewBox } from '@foblex/2d';
 import { __decorate } from 'tslib';
 import { FExecutionRegister, FMediator } from '@foblex/mediator';
 import { BrowserService, PlatformService, EOperationSystem } from '@foblex/platform';
 import { normalizeDomElementId, castToEnum, isClosestElementHasClass, flatMap, getOrCreateRootNodeForViewRef, deepCloneNode, disableDragInteractions, extendStyles, getDataAttrValueFromClosestElementWithClass } from '@foblex/utils';
+import { coerceNumberProperty } from '@angular/cdk/coercion';
 import { CommonModule } from '@angular/common';
 
 const F_BACKGROUND_PATTERN = new InjectionToken('F_BACKGROUND_PATTERN');
@@ -278,6 +279,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             type: Injectable
         }] });
 
+class FConnectorsStore {
+    _connectors = {};
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectorsStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectorsStore });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectorsStore, decorators: [{
+            type: Injectable
+        }] });
+
 const F_STORAGE_PROVIDERS = [
     NotifyDataChangedExecution,
     ListenCountChangesExecution,
@@ -1014,14 +1024,14 @@ function createSVGElement$1(tag, fBrowser) {
 class CalculateConnectionLineByBehaviorRequest {
     sourceRect;
     targetRect;
-    behavior;
+    connection;
     sourceConnectableSide;
     targetConnectableSide;
     static fToken = Symbol('CalculateConnectionLineByBehaviorRequest');
-    constructor(sourceRect, targetRect, behavior, sourceConnectableSide, targetConnectableSide) {
+    constructor(sourceRect, targetRect, connection, sourceConnectableSide, targetConnectableSide) {
         this.sourceRect = sourceRect;
         this.targetRect = targetRect;
-        this.behavior = behavior;
+        this.connection = connection;
         this.sourceConnectableSide = sourceConnectableSide;
         this.targetConnectableSide = targetConnectableSide;
     }
@@ -1429,7 +1439,7 @@ class FGroupDirective extends FNodeBase {
         this._debounceTimer = setTimeout(() => this._calculateNodeConnectorsConnectableSides(), _DEBOUNCE_TIME$2);
     }
     _calculateNodeConnectorsConnectableSides() {
-        this._mediator.execute(new CalculateNodeConnectorsConnectableSidesRequest(this));
+        this._mediator.execute(new CalculateConnectorsConnectableSidesRequest(this));
     }
     ngAfterViewInit() {
         if (!this.browser.isBrowser()) {
@@ -1556,7 +1566,7 @@ class FNodeDirective extends FNodeBase {
         this._debounceTimer = setTimeout(() => this._calculateNodeConnectorsConnectableSides(), _DEBOUNCE_TIME$1);
     }
     _calculateNodeConnectorsConnectableSides() {
-        this._mediator.execute(new CalculateNodeConnectorsConnectableSidesRequest(this));
+        this._mediator.execute(new CalculateConnectorsConnectableSidesRequest(this));
     }
     ngAfterViewInit() {
         if (!this.browser.isBrowser()) {
@@ -1860,6 +1870,205 @@ const F_CONNECTORS_PROVIDERS = [
     FNodeOutputDirective,
 ];
 
+/**
+ * AdaptiveCurveBuilder
+ *
+ * Builds a smooth **adaptive connector curve** between two points using a cubic Bézier path,
+ * but with control points computed differently from a classic “Bezier” connector.
+ *
+ * Key differences from a classic Bézier builder:
+ * - Control handles are **aligned with the port side** (LEFT/RIGHT/TOP/BOTTOM),
+ *   yet are **slightly blended toward the target direction** to reduce harsh S-shapes.
+ * - Handle lengths are **adaptive**: based on the `offset` (your “padding” from ports)
+ *   and the projected distance along the side’s axis. This produces a subtler curvature
+ *   and a distinct look & feel compared to a standard Bézier connector.
+ *
+ * Compatibility:
+ * - Implements {@link IFConnectionBuilder}; output shape is the same:
+ *   SVG path, sampled points for hit-testing, and connection center.
+ * - Only the four base sides are expected to be passed here:
+ *   {@link EFConnectableSide.LEFT}, {@link EFConnectableSide.RIGHT},
+ *   {@link EFConnectableSide.TOP}, {@link EFConnectableSide.BOTTOM}.
+ *
+ * Usage example:
+ * ```ts
+ * const builder = new AdaptiveCurveBuilder();
+ * const res = builder.handle({
+ *   source: { x: 100, y: 120 },
+ *   sourceSide: EFConnectableSide.RIGHT,
+ *   target: { x: 340, y: 220 },
+ *   targetSide: EFConnectableSide.LEFT,
+ *   offset: 16, // acts as padding + minimal handle baseline
+ * });
+ * // res.path -> SVG "M … C …" string
+ * // res.points -> sampled points along the curve
+ * ```
+ */
+class AdaptiveCurveBuilder {
+    /**
+     * Returns a unit direction vector for a given side.
+     *
+     * @param side - One of LEFT/RIGHT/TOP/BOTTOM.
+     * @returns Unit vector pointing outwards from the side.
+     * @remarks
+     * Only base sides should reach this builder. A fallback `{0,0}` is returned
+     * defensively, but should not occur in normal usage.
+     */
+    static _dir(side) {
+        switch (side) {
+            case EFConnectableSide.LEFT:
+                return { x: -1, y: 0 };
+            case EFConnectableSide.RIGHT:
+                return { x: 1, y: 0 };
+            case EFConnectableSide.TOP:
+                return { x: 0, y: -1 };
+            case EFConnectableSide.BOTTOM:
+                return { x: 0, y: 1 };
+        }
+        return { x: 0, y: 0 };
+    }
+    /**
+     * Checks whether a side is horizontal (LEFT/RIGHT).
+     *
+     * @param side - Side to check.
+     * @returns `true` for LEFT/RIGHT, otherwise `false`.
+     */
+    static _isH(side) {
+        return side === EFConnectableSide.LEFT || side === EFConnectableSide.RIGHT;
+    }
+    /**
+     * Computes a **soft** handle length for a control point.
+     *
+     * The handle length is derived from:
+     * - `offset` (acts as padding & the baseline handle),
+     * - distance projected along the side’s axis (dx for horizontal, dy for vertical),
+     * - a conservative upper bound to avoid bloated curves.
+     *
+     * @param p0 - Start (or end) point of the segment.
+     * @param p3 - Opposite end (or start) point.
+     * @param side - Side at which the handle originates.
+     * @param offset - Visual padding/minimal handle baseline (must be ≥ 0).
+     * @returns A bounded positive handle length.
+     */
+    static _handleLen(p0, p3, side, offset) {
+        const dx = Math.abs(p3.x - p0.x);
+        const dy = Math.abs(p3.y - p0.y);
+        const d = Math.hypot(dx, dy);
+        const along = this._isH(side) ? dx : dy;
+        const MIN = Math.max(8, offset);
+        const MAX = offset + 0.5 * d; // upper cap to keep the shape compact
+        const len = offset * 1.05 + along * 0.3; // moderate growth along the axis
+        return Math.min(MAX, Math.max(MIN, len));
+    }
+    /**
+     * Computes a control point by taking the side direction and **lightly blending**
+     * it toward the target direction. This reduces harsh inflections while keeping
+     * the perceptual attachment to the port side.
+     *
+     * @param side - Base side defining the primary direction (LEFT/RIGHT/TOP/BOTTOM).
+     * @param source - Anchor point where the control handle is attached.
+     * @param target - Opposite end; used to orient the handle slightly toward the goal.
+     * @param handle - Handle length (see {@link _handleLen}).
+     * @returns Control point coordinates for the cubic Bézier segment.
+     */
+    static _softControl(side, source, target, handle) {
+        const v = this._dir(side);
+        const dx = target.x - source.x;
+        const dy = target.y - source.y;
+        const dist = Math.hypot(dx, dy) || 1;
+        const tx = dx / dist;
+        const ty = dy / dist;
+        // Orientation of side vs. target direction (in [-1, 1])
+        const dot = v.x * tx + v.y * ty;
+        // Small base blend toward the target; slightly increase if the side points away.
+        const baseBlend = 0.12;
+        const extra = Math.max(0, -dot) * 0.08; // add a bit when pointing “backwards”
+        const blend = Math.min(0.2, baseBlend + extra);
+        const dirX = v.x * (1 - blend) + tx * blend;
+        const dirY = v.y * (1 - blend) + ty * blend;
+        const len = Math.hypot(dirX, dirY) || 1;
+        return { x: source.x + (dirX / len) * handle, y: source.y + (dirY / len) * handle };
+    }
+    /**
+     * Builds an adaptive connector between `source` and `target`.
+     *
+     * @param request - Connection build request.
+     * @param request.source - Start point of the connector.
+     * @param request.sourceSide - Side at the source port (LEFT/RIGHT/TOP/BOTTOM).
+     * @param request.target - End point of the connector.
+     * @param request.targetSide - Side at the target port (LEFT/RIGHT/TOP/BOTTOM).
+     * @param request.offset - Visual padding & minimal handle baseline (≥ 0).
+     *
+     * @returns Standard {@link IFConnectionBuilderResponse}:
+     * - `path`: SVG cubic path (“M … C …”),
+     * - `points`: discretized samples along the curve,
+     * - `connectionCenter`: approximate visual center for labeling/interaction,
+     * - `secondPoint`/`penultimatePoint`: first/second control points (for tooling).
+     *
+     * @remarks
+     * The returned path slightly offsets the end point by +0.0002 on both axes
+     * to avoid edge cases in some renderers and hit-testing implementations.
+     */
+    handle(request) {
+        const { source, sourceSide, target, targetSide } = request;
+        const offset = Math.max(0, request.offset ?? 0);
+        const p0 = { x: source.x, y: source.y };
+        const p3 = { x: target.x, y: target.y };
+        const h0 = AdaptiveCurveBuilder._handleLen(p0, p3, sourceSide, offset);
+        const h3 = AdaptiveCurveBuilder._handleLen(p3, p0, targetSide, offset);
+        const c1 = AdaptiveCurveBuilder._softControl(sourceSide, p0, p3, h0);
+        const c2 = AdaptiveCurveBuilder._softControl(targetSide, p3, p0, h3);
+        const path = `M ${p0.x} ${p0.y} C ${c1.x} ${c1.y}, ${c2.x} ${c2.y}, ${p3.x + 0.0002} ${p3.y + 0.0002}`;
+        const connectionCenter = new CalculateConnectionCenterHandler().handle(new CalculateConnectionCenterRequest([p0, c1, c2, p3]));
+        return {
+            path,
+            connectionCenter,
+            secondPoint: c1,
+            penultimatePoint: c2,
+            points: _sampleCubic$1(p0, c1, c2, p3, 32),
+        };
+    }
+}
+/**
+ * Evaluates a cubic Bézier at parameter `t` in [0, 1].
+ *
+ * @param p0 - Start point.
+ * @param p1 - First control point.
+ * @param p2 - Second control point.
+ * @param p3 - End point.
+ * @param t - Parameter in [0, 1].
+ * @returns Point on the curve at `t`.
+ */
+function bez3$1(p0, p1, p2, p3, t) {
+    const u = 1 - t, tt = t * t, uu = u * u, uuu = uu * u, ttt = tt * t;
+    return {
+        x: uuu * p0.x + 3 * uu * t * p1.x + 3 * u * tt * p2.x + ttt * p3.x,
+        y: uuu * p0.y + 3 * uu * t * p1.y + 3 * u * tt * p2.y + ttt * p3.y,
+    };
+}
+/**
+ * Uniformly samples a cubic Bézier segment.
+ *
+ * @param p0 - Start point.
+ * @param p1 - First control point.
+ * @param p2 - Second control point.
+ * @param p3 - End point.
+ * @param samples - Number of sub-segments (default: 32). The function returns `samples + 1` points.
+ * @returns Array of sampled points including both endpoints.
+ * @remarks
+ * Sampling is uniform in parameter `t`, not in arc length. This is typically
+ * sufficient for hit-testing and bounding boxes; if you need error-bounded
+ * flattening, consider an adaptive subdivision strategy instead.
+ */
+function _sampleCubic$1(p0, p1, p2, p3, samples = 32) {
+    const out = new Array(samples + 1);
+    out[0] = { ...p0 };
+    for (let i = 1; i <= samples; i++) {
+        out[i] = bez3$1(p0, p1, p2, p3, i / samples);
+    }
+    return out;
+}
+
 class FBezierPathBuilder {
     static _getConnectorOffset(distance, offset) {
         if (distance >= offset) {
@@ -2222,6 +2431,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                     }, 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" }]
         }] });
 
+/* eslint-disable */
 const F_CSS_CLASS = {
     DRAG_AND_DROP: {
         DRAGGING: 'f-dragging',
@@ -2439,34 +2649,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 const F_CONNECTION_BUILDERS = new InjectionToken('F_CONNECTION_BUILDERS');
 
 class FConnectionFactory {
-    builders = {
+    _builders = {
         [EFConnectionType.STRAIGHT]: new FStraightPathBuilder(),
         [EFConnectionType.BEZIER]: new FBezierPathBuilder(),
+        [EFConnectionType.ADAPTIVE_CURVE]: new AdaptiveCurveBuilder(),
         [EFConnectionType.SEGMENT]: new FSegmentPathBuilder(),
+        ...(inject(F_CONNECTION_BUILDERS, { optional: true }) || {}),
     };
-    constructor(builders) {
-        if (builders) {
-            this.builders = { ...this.builders, ...builders };
-        }
-    }
     handle(request) {
-        const builder = this.builders[request.type];
+        const builder = this._builders[request.type];
         if (!builder) {
             throw new Error(`FConnectionBuilder not found for type ${request.type}`);
         }
         return builder.handle(request.payload);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectionFactory, deps: [{ token: F_CONNECTION_BUILDERS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectionFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectionFactory });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectionFactory, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [F_CONNECTION_BUILDERS]
-                }] }] });
+        }] });
 
 let warnedFConnectionCenter = false;
 /** @deprecated '[fConnectionCenter] is deprecated and will be removed in v18.0.0. Use FConnectionContent directive instead.' */
@@ -2749,7 +2951,7 @@ class PolylineContentPlace {
         return { x, y };
     }
     _sizeAlongDirection(element, dir) {
-        const rect = element.getBoundingClientRect();
+        const rect = DragRectCache.fromElement(element);
         return Math.abs(dir.x) * rect.width + Math.abs(dir.y) * rect.height;
     }
     _normalize180(angleDeg) {
@@ -2790,16 +2992,15 @@ class ConnectionContentLayoutEngine {
         const total = sampler.totalLength;
         for (const item of contents) {
             const { position, rotationDeg } = this._placement.compute(sampler, item);
-            const style = this._createTransformString(position, rotationDeg);
-            item.hostElement.setAttribute('style', style);
+            item.hostElement.style.transform = this._createTransformString(position, rotationDeg);
         }
         return total;
     }
     _createTransformString(position, rotationDeg) {
-        return `position: fixed; pointer-events: all; transform: translate(-50%, -50%) rotate(${rotationDeg}deg); left: ${position.x}px; top: ${position.y}px`;
+        return `translate3d(${position.x}px, ${position.y}px, 0) translate(-50%, -50%) rotate(${rotationDeg}deg)`;
     }
 }
-function calculatePathPointsIfEmpty({ point1, point2 }, { secondPoint, connectionCenter, penultimatePoint }) {
+function calculatePathPointsIfEmpty({ point1, point2 }, { secondPoint, connectionCenter, penultimatePoint, }) {
     return [point1, secondPoint || point1, connectionCenter, penultimatePoint || point2, point2];
 }
 
@@ -2847,7 +3048,10 @@ class FConnectionContent {
      * - `0.5` — at the middle of the connection (default).
      */
     position = input(0.5, {
-        transform: (v) => (v < 0 ? 0 : v > 1 ? 1 : v),
+        transform: (x) => {
+            const v = coerceNumberProperty(x);
+            return v < 0 ? 0 : v > 1 ? 1 : v;
+        },
     });
     /**
      * Perpendicular offset from the connection line (in pixels).
@@ -2857,7 +3061,9 @@ class FConnectionContent {
      * - Negative values shift it to the left.
      * - Default: `0` (no shift).
      */
-    offset = input(0);
+    offset = input(0, {
+        transform: (x) => coerceNumberProperty(x),
+    });
     /**
      * Controls the orientation (rotation) of the content relative to the connection.
      *
@@ -2893,6 +3099,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 }]
         }] });
 
+var EFConnectionConnectableSide;
+(function (EFConnectionConnectableSide) {
+    EFConnectionConnectableSide["DEFAULT"] = "default";
+    EFConnectionConnectableSide["TOP"] = "top";
+    EFConnectionConnectableSide["BOTTOM"] = "bottom";
+    EFConnectionConnectableSide["LEFT"] = "left";
+    EFConnectionConnectableSide["RIGHT"] = "right";
+    EFConnectionConnectableSide["CALCULATE"] = "calculate";
+    EFConnectionConnectableSide["CALCULATE_HORIZONTAL"] = "calculate_horizontal";
+    EFConnectionConnectableSide["CALCULATE_VERTICAL"] = "calculate_vertical";
+})(EFConnectionConnectableSide || (EFConnectionConnectableSide = {}));
+
 const MIXIN_BASE = mixinChangeSelection(mixinChangeVisibility(class {
     hostElement;
     constructor(hostElement) {
@@ -2922,6 +3140,10 @@ class FConnectionBase extends MIXIN_BASE {
     fConnectionContents = contentChildren(FConnectionContent, {
         descendants: true,
     });
+    fInputSide = signal(EFConnectionConnectableSide.DEFAULT);
+    _sourceSide = EFConnectableSide.AUTO;
+    fOutputSide = signal(EFConnectionConnectableSide.DEFAULT);
+    _targetSide = EFConnectableSide.AUTO;
     _penultimatePoint = PointExtensions.initialize();
     _secondPoint = PointExtensions.initialize();
     constructor() {
@@ -2935,9 +3157,9 @@ class FConnectionBase extends MIXIN_BASE {
     isContains(element) {
         return (this.hostElement.firstChild?.lastChild).contains(element);
     }
-    setLine({ point1, point2 }, sourceSide, targetSide) {
+    setLine({ point1, point2 }) {
         this.line = LineExtensions.initialize(point1, point2);
-        const pathResult = this._getPathResult(point1, sourceSide, point2, targetSide);
+        const pathResult = this._getPathResult(point1, point2);
         this.path = pathResult.path;
         this._penultimatePoint = pathResult.penultimatePoint || point1;
         this._secondPoint = pathResult.secondPoint || point2;
@@ -2947,12 +3169,19 @@ class FConnectionBase extends MIXIN_BASE {
     _contents() {
         return Array.from(this.fConnectionContents()?.values() ?? []);
     }
-    _getPathResult(source, sourceSide, target, targetSide) {
+    _getPathResult(source, target) {
         const radius = this.fRadius > 0 ? this.fRadius : 0;
         const offset = this.fOffset > 0 ? this.fOffset : 1;
         return this._connectionFactory.handle({
             type: this.fType,
-            payload: { source, sourceSide, target, targetSide, radius, offset },
+            payload: {
+                source,
+                sourceSide: this._sourceSide,
+                target,
+                targetSide: this._targetSide,
+                radius,
+                offset,
+            },
         });
     }
     _createTransformString(position, rotate = 0) {
@@ -2972,6 +3201,16 @@ class FConnectionBase extends MIXIN_BASE {
         this.fDragHandleStart()?.redraw(this._secondPoint, this.line.point1);
         this.fTextComponent().redraw(this.line);
     }
+    /**
+     * Applies the resolved sides to the connection. Don't call this method directly; it's used internally.
+     *
+     * @param sourceSide The resolved side for the source element.
+     * @param targetSide The resolved side for the target element.
+     */
+    _applyResolvedSidesToConnection(sourceSide, targetSide) {
+        this._sourceSide = sourceSide;
+        this._targetSide = targetSide;
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectionBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "18.2.13", type: FConnectionBase, inputs: { fStartColor: { classPropertyName: "fStartColor", publicName: "fStartColor", isSignal: true, isRequired: false, transformFunction: null }, fEndColor: { classPropertyName: "fEndColor", publicName: "fEndColor", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true, isSignal: true }, { propertyName: "fConnectionContents", predicate: FConnectionContent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, isSignal: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, isSignal: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, isSignal: true }, { propertyName: "fDragHandleStart", first: true, predicate: FConnectionDragHandleStartComponent, descendants: true, isSignal: true }, { propertyName: "fDragHandleEnd", first: true, predicate: FConnectionDragHandleEndComponent, descendants: true, isSignal: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, isSignal: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, isSignal: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 });
 }
@@ -2991,6 +3230,7 @@ var EFConnectionType;
     EFConnectionType["SEGMENT"] = "segment";
     EFConnectionType["STRAIGHT"] = "straight";
     EFConnectionType["BEZIER"] = "bezier";
+    EFConnectionType["ADAPTIVE_CURVE"] = "adaptive-curve";
 })(EFConnectionType || (EFConnectionType = {}));
 
 let uniqueId$6 = 0;
@@ -3004,6 +3244,16 @@ class FConnectionForCreateComponent extends FConnectionBase {
     fOffset = 12;
     fBehavior = EFConnectionBehavior.FIXED;
     fType = EFConnectionType.STRAIGHT;
+    fInputSide = input(EFConnectionConnectableSide.DEFAULT, {
+        transform: (x) => {
+            return castToEnum(x, 'fInputSide', EFConnectionConnectableSide);
+        },
+    });
+    fOutputSide = input(EFConnectionConnectableSide.DEFAULT, {
+        transform: (x) => {
+            return castToEnum(x, 'fOutputSide', EFConnectionConnectableSide);
+        },
+    });
     get boundingElement() {
         return this.fPath().hostElement;
     }
@@ -3021,7 +3271,7 @@ class FConnectionForCreateComponent extends FConnectionBase {
         this._mediator.execute(new RemoveConnectionForCreateFromStoreRequest());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectionForCreateComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FConnectionForCreateComponent, selector: "f-connection-for-create", inputs: { fRadius: ["fRadius", "fRadius", numberAttribute], fOffset: ["fOffset", "fOffset", numberAttribute], fBehavior: ["fBehavior", "fBehavior", (value) => castToEnum(value, 'fBehavior', EFConnectionBehavior)], fType: "fType" }, host: { classAttribute: "f-component f-connection f-connection-for-create" }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionForCreateComponent }], usesInheritance: true, usesOnChanges: 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 [attr.d]=\"path\"></path>\n      <circle f-connection-drag-handle-start r=\"8\"></circle>\n      <circle f-connection-drag-handle-end r=\"8\"></circle>\n    </g>\n    <text f-connection-text></text>\n  </g>\n  <ng-content></ng-content>\n</svg>\n@if (fConnectionCenters().length) {\n  <div #fConnectionCenter class=\"f-connection-center\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n  </div>\n}\n\n@if (fConnectionContents().length) {\n  <ng-content select=\"[fConnectionContent]\"></ng-content>\n}\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center,:host .f-connection-content{pointer-events:all}\n"], dependencies: [{ kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionDragHandleStartComponent, selector: "circle[f-connection-drag-handle-start]" }, { kind: "component", type: FConnectionDragHandleEndComponent, selector: "circle[f-connection-drag-handle-end]" }, { 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 });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FConnectionForCreateComponent, selector: "f-connection-for-create", inputs: { fRadius: { classPropertyName: "fRadius", publicName: "fRadius", isSignal: false, isRequired: false, transformFunction: numberAttribute }, fOffset: { classPropertyName: "fOffset", publicName: "fOffset", isSignal: false, isRequired: false, transformFunction: numberAttribute }, fBehavior: { classPropertyName: "fBehavior", publicName: "fBehavior", isSignal: false, isRequired: false, transformFunction: (value) => castToEnum(value, 'fBehavior', EFConnectionBehavior) }, fType: { classPropertyName: "fType", publicName: "fType", isSignal: false, isRequired: false, transformFunction: null }, fInputSide: { classPropertyName: "fInputSide", publicName: "fInputSide", isSignal: true, isRequired: false, transformFunction: null }, fOutputSide: { classPropertyName: "fOutputSide", publicName: "fOutputSide", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "f-component f-connection f-connection-for-create" }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionForCreateComponent }], usesInheritance: true, usesOnChanges: 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 [attr.d]=\"path\"></path>\n      <circle f-connection-drag-handle-start r=\"8\"></circle>\n      <circle f-connection-drag-handle-end r=\"8\"></circle>\n    </g>\n    <text f-connection-text></text>\n  </g>\n  <ng-content></ng-content>\n</svg>\n@if (fConnectionCenters().length) {\n  <div #fConnectionCenter class=\"f-connection-center\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n  </div>\n}\n\n@if (fConnectionContents().length) {\n  <ng-content select=\"[fConnectionContent]\"></ng-content>\n}\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center,:host .f-connection-content{pointer-events:all}\n"], dependencies: [{ kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionDragHandleStartComponent, selector: "circle[f-connection-drag-handle-start]" }, { kind: "component", type: FConnectionDragHandleEndComponent, selector: "circle[f-connection-drag-handle-end]" }, { 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: "18.2.13", ngImport: i0, type: FConnectionForCreateComponent, decorators: [{
             type: Component,
@@ -3064,6 +3314,16 @@ class FConnectionComponent extends FConnectionBase {
         alias: 'fReassignDisabled',
         transform: booleanAttribute,
     });
+    fInputSide = input(EFConnectionConnectableSide.DEFAULT, {
+        transform: (x) => {
+            return castToEnum(x, 'fInputSide', EFConnectionConnectableSide);
+        },
+    });
+    fOutputSide = input(EFConnectionConnectableSide.DEFAULT, {
+        transform: (x) => {
+            return castToEnum(x, 'fOutputSide', EFConnectionConnectableSide);
+        },
+    });
     get boundingElement() {
         return this.fPath().hostElement;
     }
@@ -3078,7 +3338,7 @@ class FConnectionComponent extends FConnectionBase {
         this._mediator.execute(new RemoveConnectionFromStoreRequest(this));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FConnectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FConnectionComponent, selector: "f-connection", inputs: { fId: { classPropertyName: "fId", publicName: "fConnectionId", isSignal: true, isRequired: false, transformFunction: null }, fText: { classPropertyName: "fText", publicName: "fText", isSignal: false, isRequired: false, transformFunction: null }, fTextStartOffset: { classPropertyName: "fTextStartOffset", publicName: "fTextStartOffset", isSignal: false, isRequired: false, transformFunction: null }, fOutputId: { classPropertyName: "fOutputId", publicName: "fOutputId", isSignal: true, isRequired: false, transformFunction: null }, fInputId: { classPropertyName: "fInputId", publicName: "fInputId", isSignal: true, isRequired: false, transformFunction: null }, fRadius: { classPropertyName: "fRadius", publicName: "fRadius", isSignal: false, isRequired: false, transformFunction: numberAttribute }, fOffset: { classPropertyName: "fOffset", publicName: "fOffset", isSignal: false, isRequired: false, transformFunction: numberAttribute }, fBehavior: { classPropertyName: "fBehavior", publicName: "fBehavior", isSignal: false, isRequired: false, transformFunction: (value) => castToEnum(value, 'fBehavior', EFConnectionBehavior) }, fType: { classPropertyName: "fType", publicName: "fType", isSignal: false, isRequired: false, transformFunction: null }, fSelectionDisabled: { classPropertyName: "fSelectionDisabled", publicName: "fSelectionDisabled", isSignal: true, isRequired: false, transformFunction: null }, fReassignableStart: { classPropertyName: "fReassignableStart", publicName: "fReassignableStart", isSignal: true, isRequired: false, transformFunction: null }, fDraggingDisabled: { classPropertyName: "fDraggingDisabled", publicName: "fReassignDisabled", isSignal: true, isRequired: false, transformFunction: null } }, 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 }], exportAs: ["fComponent"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<svg\n  xmlns=\"http://www.w3.org/2000/svg\"\n  style=\"overflow: visible; display: block; vertical-align: middle;\"\n>\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      @if (fReassignableStart()) {\n        <circle f-connection-drag-handle-start r=\"8\"></circle>\n      }\n      <circle f-connection-drag-handle-end r=\"8\"></circle>\n    </g>\n    <text f-connection-text></text>\n  </g>\n</svg>\n@if (fConnectionCenters().length) {\n  <div #fConnectionCenter class=\"f-connection-center\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n  </div>\n}\n\n@if (fConnectionContents().length) {\n  <ng-content select=\"[fConnectionContent]\"></ng-content>\n}\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center,:host .f-connection-content{pointer-events:all}\n"], dependencies: [{ kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionDragHandleStartComponent, selector: "circle[f-connection-drag-handle-start]" }, { kind: "component", type: FConnectionDragHandleEndComponent, selector: "circle[f-connection-drag-handle-end]" }, { 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 });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FConnectionComponent, selector: "f-connection", inputs: { fId: { classPropertyName: "fId", publicName: "fConnectionId", isSignal: true, isRequired: false, transformFunction: null }, fText: { classPropertyName: "fText", publicName: "fText", isSignal: false, isRequired: false, transformFunction: null }, fTextStartOffset: { classPropertyName: "fTextStartOffset", publicName: "fTextStartOffset", isSignal: false, isRequired: false, transformFunction: null }, fOutputId: { classPropertyName: "fOutputId", publicName: "fOutputId", isSignal: true, isRequired: false, transformFunction: null }, fInputId: { classPropertyName: "fInputId", publicName: "fInputId", isSignal: true, isRequired: false, transformFunction: null }, fRadius: { classPropertyName: "fRadius", publicName: "fRadius", isSignal: false, isRequired: false, transformFunction: numberAttribute }, fOffset: { classPropertyName: "fOffset", publicName: "fOffset", isSignal: false, isRequired: false, transformFunction: numberAttribute }, fBehavior: { classPropertyName: "fBehavior", publicName: "fBehavior", isSignal: false, isRequired: false, transformFunction: (value) => castToEnum(value, 'fBehavior', EFConnectionBehavior) }, fType: { classPropertyName: "fType", publicName: "fType", isSignal: false, isRequired: false, transformFunction: null }, fSelectionDisabled: { classPropertyName: "fSelectionDisabled", publicName: "fSelectionDisabled", isSignal: true, isRequired: false, transformFunction: null }, fReassignableStart: { classPropertyName: "fReassignableStart", publicName: "fReassignableStart", isSignal: true, isRequired: false, transformFunction: null }, fDraggingDisabled: { classPropertyName: "fDraggingDisabled", publicName: "fReassignDisabled", isSignal: true, isRequired: false, transformFunction: null }, fInputSide: { classPropertyName: "fInputSide", publicName: "fInputSide", isSignal: true, isRequired: false, transformFunction: null }, fOutputSide: { classPropertyName: "fOutputSide", publicName: "fOutputSide", isSignal: true, isRequired: false, transformFunction: null } }, 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 }], exportAs: ["fComponent"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<svg\n  xmlns=\"http://www.w3.org/2000/svg\"\n  style=\"overflow: visible; display: block; vertical-align: middle;\"\n>\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      @if (fReassignableStart()) {\n        <circle f-connection-drag-handle-start r=\"8\"></circle>\n      }\n      <circle f-connection-drag-handle-end r=\"8\"></circle>\n    </g>\n    <text f-connection-text></text>\n  </g>\n</svg>\n@if (fConnectionCenters().length) {\n  <div #fConnectionCenter class=\"f-connection-center\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n  </div>\n}\n\n@if (fConnectionContents().length) {\n  <ng-content select=\"[fConnectionContent]\"></ng-content>\n}\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center,:host .f-connection-content{pointer-events:all}\n"], dependencies: [{ kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionDragHandleStartComponent, selector: "circle[f-connection-drag-handle-start]" }, { kind: "component", type: FConnectionDragHandleEndComponent, selector: "circle[f-connection-drag-handle-end]" }, { 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: "18.2.13", ngImport: i0, type: FConnectionComponent, decorators: [{
             type: Component,
@@ -3174,6 +3434,16 @@ class FSnapConnectionComponent extends FConnectionBase {
     fOffset = 12;
     fBehavior = EFConnectionBehavior.FIXED;
     fType = EFConnectionType.STRAIGHT;
+    fInputSide = input(EFConnectionConnectableSide.DEFAULT, {
+        transform: (x) => {
+            return castToEnum(x, 'fInputSide', EFConnectionConnectableSide);
+        },
+    });
+    fOutputSide = input(EFConnectionConnectableSide.DEFAULT, {
+        transform: (x) => {
+            return castToEnum(x, 'fOutputSide', EFConnectionConnectableSide);
+        },
+    });
     get boundingElement() {
         return this.fPath().hostElement;
     }
@@ -3191,7 +3461,7 @@ class FSnapConnectionComponent extends FConnectionBase {
         this._mediator.execute(new RemoveSnapConnectionFromStoreRequest());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FSnapConnectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FSnapConnectionComponent, selector: "f-snap-connection", inputs: { fSnapThreshold: ["fSnapThreshold", "fSnapThreshold", numberAttribute], fRadius: ["fRadius", "fRadius", numberAttribute], fOffset: ["fOffset", "fOffset", numberAttribute], fBehavior: ["fBehavior", "fBehavior", (value) => castToEnum(value, 'fBehavior', EFConnectionBehavior)], fType: "fType" }, host: { classAttribute: "f-component f-connection f-snap-connection" }, providers: [{ provide: F_CONNECTION, useExisting: FSnapConnectionComponent }], usesInheritance: true, usesOnChanges: 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 [attr.d]=\"path\"></path>\n      <circle f-connection-drag-handle-start r=\"8\"></circle>\n      <circle f-connection-drag-handle-end r=\"8\"></circle>\n    </g>\n    <text f-connection-text></text>\n  </g>\n  <ng-content></ng-content>\n</svg>\n@if (fConnectionCenters().length) {\n  <div #fConnectionCenter class=\"f-connection-center\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n  </div>\n}\n\n@if (fConnectionContents().length) {\n  <ng-content select=\"[fConnectionContent]\"></ng-content>\n}\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center,:host .f-connection-content{pointer-events:all}\n"], dependencies: [{ kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionDragHandleStartComponent, selector: "circle[f-connection-drag-handle-start]" }, { kind: "component", type: FConnectionDragHandleEndComponent, selector: "circle[f-connection-drag-handle-end]" }, { 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 });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FSnapConnectionComponent, selector: "f-snap-connection", inputs: { fSnapThreshold: { classPropertyName: "fSnapThreshold", publicName: "fSnapThreshold", isSignal: false, isRequired: false, transformFunction: numberAttribute }, fRadius: { classPropertyName: "fRadius", publicName: "fRadius", isSignal: false, isRequired: false, transformFunction: numberAttribute }, fOffset: { classPropertyName: "fOffset", publicName: "fOffset", isSignal: false, isRequired: false, transformFunction: numberAttribute }, fBehavior: { classPropertyName: "fBehavior", publicName: "fBehavior", isSignal: false, isRequired: false, transformFunction: (value) => castToEnum(value, 'fBehavior', EFConnectionBehavior) }, fType: { classPropertyName: "fType", publicName: "fType", isSignal: false, isRequired: false, transformFunction: null }, fInputSide: { classPropertyName: "fInputSide", publicName: "fInputSide", isSignal: true, isRequired: false, transformFunction: null }, fOutputSide: { classPropertyName: "fOutputSide", publicName: "fOutputSide", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "f-component f-connection f-snap-connection" }, providers: [{ provide: F_CONNECTION, useExisting: FSnapConnectionComponent }], usesInheritance: true, usesOnChanges: 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 [attr.d]=\"path\"></path>\n      <circle f-connection-drag-handle-start r=\"8\"></circle>\n      <circle f-connection-drag-handle-end r=\"8\"></circle>\n    </g>\n    <text f-connection-text></text>\n  </g>\n  <ng-content></ng-content>\n</svg>\n@if (fConnectionCenters().length) {\n  <div #fConnectionCenter class=\"f-connection-center\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n  </div>\n}\n\n@if (fConnectionContents().length) {\n  <ng-content select=\"[fConnectionContent]\"></ng-content>\n}\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}:host .f-connection-center,:host .f-connection-content{pointer-events:all}\n"], dependencies: [{ kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionDragHandleStartComponent, selector: "circle[f-connection-drag-handle-start]" }, { kind: "component", type: FConnectionDragHandleEndComponent, selector: "circle[f-connection-drag-handle-end]" }, { 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: "18.2.13", ngImport: i0, type: FSnapConnectionComponent, decorators: [{
             type: Component,
@@ -3234,7 +3504,7 @@ const F_CONNECTION_PROVIDERS = [
  * It constructs a line between the intersections of the connectors rectangles and line from the centers of the connector rectangles
  * @param payload
  */
-function floatingBehavior({ sourceRect, targetRect, }) {
+function floatingBehavior({ sourceRect, targetRect }) {
     return _getIntersectionsLine(_fromRoundedRectIntersections(sourceRect, targetRect), _toRoundedRectIntersections(sourceRect, targetRect), sourceRect, targetRect);
 }
 function _fromRoundedRectIntersections(sourceRect, targetRect) {
@@ -3255,7 +3525,7 @@ function _getIntersectionsLine(from, to, sourceRect, targetRect) {
  * It constructs a line between the gravity centers of the connector rectangles
  * @param payload
  */
-function fixedCenterBehavior({ sourceRect, targetRect, }) {
+function fixedCenterBehavior({ sourceRect, targetRect }) {
     return {
         point1: sourceRect.gravityCenter,
         point2: targetRect.gravityCenter,
@@ -3293,16 +3563,128 @@ function _getPosition(rect, side) {
 }
 
 /**
- * Execution that calculates the connection line based on the behavior.
+ * Small epsilon to treat near-zero differences as negligible.
+ */
+const EPSILON = 0.5;
+/**
+ * Registry of all connection behavior handlers.
+ */
+const BEHAVIOR_HANDLERS = {
+    [EFConnectionBehavior.FLOATING]: floatingBehavior,
+    [EFConnectionBehavior.FIXED_CENTER]: fixedCenterBehavior,
+    [EFConnectionBehavior.FIXED]: fixedOutboundBehavior,
+};
+/**
+ * Calculates connection lines based on behavior rules.
+ * It determines which sides of the source and target should connect,
+ * then delegates to a registered behavior handler.
  */
 let CalculateConnectionLineByBehavior = class CalculateConnectionLineByBehavior {
-    _handlers = {
-        [EFConnectionBehavior.FLOATING.toString()]: floatingBehavior,
-        [EFConnectionBehavior.FIXED_CENTER.toString()]: fixedCenterBehavior,
-        [EFConnectionBehavior.FIXED.toString()]: fixedOutboundBehavior,
-    };
-    handle(payload) {
-        return this._handlers[payload.behavior](payload);
+    /**
+     * Main execution entry point.
+     *
+     * @param request The request containing source, target, and connection details.
+     * @returns A calculated connection line (ILine).
+     */
+    handle(request) {
+        const vectors = this._calculateDirectionalVectors(request.sourceRect.gravityCenter.x, request.sourceRect.gravityCenter.y, request.targetRect.gravityCenter.x, request.targetRect.gravityCenter.y);
+        const sourceSide = this._determineSourceSide(request, vectors);
+        const targetSide = this._determineTargetSide(request, vectors);
+        request.connection._applyResolvedSidesToConnection(sourceSide, targetSide);
+        const handler = this._getBehaviorHandler(request.connection.fBehavior);
+        return handler({
+            sourceRect: request.sourceRect,
+            targetRect: request.targetRect,
+            sourceConnectableSide: sourceSide,
+            targetConnectableSide: targetSide,
+        });
+    }
+    /**
+     * Computes the directional deltas between two rectangles.
+     */
+    _calculateDirectionalVectors(sourceX, sourceY, targetX, targetY) {
+        const sourceToTargetX = targetX - sourceX;
+        const sourceToTargetY = targetY - sourceY;
+        return {
+            sourceToTargetX,
+            sourceToTargetY,
+            targetToSourceX: -sourceToTargetX,
+            targetToSourceY: -sourceToTargetY,
+        };
+    }
+    /**
+     * Determines the side for the source element.
+     */
+    _determineSourceSide(request, vectors) {
+        return this._resolveConnectableSide(request.connection.fOutputSide(), vectors.sourceToTargetX, vectors.sourceToTargetY, request.sourceConnectableSide);
+    }
+    /**
+     * Determines the side for the target element.
+     */
+    _determineTargetSide(request, vectors) {
+        return this._resolveConnectableSide(request.connection.fInputSide(), vectors.targetToSourceX, vectors.targetToSourceY, request.targetConnectableSide);
+    }
+    /**
+     * Resolves which side of a shape to connect to based on direction, fallback, and connection mode.
+     *
+     * @param requestedSide The side mode (e.g. CALCULATE, CALCULATE_HORIZONTAL, FIXED, etc.).
+     * @param deltaX Difference in X between source and target.
+     * @param deltaY Difference in Y between source and target.
+     * @param fallbackSide The default fallback side if calculation is ambiguous.
+     */
+    _resolveConnectableSide(requestedSide, deltaX, deltaY, fallbackSide) {
+        if (requestedSide === EFConnectionConnectableSide.DEFAULT) {
+            return fallbackSide;
+        }
+        const absoluteX = Math.abs(deltaX);
+        const absoluteY = Math.abs(deltaY);
+        const isNearZero = absoluteX < EPSILON && absoluteY < EPSILON;
+        if (isNearZero) {
+            return fallbackSide;
+        }
+        const isHorizontalDominant = absoluteX >= absoluteY;
+        switch (requestedSide) {
+            case EFConnectionConnectableSide.CALCULATE:
+                return isHorizontalDominant
+                    ? deltaX >= 0
+                        ? EFConnectableSide.RIGHT
+                        : EFConnectableSide.LEFT
+                    : deltaY >= 0
+                        ? EFConnectableSide.BOTTOM
+                        : EFConnectableSide.TOP;
+            case EFConnectionConnectableSide.CALCULATE_HORIZONTAL:
+                if (absoluteX < EPSILON) {
+                    return fallbackSide;
+                }
+                return deltaX >= 0 ? EFConnectableSide.RIGHT : EFConnectableSide.LEFT;
+            case EFConnectionConnectableSide.CALCULATE_VERTICAL:
+                if (absoluteY < EPSILON) {
+                    return fallbackSide;
+                }
+                return deltaY >= 0 ? EFConnectableSide.BOTTOM : EFConnectableSide.TOP;
+            case EFConnectionConnectableSide.TOP:
+                return EFConnectableSide.TOP;
+            case EFConnectionConnectableSide.BOTTOM:
+                return EFConnectableSide.BOTTOM;
+            case EFConnectionConnectableSide.LEFT:
+                return EFConnectableSide.LEFT;
+            case EFConnectionConnectableSide.RIGHT:
+                return EFConnectableSide.RIGHT;
+            default:
+                return fallbackSide;
+        }
+    }
+    /**
+     * Returns the appropriate handler for the given connection behavior.
+     *
+     * @throws Error if no handler is registered for the behavior.
+     */
+    _getBehaviorHandler(behavior) {
+        const handler = BEHAVIOR_HANDLERS[behavior];
+        if (!handler) {
+            throw new Error(`[Behavior] No handler for behavior: ${behavior}`);
+        }
+        return handler;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectionLineByBehavior, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectionLineByBehavior });
@@ -3363,6 +3745,9 @@ let GetNormalizedPointExecution = class GetNormalizedPointExecution {
     // +------------------------------------------+
     // Transform from the browser window to the canvas coordinates:
     handle(request) {
+        if (!this._store.flowHost) {
+            return request.position;
+        }
         return Point.fromPoint(request.position)
             .elementTransform(this._store.flowHost)
             .sub(this._transform.scaledPosition)
@@ -3423,12 +3808,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             type: Injectable
         }] });
 
+class DragRectCache {
+    static _cache = new WeakMap();
+    static fromElement(element) {
+        const rect = this._cache.get(element) || RectExtensions.fromElement(element);
+        this._cache.set(element, rect);
+        return rect;
+    }
+    static set(element) {
+        this._cache.set(element, RectExtensions.fromElement(element));
+    }
+    static invalidate(element) {
+        this._cache.delete(element);
+    }
+    static invalidateAll() {
+        this._cache = new WeakMap();
+    }
+}
+
 /**
  * Execution that redraws connections in the FComponentsStore.
  * It resets connectors, sets markers for temporary and snap connections,
  * and sets up connections based on the stored outputs and inputs.
  */
-let RedrawConnectionsExecution = class RedrawConnectionsExecution {
+let RedrawConnections = class RedrawConnections {
     _mediator = inject(FMediator);
     _store = inject(FComponentsStore);
     handle(_request) {
@@ -3442,6 +3845,7 @@ let RedrawConnectionsExecution = class RedrawConnectionsExecution {
         this._store.fConnections.forEach((x) => {
             this._setupConnection(this._getOutput(x.fOutputId()), this._getInput(x.fInputId()), x);
         });
+        DragRectCache.invalidateAll();
     }
     _getOutput(id) {
         const result = this._store.fOutputs.find((x) => x.fId() === id);
@@ -3466,23 +3870,23 @@ let RedrawConnectionsExecution = class RedrawConnectionsExecution {
         fInput.setConnected(fOutput);
         const line = this._getLine(fOutput, fInput, fConnection);
         this._setMarkers(fConnection);
-        fConnection.setLine(line, fOutput.fConnectableSide, fInput.fConnectableSide);
+        fConnection.setLine(line);
         fConnection.initialize();
         fConnection.isSelected() ? fConnection.markAsSelected() : null;
     }
     _getLine(output, input, connection) {
-        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(this._mediator.execute(new GetNormalizedConnectorRectRequest(output.hostElement)), this._mediator.execute(new GetNormalizedConnectorRectRequest(input.hostElement)), connection.fBehavior, output.fConnectableSide, input.fConnectableSide));
+        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(this._mediator.execute(new GetNormalizedConnectorRectRequest(output.hostElement)), this._mediator.execute(new GetNormalizedConnectorRectRequest(input.hostElement)), connection, output.fConnectableSide, input.fConnectableSide));
     }
     _setMarkers(connection) {
         this._mediator.execute(new CreateConnectionMarkersRequest(connection));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RedrawConnectionsExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RedrawConnectionsExecution });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RedrawConnections, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RedrawConnections });
 };
-RedrawConnectionsExecution = __decorate([
+RedrawConnections = __decorate([
     FExecutionRegister(RedrawConnectionsRequest)
-], RedrawConnectionsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RedrawConnectionsExecution, decorators: [{
+], RedrawConnections);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RedrawConnections, decorators: [{
             type: Injectable
         }] });
 
@@ -3600,7 +4004,7 @@ const F_CONNECTION_FEATURES = [
     AddSnapConnectionToStoreExecution,
     CreateConnectionMarkersExecution,
     CalculateConnectionLineByBehavior,
-    RedrawConnectionsExecution,
+    RedrawConnections,
     RemoveConnectionForCreateFromStoreExecution,
     RemoveConnectionFromStoreExecution,
     RemoveConnectionMarkerFromStoreExecution,
@@ -3839,11 +4243,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             type: Injectable
         }] });
 
-class GetAllCanBeConnectedInputsAndRectsRequest {
-    outputOrOutlet;
-    static fToken = Symbol('GetAllCanBeConnectedInputsAndRectsRequest');
-    constructor(outputOrOutlet) {
-        this.outputOrOutlet = outputOrOutlet;
+class CalculateTargetConnectorsToConnectRequest {
+    sourceConnector;
+    pointerPosition;
+    static fToken = Symbol('CalculateTargetConnectorsToConnectRequest');
+    constructor(sourceConnector, pointerPosition) {
+        this.sourceConnector = sourceConnector;
+        this.pointerPosition = pointerPosition;
     }
 }
 
@@ -3879,245 +4285,341 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             type: Injectable
         }] });
 
+class AddNodeToStoreRequest {
+    nodeOrGroup;
+    static fToken = Symbol('AddNodeToStoreRequest');
+    constructor(nodeOrGroup) {
+        this.nodeOrGroup = nodeOrGroup;
+    }
+}
+
 /**
- * Execution that retrieves all input connectors that can be connected to a given output or outlet connector,
+ * Execution that adds a Node to the FComponentsStore.
  */
-let GetAllCanBeConnectedInputsAndRectsExecution = class GetAllCanBeConnectedInputsAndRectsExecution {
-    _mediator = inject(FMediator);
+let AddNodeToStore = class AddNodeToStore {
     _store = inject(FComponentsStore);
-    get _targetConnectors() {
-        return this._store.fInputs;
-    }
-    handle({ outputOrOutlet, }) {
-        return this._getCanBeConnectedInputs(outputOrOutlet).map((x) => {
-            return this._mediator.execute(new GetConnectorAndRectRequest(x));
-        });
-    }
-    _getCanBeConnectedInputs(outputOrOutlet) {
-        let targetConnectors = [];
-        if (outputOrOutlet.hasConnectionLimits) {
-            targetConnectors = this._targetConnectors.filter((x) => outputOrOutlet.canConnectTo(x));
-        }
-        else {
-            targetConnectors = this._targetConnectors.filter((x) => x.canBeConnected);
-            if (!outputOrOutlet.isSelfConnectable) {
-                targetConnectors = this._filterSelfConnectable(targetConnectors, outputOrOutlet);
-            }
-        }
-        return targetConnectors;
-    }
-    _filterSelfConnectable(targetConnectors, outputOrOutlet) {
-        return targetConnectors.filter(({ fNodeId }) => outputOrOutlet.fNodeId !== fNodeId);
+    handle(request) {
+        this._store.addComponent(this._store.fNodes, request.nodeOrGroup);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetAllCanBeConnectedInputsAndRectsExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetAllCanBeConnectedInputsAndRectsExecution });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddNodeToStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddNodeToStore });
 };
-GetAllCanBeConnectedInputsAndRectsExecution = __decorate([
-    FExecutionRegister(GetAllCanBeConnectedInputsAndRectsRequest)
-], GetAllCanBeConnectedInputsAndRectsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetAllCanBeConnectedInputsAndRectsExecution, decorators: [{
+AddNodeToStore = __decorate([
+    FExecutionRegister(AddNodeToStoreRequest)
+], AddNodeToStore);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddNodeToStore, decorators: [{
             type: Injectable
         }] });
 
-class GetAllCanBeConnectedSourceConnectorsAndRectsRequest {
-    targetConnector;
-    static fToken = Symbol('GetAllCanBeConnectedSourceConnectorsAndRectsRequest');
-    constructor(targetConnector) {
-        this.targetConnector = targetConnector;
+class CalculateInputConnectionsRequest {
+    nodeOrGroup;
+    static fToken = Symbol('CalculateInputConnectionsRequest');
+    constructor(nodeOrGroup) {
+        this.nodeOrGroup = nodeOrGroup;
     }
 }
 
 /**
- * Execution that retrieves all source connectors that can be connected to a given target connector,
- * along with their rectangles.
- * Source - Output or Outlet connectors.
+ * Execution that calculates input connections for a given FNode.
  */
-let GetAllCanBeConnectedSourceConnectorsAndRectsExecution = class GetAllCanBeConnectedSourceConnectorsAndRectsExecution {
-    _mediator = inject(FMediator);
+let CalculateInputConnections = class CalculateInputConnections {
     _store = inject(FComponentsStore);
-    get _sourceConnectors() {
-        return this._store.fOutputs;
-    }
-    handle({ targetConnector, }) {
-        return this._getCanBeConnectedSourceConnectors(targetConnector).map((x) => {
-            return this._mediator.execute(new GetConnectorAndRectRequest(x));
-        });
+    handle({ nodeOrGroup }) {
+        const ids = this._collectInputIds(nodeOrGroup);
+        return this._collectConnections(ids);
+    }
+    _collectInputIds(nodeOrGroup) {
+        const ids = new Set();
+        for (const connector of this._store.fInputs) {
+            if (nodeOrGroup.isContains(connector.hostElement)) {
+                ids.add(connector.fId());
+            }
+        }
+        return ids;
     }
-    _getCanBeConnectedSourceConnectors(targetConnector) {
-        return this._sourceConnectors.filter((x) => {
-            let result = x.canBeConnected;
-            if (result && x.hasConnectionLimits) {
-                result = x.canConnectTo(targetConnector);
+    _collectConnections(ids) {
+        const result = [];
+        for (const conn of this._store.fConnections) {
+            if (ids.has(conn.fInputId())) {
+                result.push(conn);
             }
-            return result;
-        });
+        }
+        return result;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetAllCanBeConnectedSourceConnectorsAndRectsExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetAllCanBeConnectedSourceConnectorsAndRectsExecution });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateInputConnections, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateInputConnections });
 };
-GetAllCanBeConnectedSourceConnectorsAndRectsExecution = __decorate([
-    FExecutionRegister(GetAllCanBeConnectedSourceConnectorsAndRectsRequest)
-], GetAllCanBeConnectedSourceConnectorsAndRectsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetAllCanBeConnectedSourceConnectorsAndRectsExecution, decorators: [{
+CalculateInputConnections = __decorate([
+    FExecutionRegister(CalculateInputConnectionsRequest)
+], CalculateInputConnections);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateInputConnections, decorators: [{
             type: Injectable
         }] });
 
-class MarkConnectableConnectorsRequest {
-    connectors;
-    static fToken = Symbol('MarkConnectableConnectorsRequest');
-    constructor(connectors) {
-        this.connectors = connectors;
+class CalculateConnectableSideByConnectedPositionsRequest {
+    connector;
+    pointerPosition;
+    static fToken = Symbol('CalculateConnectableSideByConnectedPositionsRequest');
+    constructor(connector, pointerPosition) {
+        this.connector = connector;
+        this.pointerPosition = pointerPosition;
     }
 }
 
 /**
- * Execution that marks connectors as connectable.
+ * Converts allowed sides array to a compact bit mask.
+ * If not provided or empty -> all sides allowed.
  */
-let MarkConnectableConnectors = class MarkConnectableConnectors {
-    _store = inject(FComponentsStore);
-    handle({ connectors }) {
-        this._store.flowHost.classList.add(F_CSS_CLASS.DRAG_AND_DROP.CONNECTIONS_DRAGGING);
-        connectors.forEach((x) => this._markConnector(x));
-    }
-    _markConnector({ hostElement }) {
-        hostElement.classList.add(F_CSS_CLASS.CONNECTOR.CONNECTABLE);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MarkConnectableConnectors, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MarkConnectableConnectors });
-};
-MarkConnectableConnectors = __decorate([
-    FExecutionRegister(MarkConnectableConnectorsRequest)
-], MarkConnectableConnectors);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MarkConnectableConnectors, decorators: [{
-            type: Injectable
-        }] });
-
-class RemoveInputFromStoreRequest {
-    component;
-    static fToken = Symbol('RemoveInputFromStoreRequest');
-    constructor(component) {
-        this.component = component;
+const SNAP_EPS = 2;
+var SideMask;
+(function (SideMask) {
+    SideMask[SideMask["NONE"] = 0] = "NONE";
+    SideMask[SideMask["LEFT"] = 1] = "LEFT";
+    SideMask[SideMask["RIGHT"] = 2] = "RIGHT";
+    SideMask[SideMask["TOP"] = 4] = "TOP";
+    SideMask[SideMask["BOTTOM"] = 8] = "BOTTOM";
+    SideMask[SideMask["ALL"] = 15] = "ALL";
+})(SideMask || (SideMask = {}));
+/**
+ * Determines final side using ideal side first; if disallowed, picks best fallback.
+ * Inputs are numbers to avoid object wrappers on hot path.
+ */
+function determineSide(selfX, selfY, avgX, avgY, allowed) {
+    const allowedMask = _toSideMask(allowed);
+    const dx = avgX - selfX;
+    const dy = avgY - selfY;
+    const ideal = _pickIdealSide(dx, dy);
+    if (_isAllowed(ideal, allowedMask)) {
+        return ideal;
     }
+    return _pickFallbackSide(dx, dy, allowedMask, ideal);
 }
-
 /**
- * Execution that removes an inputConnector from the FComponentsStore.
+ * Converts allowed sides array to a compact bit mask.
+ * If not provided or empty -> all sides allowed.
  */
-let RemoveInputFromStore = class RemoveInputFromStore {
-    _store = inject(FComponentsStore);
-    handle({ component }) {
-        this._store.removeComponent(this._store.fInputs, component);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveInputFromStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveInputFromStore });
-};
-RemoveInputFromStore = __decorate([
-    FExecutionRegister(RemoveInputFromStoreRequest)
-], RemoveInputFromStore);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveInputFromStore, decorators: [{
-            type: Injectable
-        }] });
-
-class RemoveOutletFromStoreRequest {
-    fComponent;
-    static fToken = Symbol('RemoveOutletFromStoreRequest');
-    constructor(fComponent) {
-        this.fComponent = fComponent;
+function _toSideMask(allowed) {
+    if (!allowed || allowed.length === 0)
+        return SideMask.ALL;
+    let mask = SideMask.NONE;
+    for (let i = 0; i < allowed.length; i++) {
+        switch (allowed[i]) {
+            case EFConnectableSide.LEFT:
+                mask |= SideMask.LEFT;
+                break;
+            case EFConnectableSide.RIGHT:
+                mask |= SideMask.RIGHT;
+                break;
+            case EFConnectableSide.TOP:
+                mask |= SideMask.TOP;
+                break;
+            case EFConnectableSide.BOTTOM:
+                mask |= SideMask.BOTTOM;
+                break;
+        }
     }
+    return mask || SideMask.ALL;
 }
-
 /**
- * Execution that removes an outlet connector from the FComponentsStore.
+ * Picks the "ideal" side based on vector (dx, dy) with hysteresis.
  */
-let RemoveOutletFromStoreExecution = class RemoveOutletFromStoreExecution {
-    _store = inject(FComponentsStore);
-    handle(request) {
-        this._store.removeComponent(this._store.fOutlets, request.fComponent);
+function _pickIdealSide(dx, dy) {
+    const ax = dx < 0 ? -dx : dx;
+    const ay = dy < 0 ? -dy : dy;
+    if (ax - ay > SNAP_EPS) {
+        return dx < 0 ? EFConnectableSide.LEFT : EFConnectableSide.RIGHT;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutletFromStoreExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutletFromStoreExecution });
+    if (ay - ax > SNAP_EPS) {
+        return dy < 0 ? EFConnectableSide.TOP : EFConnectableSide.BOTTOM;
+    }
+    return dy < 0 ? EFConnectableSide.TOP : EFConnectableSide.BOTTOM;
+}
+/**
+ * Quick membership check via bit mask.
+ */
+function _isAllowed(side, mask) {
+    switch (side) {
+        case EFConnectableSide.LEFT:
+            return (mask & SideMask.LEFT) !== 0;
+        case EFConnectableSide.RIGHT:
+            return (mask & SideMask.RIGHT) !== 0;
+        case EFConnectableSide.TOP:
+            return (mask & SideMask.TOP) !== 0;
+        case EFConnectableSide.BOTTOM:
+            return (mask & SideMask.BOTTOM) !== 0;
+        default:
+            return true;
+    }
+}
+/**
+ * Picks the best available side from allowed mask by maximizing directional score.
+ * No intermediate objects, constant-time operations.
+ */
+function _pickFallbackSide(dx, dy, allowedMask, ideal) {
+    let bestSide = ideal;
+    let bestScore = -Infinity;
+    if (allowedMask & SideMask.RIGHT) {
+        const s = dx;
+        if (s > bestScore) {
+            bestScore = s;
+            bestSide = EFConnectableSide.RIGHT;
+        }
+    }
+    if (allowedMask & SideMask.LEFT) {
+        const s = -dx;
+        if (s > bestScore) {
+            bestScore = s;
+            bestSide = EFConnectableSide.LEFT;
+        }
+    }
+    if (allowedMask & SideMask.BOTTOM) {
+        const s = dy;
+        if (s > bestScore) {
+            bestScore = s;
+            bestSide = EFConnectableSide.BOTTOM;
+        }
+    }
+    if (allowedMask & SideMask.TOP) {
+        const s = -dy;
+        if (s > bestScore) {
+            bestScore = s;
+            bestSide = EFConnectableSide.TOP;
+        }
+    }
+    return bestSide;
+}
+
+/**
+ * Checks if the given side is one of the calculate modes.
+ * @param side The connectable side to check.
+ * @returns True if the side is a calculate mode, false otherwise.
+ */
+function isCalculateMode(side) {
+    return (side === EFConnectableSide.CALCULATE ||
+        side === EFConnectableSide.CALCULATE_HORIZONTAL ||
+        side === EFConnectableSide.CALCULATE_VERTICAL);
+}
+
+const CALCULATABLE_SIDES = {
+    [EFConnectableSide.CALCULATE]: [
+        EFConnectableSide.TOP,
+        EFConnectableSide.BOTTOM,
+        EFConnectableSide.LEFT,
+        EFConnectableSide.RIGHT,
+    ],
+    [EFConnectableSide.CALCULATE_HORIZONTAL]: [EFConnectableSide.LEFT, EFConnectableSide.RIGHT],
+    [EFConnectableSide.CALCULATE_VERTICAL]: [EFConnectableSide.TOP, EFConnectableSide.BOTTOM],
 };
-RemoveOutletFromStoreExecution = __decorate([
-    FExecutionRegister(RemoveOutletFromStoreRequest)
-], RemoveOutletFromStoreExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutletFromStoreExecution, decorators: [{
-            type: Injectable
-        }] });
 
-class RemoveOutputFromStoreRequest {
-    fComponent;
-    static fToken = Symbol('RemoveOutputFromStoreRequest');
-    constructor(fComponent) {
-        this.fComponent = fComponent;
+class GetNormalizedElementRectRequest {
+    element;
+    static fToken = Symbol('GetNormalizedElementRectRequest');
+    constructor(element) {
+        this.element = element;
     }
 }
 
 /**
- * Execution that removes an outlet connector from the FComponentsStore.
+ * Execution that retrieves the normalized rectangle of an element.
+ * It calculates the rectangle based on the element's position and size,
+ * adjusting for the canvas transformation and element offsets.
  */
-let RemoveOutputFromStoreExecution = class RemoveOutputFromStoreExecution {
+let GetNormalizedElementRectExecution = class GetNormalizedElementRectExecution {
     _store = inject(FComponentsStore);
+    _mediator = inject(FMediator);
+    get _transform() {
+        return this._store.fCanvas.transform;
+    }
     handle(request) {
-        this._store.removeComponent(this._store.fOutputs, request.fComponent);
+        const systemRect = this._getElementRoundedRect(request);
+        const position = this._normalizePosition(systemRect);
+        const unscaledSize = this._unscaleSize(systemRect);
+        const unscaledRect = this._getUnscaledRect(position, unscaledSize, systemRect);
+        const offsetSize = this._getOffsetSize(request.element, unscaledSize);
+        return RoundedRect.fromCenter(unscaledRect, offsetSize.width, offsetSize.height);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutputFromStoreExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutputFromStoreExecution });
+    _getElementRoundedRect(request) {
+        return RoundedRect.fromRect(RectExtensions.fromElement(request.element));
+    }
+    _normalizePosition(rect) {
+        return this._mediator.execute(new GetNormalizedPointRequest(rect));
+    }
+    _unscaleSize(rect) {
+        return SizeExtensions.initialize(rect.width / this._transform.scale, rect.height / this._transform.scale);
+    }
+    _getUnscaledRect(position, size, rect) {
+        return new RoundedRect(position.x, position.y, size.width, size.height, rect.radius1, rect.radius2, rect.radius3, rect.radius4);
+    }
+    _getOffsetSize(element, size) {
+        return SizeExtensions.offsetFromElement(element) || size;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNormalizedElementRectExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNormalizedElementRectExecution });
 };
-RemoveOutputFromStoreExecution = __decorate([
-    FExecutionRegister(RemoveOutputFromStoreRequest)
-], RemoveOutputFromStoreExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutputFromStoreExecution, decorators: [{
+GetNormalizedElementRectExecution = __decorate([
+    FExecutionRegister(GetNormalizedElementRectRequest)
+], GetNormalizedElementRectExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNormalizedElementRectExecution, decorators: [{
             type: Injectable
         }] });
 
-class UnmarkConnectableConnectorsRequest {
-    connectors;
-    static fToken = Symbol('UnmarkConnectableConnectorsRequest');
-    constructor(connectors) {
-        this.connectors = connectors;
-    }
-}
-
 /**
- * Execution that unmarks connectors as connectable.
+ * Execution that calculates the connectable side for a connector
+ * based on positions of connected connectors and allowed sides.
  */
-let UnmarkConnectableConnectors = class UnmarkConnectableConnectors {
-    _store = inject(FComponentsStore);
-    handle({ connectors }) {
-        this._store.flowHost.classList.remove(F_CSS_CLASS.DRAG_AND_DROP.CONNECTIONS_DRAGGING);
-        connectors.forEach((x) => this._unmarkConnector(x));
+let CalculateConnectableSideByConnectedPositions = class CalculateConnectableSideByConnectedPositions {
+    _mediator = inject(FMediator);
+    /**
+     * Entry point (hot path). Avoids intermediate arrays and redundant allocations.
+     *
+     * @param request - Contains the connector and optionally allowed sides.
+     * @returns {EFConnectableSide} - The chosen connectable side.
+     */
+    handle({ connector, pointerPosition, }) {
+        const mode = connector.userFConnectableSide;
+        const selfCenter = this._getConnectorRect(connector.hostElement).gravityCenter;
+        const acc = this._accumulateConnectedCenters(connector.hostElement, connector.toConnector, pointerPosition);
+        const avgX = acc.sumX / acc.count;
+        const avgY = acc.sumY / acc.count;
+        return determineSide(selfCenter.x, selfCenter.y, avgX, avgY, CALCULATABLE_SIDES[mode]);
     }
-    _unmarkConnector({ hostElement }) {
-        hostElement.classList.remove(F_CSS_CLASS.CONNECTOR.CONNECTABLE);
+    _accumulateConnectedCenters(selfHost, connected, pointerPosition) {
+        let sumX = pointerPosition?.x || 0;
+        let sumY = pointerPosition?.y || 0;
+        let count = pointerPosition ? 1 : 0;
+        if (connected && connected.length) {
+            for (let i = 0; i < connected.length; i++) {
+                const el = connected[i].hostElement;
+                if (el === selfHost)
+                    continue;
+                const c = this._getConnectorRect(el).gravityCenter;
+                sumX += c.x;
+                sumY += c.y;
+                count++;
+            }
+        }
+        return { sumX, sumY, count };
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UnmarkConnectableConnectors, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UnmarkConnectableConnectors });
+    _getConnectorRect(element) {
+        return this._mediator.execute(new GetNormalizedElementRectRequest(element));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByConnectedPositions, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByConnectedPositions });
 };
-UnmarkConnectableConnectors = __decorate([
-    FExecutionRegister(UnmarkConnectableConnectorsRequest)
-], UnmarkConnectableConnectors);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UnmarkConnectableConnectors, decorators: [{
+CalculateConnectableSideByConnectedPositions = __decorate([
+    FExecutionRegister(CalculateConnectableSideByConnectedPositionsRequest)
+], CalculateConnectableSideByConnectedPositions);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByConnectedPositions, decorators: [{
             type: Injectable
         }] });
 
-/*
- * This file exports all the connector-related executions that can be used in the FFlow domain.
- */
-const F_CONNECTORS_FEATURES = [
-    AddInputToStore,
-    AddOutletToStore,
-    AddOutputToStore,
-    CalculateClosestConnector,
-    FindConnectableConnectorUsingPriorityAndPositionExecution,
-    GetAllCanBeConnectedSourceConnectorsAndRectsExecution,
-    GetAllCanBeConnectedInputsAndRectsExecution,
-    GetConnectorAndRect,
-    MarkConnectableConnectors,
-    RemoveInputFromStore,
-    RemoveOutletFromStoreExecution,
-    RemoveOutputFromStoreExecution,
-    UnmarkConnectableConnectors,
-];
+class CalculateConnectableSideByInternalPositionRequest {
+    connector;
+    static fToken = Symbol('CalculateConnectableSideByInternalPositionRequest');
+    constructor(connector) {
+        this.connector = connector;
+    }
+}
 
 class AddDndToStoreRequest {
     fComponent;
@@ -4585,14 +5087,14 @@ class FCreateConnectionDragHandler {
         this._store = _injector.get(FComponentsStore);
         this._toConnectorRect = RoundedRect.fromRect(RectExtensions.initialize(_onPointerDownPosition.x, _onPointerDownPosition.y));
         this.fData = {
-            fOutputOrOutletId: this._fOutputOrOutlet.fId,
+            fOutputOrOutletId: this._fOutputOrOutlet.fId(),
         };
     }
     prepareDragSequence() {
+        this._fOutputWithRect = this._mediator.execute(new GetConnectorAndRectRequest(this._fOutputOrOutlet));
         this._getAndMarkCanBeConnectedInputs();
         this._initializeSnapConnection();
         this._initializeConnectionForCreate();
-        this._fOutputWithRect = this._mediator.execute(new GetConnectorAndRectRequest(this._fOutputOrOutlet));
         this._connection.show();
         this.onPointerMove(PointExtensions.initialize());
         this._result.setData({
@@ -4602,7 +5104,7 @@ class FCreateConnectionDragHandler {
         });
     }
     _getAndMarkCanBeConnectedInputs() {
-        this._canBeConnectedInputs = this._mediator.execute(new GetAllCanBeConnectedInputsAndRectsRequest(this._fOutputOrOutlet));
+        this._canBeConnectedInputs = this._mediator.execute(new CalculateTargetConnectorsToConnectRequest(this._fOutputOrOutlet, this._fOutputWithRect.fRect.gravityCenter));
         this._mediator.execute(new MarkConnectableConnectorsRequest(this._canBeConnectedInputs.map((x) => x.fConnector)));
     }
     _initializeSnapConnection() {
@@ -4617,22 +5119,22 @@ class FCreateConnectionDragHandler {
         this._connection.initialize();
     }
     onPointerMove(difference) {
-        const fClosestInput = this._findClosestInput(difference);
-        this._drawConnectionForCreate(this._toConnectorRect.addPoint(difference), fClosestInput?.fConnector.fConnectableSide || EFConnectableSide.TOP);
+        const closestInput = this._findClosestInput(difference);
+        this._drawConnectionForCreate(this._toConnectorRect.addPoint(difference), closestInput?.fConnector.fConnectableSide || EFConnectableSide.TOP);
         if (this._snapConnection) {
-            this._drawSnapConnection(this._getClosestInputForSnapConnection(fClosestInput));
+            this._drawSnapConnection(this._getClosestInputForSnapConnection(closestInput));
         }
     }
     _drawConnectionForCreate(toConnectorRect, fSide) {
-        const line = this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(this._fOutputWithRect.fRect, toConnectorRect, this._connection.fBehavior, this._fOutputWithRect.fConnector.fConnectableSide, fSide));
-        this._connection.setLine(line, this._fOutputWithRect.fConnector.fConnectableSide, fSide);
+        const line = this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(this._fOutputWithRect.fRect, toConnectorRect, this._connection, this._fOutputWithRect.fConnector.fConnectableSide, fSide));
+        this._connection.setLine(line);
         this._connection.redraw();
     }
     _drawSnapConnection(fClosestInput) {
         if (fClosestInput) {
-            const line = this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(this._fOutputWithRect.fRect, fClosestInput.fRect, this._snapConnection.fBehavior, this._fOutputWithRect.fConnector.fConnectableSide, fClosestInput.fConnector.fConnectableSide));
+            const line = this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(this._fOutputWithRect.fRect, fClosestInput.fRect, this._snapConnection, this._fOutputWithRect.fConnector.fConnectableSide, fClosestInput.fConnector.fConnectableSide));
             this._snapConnection?.show();
-            this._snapConnection?.setLine(line, this._fOutputWithRect.fConnector.fConnectableSide, fClosestInput.fConnector.fConnectableSide);
+            this._snapConnection?.setLine(line);
             this._snapConnection?.redraw();
         }
         else {
@@ -4799,18 +5301,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             type: Injectable
         }] });
 
-class FCreateConnectionFromOutputPreparationRequest {
+class CreateConnectionFromOutputPreparationRequest {
     event;
-    fNode;
-    static fToken = Symbol('FCreateConnectionFromOutputPreparationRequest');
-    constructor(event, fNode) {
+    node;
+    static fToken = Symbol('CreateConnectionFromOutputPreparationRequest');
+    constructor(event, node) {
         this.event = event;
-        this.fNode = fNode;
+        this.node = node;
     }
 }
 
-let FCreateConnectionFromOutputPreparationExecution = class FCreateConnectionFromOutputPreparationExecution {
-    _fMediator = inject(FMediator);
+let CreateConnectionFromOutputPreparation = class CreateConnectionFromOutputPreparation {
+    _mediator = inject(FMediator);
     _store = inject(FComponentsStore);
     handle(request) {
         if (!this._isValid(request)) {
@@ -4818,70 +5320,74 @@ let FCreateConnectionFromOutputPreparationExecution = class FCreateConnectionFro
         }
         const fOutput = this._getOutput(request.event.targetElement);
         if (fOutput.canBeConnected) {
-            this._fMediator.execute(new FCreateConnectionDragHandlerPreparationRequest(request.event.getPosition(), fOutput));
+            this._mediator.execute(new FCreateConnectionDragHandlerPreparationRequest(request.event.getPosition(), fOutput));
         }
     }
     _isValid(request) {
-        return this._isNodeOutput(request.event.targetElement, request.fNode);
+        return this._isNodeOutput(request.event.targetElement, request.node);
     }
     _isNodeOutput(element, fNode) {
         return isNodeOutput(element) && !this._getNodeOutlets(fNode).length;
     }
     _getNodeOutlets(node) {
-        return this._store.fOutlets
-            .filter((x) => node.isContains(x.hostElement));
+        return this._store.fOutlets.filter((x) => node.isContains(x.hostElement));
     }
     _getOutput(element) {
-        const result = this._store.fOutputs
-            .find((x) => x.hostElement.contains(element));
+        const result = this._store.fOutputs.find((x) => x.hostElement.contains(element));
         if (!result) {
             throw new Error('Output not found');
         }
         return result;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FCreateConnectionFromOutputPreparationExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FCreateConnectionFromOutputPreparationExecution });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CreateConnectionFromOutputPreparation, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CreateConnectionFromOutputPreparation });
 };
-FCreateConnectionFromOutputPreparationExecution = __decorate([
-    FExecutionRegister(FCreateConnectionFromOutputPreparationRequest)
-], FCreateConnectionFromOutputPreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FCreateConnectionFromOutputPreparationExecution, decorators: [{
+CreateConnectionFromOutputPreparation = __decorate([
+    FExecutionRegister(CreateConnectionFromOutputPreparationRequest)
+], CreateConnectionFromOutputPreparation);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CreateConnectionFromOutputPreparation, decorators: [{
             type: Injectable
         }] });
 
-class FCreateConnectionPreparationRequest {
+class CreateConnectionPreparationRequest {
     event;
     fTrigger;
-    static fToken = Symbol('FCreateConnectionPreparationRequest');
+    static fToken = Symbol('CreateConnectionPreparationRequest');
     constructor(event, fTrigger) {
         this.event = event;
         this.fTrigger = fTrigger;
     }
 }
 
-let FCreateConnectionPreparationExecution = class FCreateConnectionPreparationExecution {
-    _fMediator = inject(FMediator);
+// import { IPoint } from '@foblex/2d';
+// import { BrowserService } from '@foblex/platform';
+let CreateConnectionPreparation = class CreateConnectionPreparation {
+    _mediator = inject(FMediator);
     _store = inject(FComponentsStore);
     _dragContext = inject(FDraggableDataContext);
-    _fNode;
+    // private readonly _browser = inject(BrowserService);
+    _node;
     handle(request) {
         if (!this._isValid(request) || !this._isValidTrigger(request)) {
             return;
         }
+        // const elements = this._elementsFromPoint(request.event.getPosition());
+        //
+        // const outlet = this._findOutlet(elements);
+        // const output = this._findOutput(elements);
         if (isNodeOutlet(request.event.targetElement)) {
-            this._fMediator.execute(new FCreateConnectionFromOutletPreparationRequest(request.event, this._fNode));
+            this._mediator.execute(new FCreateConnectionFromOutletPreparationRequest(request.event, this._node));
         }
         else if (isNodeOutput(request.event.targetElement)) {
-            this._fMediator.execute(new FCreateConnectionFromOutputPreparationRequest(request.event, this._fNode));
+            this._mediator.execute(new CreateConnectionFromOutputPreparationRequest(request.event, this._node));
         }
     }
     _isValid(request) {
         return !!this._getNode(request.event) && this._isValidConditions();
     }
     _getNode(event) {
-        this._fNode = this._store
-            .fNodes.find(n => n.isContains(event.targetElement));
-        return this._fNode;
+        this._node = this._store.fNodes.find((n) => n.isContains(event.targetElement));
+        return this._node;
     }
     _isValidConditions() {
         return this._dragContext.isEmpty() && !!this._store.fTempConnection;
@@ -4889,13 +5395,13 @@ let FCreateConnectionPreparationExecution = class FCreateConnectionPreparationEx
     _isValidTrigger(request) {
         return isValidEventTrigger(request.event.originalEvent, request.fTrigger);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FCreateConnectionPreparationExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FCreateConnectionPreparationExecution });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CreateConnectionPreparation, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CreateConnectionPreparation });
 };
-FCreateConnectionPreparationExecution = __decorate([
-    FExecutionRegister(FCreateConnectionPreparationRequest)
-], FCreateConnectionPreparationExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FCreateConnectionPreparationExecution, decorators: [{
+CreateConnectionPreparation = __decorate([
+    FExecutionRegister(CreateConnectionPreparationRequest)
+], CreateConnectionPreparation);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CreateConnectionPreparation, decorators: [{
             type: Injectable
         }] });
 
@@ -4942,7 +5448,7 @@ class FReassignTargetDragHandler {
         return this._connectableConnectors;
     }
     markConnectableConnector() {
-        this._connectableConnectors = this._mediator.execute(new GetAllCanBeConnectedInputsAndRectsRequest(this._sourceConnector));
+        this._connectableConnectors = this._mediator.execute(new CalculateTargetConnectorsToConnectRequest(this._sourceConnector, this._sourceConnectorRect.gravityCenter));
         this._mediator.execute(new MarkConnectableConnectorsRequest(this._connectableConnectors.map((x) => x.fConnector)));
     }
     initializeSnapConnection(snapConnection) {
@@ -4966,18 +5472,18 @@ class FReassignTargetDragHandler {
     }
     _drawConnection(newPoint, fSide) {
         const line = this._calculateNewLine(newPoint, fSide);
-        this._connection.setLine(line, this._sourceConnectorAndRect.fConnector.fConnectableSide, fSide);
+        this._connection.setLine(line);
         this._connection.redraw();
     }
     _calculateNewLine(targetPoint, fSide) {
-        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(this._sourceConnectorRect, roundedRectFromPoint(targetPoint), this._connection.fBehavior, this._sourceConnector.fConnectableSide, fSide));
+        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(this._sourceConnectorRect, roundedRectFromPoint(targetPoint), this._connection, this._sourceConnector.fConnectableSide, fSide));
     }
-    _drawSnapConnection(fClosestConnector) {
+    _drawSnapConnection(closestConnector) {
         const snapConnection = this._snapConnection;
-        if (fClosestConnector) {
-            const line = this._getLineToClosestTargetConnector(fClosestConnector, snapConnection);
+        if (closestConnector) {
+            const line = this._getLineToClosestTargetConnector(closestConnector, snapConnection);
             snapConnection.show();
-            snapConnection.setLine(line, this._sourceConnector.fConnectableSide, fClosestConnector.fConnector.fConnectableSide);
+            snapConnection.setLine(line);
             snapConnection.redraw();
         }
         else {
@@ -4985,7 +5491,7 @@ class FReassignTargetDragHandler {
         }
     }
     _getLineToClosestTargetConnector(fClosestInput, snapConnection) {
-        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(this._sourceConnectorRect, fClosestInput.fRect, snapConnection.fBehavior, this._sourceConnector.fConnectableSide, fClosestInput.fConnector.fConnectableSide));
+        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(this._sourceConnectorRect, fClosestInput.fRect, snapConnection, this._sourceConnector.fConnectableSide, fClosestInput.fConnector.fConnectableSide));
     }
     onPointerUp() {
         this._drawConnection(this._connectorRect, this._targetConnectorAndRect.fConnector.fConnectableSide);
@@ -5019,7 +5525,7 @@ class FReassignSourceDragHandler {
         return this._connectableConnectors;
     }
     markConnectableConnector() {
-        this._connectableConnectors = this._mediator.execute(new GetAllCanBeConnectedSourceConnectorsAndRectsRequest(this._targetConnector));
+        this._connectableConnectors = this._mediator.execute(new CalculateSourceConnectorsToConnectRequest(this._targetConnector, this._targetConnectorAndRect.fRect.gravityCenter));
         const isExistCurrentSourceConnector = this._connectableConnectors.some((x) => x.fConnector.fId() === this._sourceConnector.fId());
         if (!isExistCurrentSourceConnector) {
             this._connectableConnectors.push(this._sourceConnectorAndRect);
@@ -5047,18 +5553,18 @@ class FReassignSourceDragHandler {
     }
     _drawConnection(newPoint, fSide) {
         const line = this._calculateNewLine(newPoint, fSide);
-        this._connection.setLine(line, fSide, this._targetConnectorAndRect.fConnector.fConnectableSide);
+        this._connection.setLine(line);
         this._connection.redraw();
     }
     _calculateNewLine(sourcePoint, fSide) {
-        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(roundedRectFromPoint(sourcePoint), this._targetConnectorAndRect.fRect, this._connection.fBehavior, fSide, this._targetConnectorAndRect.fConnector.fConnectableSide));
+        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(roundedRectFromPoint(sourcePoint), this._targetConnectorAndRect.fRect, this._connection, fSide, this._targetConnectorAndRect.fConnector.fConnectableSide));
     }
     _drawSnapConnection(fClosestConnector) {
         const snapConnection = this._snapConnection;
         if (fClosestConnector) {
             const line = this._getLineToClosestSourceConnector(fClosestConnector, snapConnection);
             snapConnection.show();
-            snapConnection.setLine(line, fClosestConnector.fConnector.fConnectableSide, this._targetConnector.fConnectableSide);
+            snapConnection.setLine(line);
             snapConnection.redraw();
         }
         else {
@@ -5066,7 +5572,7 @@ class FReassignSourceDragHandler {
         }
     }
     _getLineToClosestSourceConnector(fClosestInput, snapConnection) {
-        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(fClosestInput.fRect, this._targetConnectorAndRect.fRect, snapConnection.fBehavior, fClosestInput.fConnector.fConnectableSide, this._targetConnector.fConnectableSide));
+        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(fClosestInput.fRect, this._targetConnectorAndRect.fRect, snapConnection, fClosestInput.fConnector.fConnectableSide, this._targetConnector.fConnectableSide));
     }
     onPointerUp() {
         this._drawConnection(this._connectorRect, this._sourceConnectorAndRect.fConnector.fConnectableSide);
@@ -5316,8 +5822,8 @@ const CONNECTIONS_PROVIDERS = [
     FCreateConnectionDragHandlerPreparationExecution,
     FCreateConnectionFromOutletPreparationExecution,
     GetFirstConnectableOutputExecution,
-    FCreateConnectionFromOutputPreparationExecution,
-    FCreateConnectionPreparationExecution,
+    CreateConnectionFromOutputPreparation,
+    CreateConnectionPreparation,
     FReassignConnectionFinalizeExecution,
     FReassignConnectionPreparationExecution,
 ];
@@ -5435,10 +5941,10 @@ class BaseConnectionDragHandler {
         this._redrawConnection(this._recalculateConnection());
     }
     _recalculateConnection() {
-        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(RoundedRect.fromRoundedRect(this._fOutputWithRect.fRect).addPoint(this._sourceDifference), RoundedRect.fromRoundedRect(this._fInputWithRect.fRect).addPoint(this._targetDifference), this.fConnection.fBehavior, this._fOutputWithRect.fConnector.fConnectableSide, this._fInputWithRect.fConnector.fConnectableSide));
+        return this._mediator.execute(new CalculateConnectionLineByBehaviorRequest(RoundedRect.fromRoundedRect(this._fOutputWithRect.fRect).addPoint(this._sourceDifference), RoundedRect.fromRoundedRect(this._fInputWithRect.fRect).addPoint(this._targetDifference), this.fConnection, this._fOutputWithRect.fConnector.fConnectableSide, this._fInputWithRect.fConnector.fConnectableSide));
     }
     _redrawConnection(line) {
-        this.fConnection.setLine(line, this._fOutputWithRect.fConnector.fConnectableSide, this._fInputWithRect.fConnector.fConnectableSide);
+        this.fConnection.setLine(line);
         this.fConnection.redraw();
     }
     _connectorNotFoundPrefix(message) {
@@ -6382,8 +6888,8 @@ let FNodeMovePreparationExecution = class FNodeMovePreparationExecution {
     _mediator = inject(FMediator);
     _store = inject(FComponentsStore);
     _dragContext = inject(FDraggableDataContext);
-    get _transform() {
-        return this._store.fCanvas.transform;
+    get _scale() {
+        return this._store.fCanvas?.transform.scale || 1;
     }
     get _fHost() {
         return this._store.fFlow.hostElement;
@@ -6394,25 +6900,25 @@ let FNodeMovePreparationExecution = class FNodeMovePreparationExecution {
             return;
         }
         const summaryDragHandler = this._calculateDraggedItems(this._fNode);
-        this._dragContext.onPointerDownScale = this._transform.scale;
+        this._dragContext.onPointerDownScale = this._scale;
         this._dragContext.onPointerDownPosition = Point.fromPoint(event.getPosition())
-            .elementTransform(this._fHost).div(this._transform.scale);
+            .elementTransform(this._fHost)
+            .div(this._scale);
         this._dragContext.draggableItems = [summaryDragHandler];
         if (this._store.fLineAlignment) {
             this._mediator.execute(new CreateSnapLinesRequest(summaryDragHandler));
         }
     }
     _isValid(event) {
-        return this._dragContext.isEmpty()
-            && this._isDragHandleElement(event.targetElement)
-            && !!this._getNode(event.targetElement);
+        return (this._dragContext.isEmpty() &&
+            this._isDragHandleElement(event.targetElement) &&
+            !!this._getNode(event.targetElement));
     }
     _isDragHandleElement(element) {
         return isClosestElementHasClass(element, '.f-drag-handle');
     }
     _getNode(element) {
-        this._fNode = this._store.fNodes
-            .find(x => x.isContains(element) && !x.fDraggingDisabled());
+        this._fNode = this._store.fNodes.find((x) => x.isContains(element) && !x.fDraggingDisabled());
         return this._fNode;
     }
     _isValidTrigger(event, fTrigger) {
@@ -6423,7 +6929,9 @@ let FNodeMovePreparationExecution = class FNodeMovePreparationExecution {
         let result;
         if (!fNode.fSelectionDisabled()) {
             // Need to select node before drag
-            this._mediator.execute(new SelectAndUpdateNodeLayerRequest(fNode));
+            setTimeout(() => {
+                this._mediator.execute(new SelectAndUpdateNodeLayerRequest(fNode));
+            });
             result = this._dragModelFromSelection();
         }
         else {
@@ -7270,7 +7778,7 @@ let DropToGroupPreparation = class DropToGroupPreparation {
             // We can drop items only to children of direct parent
             const childIds = this._mediator.execute(new GetChildNodeIdsRequest(_dragTarget.fParentId()));
             if (childIds.length) {
-                targetRects = targetRects.filter(t => childIds.includes(t.node.fId()));
+                targetRects = targetRects.filter((t) => childIds.includes(t.node.fId()));
             }
         }
         this._dragContext.draggableItems.push(new FNodeDropToGroupDragHandler(this._injector, targetRects));
@@ -7279,12 +7787,10 @@ let DropToGroupPreparation = class DropToGroupPreparation {
         return this._isNodeDragHandler() || this._isExternalItemDragHandler();
     }
     _isNodeDragHandler() {
-        return this._dragContext.draggableItems
-            .some((x) => x instanceof MoveSummaryDragHandler);
+        return this._dragContext.draggableItems.some((x) => x instanceof MoveSummaryDragHandler);
     }
     _isExternalItemDragHandler() {
-        return this._dragContext.draggableItems
-            .some((x) => x instanceof FExternalItemDragHandler);
+        return this._dragContext.draggableItems.some((x) => x instanceof FExternalItemDragHandler);
     }
     _collectGroupingTargetRects() {
         const dragged = this._draggedNodes();
@@ -7296,9 +7802,9 @@ let DropToGroupPreparation = class DropToGroupPreparation {
         });
     }
     _draggedNodes() {
-        return this._dragContext.draggableItems
+        return (this._dragContext.draggableItems
             .find((x) => x instanceof MoveSummaryDragHandler)
-            ?.allDraggedNodeHandlers.map((x) => x.nodeOrGroup) || [];
+            ?.allDraggedNodeHandlers.map((x) => x.nodeOrGroup) || []);
     }
     /**
      * Returns the list of dragged nodes extended with all of their parent nodes.
@@ -7313,8 +7819,8 @@ let DropToGroupPreparation = class DropToGroupPreparation {
         }, []);
     }
     _eligibleTargets(dragged, draggingGroup) {
-        const nonDragged = this._allNodesAndGroups.filter(x => !dragged.includes(x));
-        return draggingGroup ? nonDragged.filter(x => x instanceof FGroupDirective) : nonDragged;
+        const nonDragged = this._allNodesAndGroups.filter((x) => !dragged.includes(x));
+        return draggingGroup ? nonDragged.filter((x) => x instanceof FGroupDirective) : nonDragged;
     }
     _toCanvasRect(rect) {
         return RectExtensions.initialize(rect.x * this._canvasTransform.scale + this._canvasPosition.x, rect.y * this._canvasTransform.scale + this._canvasPosition.y, rect.width * this._canvasTransform.scale, rect.height * this._canvasTransform.scale);
@@ -8746,7 +9252,7 @@ class FDraggableDirective extends FDraggableBase {
         this._beforePlugins.forEach((p) => p.onPointerDown?.(event));
         this._mediator.execute(new FSingleSelectRequest(event, this.fMultiSelectTrigger));
         this._mediator.execute(new FReassignConnectionPreparationRequest(event, this.fReassignConnectionTrigger));
-        this._mediator.execute(new FCreateConnectionPreparationRequest(event, this.fCreateConnectionTrigger));
+        this._mediator.execute(new CreateConnectionPreparationRequest(event, this.fCreateConnectionTrigger));
         this._afterPlugins.forEach((p) => p.onPointerDown?.(event));
         const isMouseLeftOrTouch = event.isMouseLeftButton();
         if (!isMouseLeftOrTouch) {
@@ -8785,6 +9291,7 @@ class FDraggableDirective extends FDraggableBase {
         this._mediator.execute(new EndDragSequenceRequest());
     }
     finalizeDragSequence() {
+        DragRectCache.invalidateAll();
         this._mediator.execute(new EmitSelectionChangeEventRequest());
         this._result.clear();
     }
@@ -9458,75 +9965,11 @@ class GetCanBeSelectedItemsRequest {
     static fToken = Symbol('GetCanBeSelectedItemsRequest');
 }
 
-class GetNormalizedElementRectRequest {
-    element;
-    static fToken = Symbol('GetNormalizedElementRectRequest');
-    constructor(element) {
-        this.element = element;
-    }
-}
-
 /**
- * Execution that retrieves the normalized rectangle of an element.
- * It calculates the rectangle based on the element's position and size,
- * adjusting for the canvas transformation and element offsets.
+ * Execution that retrieves elements that can be selected in the Flow, along with their bounding rectangles.
+ * It filters out elements that are already selected in the FDraggableDataContext.
  */
-let GetNormalizedElementRectExecution = class GetNormalizedElementRectExecution {
-    _store = inject(FComponentsStore);
-    _mediator = inject(FMediator);
-    get _transform() {
-        return this._store.fCanvas.transform;
-    }
-    handle(request) {
-        const systemRect = this._getElementRoundedRect(request);
-        const position = this._normalizePosition(systemRect);
-        const unscaledSize = this._unscaleSize(systemRect);
-        const unscaledRect = this._getUnscaledRect(position, unscaledSize, systemRect);
-        const offsetSize = this._getOffsetSize(request.element, unscaledSize);
-        return RoundedRect.fromCenter(unscaledRect, offsetSize.width, offsetSize.height);
-    }
-    // BrowserWindow
-    // +--------------------------------+
-    // |                                |
-    // |     Element                    |
-    // |     (x: 100, y: 50)            |
-    // |     +--------+                 |
-    // |     |        |                 |
-    // |     |        |                 |
-    // |     +--------+                 |
-    // |                                |
-    // +--------------------------------+
-    // This data of the element is relative to the browser window, not the canvas, with all transformations applied.
-    _getElementRoundedRect(request) {
-        return RoundedRect.fromRect(RectExtensions.fromElement(request.element));
-    }
-    _normalizePosition(rect) {
-        return this._mediator.execute(new GetNormalizedPointRequest(rect));
-    }
-    _unscaleSize(rect) {
-        return SizeExtensions.initialize(rect.width / this._transform.scale, rect.height / this._transform.scale);
-    }
-    _getUnscaledRect(position, size, rect) {
-        return new RoundedRect(position.x, position.y, size.width, size.height, rect.radius1, rect.radius2, rect.radius3, rect.radius4);
-    }
-    _getOffsetSize(element, size) {
-        return SizeExtensions.offsetFromElement(element) || size;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNormalizedElementRectExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNormalizedElementRectExecution });
-};
-GetNormalizedElementRectExecution = __decorate([
-    FExecutionRegister(GetNormalizedElementRectRequest)
-], GetNormalizedElementRectExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNormalizedElementRectExecution, decorators: [{
-            type: Injectable
-        }] });
-
-/**
- * Execution that retrieves elements that can be selected in the Flow, along with their bounding rectangles.
- * It filters out elements that are already selected in the FDraggableDataContext.
- */
-let GetCanBeSelectedItemsExecution = class GetCanBeSelectedItemsExecution {
+let GetCanBeSelectedItemsExecution = class GetCanBeSelectedItemsExecution {
     _mediator = inject(FMediator);
     _store = inject(FComponentsStore);
     _dragContext = inject(FDraggableDataContext);
@@ -9705,10 +10148,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
         }] });
 
 class SelectAndUpdateNodeLayerRequest {
-    fNode;
+    nodeOrGroup;
     static fToken = Symbol('SelectAndUpdateNodeLayerRequest');
-    constructor(fNode) {
-        this.fNode = fNode;
+    constructor(nodeOrGroup) {
+        this.nodeOrGroup = nodeOrGroup;
     }
 }
 
@@ -9731,7 +10174,7 @@ class MoveFrontElementsBeforeTargetElementRequest {
  * Execution that moves elements in the FItemsContainer before a target element.
  * It removes elements that should not be in front and inserts them before the target element.
  */
-let MoveFrontElementsBeforeTargetElementExecution = class MoveFrontElementsBeforeTargetElementExecution {
+let MoveFrontElementsBeforeTargetElement = class MoveFrontElementsBeforeTargetElement {
     handle(request) {
         const elementsToMove = [];
         for (let i = request.targetIndex + 1; i < request.allElements.length; i++) {
@@ -9745,13 +10188,13 @@ let MoveFrontElementsBeforeTargetElementExecution = class MoveFrontElementsBefor
             request.fItemsContainer.insertBefore(x, request.allElements[request.targetIndex]);
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MoveFrontElementsBeforeTargetElementExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MoveFrontElementsBeforeTargetElementExecution });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MoveFrontElementsBeforeTargetElement, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MoveFrontElementsBeforeTargetElement });
 };
-MoveFrontElementsBeforeTargetElementExecution = __decorate([
+MoveFrontElementsBeforeTargetElement = __decorate([
     FExecutionRegister(MoveFrontElementsBeforeTargetElementRequest)
-], MoveFrontElementsBeforeTargetElementExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MoveFrontElementsBeforeTargetElementExecution, decorators: [{
+], MoveFrontElementsBeforeTargetElement);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MoveFrontElementsBeforeTargetElement, decorators: [{
             type: Injectable
         }] });
 
@@ -9899,11 +10342,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 let SelectAndUpdateNodeLayerExecution = class SelectAndUpdateNodeLayerExecution {
     _dragContext = inject(FDraggableDataContext);
     _mediator = inject(FMediator);
-    handle(request) {
-        this.selectNodeIfNotSelected(request.fNode);
-        this._mediator.execute(new UpdateItemAndChildrenLayersRequest(request.fNode, request.fNode.hostElement.parentElement));
+    handle({ nodeOrGroup }) {
+        this._selectNodeIfNotSelected(nodeOrGroup);
+        this._mediator.execute(new UpdateItemAndChildrenLayersRequest(nodeOrGroup, nodeOrGroup.hostElement.parentElement));
     }
-    selectNodeIfNotSelected(fNode) {
+    _selectNodeIfNotSelected(fNode) {
         if (!this._dragContext.selectedItems.includes(fNode) && !fNode.fSelectionDisabled()) {
             this._dragContext.selectedItems.push(fNode);
             fNode.markAsSelected();
@@ -9943,7 +10386,7 @@ let EmitSelectionChangeEventExecution = class EmitSelectionChangeEventExecution
         return this._store.fDraggable.fSelectionChange;
     }
     _dragContext = inject(FDraggableDataContext);
-    handle(request) {
+    handle(_request) {
         if (!this._dragContext.isSelectedChanged) {
             return;
         }
@@ -10190,1088 +10633,1149 @@ const F_DRAGGABLE_FEATURES = [
     RemoveDndFromStoreExecution,
 ];
 
-class AddFlowToStoreRequest {
-    fComponent;
-    static fToken = Symbol('AddFlowToStoreRequest');
-    constructor(fComponent) {
-        this.fComponent = fComponent;
-    }
-}
-
 /**
- * Execution that adds a Flow to the FComponentsStore.
+ * Injection token for configuring the side detection tolerance (in pixels).
+ * A new side must beat the previous side by more than this value to switch.
  */
-let AddFlowToStoreExecution = class AddFlowToStoreExecution {
-    _store = inject(FComponentsStore);
-    handle(request) {
-        this._store.fFlow = request.fComponent;
+const CONNECTABLE_SIDE_EPSILON = new InjectionToken('CONNECTABLE_SIDE_EPSILON');
+/**
+ * Calculates the connectable side of a connector relative to its node host.
+ *
+ * Optimizations & behavior:
+ * - Hysteresis via epsilon to avoid jitter near boundaries.
+ * - Per-connector memoization using WeakMap (no leaks).
+ * - During drag (isDragging === true) the last memorized side is returned immediately
+ *   for maximum stability and performance; a safe fallback computes it if missing.
+ */
+let CalculateConnectableSideByInternalPosition = class CalculateConnectableSideByInternalPosition {
+    _mediator = inject(FMediator);
+    /**
+     * Stores the last computed side per connector.
+     * WeakMap ensures entries are garbage-collected with the connector objects.
+     */
+    _lastSide = new WeakMap();
+    /** Pixel threshold to prevent side switching unless the new side is sufficiently better. */
+    _epsilon = Math.max(0, inject(CONNECTABLE_SIDE_EPSILON, { optional: true }) ?? 2);
+    /**
+     * Entry point: returns the connectable side for a given connector.
+     * If a drag is in progress, returns the last memorized side for stability.
+     */
+    handle({ connector, }) {
+        // Fast path during drag: use memorized side (guaranteed to be present by caller’s contract).
+        if (this._isDragging()) {
+            const cached = this._lastSide.get(connector);
+            if (cached !== undefined)
+                return cached;
+            // Safe fallback: compute once and cache.
+            const computed = this._getSideByDelta(connector.hostElement, connector.fNodeHost, connector);
+            this._lastSide.set(connector, computed);
+            return computed;
+        }
+        // Normal path: compute with hysteresis, then remember.
+        const side = this._getSideByDelta(connector.hostElement, connector.fNodeHost, connector);
+        this._lastSide.set(connector, side);
+        return side;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddFlowToStoreExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddFlowToStoreExecution });
+    /**
+     * Determines the side of the connector relative to the node host by
+     * comparing distances from the connector's gravity center to each host edge.
+     *
+     * Hysteresis rule:
+     * If the previously chosen side is within `epsilon` pixels of the new best side,
+     * keep the previous side to avoid flicker.
+     *
+     * @param connectorHost - The connector element (HTML or SVG).
+     * @param nodeHost - The parent node element (HTML or SVG).
+     * @param connectorKey - The connector object, used as WeakMap key.
+     * @returns The most stable connectable side.
+     */
+    _getSideByDelta(connectorHost, nodeHost, connectorKey) {
+        const childRect = RectExtensions.fromElement(connectorHost);
+        const parentRect = nodeHost.getBoundingClientRect();
+        const cx = childRect.gravityCenter.x;
+        const cy = childRect.gravityCenter.y;
+        const deltaLeft = cx - parentRect.left;
+        const deltaRight = parentRect.right - cx;
+        const deltaTop = cy - parentRect.top;
+        const deltaBottom = parentRect.bottom - cy;
+        // Determine best side (min delta) in one pass
+        let minIdx = 0;
+        let minVal = deltaLeft;
+        // i=1..3 correspond to Right, Top, Bottom respectively
+        const candidates = [deltaLeft, deltaRight, deltaTop, deltaBottom];
+        for (let i = 1; i < 4; i++) {
+            const v = candidates[i];
+            if (v < minVal) {
+                minVal = v;
+                minIdx = i;
+            }
+        }
+        let candidate = minIdx === 0
+            ? EFConnectableSide.LEFT
+            : minIdx === 1
+                ? EFConnectableSide.RIGHT
+                : minIdx === 2
+                    ? EFConnectableSide.TOP
+                    : EFConnectableSide.BOTTOM;
+        // Hysteresis: prefer previously chosen side if it's almost as good
+        const prev = this._lastSide.get(connectorKey);
+        if (prev !== undefined && prev !== candidate) {
+            const prevIdx = prev === EFConnectableSide.LEFT
+                ? 0
+                : prev === EFConnectableSide.RIGHT
+                    ? 1
+                    : prev === EFConnectableSide.TOP
+                        ? 2
+                        : 3;
+            const prevDelta = prevIdx === 0
+                ? deltaLeft
+                : prevIdx === 1
+                    ? deltaRight
+                    : prevIdx === 2
+                        ? deltaTop
+                        : deltaBottom;
+            // How much better the new side is (smaller is better)
+            const advantage = prevDelta - minVal;
+            if (advantage <= this._epsilon) {
+                candidate = prev;
+            }
+        }
+        return candidate;
+    }
+    /** Returns true if a drag operation is currently active. */
+    _isDragging() {
+        return this._mediator.execute(new IsDragStartedRequest());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByInternalPosition, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByInternalPosition });
 };
-AddFlowToStoreExecution = __decorate([
-    FExecutionRegister(AddFlowToStoreRequest)
-], AddFlowToStoreExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddFlowToStoreExecution, decorators: [{
+CalculateConnectableSideByInternalPosition = __decorate([
+    FExecutionRegister(CalculateConnectableSideByInternalPositionRequest)
+], CalculateConnectableSideByInternalPosition);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByInternalPosition, decorators: [{
             type: Injectable
         }] });
 
-class GetFlowRequest {
-    static fToken = Symbol('GetFlowRequest');
+class CalculateConnectorsConnectableSidesRequest {
+    nodeOrGroup;
+    static fToken = Symbol('CalculateConnectorsConnectableSidesRequest');
+    constructor(nodeOrGroup) {
+        this.nodeOrGroup = nodeOrGroup;
+    }
 }
 
 /**
- * Execution that retrieves the current Flow from the FComponentsStore.
+ * Execution that calculates connectable sides for all connectors of a node.
  */
-let GetFlowExecution = class GetFlowExecution {
-    _store = inject(FComponentsStore);
-    handle(request) {
-        const result = this._store.fFlow;
-        if (!result) {
-            throw new Error(`Flow not found in store`);
+let CalculateConnectorsConnectableSides = class CalculateConnectorsConnectableSides {
+    _mediator = inject(FMediator);
+    /**
+     * Orchestrates side calculation for all connectors of the given node.
+     */
+    handle({ nodeOrGroup }) {
+        const connectors = nodeOrGroup.connectors;
+        const len = connectors.length;
+        for (let i = 0; i < len; i++) {
+            const connection = connectors[i];
+            connection.fConnectableSide = this._resolveSideForConnectorFast(connection);
+        }
+        const toRecalc = new Set();
+        for (let i = 0; i < len; i++) {
+            const source = connectors[i];
+            const outs = source.toConnector;
+            if (outs && outs.length) {
+                for (let j = 0, m = outs.length; j < m; j++) {
+                    const target = outs[j];
+                    const userSide = target.userFConnectableSide;
+                    if (isCalculateMode(userSide)) {
+                        toRecalc.add(target);
+                    }
+                }
+            }
+        }
+        if (toRecalc.size > 0) {
+            toRecalc.forEach((target) => {
+                target.fConnectableSide = this._calculateByConnectedPositions(target);
+            });
         }
-        return result;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowExecution });
+    /**
+     * Resolves the connectable side for a connector quickly.
+     * Avoids intermediate arrays and redundant allocations.
+     */
+    _resolveSideForConnectorFast(connector) {
+        const mode = connector.userFConnectableSide;
+        if (mode === EFConnectableSide.AUTO) {
+            return this._mediator.execute(new CalculateConnectableSideByInternalPositionRequest(connector));
+        }
+        if (isCalculateMode(mode)) {
+            return this._calculateByConnectedPositions(connector);
+        }
+        return mode;
+    }
+    /** Delegates to the connected-positions calculation execution. */
+    _calculateByConnectedPositions(connector) {
+        return this._mediator.execute(new CalculateConnectableSideByConnectedPositionsRequest(connector));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectorsConnectableSides, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectorsConnectableSides });
 };
-GetFlowExecution = __decorate([
-    FExecutionRegister(GetFlowRequest)
-], GetFlowExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowExecution, decorators: [{
+CalculateConnectorsConnectableSides = __decorate([
+    FExecutionRegister(CalculateConnectorsConnectableSidesRequest)
+], CalculateConnectorsConnectableSides);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectorsConnectableSides, decorators: [{
             type: Injectable
         }] });
 
-class GetFlowHostElementRequest {
-    static fToken = Symbol('GetFlowHostElementRequest');
+class CalculateNodesBoundingBoxRequest {
+    static fToken = Symbol('CalculateNodesBoundingBoxRequest');
 }
 
 /**
- * Execution that retrieves the Flow host element from the FComponentsStore.
+ * Execution that calculates the bounding box of all nodes in the FComponentsStore.
+ * It retrieves the rectangles of each node's host element and computes their union.
  */
-let GetFlowHostElementExecution = class GetFlowHostElementExecution {
+let CalculateNodesBoundingBox = class CalculateNodesBoundingBox {
     _store = inject(FComponentsStore);
-    handle() {
-        return this._store.flowHost;
+    handle(_request) {
+        return RectExtensions.union(this._nodesRects());
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowHostElementExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowHostElementExecution });
+    _nodesRects() {
+        return this._store.fNodes.map((x) => RectExtensions.fromElement(x.hostElement));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBox, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBox });
 };
-GetFlowHostElementExecution = __decorate([
-    FExecutionRegister(GetFlowHostElementRequest)
-], GetFlowHostElementExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowHostElementExecution, decorators: [{
+CalculateNodesBoundingBox = __decorate([
+    FExecutionRegister(CalculateNodesBoundingBoxRequest)
+], CalculateNodesBoundingBox);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBox, decorators: [{
             type: Injectable
         }] });
 
-class GetFlowStateConnectionsRequest {
-    static fToken = Symbol('GetFlowStateConnectionsRequest');
+class CalculateNodesBoundingBoxNormalizedPositionRequest {
+    fNodes;
+    static fToken = Symbol('CalculateNodesBoundingBoxNormalizedPositionRequest');
+    constructor(fNodes) {
+        this.fNodes = fNodes;
+    }
 }
 
 /**
- * Execution that retrieves the current Flow state connections from the FComponentsStore.
+ * Execution that calculates the bounding box of all nodes in the FComponentsStore
+ * and returns their normalized positions.
+ * It retrieves the rectangles of each node's host element and computes their union.
  */
-let GetFlowStateConnectionsExecution = class GetFlowStateConnectionsExecution {
+let CalculateNodesBoundingBoxNormalizedPosition = class CalculateNodesBoundingBoxNormalizedPosition {
     _store = inject(FComponentsStore);
-    handle(_request) {
-        return this._store.fConnections.map(this._mapToConnectionState);
+    handle(request) {
+        return RectExtensions.union(this._getNodesRects(request.fNodes || this._store.fNodes));
     }
-    _mapToConnectionState(x) {
-        return {
-            id: x.fId(),
-            fOutputId: x.fOutputId(),
-            fInputId: x.fInputId(),
-            fType: x.fType,
-            fBehavior: x.fBehavior,
-            isSelected: x.isSelected(),
-        };
+    _getNodesRects(fNodes) {
+        return fNodes.map((x) => {
+            return this._getElementRect(x, RectExtensions.fromElement(x.hostElement));
+        });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateConnectionsExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateConnectionsExecution });
+    _getElementRect(fNode, rect) {
+        return RectExtensions.initialize(fNode._position.x, fNode._position.y, rect.width, rect.height);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBoxNormalizedPosition, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBoxNormalizedPosition });
 };
-GetFlowStateConnectionsExecution = __decorate([
-    FExecutionRegister(GetFlowStateConnectionsRequest)
-], GetFlowStateConnectionsExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateConnectionsExecution, decorators: [{
+CalculateNodesBoundingBoxNormalizedPosition = __decorate([
+    FExecutionRegister(CalculateNodesBoundingBoxNormalizedPositionRequest)
+], CalculateNodesBoundingBoxNormalizedPosition);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBoxNormalizedPosition, decorators: [{
             type: Injectable
         }] });
 
-class GetFlowStateNodesRequest {
-    type;
-    static fToken = Symbol('GetFlowStateNodesRequest');
-    constructor(type) {
-        this.type = type;
+class CalculateOutputConnectionsRequest {
+    nodeOrGroup;
+    static fToken = Symbol('CalculateOutputConnectionsRequest');
+    constructor(nodeOrGroup) {
+        this.nodeOrGroup = nodeOrGroup;
     }
 }
 
 /**
- * Execution that retrieves the state of Flow nodes, including their position, size, inputs, outputs, and selection status.
+ * Execution that calculates output connections for a given FNode.
  */
-let GetFlowStateNodesExecution = class GetFlowStateNodesExecution {
+let CalculateOutputConnections = class CalculateOutputConnections {
     _store = inject(FComponentsStore);
-    handle(request) {
-        return this._store.fNodes
-            .filter((x) => x instanceof request.type)
-            .map((x) => {
-            return {
-                id: x.fId(),
-                parent: x.fParentId(),
-                position: x._position,
-                size: x._size,
-                rotate: x._rotate,
-                fOutputs: this._getOutputs(x.hostElement),
-                fInputs: this._getInputs(x.hostElement),
-                isSelected: x.isSelected(),
-            };
-        });
+    handle({ nodeOrGroup }) {
+        const ids = this._collectOutputIds(nodeOrGroup);
+        return this._collectConnections(ids);
+    }
+    _collectOutputIds(nodeOrGroup) {
+        const ids = new Set();
+        for (const connector of this._store.fOutputs) {
+            if (nodeOrGroup.isContains(connector.hostElement)) {
+                ids.add(connector.fId());
+            }
+        }
+        return ids;
     }
-    _getOutputs(hostElement) {
-        return this._store.fOutputs
-            .filter((x) => hostElement.contains(x.hostElement))
-            .map((x) => {
-            return {
-                id: x.fId(),
-                fConnectableSide: x.fConnectableSide,
-            };
-        });
-    }
-    _getInputs(hostElement) {
-        return this._store.fInputs
-            .filter((x) => hostElement.contains(x.hostElement))
-            .map((x) => {
-            return {
-                id: x.fId(),
-                fConnectableSide: x.fConnectableSide,
-            };
-        });
+    _collectConnections(ids) {
+        const result = [];
+        for (const conn of this._store.fConnections) {
+            if (ids.has(conn.fOutputId())) {
+                result.push(conn);
+            }
+        }
+        return result;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateNodesExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateNodesExecution });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateOutputConnections, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateOutputConnections });
 };
-GetFlowStateNodesExecution = __decorate([
-    FExecutionRegister(GetFlowStateNodesRequest)
-], GetFlowStateNodesExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateNodesExecution, decorators: [{
+CalculateOutputConnections = __decorate([
+    FExecutionRegister(CalculateOutputConnectionsRequest)
+], CalculateOutputConnections);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateOutputConnections, decorators: [{
             type: Injectable
         }] });
 
-class GetFlowStateRequest {
-    static fToken = Symbol('GetFlowStateRequest');
+class FitToChildNodesAndGroupsRequest {
+    nodeOrGroup;
+    static fToken = Symbol('FitToChildNodesAndGroupsRequest');
+    constructor(nodeOrGroup) {
+        this.nodeOrGroup = nodeOrGroup;
+    }
+}
+
+class GetNodePaddingRequest {
+    fNode;
+    rect;
+    static fToken = Symbol('GetNodePaddingRequest');
+    constructor(fNode, rect) {
+        this.fNode = fNode;
+        this.rect = rect;
+    }
 }
 
 /**
- * Execution that retrieves the current state of the Flow, including its position, scale, nodes, groups, and connections.
+ * Execution that retrieves the padding data of a Node.
+ * If the Node does not include padding, it returns [0, 0, 0, 0].
  */
-let GetFlowStateExecution = class GetFlowStateExecution {
-    _mediator = inject(FMediator);
-    _store = inject(FComponentsStore);
-    handle(payload) {
-        return {
-            position: this._getCanvasPosition(this._store.fCanvas.transform),
-            scale: this._store.fCanvas.transform.scale,
-            nodes: this._mediator.execute(new GetFlowStateNodesRequest(FNodeDirective)),
-            groups: this._mediator.execute(new GetFlowStateNodesRequest(FGroupDirective)),
-            connections: this._mediator.execute(new GetFlowStateConnectionsRequest()),
-        };
+let GetNodePadding = class GetNodePadding {
+    _browser = inject(BrowserService);
+    handle(request) {
+        return request.fNode.fIncludePadding() ? this.getPaddingData(request.fNode, request.rect) : [0, 0, 0, 0];
     }
-    _getCanvasPosition(transform) {
-        return PointExtensions.sum(transform.position, transform.scaledPosition);
+    getPaddingData(node, rect) {
+        const style = this._browser.window.getComputedStyle(node.hostElement);
+        return [
+            this._browser.toPixels(style.paddingLeft, rect.width, rect.height, style.fontSize),
+            this._browser.toPixels(style.paddingTop, rect.width, rect.height, style.fontSize),
+            this._browser.toPixels(style.paddingRight, rect.width, rect.height, style.fontSize),
+            this._browser.toPixels(style.paddingBottom, rect.width, rect.height, style.fontSize),
+        ];
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateExecution });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNodePadding, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNodePadding });
 };
-GetFlowStateExecution = __decorate([
-    FExecutionRegister(GetFlowStateRequest)
-], GetFlowStateExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateExecution, decorators: [{
+GetNodePadding = __decorate([
+    FExecutionRegister(GetNodePaddingRequest)
+], GetNodePadding);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNodePadding, decorators: [{
             type: Injectable
         }] });
 
-/**
- * Providers for retrieving the current Flow state, including nodes, groups, and connections.
- */
-const GET_FLOW_STATE_PROVIDERS = [
-    GetFlowStateExecution,
-    GetFlowStateNodesExecution,
-    GetFlowStateConnectionsExecution,
-];
-
-class RemoveFlowFromStoreRequest {
-    static fToken = Symbol('RemoveFlowFromStoreRequest');
-}
-
-/**
- * Execution that removes a Flow from the FComponentsStore.
- */
-let RemoveFlowFromStoreExecution = class RemoveFlowFromStoreExecution {
+let FitToChildNodesAndGroups = class FitToChildNodesAndGroups {
+    _mediator = inject(FMediator);
     _store = inject(FComponentsStore);
-    handle(request) {
-        this._store.fFlow = undefined;
+    get _nodes() {
+        return this._store.fNodes;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveFlowFromStoreExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveFlowFromStoreExecution });
+    handle({ nodeOrGroup }) {
+        if (nodeOrGroup.fAutoSizeToFitChildren()) {
+            const directChildren = this._calculateDirectChildren(nodeOrGroup);
+            if (directChildren.length) {
+                const currentBounding = this._boundingRect(nodeOrGroup);
+                const childrenBounding = this._calculateChildrenBounding(directChildren, this._paddings(nodeOrGroup, currentBounding));
+                nodeOrGroup.updatePosition(childrenBounding);
+                nodeOrGroup.updateSize(childrenBounding);
+                nodeOrGroup.redraw();
+            }
+        }
+        const parent = nodeOrGroup.fParentId();
+        if (!parent) {
+            return;
+        }
+        const parentNode = this._nodes.find(x => x.fId() === parent);
+        if (!parentNode) {
+            return;
+        }
+        this._mediator.execute(new FitToChildNodesAndGroupsRequest(parentNode));
+    }
+    _calculateDirectChildren(nodeOrGroup) {
+        return this._nodes.filter(x => x.fParentId() === nodeOrGroup.fId());
+    }
+    _unionRect(nodeOrGroups) {
+        return RectExtensions.union(nodeOrGroups.map((x) => this._boundingRect(x))) || RectExtensions.initialize();
+    }
+    _boundingRect(nodeOrGroup) {
+        return this._mediator.execute(new GetNormalizedElementRectRequest(nodeOrGroup.hostElement));
+    }
+    _paddings(nodeOrGroup, rect) {
+        return this._mediator.execute(new GetNodePaddingRequest(nodeOrGroup, rect));
+    }
+    _calculateChildrenBounding(directChildren, [top, right, bottom, left]) {
+        let childrenBounding = this._unionRect(directChildren);
+        childrenBounding = RectExtensions.initialize(childrenBounding.x - left, childrenBounding.y - top, childrenBounding.width + left + right, childrenBounding.height + top + bottom);
+        return childrenBounding;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FitToChildNodesAndGroups, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FitToChildNodesAndGroups });
 };
-RemoveFlowFromStoreExecution = __decorate([
-    FExecutionRegister(RemoveFlowFromStoreRequest)
-], RemoveFlowFromStoreExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveFlowFromStoreExecution, decorators: [{
+FitToChildNodesAndGroups = __decorate([
+    FExecutionRegister(FitToChildNodesAndGroupsRequest)
+], FitToChildNodesAndGroups);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FitToChildNodesAndGroups, decorators: [{
             type: Injectable
         }] });
 
-/**
- * Providers for managing the Flow in the FComponentsStore.
- * This includes adding, retrieving, and removing the Flow,
- * as well as getting the Flow host element and its state.
- */
-const F_FLOW_FEATURES = [
-    AddFlowToStoreExecution,
-    GetFlowExecution,
-    GetFlowHostElementExecution,
-    ...GET_FLOW_STATE_PROVIDERS,
-    RemoveFlowFromStoreExecution,
-];
-
-class AddLineAlignmentToStoreRequest {
-    fComponent;
-    static fToken = Symbol('AddLineAlignmentToStoreRequest');
-    constructor(fComponent) {
-        this.fComponent = fComponent;
+class GetChildNodeIdsRequest {
+    id;
+    static fToken = Symbol('GetChildNodeIdsRequest');
+    constructor(id) {
+        this.id = id;
     }
 }
 
 /**
- * Execution that adds a line alignment to the FComponentsStore.
+ * Execution that retrieves all child nodes of a given node in the Flow.
  */
-let AddLineAlignmentToStoreExecution = class AddLineAlignmentToStoreExecution {
+let GetChildNodeIds = class GetChildNodeIds {
     _store = inject(FComponentsStore);
+    get _allNodesAndGroups() {
+        return this._store.fNodes;
+    }
     handle(request) {
-        this._store.fLineAlignment = request.fComponent;
+        if (!request.id) {
+            return [];
+        }
+        const visited = new Set();
+        const result = [];
+        this._collectDescendants(request.id, result, visited);
+        return result;
+    }
+    _collectDescendants(nodeId, result, visited) {
+        if (visited.has(nodeId)) {
+            throw new Error(`Circular reference detected in the node hierarchy. Node id: ${nodeId}`);
+        }
+        visited.add(nodeId);
+        const children = this._allNodesAndGroups.filter(n => n.fParentId() === nodeId).map((x) => x.fId());
+        result.push(...children);
+        for (const id of children) {
+            this._collectDescendants(id, result, visited);
+        }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddLineAlignmentToStoreExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddLineAlignmentToStoreExecution });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetChildNodeIds, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetChildNodeIds });
 };
-AddLineAlignmentToStoreExecution = __decorate([
-    FExecutionRegister(AddLineAlignmentToStoreRequest)
-], AddLineAlignmentToStoreExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddLineAlignmentToStoreExecution, decorators: [{
+GetChildNodeIds = __decorate([
+    FExecutionRegister(GetChildNodeIdsRequest)
+], GetChildNodeIds);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetChildNodeIds, decorators: [{
             type: Injectable
         }] });
 
-class RemoveLineAlignmentFromStoreRequest {
-    static fToken = Symbol('RemoveLineAlignmentFromStoreRequest');
+class GetParentNodesRequest {
+    nodeOrGroup;
+    static fToken = Symbol('GetParentNodesRequest');
+    constructor(nodeOrGroup) {
+        this.nodeOrGroup = nodeOrGroup;
+    }
 }
 
 /**
- * Execution that removes a line alignment from the FComponentsStore.
+ * Execution that retrieves all parent nodes of a given node from the FComponentsStore.
  */
-let RemoveLineAlignmentFromStoreExecution = class RemoveLineAlignmentFromStoreExecution {
+let GetParentNodes = class GetParentNodes {
     _store = inject(FComponentsStore);
-    handle(request) {
-        this._store.fLineAlignment = undefined;
+    handle({ nodeOrGroup }) {
+        return this._getParentNodes(nodeOrGroup, new Set(), []);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveLineAlignmentFromStoreExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveLineAlignmentFromStoreExecution });
+    _getParentNodes(nodeOrGroup, visited, result) {
+        if (visited.has(nodeOrGroup.fId())) {
+            throw new Error('Circular reference detected in the node hierarchy. Node id: ' + nodeOrGroup.fId());
+        }
+        visited.add(nodeOrGroup.fId());
+        const parent = this._store.fNodes.find((x) => x.fId() === nodeOrGroup.fParentId());
+        if (!parent) {
+            return result;
+        }
+        result.push(parent);
+        return this._getParentNodes(parent, visited, result);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetParentNodes, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetParentNodes });
 };
-RemoveLineAlignmentFromStoreExecution = __decorate([
-    FExecutionRegister(RemoveLineAlignmentFromStoreRequest)
-], RemoveLineAlignmentFromStoreExecution);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveLineAlignmentFromStoreExecution, decorators: [{
+GetParentNodes = __decorate([
+    FExecutionRegister(GetParentNodesRequest)
+], GetParentNodes);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetParentNodes, decorators: [{
             type: Injectable
         }] });
 
+class UpdateNodeWhenStateOrSizeChangedRequest {
+    nodeOrGroup;
+    destroyRef;
+    static fToken = Symbol('UpdateNodeWhenStateOrSizeChangedRequest');
+    constructor(nodeOrGroup, destroyRef) {
+        this.nodeOrGroup = nodeOrGroup;
+        this.destroyRef = destroyRef;
+    }
+}
+
 /**
- * Collection of all FLineAlignment feature executions.
- * These executions handle the addition and removal of line alignments
- * in the FComponentsStore.
+ * Execution that updates a node's connectors when its state or size changes.
  */
-const F_LINE_ALIGNMENT_FEATURES = [
-    AddLineAlignmentToStoreExecution,
-    RemoveLineAlignmentFromStoreExecution,
-];
-
-class AddNodeToStoreRequest {
-    fComponent;
-    static fToken = Symbol('AddNodeToStoreRequest');
-    constructor(fComponent) {
-        this.fComponent = fComponent;
+let UpdateNodeWhenStateOrSizeChanged = class UpdateNodeWhenStateOrSizeChanged {
+    _mediator = inject(FMediator);
+    /**
+     * Handles the request to update the node's connectors based on state or size changes.
+     * It listens for resize events and recalculates the connectable sides of the connectors.
+     * @param request
+     */
+    handle({ nodeOrGroup, destroyRef }) {
+        const { hostElement, stateChanges } = nodeOrGroup;
+        new FChannelHub(new FResizeChannel(hostElement), stateChanges)
+            .pipe(notifyOnStart(), debounceTime(10))
+            .listen(destroyRef, () => {
+            this._mediator.execute(new NotifyDataChangedRequest());
+            if (!this._isDragging()) {
+                this._mediator.execute(new CalculateConnectorsConnectableSidesRequest(nodeOrGroup));
+                this._mediator.execute(new FitToChildNodesAndGroupsRequest(nodeOrGroup));
+            }
+        });
     }
-}
-
-/**
- * Execution that adds a Node to the FComponentsStore.
- */
-let AddNodeToStore = class AddNodeToStore {
-    _store = inject(FComponentsStore);
-    handle(request) {
-        this._store.addComponent(this._store.fNodes, request.fComponent);
+    _isDragging() {
+        return this._mediator.execute(new IsDragStartedRequest());
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddNodeToStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddNodeToStore });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UpdateNodeWhenStateOrSizeChanged, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UpdateNodeWhenStateOrSizeChanged });
 };
-AddNodeToStore = __decorate([
-    FExecutionRegister(AddNodeToStoreRequest)
-], AddNodeToStore);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddNodeToStore, decorators: [{
+UpdateNodeWhenStateOrSizeChanged = __decorate([
+    FExecutionRegister(UpdateNodeWhenStateOrSizeChangedRequest)
+], UpdateNodeWhenStateOrSizeChanged);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UpdateNodeWhenStateOrSizeChanged, decorators: [{
             type: Injectable
         }] });
 
-class CalculateInputConnectionsRequest {
-    fNode;
-    static fToken = Symbol('CalculateInputConnectionsRequest');
-    constructor(fNode) {
-        this.fNode = fNode;
+class RemoveNodeFromStoreRequest {
+    instance;
+    static fToken = Symbol('RemoveNodeFromStoreRequest');
+    constructor(instance) {
+        this.instance = instance;
     }
 }
 
 /**
- * Execution that calculates input connections for a given FNode.
+ * Execution that removes a node from the FComponentsStore.
  */
-let CalculateInputConnections = class CalculateInputConnections {
+let RemoveNodeFromStore = class RemoveNodeFromStore {
     _store = inject(FComponentsStore);
-    handle(request) {
-        return this._calculateConnections(new Set(this._calculateConnectors(request.fNode)));
-    }
-    _calculateConnectors(fNode) {
-        return this._store.fInputs.filter((x) => fNode.isContains(x.hostElement)).map((x) => x.fId());
-    }
-    _calculateConnections(ids) {
-        return this._store.fConnections.filter((x) => ids.has(x.fInputId()));
+    handle({ instance }) {
+        this._store.removeComponent(this._store.fNodes, instance);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateInputConnections, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateInputConnections });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveNodeFromStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveNodeFromStore });
 };
-CalculateInputConnections = __decorate([
-    FExecutionRegister(CalculateInputConnectionsRequest)
-], CalculateInputConnections);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateInputConnections, decorators: [{
+RemoveNodeFromStore = __decorate([
+    FExecutionRegister(RemoveNodeFromStoreRequest)
+], RemoveNodeFromStore);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveNodeFromStore, decorators: [{
             type: Injectable
         }] });
 
-const CALCULATE_MODES = [
-    EFConnectableSide.CALCULATE,
-    EFConnectableSide.CALCULATE_HORIZONTAL,
-    EFConnectableSide.CALCULATE_VERTICAL,
+/**
+ * This file exports all the node-related executions that can be used in the F-Flow domain.
+ */
+const F_NODE_FEATURES = [
+    AddNodeToStore,
+    CalculateConnectableSideByConnectedPositions,
+    CalculateConnectableSideByInternalPosition,
+    CalculateInputConnections,
+    CalculateConnectorsConnectableSides,
+    CalculateNodesBoundingBox,
+    CalculateNodesBoundingBoxNormalizedPosition,
+    CalculateOutputConnections,
+    FitToChildNodesAndGroups,
+    GetChildNodeIds,
+    GetNodePadding,
+    GetParentNodes,
+    UpdateNodeWhenStateOrSizeChanged,
+    RemoveNodeFromStore,
 ];
-class CalculateConnectableSideByConnectedPositionsRequest {
-    connector;
-    mode;
-    static fToken = Symbol('CalculateConnectableSideByConnectedPositionsRequest');
-    constructor(connector, mode) {
-        this.connector = connector;
-        this.mode = mode;
-    }
-}
-
-class CalculateConnectableSideByInternalPositionRequest {
-    connector;
-    static fToken = Symbol('CalculateConnectableSideByInternalPositionRequest');
-    constructor(connector) {
-        this.connector = connector;
-    }
-}
 
 /**
- * Execution that calculates the connectable side for a connector
- * based on the internal position of the connector relative to its node host.
+ * Execution that retrieves all input connectors that can be connected to a given output or outlet connector,
  */
-let CalculateConnectableSideByInternalPosition = class CalculateConnectableSideByInternalPosition {
-    handle({ connector, }) {
-        return this._getSideByDelta(connector.hostElement, connector.fNodeHost);
+let CalculateTargetConnectorsToConnect = class CalculateTargetConnectorsToConnect {
+    _mediator = inject(FMediator);
+    _store = inject(FComponentsStore);
+    get _targetConnectors() {
+        return this._store.fInputs;
     }
-    /**
-     * Determines the side of the connector relative to the node host based on the minimum distance.
-     * @param connectorHost
-     * @param nodeHost
-     * @private
-     */
-    _getSideByDelta(connectorHost, nodeHost) {
-        let result;
-        const childRect = RectExtensions.fromElement(connectorHost);
-        const parentRect = nodeHost.getBoundingClientRect();
-        const deltaLeft = childRect.gravityCenter.x - parentRect.left;
-        const deltaRight = parentRect.right - childRect.gravityCenter.x;
-        const deltaTop = childRect.gravityCenter.y - parentRect.top;
-        const deltaBottom = parentRect.bottom - childRect.gravityCenter.y;
-        const minDelta = Math.min(deltaLeft, deltaRight, deltaTop, deltaBottom);
-        if (minDelta === deltaLeft) {
-            result = EFConnectableSide.LEFT;
-        }
-        else if (minDelta === deltaRight) {
-            result = EFConnectableSide.RIGHT;
-        }
-        else if (minDelta === deltaTop) {
-            result = EFConnectableSide.TOP;
+    handle({ sourceConnector, pointerPosition, }) {
+        const result = this._getCanBeConnectedInputs(sourceConnector).map((x) => {
+            return this._mediator.execute(new GetConnectorAndRectRequest(x));
+        });
+        setTimeout(() => {
+            this._calculateConnectableSides(result, pointerPosition);
+        });
+        return result;
+    }
+    _getCanBeConnectedInputs(outputOrOutlet) {
+        let targetConnectors = [];
+        if (outputOrOutlet.hasConnectionLimits) {
+            targetConnectors = this._targetConnectors.filter((x) => outputOrOutlet.canConnectTo(x));
         }
         else {
-            result = EFConnectableSide.BOTTOM;
+            targetConnectors = this._targetConnectors.filter((x) => x.canBeConnected);
+            if (!outputOrOutlet.isSelfConnectable) {
+                targetConnectors = this._filterSelfConnectable(targetConnectors, outputOrOutlet);
+            }
         }
-        return result;
+        return targetConnectors;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByInternalPosition, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByInternalPosition });
+    _filterSelfConnectable(targetConnectors, outputOrOutlet) {
+        return targetConnectors.filter(({ fNodeId }) => outputOrOutlet.fNodeId !== fNodeId);
+    }
+    _calculateConnectableSides(connectors, pointerPosition) {
+        connectors.forEach((x) => {
+            if (isCalculateMode(x.fConnector.userFConnectableSide)) {
+                x.fConnector.fConnectableSide = this._calculateByConnectedPositions(x.fConnector, pointerPosition);
+            }
+        });
+    }
+    /** Delegates to the connected-positions calculation execution. */
+    _calculateByConnectedPositions(connector, pointerPosition) {
+        return this._mediator.execute(new CalculateConnectableSideByConnectedPositionsRequest(connector, pointerPosition));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateTargetConnectorsToConnect, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateTargetConnectorsToConnect });
 };
-CalculateConnectableSideByInternalPosition = __decorate([
-    FExecutionRegister(CalculateConnectableSideByInternalPositionRequest)
-], CalculateConnectableSideByInternalPosition);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByInternalPosition, decorators: [{
+CalculateTargetConnectorsToConnect = __decorate([
+    FExecutionRegister(CalculateTargetConnectorsToConnectRequest)
+], CalculateTargetConnectorsToConnect);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateTargetConnectorsToConnect, decorators: [{
             type: Injectable
         }] });
 
-const SNAP_EPS = 2;
-const CALCULATE_SIDES = {
-    [EFConnectableSide.CALCULATE]: [
-        EFConnectableSide.TOP,
-        EFConnectableSide.BOTTOM,
-        EFConnectableSide.LEFT,
-        EFConnectableSide.RIGHT,
-    ],
-    [EFConnectableSide.CALCULATE_HORIZONTAL]: [EFConnectableSide.LEFT, EFConnectableSide.RIGHT],
-    [EFConnectableSide.CALCULATE_VERTICAL]: [EFConnectableSide.TOP, EFConnectableSide.BOTTOM],
-};
+class CalculateSourceConnectorsToConnectRequest {
+    targetConnector;
+    pointerPosition;
+    static fToken = Symbol('CalculateSourceConnectorsToConnectRequest');
+    constructor(targetConnector, pointerPosition) {
+        this.targetConnector = targetConnector;
+        this.pointerPosition = pointerPosition;
+    }
+}
+
 /**
- * Execution that calculates the connectable side for a connector
- * based on positions of connected connectors and allowed sides.
+ * Execution that retrieves all source connectors that can be connected to a given target connector,
+ * along with their rectangles.
+ * Source - Output or Outlet connectors.
  */
-let CalculateConnectableSideByConnectedPositions = class CalculateConnectableSideByConnectedPositions {
+let CalculateSourceConnectorsToConnect = class CalculateSourceConnectorsToConnect {
     _mediator = inject(FMediator);
-    /**
-     * Entry point (hot path). Avoids intermediate arrays and redundant allocations.
-     *
-     * @param request - Contains the connector and optionally allowed sides.
-     * @returns {EFConnectableSide} - The chosen connectable side.
-     */
-    handle({ connector, mode, }) {
-        const selfCenter = RectExtensions.fromElement(connector.hostElement).gravityCenter;
-        const acc = this._accumulateConnectedCenters(connector.hostElement, connector.toConnector);
-        if (acc.count === 0) {
-            return this._mediator.execute(new CalculateConnectableSideByInternalPositionRequest(connector));
-        }
-        const avgX = acc.sumX / acc.count;
-        const avgY = acc.sumY / acc.count;
-        const mask = this._toSideMask(CALCULATE_SIDES[mode]);
-        return this._determineSide(selfCenter.x, selfCenter.y, avgX, avgY, mask);
+    _store = inject(FComponentsStore);
+    get _sourceConnectors() {
+        return this._store.fOutputs;
     }
-    /**
-     * Accumulates sum of gravity centers and count, excluding the current host.
-     * Single pass, minimal allocations.
-     */
-    _accumulateConnectedCenters(selfHost, connected) {
-        let sumX = 0;
-        let sumY = 0;
-        let count = 0;
-        if (connected && connected.length) {
-            for (let i = 0; i < connected.length; i++) {
-                const el = connected[i]?.hostElement;
-                if (!el || el === selfHost)
-                    continue;
-                const c = RectExtensions.fromElement(el).gravityCenter;
-                sumX += c.x;
-                sumY += c.y;
-                count++;
+    handle({ targetConnector, pointerPosition, }) {
+        const result = this._getConnectableSources(targetConnector).map((x) => {
+            return this._mediator.execute(new GetConnectorAndRectRequest(x));
+        });
+        setTimeout(() => {
+            this._calculateConnectableSides(result, pointerPosition);
+        });
+        return result;
+    }
+    _getConnectableSources(targetConnector) {
+        return this._sourceConnectors.filter((x) => {
+            let result = x.canBeConnected;
+            if (result && x.hasConnectionLimits) {
+                result = x.canConnectTo(targetConnector);
             }
-        }
-        return { sumX, sumY, count };
+            return result;
+        });
     }
-    /**
-     * Converts allowed sides array to a compact bit mask.
-     * If not provided or empty -> all sides allowed.
-     */
-    _toSideMask(allowed) {
-        if (!allowed || allowed.length === 0)
-            return 15 /* SideMask.ALL */;
-        let mask = 0 /* SideMask.NONE */;
-        for (let i = 0; i < allowed.length; i++) {
-            switch (allowed[i]) {
-                case EFConnectableSide.LEFT:
-                    mask |= 1 /* SideMask.LEFT */;
-                    break;
-                case EFConnectableSide.RIGHT:
-                    mask |= 2 /* SideMask.RIGHT */;
-                    break;
-                case EFConnectableSide.TOP:
-                    mask |= 4 /* SideMask.TOP */;
-                    break;
-                case EFConnectableSide.BOTTOM:
-                    mask |= 8 /* SideMask.BOTTOM */;
-                    break;
+    _calculateConnectableSides(connectors, pointerPosition) {
+        connectors.forEach((x) => {
+            if (isCalculateMode(x.fConnector.userFConnectableSide)) {
+                x.fConnector.fConnectableSide = this._calculateByConnectedPositions(x.fConnector, pointerPosition);
             }
-        }
-        return mask || 15 /* SideMask.ALL */;
+        });
     }
-    /**
-     * Determines final side using ideal side first; if disallowed, picks best fallback.
-     * Inputs are numbers to avoid object wrappers on hot path.
-     */
-    _determineSide(selfX, selfY, avgX, avgY, allowedMask) {
-        const dx = avgX - selfX;
-        const dy = avgY - selfY;
-        const ideal = this._pickIdealSide(dx, dy);
-        if (this._isAllowed(ideal, allowedMask)) {
-            return ideal;
-        }
-        return this._pickFallbackSide(dx, dy, allowedMask, ideal);
+    /** Delegates to the connected-positions calculation execution. */
+    _calculateByConnectedPositions(connector, pointerPosition) {
+        return this._mediator.execute(new CalculateConnectableSideByConnectedPositionsRequest(connector, pointerPosition));
     }
-    /**
-     * Picks the "ideal" side based on vector (dx, dy) with hysteresis.
-     */
-    _pickIdealSide(dx, dy) {
-        const ax = dx < 0 ? -dx : dx;
-        const ay = dy < 0 ? -dy : dy;
-        if (ax - ay > SNAP_EPS) {
-            return dx < 0 ? EFConnectableSide.LEFT : EFConnectableSide.RIGHT;
-        }
-        if (ay - ax > SNAP_EPS) {
-            return dy < 0 ? EFConnectableSide.TOP : EFConnectableSide.BOTTOM;
-        }
-        return dy < 0 ? EFConnectableSide.TOP : EFConnectableSide.BOTTOM;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateSourceConnectorsToConnect, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateSourceConnectorsToConnect });
+};
+CalculateSourceConnectorsToConnect = __decorate([
+    FExecutionRegister(CalculateSourceConnectorsToConnectRequest)
+], CalculateSourceConnectorsToConnect);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateSourceConnectorsToConnect, decorators: [{
+            type: Injectable
+        }] });
+
+class MarkConnectableConnectorsRequest {
+    connectors;
+    static fToken = Symbol('MarkConnectableConnectorsRequest');
+    constructor(connectors) {
+        this.connectors = connectors;
     }
-    /**
-     * Quick membership check via bit mask.
-     */
-    _isAllowed(side, mask) {
-        switch (side) {
-            case EFConnectableSide.LEFT:
-                return (mask & 1 /* SideMask.LEFT */) !== 0;
-            case EFConnectableSide.RIGHT:
-                return (mask & 2 /* SideMask.RIGHT */) !== 0;
-            case EFConnectableSide.TOP:
-                return (mask & 4 /* SideMask.TOP */) !== 0;
-            case EFConnectableSide.BOTTOM:
-                return (mask & 8 /* SideMask.BOTTOM */) !== 0;
-            default:
-                return true;
-        }
+}
+
+/**
+ * Execution that marks connectors as connectable.
+ */
+let MarkConnectableConnectors = class MarkConnectableConnectors {
+    _store = inject(FComponentsStore);
+    handle({ connectors }) {
+        this._store.flowHost.classList.add(F_CSS_CLASS.DRAG_AND_DROP.CONNECTIONS_DRAGGING);
+        connectors.forEach((x) => this._markConnector(x));
     }
-    /**
-     * Picks the best available side from allowed mask by maximizing directional score.
-     * No intermediate objects, constant-time operations.
-     */
-    _pickFallbackSide(dx, dy, allowedMask, ideal) {
-        let bestSide = ideal;
-        let bestScore = -Infinity;
-        if (allowedMask & 2 /* SideMask.RIGHT */) {
-            const s = dx;
-            if (s > bestScore) {
-                bestScore = s;
-                bestSide = EFConnectableSide.RIGHT;
-            }
-        }
-        if (allowedMask & 1 /* SideMask.LEFT */) {
-            const s = -dx;
-            if (s > bestScore) {
-                bestScore = s;
-                bestSide = EFConnectableSide.LEFT;
-            }
-        }
-        if (allowedMask & 8 /* SideMask.BOTTOM */) {
-            const s = dy;
-            if (s > bestScore) {
-                bestScore = s;
-                bestSide = EFConnectableSide.BOTTOM;
-            }
-        }
-        if (allowedMask & 4 /* SideMask.TOP */) {
-            const s = -dy;
-            if (s > bestScore) {
-                bestScore = s;
-                bestSide = EFConnectableSide.TOP;
-            }
-        }
-        return bestSide;
+    _markConnector({ hostElement }) {
+        hostElement.classList.add(F_CSS_CLASS.CONNECTOR.CONNECTABLE);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByConnectedPositions, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByConnectedPositions });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MarkConnectableConnectors, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MarkConnectableConnectors });
 };
-CalculateConnectableSideByConnectedPositions = __decorate([
-    FExecutionRegister(CalculateConnectableSideByConnectedPositionsRequest)
-], CalculateConnectableSideByConnectedPositions);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateConnectableSideByConnectedPositions, decorators: [{
+MarkConnectableConnectors = __decorate([
+    FExecutionRegister(MarkConnectableConnectorsRequest)
+], MarkConnectableConnectors);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MarkConnectableConnectors, decorators: [{
             type: Injectable
         }] });
 
-class CalculateNodeConnectorsConnectableSidesRequest {
-    node;
-    static fToken = Symbol('CalculateNodeConnectorsConnectableSidesRequest');
-    constructor(node) {
-        this.node = node;
+class RemoveInputFromStoreRequest {
+    component;
+    static fToken = Symbol('RemoveInputFromStoreRequest');
+    constructor(component) {
+        this.component = component;
     }
 }
 
-/** Fast predicate: whether the user side is a calculate mode. */
-function isCalculateMode(side) {
-    return (side === EFConnectableSide.CALCULATE ||
-        side === EFConnectableSide.CALCULATE_HORIZONTAL ||
-        side === EFConnectableSide.CALCULATE_VERTICAL);
-}
 /**
- * Execution that calculates connectable sides for all connectors of a node.
- *
- * Performance goals:
- * - Single-pass loops (no `forEach`).
- * - Unique target recomputation (avoid repeated mediator calls for the same target).
- * - Fast checks for "calculate" modes (bit mask instead of `includes`).
+ * Execution that removes an inputConnector from the FComponentsStore.
  */
-let CalculateNodeConnectorsConnectableSides = class CalculateNodeConnectorsConnectableSides {
-    _mediator = inject(FMediator);
-    /**
-     * Orchestrates side calculation for all connectors of the given node.
-     * Two-phase approach:
-     *  1) Update each connector's own side.
-     *  2) Collect unique `toConnector` with calculate modes and recompute once.
-     */
-    handle({ node }) {
-        const mediator = this._mediator;
-        const connectors = node.connectors;
-        const len = connectors.length;
-        for (let i = 0; i < len; i++) {
-            const connection = connectors[i];
-            connection.fConnectableSide = this._resolveSideForConnectorFast(mediator, connection);
-        }
-        const toRecalc = new Set();
-        for (let i = 0; i < len; i++) {
-            const source = connectors[i];
-            const outs = source.toConnector;
-            if (outs && outs.length) {
-                for (let j = 0, m = outs.length; j < m; j++) {
-                    const target = outs[j];
-                    const userSide = target.userFConnectableSide;
-                    if (isCalculateMode(userSide)) {
-                        toRecalc.add(target);
-                    }
-                }
-            }
-        }
-        if (toRecalc.size > 0) {
-            toRecalc.forEach((target) => {
-                target.fConnectableSide = mediator.execute(new CalculateConnectableSideByConnectedPositionsRequest(target, userSideToTCalculateMode(target.userFConnectableSide)));
-            });
-        }
+let RemoveInputFromStore = class RemoveInputFromStore {
+    _store = inject(FComponentsStore);
+    handle({ component }) {
+        this._store.removeComponent(this._store.fInputs, component);
     }
-    /**
-     * Fast resolver for a single connector.
-     * Uses switch and avoids array operations.
-     */
-    _resolveSideForConnectorFast(mediator, connector) {
-        const preference = connector.userFConnectableSide;
-        if (preference !== EFConnectableSide.AUTO && !isCalculateMode(preference)) {
-            return preference;
-        }
-        if (preference === EFConnectableSide.AUTO) {
-            return mediator.execute(new CalculateConnectableSideByInternalPositionRequest(connector));
-        }
-        return mediator.execute(new CalculateConnectableSideByConnectedPositionsRequest(connector, userSideToTCalculateMode(preference)));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveInputFromStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveInputFromStore });
+};
+RemoveInputFromStore = __decorate([
+    FExecutionRegister(RemoveInputFromStoreRequest)
+], RemoveInputFromStore);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveInputFromStore, decorators: [{
+            type: Injectable
+        }] });
+
+class RemoveOutletFromStoreRequest {
+    fComponent;
+    static fToken = Symbol('RemoveOutletFromStoreRequest');
+    constructor(fComponent) {
+        this.fComponent = fComponent;
+    }
+}
+
+/**
+ * Execution that removes an outlet connector from the FComponentsStore.
+ */
+let RemoveOutletFromStoreExecution = class RemoveOutletFromStoreExecution {
+    _store = inject(FComponentsStore);
+    handle(request) {
+        this._store.removeComponent(this._store.fOutlets, request.fComponent);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodeConnectorsConnectableSides, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodeConnectorsConnectableSides });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutletFromStoreExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutletFromStoreExecution });
 };
-CalculateNodeConnectorsConnectableSides = __decorate([
-    FExecutionRegister(CalculateNodeConnectorsConnectableSidesRequest)
-], CalculateNodeConnectorsConnectableSides);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodeConnectorsConnectableSides, decorators: [{
+RemoveOutletFromStoreExecution = __decorate([
+    FExecutionRegister(RemoveOutletFromStoreRequest)
+], RemoveOutletFromStoreExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutletFromStoreExecution, decorators: [{
             type: Injectable
         }] });
-/**
- * Utility: maps EFConnectableSide user value to TCalculateMode safely.
- * If your enums are distinct, implement the exact mapping here.
- */
-function userSideToTCalculateMode(side) {
-    return side;
-}
 
-class CalculateNodesBoundingBoxRequest {
-    static fToken = Symbol('CalculateNodesBoundingBoxRequest');
+class RemoveOutputFromStoreRequest {
+    fComponent;
+    static fToken = Symbol('RemoveOutputFromStoreRequest');
+    constructor(fComponent) {
+        this.fComponent = fComponent;
+    }
 }
 
 /**
- * Execution that calculates the bounding box of all nodes in the FComponentsStore.
- * It retrieves the rectangles of each node's host element and computes their union.
+ * Execution that removes an outlet connector from the FComponentsStore.
  */
-let CalculateNodesBoundingBox = class CalculateNodesBoundingBox {
+let RemoveOutputFromStoreExecution = class RemoveOutputFromStoreExecution {
     _store = inject(FComponentsStore);
     handle(request) {
-        return RectExtensions.union(this._getNodesRects());
-    }
-    _getNodesRects() {
-        return this._store.fNodes.map((x) => this._getElementRect(x.hostElement));
-    }
-    _getElementRect(element) {
-        return RectExtensions.fromElement(element);
+        this._store.removeComponent(this._store.fOutputs, request.fComponent);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBox, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBox });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutputFromStoreExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutputFromStoreExecution });
 };
-CalculateNodesBoundingBox = __decorate([
-    FExecutionRegister(CalculateNodesBoundingBoxRequest)
-], CalculateNodesBoundingBox);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBox, decorators: [{
+RemoveOutputFromStoreExecution = __decorate([
+    FExecutionRegister(RemoveOutputFromStoreRequest)
+], RemoveOutputFromStoreExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveOutputFromStoreExecution, decorators: [{
             type: Injectable
         }] });
 
-class CalculateNodesBoundingBoxNormalizedPositionRequest {
-    fNodes;
-    static fToken = Symbol('CalculateNodesBoundingBoxNormalizedPositionRequest');
-    constructor(fNodes) {
-        this.fNodes = fNodes;
+class UnmarkConnectableConnectorsRequest {
+    connectors;
+    static fToken = Symbol('UnmarkConnectableConnectorsRequest');
+    constructor(connectors) {
+        this.connectors = connectors;
     }
 }
 
 /**
- * Execution that calculates the bounding box of all nodes in the FComponentsStore
- * and returns their normalized positions.
- * It retrieves the rectangles of each node's host element and computes their union.
+ * Execution that unmarks connectors as connectable.
  */
-let CalculateNodesBoundingBoxNormalizedPosition = class CalculateNodesBoundingBoxNormalizedPosition {
+let UnmarkConnectableConnectors = class UnmarkConnectableConnectors {
     _store = inject(FComponentsStore);
-    handle(request) {
-        return RectExtensions.union(this._getNodesRects(request.fNodes || this._store.fNodes));
-    }
-    _getNodesRects(fNodes) {
-        return fNodes.map((x) => {
-            return this._getElementRect(x, RectExtensions.fromElement(x.hostElement));
-        });
+    handle({ connectors }) {
+        this._store.flowHost.classList.remove(F_CSS_CLASS.DRAG_AND_DROP.CONNECTIONS_DRAGGING);
+        connectors.forEach((x) => this._unmarkConnector(x));
     }
-    _getElementRect(fNode, rect) {
-        return RectExtensions.initialize(fNode._position.x, fNode._position.y, rect.width, rect.height);
+    _unmarkConnector({ hostElement }) {
+        hostElement.classList.remove(F_CSS_CLASS.CONNECTOR.CONNECTABLE);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBoxNormalizedPosition, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBoxNormalizedPosition });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UnmarkConnectableConnectors, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UnmarkConnectableConnectors });
 };
-CalculateNodesBoundingBoxNormalizedPosition = __decorate([
-    FExecutionRegister(CalculateNodesBoundingBoxNormalizedPositionRequest)
-], CalculateNodesBoundingBoxNormalizedPosition);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateNodesBoundingBoxNormalizedPosition, decorators: [{
+UnmarkConnectableConnectors = __decorate([
+    FExecutionRegister(UnmarkConnectableConnectorsRequest)
+], UnmarkConnectableConnectors);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UnmarkConnectableConnectors, decorators: [{
             type: Injectable
         }] });
 
-class CalculateOutputConnectionsRequest {
-    fNode;
-    static fToken = Symbol('CalculateOutputConnectionsRequest');
-    constructor(fNode) {
-        this.fNode = fNode;
+/*
+ * This file exports all the connector-related executions that can be used in the FFlow domain.
+ */
+const F_CONNECTORS_FEATURES = [
+    AddInputToStore,
+    AddOutletToStore,
+    AddOutputToStore,
+    CalculateClosestConnector,
+    FindConnectableConnectorUsingPriorityAndPositionExecution,
+    CalculateSourceConnectorsToConnect,
+    CalculateTargetConnectorsToConnect,
+    GetConnectorAndRect,
+    MarkConnectableConnectors,
+    RemoveInputFromStore,
+    RemoveOutletFromStoreExecution,
+    RemoveOutputFromStoreExecution,
+    UnmarkConnectableConnectors,
+];
+
+class AddFlowToStoreRequest {
+    fComponent;
+    static fToken = Symbol('AddFlowToStoreRequest');
+    constructor(fComponent) {
+        this.fComponent = fComponent;
     }
 }
 
 /**
- * Execution that calculates output connections for a given FNode.
+ * Execution that adds a Flow to the FComponentsStore.
  */
-let CalculateOutputConnections = class CalculateOutputConnections {
+let AddFlowToStoreExecution = class AddFlowToStoreExecution {
     _store = inject(FComponentsStore);
     handle(request) {
-        return this._calculateConnections(new Set(this._calculateConnectors(request.fNode)));
-    }
-    _calculateConnectors(fNode) {
-        return this._store.fOutputs.filter((x) => fNode.isContains(x.hostElement)).map((x) => x.fId());
-    }
-    _calculateConnections(ids) {
-        return this._store.fConnections.filter((x) => ids.has(x.fOutputId()));
+        this._store.fFlow = request.fComponent;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateOutputConnections, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateOutputConnections });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddFlowToStoreExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddFlowToStoreExecution });
 };
-CalculateOutputConnections = __decorate([
-    FExecutionRegister(CalculateOutputConnectionsRequest)
-], CalculateOutputConnections);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CalculateOutputConnections, decorators: [{
+AddFlowToStoreExecution = __decorate([
+    FExecutionRegister(AddFlowToStoreRequest)
+], AddFlowToStoreExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddFlowToStoreExecution, decorators: [{
             type: Injectable
         }] });
 
-class FitToChildNodesAndGroupsRequest {
-    nodeOrGroup;
-    static fToken = Symbol('FitToChildNodesAndGroupsRequest');
-    constructor(nodeOrGroup) {
-        this.nodeOrGroup = nodeOrGroup;
-    }
+class GetFlowRequest {
+    static fToken = Symbol('GetFlowRequest');
 }
 
-class GetNodePaddingRequest {
-    fNode;
-    rect;
-    static fToken = Symbol('GetNodePaddingRequest');
-    constructor(fNode, rect) {
-        this.fNode = fNode;
-        this.rect = rect;
+/**
+ * Execution that retrieves the current Flow from the FComponentsStore.
+ */
+let GetFlowExecution = class GetFlowExecution {
+    _store = inject(FComponentsStore);
+    handle(request) {
+        const result = this._store.fFlow;
+        if (!result) {
+            throw new Error(`Flow not found in store`);
+        }
+        return result;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowExecution });
+};
+GetFlowExecution = __decorate([
+    FExecutionRegister(GetFlowRequest)
+], GetFlowExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowExecution, decorators: [{
+            type: Injectable
+        }] });
+
+class GetFlowHostElementRequest {
+    static fToken = Symbol('GetFlowHostElementRequest');
 }
 
 /**
- * Execution that retrieves the padding data of a Node.
- * If the Node does not include padding, it returns [0, 0, 0, 0].
+ * Execution that retrieves the Flow host element from the FComponentsStore.
  */
-let GetNodePadding = class GetNodePadding {
-    _browser = inject(BrowserService);
-    handle(request) {
-        return request.fNode.fIncludePadding() ? this.getPaddingData(request.fNode, request.rect) : [0, 0, 0, 0];
-    }
-    getPaddingData(node, rect) {
-        const style = this._browser.window.getComputedStyle(node.hostElement);
-        return [
-            this._browser.toPixels(style.paddingLeft, rect.width, rect.height, style.fontSize),
-            this._browser.toPixels(style.paddingTop, rect.width, rect.height, style.fontSize),
-            this._browser.toPixels(style.paddingRight, rect.width, rect.height, style.fontSize),
-            this._browser.toPixels(style.paddingBottom, rect.width, rect.height, style.fontSize),
-        ];
+let GetFlowHostElementExecution = class GetFlowHostElementExecution {
+    _store = inject(FComponentsStore);
+    handle() {
+        return this._store.flowHost;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNodePadding, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNodePadding });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowHostElementExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowHostElementExecution });
 };
-GetNodePadding = __decorate([
-    FExecutionRegister(GetNodePaddingRequest)
-], GetNodePadding);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNodePadding, decorators: [{
+GetFlowHostElementExecution = __decorate([
+    FExecutionRegister(GetFlowHostElementRequest)
+], GetFlowHostElementExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowHostElementExecution, decorators: [{
             type: Injectable
         }] });
 
-let FitToChildNodesAndGroups = class FitToChildNodesAndGroups {
-    _mediator = inject(FMediator);
+class GetFlowStateConnectionsRequest {
+    static fToken = Symbol('GetFlowStateConnectionsRequest');
+}
+
+/**
+ * Execution that retrieves the current Flow state connections from the FComponentsStore.
+ */
+let GetFlowStateConnectionsExecution = class GetFlowStateConnectionsExecution {
     _store = inject(FComponentsStore);
-    get _nodes() {
-        return this._store.fNodes;
-    }
-    handle({ nodeOrGroup }) {
-        if (nodeOrGroup.fAutoSizeToFitChildren()) {
-            const directChildren = this._calculateDirectChildren(nodeOrGroup);
-            if (directChildren.length) {
-                const currentBounding = this._boundingRect(nodeOrGroup);
-                const childrenBounding = this._calculateChildrenBounding(directChildren, this._paddings(nodeOrGroup, currentBounding));
-                nodeOrGroup.updatePosition(childrenBounding);
-                nodeOrGroup.updateSize(childrenBounding);
-                nodeOrGroup.redraw();
-            }
-        }
-        const parent = nodeOrGroup.fParentId();
-        if (!parent) {
-            return;
-        }
-        const parentNode = this._nodes.find(x => x.fId() === parent);
-        if (!parentNode) {
-            return;
-        }
-        this._mediator.execute(new FitToChildNodesAndGroupsRequest(parentNode));
-    }
-    _calculateDirectChildren(nodeOrGroup) {
-        return this._nodes.filter(x => x.fParentId() === nodeOrGroup.fId());
-    }
-    _unionRect(nodeOrGroups) {
-        return RectExtensions.union(nodeOrGroups.map((x) => this._boundingRect(x))) || RectExtensions.initialize();
-    }
-    _boundingRect(nodeOrGroup) {
-        return this._mediator.execute(new GetNormalizedElementRectRequest(nodeOrGroup.hostElement));
-    }
-    _paddings(nodeOrGroup, rect) {
-        return this._mediator.execute(new GetNodePaddingRequest(nodeOrGroup, rect));
+    handle(_request) {
+        return this._store.fConnections.map(this._mapToConnectionState);
     }
-    _calculateChildrenBounding(directChildren, [top, right, bottom, left]) {
-        let childrenBounding = this._unionRect(directChildren);
-        childrenBounding = RectExtensions.initialize(childrenBounding.x - left, childrenBounding.y - top, childrenBounding.width + left + right, childrenBounding.height + top + bottom);
-        return childrenBounding;
+    _mapToConnectionState(x) {
+        return {
+            id: x.fId(),
+            fOutputId: x.fOutputId(),
+            fInputId: x.fInputId(),
+            fType: x.fType,
+            fBehavior: x.fBehavior,
+            isSelected: x.isSelected(),
+        };
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FitToChildNodesAndGroups, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FitToChildNodesAndGroups });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateConnectionsExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateConnectionsExecution });
 };
-FitToChildNodesAndGroups = __decorate([
-    FExecutionRegister(FitToChildNodesAndGroupsRequest)
-], FitToChildNodesAndGroups);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FitToChildNodesAndGroups, decorators: [{
+GetFlowStateConnectionsExecution = __decorate([
+    FExecutionRegister(GetFlowStateConnectionsRequest)
+], GetFlowStateConnectionsExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateConnectionsExecution, decorators: [{
             type: Injectable
         }] });
 
-class GetChildNodeIdsRequest {
-    id;
-    static fToken = Symbol('GetChildNodeIdsRequest');
-    constructor(id) {
-        this.id = id;
+class GetFlowStateNodesRequest {
+    type;
+    static fToken = Symbol('GetFlowStateNodesRequest');
+    constructor(type) {
+        this.type = type;
     }
 }
 
 /**
- * Execution that retrieves all child nodes of a given node in the Flow.
+ * Execution that retrieves the state of Flow nodes, including their position, size, inputs, outputs, and selection status.
  */
-let GetChildNodeIds = class GetChildNodeIds {
+let GetFlowStateNodesExecution = class GetFlowStateNodesExecution {
     _store = inject(FComponentsStore);
-    get _allNodesAndGroups() {
-        return this._store.fNodes;
-    }
     handle(request) {
-        if (!request.id) {
-            return [];
-        }
-        const visited = new Set();
-        const result = [];
-        this._collectDescendants(request.id, result, visited);
-        return result;
+        return this._store.fNodes
+            .filter((x) => x instanceof request.type)
+            .map((x) => {
+            return {
+                id: x.fId(),
+                parent: x.fParentId(),
+                position: x._position,
+                size: x._size,
+                rotate: x._rotate,
+                fOutputs: this._getOutputs(x.hostElement),
+                fInputs: this._getInputs(x.hostElement),
+                isSelected: x.isSelected(),
+            };
+        });
     }
-    _collectDescendants(nodeId, result, visited) {
-        if (visited.has(nodeId)) {
-            throw new Error(`Circular reference detected in the node hierarchy. Node id: ${nodeId}`);
-        }
-        visited.add(nodeId);
-        const children = this._allNodesAndGroups.filter(n => n.fParentId() === nodeId).map((x) => x.fId());
-        result.push(...children);
-        for (const id of children) {
-            this._collectDescendants(id, result, visited);
-        }
+    _getOutputs(hostElement) {
+        return this._store.fOutputs
+            .filter((x) => hostElement.contains(x.hostElement))
+            .map((x) => {
+            return {
+                id: x.fId(),
+                fConnectableSide: x.fConnectableSide,
+            };
+        });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetChildNodeIds, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetChildNodeIds });
+    _getInputs(hostElement) {
+        return this._store.fInputs
+            .filter((x) => hostElement.contains(x.hostElement))
+            .map((x) => {
+            return {
+                id: x.fId(),
+                fConnectableSide: x.fConnectableSide,
+            };
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateNodesExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateNodesExecution });
 };
-GetChildNodeIds = __decorate([
-    FExecutionRegister(GetChildNodeIdsRequest)
-], GetChildNodeIds);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetChildNodeIds, decorators: [{
+GetFlowStateNodesExecution = __decorate([
+    FExecutionRegister(GetFlowStateNodesRequest)
+], GetFlowStateNodesExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateNodesExecution, decorators: [{
             type: Injectable
         }] });
 
-class GetNodesRequest {
-    static fToken = Symbol('GetNodesRequest');
+class GetFlowStateRequest {
+    static fToken = Symbol('GetFlowStateRequest');
 }
 
 /**
- * Execution that retrieves all nodes from the FComponentsStore.
+ * Execution that retrieves the current state of the Flow, including its position, scale, nodes, groups, and connections.
  */
-let GetNodes = class GetNodes {
+let GetFlowStateExecution = class GetFlowStateExecution {
+    _mediator = inject(FMediator);
     _store = inject(FComponentsStore);
-    handle(request) {
-        return this._store.fNodes;
+    handle(payload) {
+        return {
+            position: this._getCanvasPosition(this._store.fCanvas.transform),
+            scale: this._store.fCanvas.transform.scale,
+            nodes: this._mediator.execute(new GetFlowStateNodesRequest(FNodeDirective)),
+            groups: this._mediator.execute(new GetFlowStateNodesRequest(FGroupDirective)),
+            connections: this._mediator.execute(new GetFlowStateConnectionsRequest()),
+        };
+    }
+    _getCanvasPosition(transform) {
+        return PointExtensions.sum(transform.position, transform.scaledPosition);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNodes, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNodes });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateExecution });
 };
-GetNodes = __decorate([
-    FExecutionRegister(GetNodesRequest)
-], GetNodes);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetNodes, decorators: [{
+GetFlowStateExecution = __decorate([
+    FExecutionRegister(GetFlowStateRequest)
+], GetFlowStateExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetFlowStateExecution, decorators: [{
             type: Injectable
         }] });
 
-class GetParentNodesRequest {
-    fNode;
-    static fToken = Symbol('GetParentNodesRequest');
-    constructor(fNode) {
-        this.fNode = fNode;
-    }
+/**
+ * Providers for retrieving the current Flow state, including nodes, groups, and connections.
+ */
+const GET_FLOW_STATE_PROVIDERS = [
+    GetFlowStateExecution,
+    GetFlowStateNodesExecution,
+    GetFlowStateConnectionsExecution,
+];
+
+class RemoveFlowFromStoreRequest {
+    static fToken = Symbol('RemoveFlowFromStoreRequest');
 }
 
 /**
- * Execution that retrieves all parent nodes of a given node from the FComponentsStore.
+ * Execution that removes a Flow from the FComponentsStore.
  */
-let GetParentNodes = class GetParentNodes {
+let RemoveFlowFromStoreExecution = class RemoveFlowFromStoreExecution {
     _store = inject(FComponentsStore);
     handle(request) {
-        return this._getParentNodes(request.fNode, new Set(), []);
-    }
-    _getParentNodes(fNode, visited, result) {
-        if (visited.has(fNode.fId())) {
-            throw new Error('Circular reference detected in the node hierarchy. Node id: ' + fNode.fId());
-        }
-        visited.add(fNode.fId());
-        const parent = this._store.fNodes.find((x) => x.fId() === fNode.fParentId());
-        if (!parent) {
-            return result;
-        }
-        result.push(parent);
-        return this._getParentNodes(parent, visited, result);
+        this._store.fFlow = undefined;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetParentNodes, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetParentNodes });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveFlowFromStoreExecution, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveFlowFromStoreExecution });
 };
-GetParentNodes = __decorate([
-    FExecutionRegister(GetParentNodesRequest)
-], GetParentNodes);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GetParentNodes, decorators: [{
+RemoveFlowFromStoreExecution = __decorate([
+    FExecutionRegister(RemoveFlowFromStoreRequest)
+], RemoveFlowFromStoreExecution);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveFlowFromStoreExecution, decorators: [{
             type: Injectable
         }] });
 
-class UpdateNodeWhenStateOrSizeChangedRequest {
-    nodeOrGroup;
-    destroyRef;
-    static fToken = Symbol('UpdateNodeWhenStateOrSizeChangedRequest');
-    constructor(nodeOrGroup, destroyRef) {
-        this.nodeOrGroup = nodeOrGroup;
-        this.destroyRef = destroyRef;
+/**
+ * Providers for managing the Flow in the FComponentsStore.
+ * This includes adding, retrieving, and removing the Flow,
+ * as well as getting the Flow host element and its state.
+ */
+const F_FLOW_FEATURES = [
+    AddFlowToStoreExecution,
+    GetFlowExecution,
+    GetFlowHostElementExecution,
+    ...GET_FLOW_STATE_PROVIDERS,
+    RemoveFlowFromStoreExecution,
+];
+
+class AddLineAlignmentToStoreRequest {
+    instance;
+    static fToken = Symbol('AddLineAlignmentToStoreRequest');
+    constructor(instance) {
+        this.instance = instance;
     }
 }
 
 /**
- * Execution that updates a node's connectors when its state or size changes.
+ * Execution that adds a line alignment to the FComponentsStore.
  */
-let UpdateNodeWhenStateOrSizeChanged = class UpdateNodeWhenStateOrSizeChanged {
-    _mediator = inject(FMediator);
-    /**
-     * Handles the request to update the node's connectors based on state or size changes.
-     * It listens for resize events and recalculates the connectable sides of the connectors.
-     * @param request
-     */
-    handle({ nodeOrGroup, destroyRef }) {
-        const { hostElement, stateChanges } = nodeOrGroup;
-        new FChannelHub(new FResizeChannel(hostElement), stateChanges)
-            .pipe(notifyOnStart(), debounceTime(10))
-            .listen(destroyRef, () => {
-            this._mediator.execute(new NotifyDataChangedRequest());
-            if (!this._isDragging()) {
-                this._mediator.execute(new CalculateNodeConnectorsConnectableSidesRequest(nodeOrGroup));
-                this._mediator.execute(new FitToChildNodesAndGroupsRequest(nodeOrGroup));
-            }
-        });
-    }
-    _isDragging() {
-        return this._mediator.execute(new IsDragStartedRequest());
+let AddLineAlignmentToStore = class AddLineAlignmentToStore {
+    _store = inject(FComponentsStore);
+    handle({ instance }) {
+        this._store.fLineAlignment = instance;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UpdateNodeWhenStateOrSizeChanged, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UpdateNodeWhenStateOrSizeChanged });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddLineAlignmentToStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddLineAlignmentToStore });
 };
-UpdateNodeWhenStateOrSizeChanged = __decorate([
-    FExecutionRegister(UpdateNodeWhenStateOrSizeChangedRequest)
-], UpdateNodeWhenStateOrSizeChanged);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UpdateNodeWhenStateOrSizeChanged, decorators: [{
+AddLineAlignmentToStore = __decorate([
+    FExecutionRegister(AddLineAlignmentToStoreRequest)
+], AddLineAlignmentToStore);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddLineAlignmentToStore, decorators: [{
             type: Injectable
         }] });
 
-class RemoveNodeFromStoreRequest {
-    fComponent;
-    static fToken = Symbol('RemoveNodeFromStoreRequest');
-    constructor(fComponent) {
-        this.fComponent = fComponent;
-    }
+class RemoveLineAlignmentFromStoreRequest {
+    static fToken = Symbol('RemoveLineAlignmentFromStoreRequest');
 }
 
 /**
- * Execution that removes a node from the FComponentsStore.
+ * Execution that removes a line alignment from the FComponentsStore.
  */
-let RemoveNodeFromStore = class RemoveNodeFromStore {
+let RemoveLineAlignmentFromStore = class RemoveLineAlignmentFromStore {
     _store = inject(FComponentsStore);
-    handle(request) {
-        this._store.removeComponent(this._store.fNodes, request.fComponent);
+    handle(_request) {
+        this._store.fLineAlignment = undefined;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveNodeFromStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveNodeFromStore });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveLineAlignmentFromStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveLineAlignmentFromStore });
 };
-RemoveNodeFromStore = __decorate([
-    FExecutionRegister(RemoveNodeFromStoreRequest)
-], RemoveNodeFromStore);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveNodeFromStore, decorators: [{
+RemoveLineAlignmentFromStore = __decorate([
+    FExecutionRegister(RemoveLineAlignmentFromStoreRequest)
+], RemoveLineAlignmentFromStore);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RemoveLineAlignmentFromStore, decorators: [{
             type: Injectable
         }] });
 
 /**
- * This file exports all the node-related executions that can be used in the F-Flow domain.
+ * Collection of all FLineAlignment feature executions.
+ * These executions handle the addition and removal of line alignments
+ * in the FComponentsStore.
  */
-const F_NODE_FEATURES = [
-    AddNodeToStore,
-    CalculateConnectableSideByConnectedPositions,
-    CalculateConnectableSideByInternalPosition,
-    CalculateInputConnections,
-    CalculateNodeConnectorsConnectableSides,
-    CalculateNodesBoundingBox,
-    CalculateNodesBoundingBoxNormalizedPosition,
-    CalculateOutputConnections,
-    FitToChildNodesAndGroups,
-    GetChildNodeIds,
-    GetNodePadding,
-    GetNodes,
-    GetParentNodes,
-    UpdateNodeWhenStateOrSizeChanged,
-    RemoveNodeFromStore,
-];
+const F_LINE_ALIGNMENT_FEATURES = [AddLineAlignmentToStore, RemoveLineAlignmentFromStore];
 
 class AddZoomToStoreRequest {
     fComponent;
@@ -11585,13 +12089,15 @@ function createSVGElement(tag, fBrowser) {
 function isValidEventTrigger(event, fTrigger) {
     return fTrigger(event);
 }
-function defaultEventTrigger(event) {
+function defaultEventTrigger(_event) {
     return true;
 }
 
 function isMobile() {
-    // @ts-ignore
-    return /android|iPad|iPhone|iPod/i.test(navigator.userAgent || navigator.vendor || window['opera']);
+    return /android|iPad|iPhone|iPod/i.test(
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-expect-error
+    navigator.userAgent || navigator.vendor || window['opera']);
 }
 
 function Deprecated(newMethodName, removalVersion = '18.0.0') {
@@ -11647,7 +12153,7 @@ const COMMON_PROVIDERS = [
     SortItemsByParentExecution,
     SortNodeLayersExecution,
     UpdateItemAndChildrenLayersExecution,
-    MoveFrontElementsBeforeTargetElementExecution,
+    MoveFrontElementsBeforeTargetElement,
 ];
 
 let uniqueId$2 = 0;
@@ -12293,7 +12799,7 @@ class FFlowComponent extends FFlowBase {
             ...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></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 });
+        ], 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></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}::ng-deep .f-connection-content{position:fixed;left:0;top:0;pointer-events:all;transform-origin:50% 50%;will-change:transform}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FFlowComponent, decorators: [{
             type: Component,
@@ -12308,7 +12814,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         ...COMMON_PROVIDERS,
                         ...F_DRAGGABLE_PROVIDERS,
                         { provide: F_FLOW, useExisting: FFlowComponent },
-                    ], 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></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: 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></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}::ng-deep .f-connection-content{position:fixed;left:0;top:0;pointer-events:all;transform-origin:50% 50%;will-change:transform}\n"] }]
         }] });
 
 const F_FLOW_PROVIDERS = [
@@ -12522,5 +13028,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AddBackgroundToStoreExecution, AddBackgroundToStoreRequest, AddCanvasToStoreExecution, AddCanvasToStoreRequest, AddConnectionForCreateToStoreExecution, AddConnectionForCreateToStoreRequest, AddConnectionMarkerToStoreExecution, AddConnectionMarkerToStoreRequest, AddConnectionToStoreExecution, AddConnectionToStoreRequest, AddDndToStoreExecution, AddDndToStoreRequest, AddFlowToStoreExecution, AddFlowToStoreRequest, AddInputToStore, AddInputToStoreRequest, AddLineAlignmentToStoreExecution, AddLineAlignmentToStoreRequest, AddNodeToStore, AddNodeToStoreRequest, AddOutletToStore, AddOutletToStoreRequest, AddOutputToStore, AddOutputToStoreRequest, AddPatternToBackgroundExecution, AddPatternToBackgroundRequest, AddSnapConnectionToStoreExecution, AddSnapConnectionToStoreRequest, AddZoomToStoreExecution, AddZoomToStoreRequest, ApplyChildResizeConstraints, ApplyChildResizeConstraintsRequest, ApplyParentResizeConstraints, ApplyParentResizeConstraintsRequest, BaseConnectionDragHandler, BuildDragHierarchy, BuildDragHierarchyRequest, BuildDragHierarchyResponse, CALCULATE_MODES, CANVAS_PROVIDERS, COMMON_PROVIDERS, CONNECTIONS_PROVIDERS, CONNECTION_GRADIENT, CONNECTION_PATH, CONNECTION_TEXT, CREATE_MOVE_NODE_DRAG_MODEL_FROM_SELECTION_PROVIDERS, CalculateCenterBetweenPointsHandler, CalculateCenterBetweenPointsRequest, CalculateChangedRectFromDifference, CalculateChangedRectFromDifferenceRequest, CalculateClosestConnector, CalculateClosestConnectorRequest, CalculateConnectableSideByConnectedPositions, CalculateConnectableSideByConnectedPositionsRequest, CalculateConnectableSideByInternalPosition, CalculateConnectableSideByInternalPositionRequest, CalculateConnectionCenterHandler, CalculateConnectionCenterRequest, CalculateConnectionLineByBehavior, CalculateConnectionLineByBehaviorRequest, CalculateDirectChildrenUnionRect, CalculateDirectChildrenUnionRectRequest, CalculateDragLimits, CalculateDragLimitsRequest, CalculateFlowPointFromMinimapPointExecution, CalculateFlowPointFromMinimapPointRequest, CalculateInputConnections, CalculateInputConnectionsRequest, CalculateNodeConnectorsConnectableSides, CalculateNodeConnectorsConnectableSidesRequest, CalculateNodesBoundingBox, CalculateNodesBoundingBoxNormalizedPosition, CalculateNodesBoundingBoxNormalizedPositionRequest, CalculateNodesBoundingBoxRequest, CalculateOutputConnections, CalculateOutputConnectionsRequest, CalculateResizeLimits, CalculateResizeLimitsRequest, CenterGroupOrNodeExecution, CenterGroupOrNodeRequest, ClearSelectionExecution, ClearSelectionRequest, ConnectionContentLayoutEngine, CreateConnectionMarkersExecution, CreateConnectionMarkersRequest, CreateDragModelFromSelection, CreateDragModelFromSelectionRequest, CreateInputConnectionHandlerAndSetToNodeHandler, CreateInputConnectionHandlerAndSetToNodeHandlerRequest, CreateOutputConnectionHandlerAndSetToNodeHandler, CreateOutputConnectionHandlerAndSetToNodeHandlerRequest, CreateSnapLines, CreateSnapLinesRequest, CreateSummaryDragHandler, CreateSummaryDragHandlerRequest, DRAG_AND_DROP_COMMON_PROVIDERS, Deprecated, DragAndDropBase, DragConstraintPipeline, DropToGroupFinalize, DropToGroupFinalizeRequest, DropToGroupPreparation, DropToGroupPreparationRequest, EFConnectableSide, EFConnectionBehavior, EFConnectionType, EFMarkerType, EFResizeHandleType, EFZoomDirection, EmitSelectionChangeEventExecution, EmitSelectionChangeEventRequest, EndDragSequenceExecution, EndDragSequenceRequest, EventExtensions, ExternalRectConstraint, FBackgroundBase, FBackgroundComponent, FBezierPathBuilder, FCanvasBase, FCanvasChangeEvent, FCanvasComponent, FCanvasDragHandler, FCanvasMoveFinalizeExecution, FCanvasMoveFinalizeRequest, FCanvasMovePreparationExecution, FCanvasMovePreparationRequest, FChannel, FChannelHub, FCirclePatternComponent, FComponentsStore, FConnectionBase, FConnectionCenterDirective, FConnectionComponent, FConnectionContent, FConnectionDragHandleEndComponent, FConnectionDragHandleStartComponent, FConnectionFactory, FConnectionForCreateComponent, FConnectionGradientComponent, FConnectionPathComponent, FConnectionSelectionComponent, FConnectionTextComponent, FConnectionTextPathDirective, FConnectorBase, FCreateConnectionDragHandler, FCreateConnectionDragHandlerPreparationExecution, FCreateConnectionDragHandlerPreparationRequest, FCreateConnectionEvent, FCreateConnectionFinalizeExecution, FCreateConnectionFinalizeRequest, FCreateConnectionFromOutletPreparationExecution, FCreateConnectionFromOutletPreparationRequest, FCreateConnectionFromOutputPreparationExecution, FCreateConnectionFromOutputPreparationRequest, FCreateConnectionPreparationExecution, FCreateConnectionPreparationRequest, FCreateNodeEvent, FDragBlockerDirective, FDragHandleDirective, FDragHandlerResult, FDragStartedEvent, FDraggableBase, FDraggableDataContext, FDraggableDirective, FDropToGroupEvent, FExternalItemBase, FExternalItemCreatePlaceholderExecution, FExternalItemCreatePlaceholderRequest, FExternalItemCreatePreviewExecution, FExternalItemCreatePreviewRequest, FExternalItemDirective, FExternalItemDragHandler, FExternalItemFinalizeExecution, FExternalItemFinalizeRequest, FExternalItemPlaceholderDirective, FExternalItemPreparationExecution, FExternalItemPreparationRequest, FExternalItemPreviewDirective, FExternalItemService, FFlowBase, FFlowComponent, FFlowModule, FGroupDirective, FLineAlignmentBase, FLineAlignmentComponent, FMarkerBase, FMarkerDirective, FMinimapCanvasDirective, FMinimapComponent, FMinimapData, FMinimapDragHandler, FMinimapFlowDirective, FMinimapViewDirective, FMoveNodesEvent, FNodeBase, FNodeDirective, FNodeDropToGroupDragHandler, FNodeInputBase, FNodeInputDirective, FNodeIntersectedWithConnections, FNodeMoveFinalizeExecution, FNodeMoveFinalizeRequest, FNodeMovePreparationExecution, FNodeMovePreparationRequest, FNodeOutletBase, FNodeOutletDirective, FNodeOutputBase, FNodeOutputDirective, FNodeRotateDragHandler, FNodeRotateFinalizeExecution, FNodeRotateFinalizeRequest, FNodeRotatePreparationExecution, FNodeRotatePreparationRequest, FReassignConnectionDragHandler, FReassignConnectionEvent, FReassignConnectionFinalizeExecution, FReassignConnectionFinalizeRequest, FReassignConnectionPreparationExecution, FReassignConnectionPreparationRequest, FReassignSourceDragHandler, FReassignTargetDragHandler, FRectPatternComponent, FResizeChannel, FResizeHandleDirective, FRotateHandleDirective, FSegmentPathBuilder, FSelectionAreaBase, FSelectionAreaComponent, FSelectionChangeEvent, FSingleSelectExecution, FSingleSelectRequest, FSnapConnectionComponent, FSourceConnectorBase, FStraightPathBuilder, FZoomBase, FZoomDirective, F_AFTER_MAIN_PLUGIN, F_BACKGROUND, F_BACKGROUND_FEATURES, F_BACKGROUND_PATTERN, F_BACKGROUND_PROVIDERS, F_BEFORE_MAIN_PLUGIN, F_CANVAS, F_CANVAS_FEATURES, F_CANVAS_PROVIDERS, F_CONNECTION_BUILDERS, F_CONNECTION_FEATURES, F_CONNECTION_IDENTIFIERS, F_CONNECTION_PROVIDERS, F_CONNECTORS_FEATURES, F_CONNECTORS_PROVIDERS, F_CSS_CLASS, F_DRAGGABLE_FEATURES, F_DRAGGABLE_PROVIDERS, F_EXTERNAL_ITEM, F_EXTERNAL_ITEM_DRAG_AND_DROP_PROVIDERS, F_EXTERNAL_ITEM_PROVIDERS, F_FLOW, F_FLOW_FEATURES, F_FLOW_PROVIDERS, F_LINE_ALIGNMENT, F_LINE_ALIGNMENT_FEATURES, F_LINE_ALIGNMENT_PROVIDERS, F_MARKER, F_MINIMAP_DRAG_AND_DROP_PROVIDERS, F_MINIMAP_PROVIDERS, F_NODE, F_NODE_FEATURES, F_NODE_INPUT, F_NODE_OUTLET, F_NODE_OUTPUT, F_NODE_PROVIDERS, F_SELECTED_CLASS, F_SELECTION_AREA_DRAG_AND_DROP_PROVIDERS, F_SELECTION_AREA_PROVIDERS, F_SELECTION_FEATURES, F_STORAGE_PROVIDERS, F_ZOOM, F_ZOOM_FEATURES, F_ZOOM_PROVIDERS, F_ZOOM_TAG, FindConnectableConnectorUsingPriorityAndPositionExecution, FindConnectableConnectorUsingPriorityAndPositionRequest, FitToChildNodesAndGroups, FitToChildNodesAndGroupsRequest, FitToFlowExecution, FitToFlowRequest, GET_FLOW_STATE_PROVIDERS, GetAllCanBeConnectedInputsAndRectsExecution, GetAllCanBeConnectedInputsAndRectsRequest, GetAllCanBeConnectedSourceConnectorsAndRectsExecution, GetAllCanBeConnectedSourceConnectorsAndRectsRequest, GetCanBeSelectedItemsExecution, GetCanBeSelectedItemsRequest, GetCanvasExecution, GetCanvasRequest, GetChildNodeIds, GetChildNodeIdsRequest, GetConnectorAndRect, GetConnectorAndRectRequest, GetCurrentSelectionExecution, GetCurrentSelectionRequest, GetDeepChildrenNodesAndGroupsExecution, GetDeepChildrenNodesAndGroupsRequest, GetElementRoundedRectExecution, GetElementRoundedRectRequest, GetFirstConnectableOutputExecution, GetFirstConnectableOutputRequest, GetFlowExecution, GetFlowHostElementExecution, GetFlowHostElementRequest, GetFlowRequest, GetFlowStateConnectionsExecution, GetFlowStateConnectionsRequest, GetFlowStateExecution, GetFlowStateNodesExecution, GetFlowStateNodesRequest, GetFlowStateRequest, GetNodeBoundingIncludePaddings, GetNodeBoundingIncludePaddingsRequest, GetNodeBoundingIncludePaddingsResponse, GetNodePadding, GetNodePaddingRequest, GetNodes, GetNodesRequest, GetNormalizedConnectorRectExecution, GetNormalizedConnectorRectRequest, GetNormalizedElementRectExecution, GetNormalizedElementRectRequest, GetNormalizedParentNodeRectExecution, GetNormalizedParentNodeRectRequest, GetNormalizedPointExecution, GetNormalizedPointRequest, GetParentNodes, GetParentNodesRequest, IMouseEvent, IPointerEvent, IPointerUpEvent, ITouchDownEvent, ITouchMoveEvent, InitializeDragSequenceExecution, InitializeDragSequenceRequest, InputCanvasPositionExecution, InputCanvasPositionRequest, InputCanvasScaleExecution, InputCanvasScaleRequest, IsArrayHasParentNodeExecution, IsArrayHasParentNodeRequest, IsConnectionUnderNodeExecution, IsConnectionUnderNodeRequest, IsDragStarted, IsDragStartedRequest, ListenCountChangesExecution, ListenCountChangesRequest, ListenDataChangesExecution, ListenDataChangesRequest, ListenTransformChangesExecution, ListenTransformChangesRequest, LogExecutionTime, MINIMAP_DRAG_FINALIZE_PROVIDERS, MINIMAP_DRAG_PREPARATION_PROVIDERS, MOUSE_EVENT_IGNORE_TIME, MarkConnectableConnectors, MarkConnectableConnectorsRequest, MinimapCalculateSvgScaleAndViewBoxExecution, MinimapCalculateSvgScaleAndViewBoxRequest, MinimapCalculateViewBoxExecution, MinimapCalculateViewBoxRequest, MinimapDragFinalizeExecution, MinimapDragFinalizeRequest, MinimapDragPreparationExecution, MinimapDragPreparationRequest, MinimapDrawNodesExecution, MinimapDrawNodesRequest, MoveDragHandler, MoveFrontElementsBeforeTargetElementExecution, MoveFrontElementsBeforeTargetElementRequest, MoveSummaryDragHandler, NODE_DROP_TO_GROUP_PROVIDERS, NODE_PROVIDERS, NODE_RESIZE_PROVIDERS, NODE_ROTATE_PROVIDERS, NodeResizeDragHandler, NodeResizeFinalize, NodeResizeFinalizeRequest, NodeResizePreparation, NodeResizePreparationRequest, NotifyDataChangedExecution, NotifyDataChangedRequest, NotifyTransformChangedExecution, NotifyTransformChangedRequest, OnPointerMoveExecution, OnPointerMoveRequest, Polyline, PolylineContentAlign, PolylineContentPlace, PolylineSampler, PrepareDragSequenceExecution, PrepareDragSequenceRequest, PreventDefaultIsExternalItemExecution, PreventDefaultIsExternalItemRequest, RESIZE_DIRECTIONS, RectConstraint, RedrawCanvasWithAnimationExecution, RedrawCanvasWithAnimationRequest, RedrawConnectionsExecution, RedrawConnectionsRequest, RemoveBackgroundFromStoreExecution, RemoveBackgroundFromStoreRequest, RemoveCanvasFromStoreExecution, RemoveCanvasFromStoreRequest, RemoveConnectionForCreateFromStoreExecution, RemoveConnectionForCreateFromStoreRequest, RemoveConnectionFromStoreExecution, RemoveConnectionFromStoreRequest, RemoveConnectionMarkerFromStoreExecution, RemoveConnectionMarkerFromStoreRequest, RemoveDndFromStoreExecution, RemoveDndFromStoreRequest, RemoveFlowFromStoreExecution, RemoveFlowFromStoreRequest, RemoveInputFromStore, RemoveInputFromStoreRequest, RemoveLineAlignmentFromStoreExecution, RemoveLineAlignmentFromStoreRequest, RemoveNodeFromStore, RemoveNodeFromStoreRequest, RemoveOutletFromStoreExecution, RemoveOutletFromStoreRequest, RemoveOutputFromStoreExecution, RemoveOutputFromStoreRequest, RemoveSnapConnectionFromStoreExecution, RemoveSnapConnectionFromStoreRequest, RemoveZoomFromStoreExecution, RemoveZoomFromStoreRequest, ResetScaleAndCenterExecution, ResetScaleAndCenterRequest, ResetScaleExecution, ResetScaleRequest, ResetZoomExecution, ResetZoomRequest, SINGLE_SELECT_PROVIDERS, SelectAllExecution, SelectAllRequest, SelectAndUpdateNodeLayerExecution, SelectAndUpdateNodeLayerRequest, SelectExecution, SelectRequest, SelectionAreaDragHandle, SelectionAreaFinalizeExecution, SelectionAreaFinalizeRequest, SelectionAreaPreparationExecution, SelectionAreaPreparationRequest, SetBackgroundTransformExecution, SetBackgroundTransformRequest, SetZoomExecution, SetZoomRequest, SnapLineElement, SnapLineService, SnapLinesDragHandler, SnapToGrid, SortContainersForDropByLayer, SortContainersForDropByLayerRequest, SortItemLayersExecution, SortItemLayersRequest, SortItemsByParentExecution, SortItemsByParentRequest, SortNodeLayersExecution, SortNodeLayersRequest, SourceConnectionDragHandler, SourceTargetConnectionDragHandler, StartDragSequenceExecution, StartDragSequenceRequest, TargetConnectionDragHandler, UnmarkConnectableConnectors, UnmarkConnectableConnectorsRequest, UpdateItemAndChildrenLayersExecution, UpdateItemAndChildrenLayersRequest, UpdateNodeWhenStateOrSizeChanged, UpdateNodeWhenStateOrSizeChangedRequest, UpdateScaleExecution, UpdateScaleRequest, createSVGElement, debounceTime, defaultEventTrigger, expandRectFromBaseline, fixedCenterBehavior, fixedOutboundBehavior, floatingBehavior, getExternalItem, getMarkerEndId, getMarkerSelectedEndId, getMarkerSelectedStartId, getMarkerStartId, infinityMinMax, isClosestConnectorInsideSnapThreshold, isDragBlocker, isDragHandleEnd, isDragHandleStart, isExternalItem, isMobile, isNode, isNodeOutlet, isNodeOutput, isPointerInsideStartOrEndDragHandles, isRotateHandle, isValidEventTrigger, mixinChangeSelection, mixinChangeVisibility, notifyOnStart, roundedRectFromPoint, stringAttribute, transitionEnd };
+export { AdaptiveCurveBuilder, AddBackgroundToStoreExecution, AddBackgroundToStoreRequest, AddCanvasToStoreExecution, AddCanvasToStoreRequest, AddConnectionForCreateToStoreExecution, AddConnectionForCreateToStoreRequest, AddConnectionMarkerToStoreExecution, AddConnectionMarkerToStoreRequest, AddConnectionToStoreExecution, AddConnectionToStoreRequest, AddDndToStoreExecution, AddDndToStoreRequest, AddFlowToStoreExecution, AddFlowToStoreRequest, AddInputToStore, AddInputToStoreRequest, AddLineAlignmentToStore, AddLineAlignmentToStoreRequest, AddNodeToStore, AddNodeToStoreRequest, AddOutletToStore, AddOutletToStoreRequest, AddOutputToStore, AddOutputToStoreRequest, AddPatternToBackgroundExecution, AddPatternToBackgroundRequest, AddSnapConnectionToStoreExecution, AddSnapConnectionToStoreRequest, AddZoomToStoreExecution, AddZoomToStoreRequest, ApplyChildResizeConstraints, ApplyChildResizeConstraintsRequest, ApplyParentResizeConstraints, ApplyParentResizeConstraintsRequest, BaseConnectionDragHandler, BuildDragHierarchy, BuildDragHierarchyRequest, BuildDragHierarchyResponse, CALCULATABLE_SIDES, CANVAS_PROVIDERS, COMMON_PROVIDERS, CONNECTABLE_SIDE_EPSILON, CONNECTIONS_PROVIDERS, CONNECTION_GRADIENT, CONNECTION_PATH, CONNECTION_TEXT, CREATE_MOVE_NODE_DRAG_MODEL_FROM_SELECTION_PROVIDERS, CalculateCenterBetweenPointsHandler, CalculateCenterBetweenPointsRequest, CalculateChangedRectFromDifference, CalculateChangedRectFromDifferenceRequest, CalculateClosestConnector, CalculateClosestConnectorRequest, CalculateConnectableSideByConnectedPositions, CalculateConnectableSideByConnectedPositionsRequest, CalculateConnectableSideByInternalPosition, CalculateConnectableSideByInternalPositionRequest, CalculateConnectionCenterHandler, CalculateConnectionCenterRequest, CalculateConnectionLineByBehavior, CalculateConnectionLineByBehaviorRequest, CalculateConnectorsConnectableSides, CalculateConnectorsConnectableSidesRequest, CalculateDirectChildrenUnionRect, CalculateDirectChildrenUnionRectRequest, CalculateDragLimits, CalculateDragLimitsRequest, CalculateFlowPointFromMinimapPointExecution, CalculateFlowPointFromMinimapPointRequest, CalculateInputConnections, CalculateInputConnectionsRequest, CalculateNodesBoundingBox, CalculateNodesBoundingBoxNormalizedPosition, CalculateNodesBoundingBoxNormalizedPositionRequest, CalculateNodesBoundingBoxRequest, CalculateOutputConnections, CalculateOutputConnectionsRequest, CalculateResizeLimits, CalculateResizeLimitsRequest, CalculateSourceConnectorsToConnect, CalculateSourceConnectorsToConnectRequest, CalculateTargetConnectorsToConnect, CalculateTargetConnectorsToConnectRequest, CenterGroupOrNodeExecution, CenterGroupOrNodeRequest, ClearSelectionExecution, ClearSelectionRequest, ConnectionContentLayoutEngine, CreateConnectionFromOutputPreparation, CreateConnectionFromOutputPreparationRequest, CreateConnectionMarkersExecution, CreateConnectionMarkersRequest, CreateConnectionPreparation, CreateConnectionPreparationRequest, CreateDragModelFromSelection, CreateDragModelFromSelectionRequest, CreateInputConnectionHandlerAndSetToNodeHandler, CreateInputConnectionHandlerAndSetToNodeHandlerRequest, CreateOutputConnectionHandlerAndSetToNodeHandler, CreateOutputConnectionHandlerAndSetToNodeHandlerRequest, CreateSnapLines, CreateSnapLinesRequest, CreateSummaryDragHandler, CreateSummaryDragHandlerRequest, DRAG_AND_DROP_COMMON_PROVIDERS, Deprecated, DragAndDropBase, DragConstraintPipeline, DragRectCache, DropToGroupFinalize, DropToGroupFinalizeRequest, DropToGroupPreparation, DropToGroupPreparationRequest, EFConnectableSide, EFConnectionBehavior, EFConnectionConnectableSide, EFConnectionType, EFMarkerType, EFResizeHandleType, EFZoomDirection, EmitSelectionChangeEventExecution, EmitSelectionChangeEventRequest, EndDragSequenceExecution, EndDragSequenceRequest, EventExtensions, ExternalRectConstraint, FBackgroundBase, FBackgroundComponent, FBezierPathBuilder, FCanvasBase, FCanvasChangeEvent, FCanvasComponent, FCanvasDragHandler, FCanvasMoveFinalizeExecution, FCanvasMoveFinalizeRequest, FCanvasMovePreparationExecution, FCanvasMovePreparationRequest, FChannel, FChannelHub, FCirclePatternComponent, FComponentsStore, FConnectionBase, FConnectionCenterDirective, FConnectionComponent, FConnectionContent, FConnectionDragHandleEndComponent, FConnectionDragHandleStartComponent, FConnectionFactory, FConnectionForCreateComponent, FConnectionGradientComponent, FConnectionPathComponent, FConnectionSelectionComponent, FConnectionTextComponent, FConnectionTextPathDirective, FConnectorBase, FConnectorsStore, FCreateConnectionDragHandler, FCreateConnectionDragHandlerPreparationExecution, FCreateConnectionDragHandlerPreparationRequest, FCreateConnectionEvent, FCreateConnectionFinalizeExecution, FCreateConnectionFinalizeRequest, FCreateConnectionFromOutletPreparationExecution, FCreateConnectionFromOutletPreparationRequest, FCreateNodeEvent, FDragBlockerDirective, FDragHandleDirective, FDragHandlerResult, FDragStartedEvent, FDraggableBase, FDraggableDataContext, FDraggableDirective, FDropToGroupEvent, FExternalItemBase, FExternalItemCreatePlaceholderExecution, FExternalItemCreatePlaceholderRequest, FExternalItemCreatePreviewExecution, FExternalItemCreatePreviewRequest, FExternalItemDirective, FExternalItemDragHandler, FExternalItemFinalizeExecution, FExternalItemFinalizeRequest, FExternalItemPlaceholderDirective, FExternalItemPreparationExecution, FExternalItemPreparationRequest, FExternalItemPreviewDirective, FExternalItemService, FFlowBase, FFlowComponent, FFlowModule, FGroupDirective, FLineAlignmentBase, FLineAlignmentComponent, FMarkerBase, FMarkerDirective, FMinimapCanvasDirective, FMinimapComponent, FMinimapData, FMinimapDragHandler, FMinimapFlowDirective, FMinimapViewDirective, FMoveNodesEvent, FNodeBase, FNodeDirective, FNodeDropToGroupDragHandler, FNodeInputBase, FNodeInputDirective, FNodeIntersectedWithConnections, FNodeMoveFinalizeExecution, FNodeMoveFinalizeRequest, FNodeMovePreparationExecution, FNodeMovePreparationRequest, FNodeOutletBase, FNodeOutletDirective, FNodeOutputBase, FNodeOutputDirective, FNodeRotateDragHandler, FNodeRotateFinalizeExecution, FNodeRotateFinalizeRequest, FNodeRotatePreparationExecution, FNodeRotatePreparationRequest, FReassignConnectionDragHandler, FReassignConnectionEvent, FReassignConnectionFinalizeExecution, FReassignConnectionFinalizeRequest, FReassignConnectionPreparationExecution, FReassignConnectionPreparationRequest, FReassignSourceDragHandler, FReassignTargetDragHandler, FRectPatternComponent, FResizeChannel, FResizeHandleDirective, FRotateHandleDirective, FSegmentPathBuilder, FSelectionAreaBase, FSelectionAreaComponent, FSelectionChangeEvent, FSingleSelectExecution, FSingleSelectRequest, FSnapConnectionComponent, FSourceConnectorBase, FStraightPathBuilder, FZoomBase, FZoomDirective, F_AFTER_MAIN_PLUGIN, F_BACKGROUND, F_BACKGROUND_FEATURES, F_BACKGROUND_PATTERN, F_BACKGROUND_PROVIDERS, F_BEFORE_MAIN_PLUGIN, F_CANVAS, F_CANVAS_FEATURES, F_CANVAS_PROVIDERS, F_CONNECTION_BUILDERS, F_CONNECTION_FEATURES, F_CONNECTION_IDENTIFIERS, F_CONNECTION_PROVIDERS, F_CONNECTORS_FEATURES, F_CONNECTORS_PROVIDERS, F_CSS_CLASS, F_DRAGGABLE_FEATURES, F_DRAGGABLE_PROVIDERS, F_EXTERNAL_ITEM, F_EXTERNAL_ITEM_DRAG_AND_DROP_PROVIDERS, F_EXTERNAL_ITEM_PROVIDERS, F_FLOW, F_FLOW_FEATURES, F_FLOW_PROVIDERS, F_LINE_ALIGNMENT, F_LINE_ALIGNMENT_FEATURES, F_LINE_ALIGNMENT_PROVIDERS, F_MARKER, F_MINIMAP_DRAG_AND_DROP_PROVIDERS, F_MINIMAP_PROVIDERS, F_NODE, F_NODE_FEATURES, F_NODE_INPUT, F_NODE_OUTLET, F_NODE_OUTPUT, F_NODE_PROVIDERS, F_SELECTED_CLASS, F_SELECTION_AREA_DRAG_AND_DROP_PROVIDERS, F_SELECTION_AREA_PROVIDERS, F_SELECTION_FEATURES, F_STORAGE_PROVIDERS, F_ZOOM, F_ZOOM_FEATURES, F_ZOOM_PROVIDERS, F_ZOOM_TAG, FindConnectableConnectorUsingPriorityAndPositionExecution, FindConnectableConnectorUsingPriorityAndPositionRequest, FitToChildNodesAndGroups, FitToChildNodesAndGroupsRequest, FitToFlowExecution, FitToFlowRequest, GET_FLOW_STATE_PROVIDERS, GetCanBeSelectedItemsExecution, GetCanBeSelectedItemsRequest, GetCanvasExecution, GetCanvasRequest, GetChildNodeIds, GetChildNodeIdsRequest, GetConnectorAndRect, GetConnectorAndRectRequest, GetCurrentSelectionExecution, GetCurrentSelectionRequest, GetDeepChildrenNodesAndGroupsExecution, GetDeepChildrenNodesAndGroupsRequest, GetElementRoundedRectExecution, GetElementRoundedRectRequest, GetFirstConnectableOutputExecution, GetFirstConnectableOutputRequest, GetFlowExecution, GetFlowHostElementExecution, GetFlowHostElementRequest, GetFlowRequest, GetFlowStateConnectionsExecution, GetFlowStateConnectionsRequest, GetFlowStateExecution, GetFlowStateNodesExecution, GetFlowStateNodesRequest, GetFlowStateRequest, GetNodeBoundingIncludePaddings, GetNodeBoundingIncludePaddingsRequest, GetNodeBoundingIncludePaddingsResponse, GetNodePadding, GetNodePaddingRequest, GetNormalizedConnectorRectExecution, GetNormalizedConnectorRectRequest, GetNormalizedElementRectExecution, GetNormalizedElementRectRequest, GetNormalizedParentNodeRectExecution, GetNormalizedParentNodeRectRequest, GetNormalizedPointExecution, GetNormalizedPointRequest, GetParentNodes, GetParentNodesRequest, IMouseEvent, IPointerEvent, IPointerUpEvent, ITouchDownEvent, ITouchMoveEvent, InitializeDragSequenceExecution, InitializeDragSequenceRequest, InputCanvasPositionExecution, InputCanvasPositionRequest, InputCanvasScaleExecution, InputCanvasScaleRequest, IsArrayHasParentNodeExecution, IsArrayHasParentNodeRequest, IsConnectionUnderNodeExecution, IsConnectionUnderNodeRequest, IsDragStarted, IsDragStartedRequest, ListenCountChangesExecution, ListenCountChangesRequest, ListenDataChangesExecution, ListenDataChangesRequest, ListenTransformChangesExecution, ListenTransformChangesRequest, LogExecutionTime, MINIMAP_DRAG_FINALIZE_PROVIDERS, MINIMAP_DRAG_PREPARATION_PROVIDERS, MOUSE_EVENT_IGNORE_TIME, MarkConnectableConnectors, MarkConnectableConnectorsRequest, MinimapCalculateSvgScaleAndViewBoxExecution, MinimapCalculateSvgScaleAndViewBoxRequest, MinimapCalculateViewBoxExecution, MinimapCalculateViewBoxRequest, MinimapDragFinalizeExecution, MinimapDragFinalizeRequest, MinimapDragPreparationExecution, MinimapDragPreparationRequest, MinimapDrawNodesExecution, MinimapDrawNodesRequest, MoveDragHandler, MoveFrontElementsBeforeTargetElement, MoveFrontElementsBeforeTargetElementRequest, MoveSummaryDragHandler, NODE_DROP_TO_GROUP_PROVIDERS, NODE_PROVIDERS, NODE_RESIZE_PROVIDERS, NODE_ROTATE_PROVIDERS, NodeResizeDragHandler, NodeResizeFinalize, NodeResizeFinalizeRequest, NodeResizePreparation, NodeResizePreparationRequest, NotifyDataChangedExecution, NotifyDataChangedRequest, NotifyTransformChangedExecution, NotifyTransformChangedRequest, OnPointerMoveExecution, OnPointerMoveRequest, Polyline, PolylineContentAlign, PolylineContentPlace, PolylineSampler, PrepareDragSequenceExecution, PrepareDragSequenceRequest, PreventDefaultIsExternalItemExecution, PreventDefaultIsExternalItemRequest, RESIZE_DIRECTIONS, RectConstraint, RedrawCanvasWithAnimationExecution, RedrawCanvasWithAnimationRequest, RedrawConnections, RedrawConnectionsRequest, RemoveBackgroundFromStoreExecution, RemoveBackgroundFromStoreRequest, RemoveCanvasFromStoreExecution, RemoveCanvasFromStoreRequest, RemoveConnectionForCreateFromStoreExecution, RemoveConnectionForCreateFromStoreRequest, RemoveConnectionFromStoreExecution, RemoveConnectionFromStoreRequest, RemoveConnectionMarkerFromStoreExecution, RemoveConnectionMarkerFromStoreRequest, RemoveDndFromStoreExecution, RemoveDndFromStoreRequest, RemoveFlowFromStoreExecution, RemoveFlowFromStoreRequest, RemoveInputFromStore, RemoveInputFromStoreRequest, RemoveLineAlignmentFromStore, RemoveLineAlignmentFromStoreRequest, RemoveNodeFromStore, RemoveNodeFromStoreRequest, RemoveOutletFromStoreExecution, RemoveOutletFromStoreRequest, RemoveOutputFromStoreExecution, RemoveOutputFromStoreRequest, RemoveSnapConnectionFromStoreExecution, RemoveSnapConnectionFromStoreRequest, RemoveZoomFromStoreExecution, RemoveZoomFromStoreRequest, ResetScaleAndCenterExecution, ResetScaleAndCenterRequest, ResetScaleExecution, ResetScaleRequest, ResetZoomExecution, ResetZoomRequest, SINGLE_SELECT_PROVIDERS, SelectAllExecution, SelectAllRequest, SelectAndUpdateNodeLayerExecution, SelectAndUpdateNodeLayerRequest, SelectExecution, SelectRequest, SelectionAreaDragHandle, SelectionAreaFinalizeExecution, SelectionAreaFinalizeRequest, SelectionAreaPreparationExecution, SelectionAreaPreparationRequest, SetBackgroundTransformExecution, SetBackgroundTransformRequest, SetZoomExecution, SetZoomRequest, SnapLineElement, SnapLineService, SnapLinesDragHandler, SnapToGrid, SortContainersForDropByLayer, SortContainersForDropByLayerRequest, SortItemLayersExecution, SortItemLayersRequest, SortItemsByParentExecution, SortItemsByParentRequest, SortNodeLayersExecution, SortNodeLayersRequest, SourceConnectionDragHandler, SourceTargetConnectionDragHandler, StartDragSequenceExecution, StartDragSequenceRequest, TargetConnectionDragHandler, UnmarkConnectableConnectors, UnmarkConnectableConnectorsRequest, UpdateItemAndChildrenLayersExecution, UpdateItemAndChildrenLayersRequest, UpdateNodeWhenStateOrSizeChanged, UpdateNodeWhenStateOrSizeChangedRequest, UpdateScaleExecution, UpdateScaleRequest, createSVGElement, debounceTime, defaultEventTrigger, determineSide, expandRectFromBaseline, fixedCenterBehavior, fixedOutboundBehavior, floatingBehavior, getExternalItem, getMarkerEndId, getMarkerSelectedEndId, getMarkerSelectedStartId, getMarkerStartId, infinityMinMax, isCalculateMode, isClosestConnectorInsideSnapThreshold, isDragBlocker, isDragHandleEnd, isDragHandleStart, isExternalItem, isMobile, isNode, isNodeOutlet, isNodeOutput, isPointerInsideStartOrEndDragHandles, isRotateHandle, isValidEventTrigger, mixinChangeSelection, mixinChangeVisibility, notifyOnStart, roundedRectFromPoint, stringAttribute, transitionEnd };
 //# sourceMappingURL=foblex-flow.mjs.map