@foblex/flow 12.0.2 → 12.0.4

package/fesm2022/foblex-flow.mjs

@@ -378,6 +378,14 @@ function isNodeInput(element) {
     return !!element.closest('[fNodeInput]');
 }
 
+function castToConnectableSide(type) {
+    const result = EFConnectableSide[type.toUpperCase()];
+    if (result === undefined) {
+        throw new Error(`Unknown connectable side: ${type}. Accepted values: ${Object.keys(EFConnectableSide).join(', ')}`);
+    }
+    return result;
+}
+
 let uniqueId$7 = 0;
 class FNodeInputDirective extends FNodeInputBase {
     get disabled() {
@@ -390,6 +398,12 @@ class FNodeInputDirective extends FNodeInputBase {
             this.stateChanges.next();
         }
     }
+    set _fSide(value) {
+        this._fConnectableSide = castToConnectableSide(value);
+    }
+    get _fSide() {
+        return this._fConnectableSide;
+    }
     get hostElement() {
         return this.elementReference.nativeElement;
     }
@@ -420,7 +434,7 @@ class FNodeInputDirective extends FNodeInputBase {
         this.fComponentsStore.removeInput(this);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: FNodeInputDirective, deps: [{ token: i0.ElementRef }, { token: F_NODE }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.1", type: FNodeInputDirective, selector: "[fNodeInput]", inputs: { id: ["fInputId", "id"], multiple: ["fInputMultiple", "multiple"], disabled: ["fInputDisabled", "disabled"], _fConnectableSide: ["fInputConnectableSide", "_fConnectableSide"] }, host: { properties: { "attr.data-f-input-id": "id", "class.f-node-input-multiple": "multiple", "class.f-node-input-disabled": "disabled", "class.f-node-input-not-connectable": "!canBeConnected" }, classAttribute: "f-component f-node-input" }, providers: [{ provide: F_NODE_INPUT, useExisting: FNodeInputDirective }], exportAs: ["fNodeInput"], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.1", type: FNodeInputDirective, selector: "[fNodeInput]", inputs: { id: ["fInputId", "id"], multiple: ["fInputMultiple", "multiple"], disabled: ["fInputDisabled", "disabled"], _fSide: ["fInputConnectableSide", "_fSide"] }, host: { properties: { "attr.data-f-input-id": "id", "class.f-node-input-multiple": "multiple", "class.f-node-input-disabled": "disabled", "class.f-node-input-not-connectable": "!canBeConnected" }, classAttribute: "f-component f-node-input" }, providers: [{ provide: F_NODE_INPUT, useExisting: FNodeInputDirective }], exportAs: ["fNodeInput"], usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: FNodeInputDirective, decorators: [{
             type: Directive,
@@ -448,7 +462,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
             }], disabled: [{
                 type: Input,
                 args: ['fInputDisabled']
-            }], _fConnectableSide: [{
+            }], _fSide: [{
                 type: Input,
                 args: ['fInputConnectableSide']
             }] } });
@@ -572,6 +586,12 @@ class FNodeOutputDirective extends FNodeOutputBase {
             this.stateChanges.next();
         }
     }
+    set _fSide(value) {
+        this._fConnectableSide = castToConnectableSide(value);
+    }
+    get _fSide() {
+        return this._fConnectableSide;
+    }
     get hostElement() {
         return this.elementReference.nativeElement;
     }
@@ -603,7 +623,7 @@ class FNodeOutputDirective extends FNodeOutputBase {
         this.fComponentsStore.removeOutput(this);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: FNodeOutputDirective, deps: [{ token: i0.ElementRef }, { token: F_NODE }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.1", type: FNodeOutputDirective, selector: "[fNodeOutput]", inputs: { id: ["fOutputId", "id"], multiple: ["fOutputMultiple", "multiple"], disabled: ["fOutputDisabled", "disabled"], _fConnectableSide: ["fOutputConnectableSide", "_fConnectableSide"], isSelfConnectable: "isSelfConnectable" }, host: { properties: { "attr.data-f-output-id": "id", "class.f-node-output-disabled": "disabled" }, classAttribute: "f-component f-node-output" }, providers: [{ provide: F_NODE_OUTPUT, useExisting: FNodeOutputDirective }], exportAs: ["fNodeOutput"], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.1", type: FNodeOutputDirective, selector: "[fNodeOutput]", inputs: { id: ["fOutputId", "id"], multiple: ["fOutputMultiple", "multiple"], disabled: ["fOutputDisabled", "disabled"], _fSide: ["fOutputConnectableSide", "_fSide"], isSelfConnectable: "isSelfConnectable" }, host: { properties: { "attr.data-f-output-id": "id", "class.f-node-output-disabled": "disabled" }, classAttribute: "f-component f-node-output" }, providers: [{ provide: F_NODE_OUTPUT, useExisting: FNodeOutputDirective }], exportAs: ["fNodeOutput"], usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: FNodeOutputDirective, decorators: [{
             type: Directive,
@@ -629,7 +649,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
             }], disabled: [{
                 type: Input,
                 args: ['fOutputDisabled']
-            }], _fConnectableSide: [{
+            }], _fSide: [{
                 type: Input,
                 args: ['fOutputConnectableSide']
             }], isSelfConnectable: [{
@@ -1352,13 +1372,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
 let uniqueId$4 = 0;
 class FConnectionForCreateComponent extends FConnectionBase {
     set fBehavior(value) {
-        this._behavior = value;
+        this._behavior = castToConnectionBehavior(value);
     }
     get fBehavior() {
         return this._behavior;
     }
     set fType(value) {
-        this._type = value;
+        this._type = castToConnectionType(value);
     }
     get fType() {
         return this._type;
@@ -1375,7 +1395,8 @@ class FConnectionForCreateComponent extends FConnectionBase {
         this.fEndColor = 'black';
         this._behavior = EFConnectionBehavior.FIXED;
         this._type = EFConnectionType.STRAIGHT;
-        this.disabled = false;
+        this.fDraggingDisabled = false;
+        this.fSelectionDisabled = false;
     }
     ngOnInit() {
         this.fComponentsStore.fTempConnection = this;
@@ -1387,7 +1408,7 @@ class FConnectionForCreateComponent extends FConnectionBase {
         this.fComponentsStore.fTempConnection = undefined;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: FConnectionForCreateComponent, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.1", type: FConnectionForCreateComponent, selector: "f-connection-for-create", inputs: { fStartColor: "fStartColor", fEndColor: "fEndColor", fBehavior: ["fBehavior", "fBehavior", castToConnectionBehavior], fType: ["fType", "fType", castToConnectionType], disabled: "disabled" }, host: { classAttribute: "f-component f-connection f-connection-for-create" }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionForCreateComponent }], queries: [{ propertyName: "fMarkers", predicate: F_MARKER, descendants: true }, { propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, static: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, static: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, static: true }, { propertyName: "fDragHandle", first: true, predicate: FConnectionDragHandleComponent, descendants: true, static: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, static: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, static: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]" }, { kind: "component", type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]" }, { kind: "component", type: FConnectionPathComponent, selector: "path[f-connection-path]" }, { kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", type: FConnectionForCreateComponent, selector: "f-connection-for-create", inputs: { fStartColor: "fStartColor", fEndColor: "fEndColor", fBehavior: "fBehavior", fType: "fType" }, host: { classAttribute: "f-component f-connection f-connection-for-create" }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionForCreateComponent }], queries: [{ propertyName: "fMarkers", predicate: F_MARKER, descendants: true }, { propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, static: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, static: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, static: true }, { propertyName: "fDragHandle", first: true, predicate: FConnectionDragHandleComponent, descendants: true, static: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, static: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, static: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]" }, { kind: "component", type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]" }, { kind: "component", type: FConnectionPathComponent, selector: "path[f-connection-path]" }, { kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: FConnectionForCreateComponent, decorators: [{
             type: Component,
@@ -1399,12 +1420,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
             }], fEndColor: [{
                 type: Input
             }], fBehavior: [{
-                type: Input,
-                args: [{ transform: castToConnectionBehavior }]
+                type: Input
             }], fType: [{
-                type: Input,
-                args: [{ transform: castToConnectionType }]
-            }], disabled: [{
                 type: Input
             }], fDefs: [{
                 type: ViewChild,
@@ -1438,13 +1455,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
 let uniqueId$3 = 0;
 class FConnectionComponent extends FConnectionBase {
     set fBehavior(value) {
-        this._behavior = value;
+        this._behavior = castToConnectionBehavior(value);
     }
     get fBehavior() {
         return this._behavior;
     }
     set fType(value) {
-        this._type = value;
+        this._type = castToConnectionType(value);
     }
     get fType() {
         return this._type;
@@ -1461,7 +1478,8 @@ class FConnectionComponent extends FConnectionBase {
         this.fEndColor = 'black';
         this._behavior = EFConnectionBehavior.FIXED;
         this._type = EFConnectionType.STRAIGHT;
-        this.disabled = false;
+        this.fDraggingDisabled = false;
+        this.fSelectionDisabled = false;
     }
     ngOnInit() {
         this.fComponentsStore.addConnection(this);
@@ -1470,14 +1488,15 @@ class FConnectionComponent extends FConnectionBase {
         this.fComponentsStore.removeConnection(this);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: FConnectionComponent, deps: [{ token: i0.ElementRef }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.1", type: FConnectionComponent, selector: "f-connection", inputs: { fConnectionId: "fConnectionId", fText: "fText", fStartColor: "fStartColor", fEndColor: "fEndColor", fOutputId: "fOutputId", fInputId: "fInputId", fBehavior: ["fBehavior", "fBehavior", castToConnectionBehavior], fType: ["fType", "fType", castToConnectionType], disabled: "disabled" }, host: { properties: { "attr.id": "fConnectionId", "class.f-connection-disabled": "disabled" }, classAttribute: "f-component f-connection" }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionComponent }], queries: [{ propertyName: "fMarkers", predicate: F_MARKER, descendants: true }, { propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, static: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, static: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, static: true }, { propertyName: "fDragHandle", first: true, predicate: FConnectionDragHandleComponent, descendants: true, static: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, static: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, static: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true }], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\" style=\"overflow: visible; display: block; vertical-align: middle;\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]" }, { kind: "component", type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]" }, { kind: "component", type: FConnectionPathComponent, selector: "path[f-connection-path]" }, { kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", type: FConnectionComponent, selector: "f-connection", inputs: { fConnectionId: "fConnectionId", fText: "fText", fStartColor: "fStartColor", fEndColor: "fEndColor", fOutputId: "fOutputId", fInputId: "fInputId", fBehavior: "fBehavior", fType: "fType", fDraggingDisabled: ["fReassignDisabled", "fDraggingDisabled"], fSelectionDisabled: "fSelectionDisabled" }, host: { properties: { "attr.id": "fConnectionId", "class.f-connection-selection-disabled": "fSelectionDisabled", "class.f-connection-reassign-disabled": "fDraggingDisabled" }, classAttribute: "f-component f-connection" }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionComponent }], queries: [{ propertyName: "fMarkers", predicate: F_MARKER, descendants: true }, { propertyName: "fConnectionCenters", predicate: FConnectionCenterDirective, descendants: true }], viewQueries: [{ propertyName: "fDefs", first: true, predicate: ["defs"], descendants: true, static: true }, { propertyName: "fPath", first: true, predicate: CONNECTION_PATH, descendants: true, static: true }, { propertyName: "fGradient", first: true, predicate: CONNECTION_GRADIENT, descendants: true, static: true }, { propertyName: "fDragHandle", first: true, predicate: FConnectionDragHandleComponent, descendants: true, static: true }, { propertyName: "fSelection", first: true, predicate: FConnectionSelectionComponent, descendants: true, static: true }, { propertyName: "fTextComponent", first: true, predicate: CONNECTION_TEXT, descendants: true, static: true }, { propertyName: "fConnectionCenter", first: true, predicate: ["fConnectionCenter"], descendants: true }], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\" style=\"overflow: visible; display: block; vertical-align: middle;\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FConnectionDragHandleComponent, selector: "circle[f-connection-drag-handle]" }, { kind: "component", type: FConnectionGradientComponent, selector: "linearGradient[fConnectionGradient]" }, { kind: "component", type: FConnectionPathComponent, selector: "path[f-connection-path]" }, { kind: "component", type: FConnectionTextComponent, selector: "text[f-connection-text]" }, { kind: "component", type: FConnectionSelectionComponent, selector: "path[fConnectionSelection]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: FConnectionComponent, decorators: [{
             type: Component,
             args: [{ selector: "f-connection", exportAs: 'fComponent', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[attr.id]': 'fConnectionId',
                         class: "f-component f-connection",
-                        '[class.f-connection-disabled]': 'disabled',
+                        '[class.f-connection-selection-disabled]': 'fSelectionDisabled',
+                        '[class.f-connection-reassign-disabled]': 'fDraggingDisabled',
                     }, providers: [{ provide: F_CONNECTION, useExisting: FConnectionComponent }], template: "<svg xmlns=\"http://www.w3.org/2000/svg\" style=\"overflow: visible; display: block; vertical-align: middle;\">\n    <defs #defs></defs>\n    <g class=\"f-connection-group\">\n        <linearGradient fConnectionGradient></linearGradient>\n        <path fConnectionSelection [attr.d]=\"path\"></path>\n        <g>\n            <path f-connection-path\n                  [attr.d]=\"path\">\n            </path>\n            <circle f-connection-drag-handle r=\"8\"></circle>\n        </g>\n        <text f-connection-text></text>\n    </g>\n    <ng-content></ng-content>\n</svg>\n<div #fConnectionCenter class=\"f-connection-center\" *ngIf=\"fConnectionCenters.length\">\n    <ng-content select=\"[fConnectionCenter]\"></ng-content>\n</div>\n", styles: [":host{pointer-events:none;position:absolute}:host svg{overflow:visible}:host svg .f-connection-group{pointer-events:all}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: FComponentsStore }], propDecorators: { fConnectionId: [{
                 type: Input
@@ -1488,18 +1507,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
             }], fEndColor: [{
                 type: Input
             }], fOutputId: [{
-                type: Input,
-                args: [{ required: true }]
+                type: Input
             }], fInputId: [{
-                type: Input,
-                args: [{ required: true }]
+                type: Input
             }], fBehavior: [{
-                type: Input,
-                args: [{ transform: castToConnectionBehavior }]
+                type: Input
             }], fType: [{
+                type: Input
+            }], fDraggingDisabled: [{
                 type: Input,
-                args: [{ transform: castToConnectionType }]
-            }], disabled: [{
+                args: ['fReassignDisabled']
+            }], fSelectionDisabled: [{
                 type: Input
             }], fDefs: [{
                 type: ViewChild,
@@ -1663,7 +1681,8 @@ class FNodeDirective extends FNodeBase {
         this.subscriptions$ = new Subscription();
         this.fNodeId = `f-node-${uniqueId$2++}`;
         this.positionChange = new EventEmitter();
-        this.disabled = false;
+        this.fDraggingDisabled = false;
+        this.fSelectionDisabled = false;
         this.connectors = [];
     }
     ngOnInit() {
@@ -1708,7 +1727,7 @@ class FNodeDirective extends FNodeBase {
         this.subscriptions$.unsubscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: FNodeDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: FComponentsStore }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.1", type: FNodeDirective, selector: "[fNode]", inputs: { fNodeId: "fNodeId", position: ["fNodePosition", "position"], disabled: "disabled" }, outputs: { positionChange: "fNodePositionChange" }, host: { properties: { "attr.data-f-node-id": "fNodeId", "class.f-node-disabled": "disabled" }, classAttribute: "f-node f-component" }, providers: [
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.1", type: FNodeDirective, selector: "[fNode]", inputs: { fNodeId: "fNodeId", position: ["fNodePosition", "position"], fDraggingDisabled: ["fNodeDraggingDisabled", "fDraggingDisabled"], fSelectionDisabled: ["fNodeSelectionDisabled", "fSelectionDisabled"] }, outputs: { positionChange: "fNodePositionChange" }, host: { properties: { "attr.data-f-node-id": "fNodeId", "class.f-node-dragging-disabled": "fDraggingDisabled", "class.f-node-selection-disabled": "fSelectionDisabled" }, classAttribute: "f-node f-component" }, providers: [
             { provide: F_NODE, useExisting: FNodeDirective }
         ], exportAs: ["fComponent"], usesInheritance: true, ngImport: i0 }); }
 }
@@ -1720,7 +1739,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
                     host: {
                         '[attr.data-f-node-id]': 'fNodeId',
                         class: "f-node f-component",
-                        '[class.f-node-disabled]': 'disabled'
+                        '[class.f-node-dragging-disabled]': 'fDraggingDisabled',
+                        '[class.f-node-selection-disabled]': 'fSelectionDisabled'
                     },
                     providers: [
                         { provide: F_NODE, useExisting: FNodeDirective }
@@ -1734,8 +1754,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
             }], positionChange: [{
                 type: Output,
                 args: ['fNodePositionChange']
-            }], disabled: [{
-                type: Input
+            }], fDraggingDisabled: [{
+                type: Input,
+                args: ['fNodeDraggingDisabled']
+            }], fSelectionDisabled: [{
+                type: Input,
+                args: ['fNodeSelectionDisabled']
             }] } });
 
 function isNode(element) {
@@ -2021,7 +2045,7 @@ class CanvasPrepareDragSequence {
         const isBackgroundElement = this.fComponentsStore.fBackground?.isBackgroundElement(event.targetElement);
         const isFlowHost = this.flowHost.contains(event.targetElement);
         let node = this.fComponentsStore.findNode(event.targetElement);
-        if (node && node.disabled) {
+        if (node && node.fDraggingDisabled) {
             node = undefined;
         }
         if ((isBackgroundElement || (isFlowHost && !node)) && !this.fDraggableDataContext.draggableItems.length) {
@@ -2432,11 +2456,10 @@ class ReassignConnectionPrepareDragSequence {
     get flowHost() {
         return this.fComponentsStore.fFlow.hostElement;
     }
-    constructor(fComponentsStore, fDraggableDataContext, getConnectionHandler, getInputRectInFlowHandler, fMediator, updateConnectionLayerHandler) {
+    constructor(fComponentsStore, fDraggableDataContext, getConnectionHandler, fMediator, updateConnectionLayerHandler) {
         this.fComponentsStore = fComponentsStore;
         this.fDraggableDataContext = fDraggableDataContext;
         this.getConnectionHandler = getConnectionHandler;
-        this.getInputRectInFlowHandler = getInputRectInFlowHandler;
         this.fMediator = fMediator;
         this.updateConnectionLayerHandler = updateConnectionLayerHandler;
     }
@@ -2449,7 +2472,7 @@ class ReassignConnectionPrepareDragSequence {
         });
         let connectionToReassign;
         if (dragHandlesOfConnections.length) {
-            const connections = dragHandlesOfConnections.map((x) => this.getConnectionHandler.handle(x)).filter((x) => !x?.disabled);
+            const connections = dragHandlesOfConnections.map((x) => this.getConnectionHandler.handle(x)).filter((x) => !x?.fDraggingDisabled);
             if (connections.length) {
                 connectionToReassign = this.getConnectionHandler.handle(dragHandlesOfConnections[0]);
             }
@@ -2463,12 +2486,12 @@ class ReassignConnectionPrepareDragSequence {
             ];
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: ReassignConnectionPrepareDragSequence, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: GetConnectionHandler }, { token: GetInputRectInFlowHandler }, { token: FFlowMediator }, { token: UpdateConnectionLayerHandler }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: ReassignConnectionPrepareDragSequence, deps: [{ token: FComponentsStore }, { token: FDraggableDataContext }, { token: GetConnectionHandler }, { token: FFlowMediator }, { token: UpdateConnectionLayerHandler }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: ReassignConnectionPrepareDragSequence }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: ReassignConnectionPrepareDragSequence, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: GetConnectionHandler }, { type: GetInputRectInFlowHandler }, { type: FFlowMediator }, { type: UpdateConnectionLayerHandler }] });
+        }], ctorParameters: () => [{ type: FComponentsStore }, { type: FDraggableDataContext }, { type: GetConnectionHandler }, { type: FFlowMediator }, { type: UpdateConnectionLayerHandler }] });
 
 const CONNECTIONS_PROVIDERS = [
     FindFirstCanBeConnectedOutputByOutletHandler,
@@ -2844,9 +2867,6 @@ class NodeDragHandler {
 }
 
 class NodeOnPointerUp {
-    get transform() {
-        return this.fComponentsStore.fCanvas.transform;
-    }
     get flowHost() {
         return this.fComponentsStore.fFlow.hostElement;
     }
@@ -2898,9 +2918,9 @@ class NodePrepareDragSequence {
     handle(event) {
         const node = this.fComponentsStore.findNode(event.targetElement);
         const pointerPositionInFlow = Point.fromPoint(event.getPosition()).elementTransform(this.flowHost);
-        if (node && !node.disabled && !this.fDraggableDataContext.draggableItems.length) {
+        if (node && !node.fDraggingDisabled && !this.fDraggableDataContext.draggableItems.length) {
             if (isNodeDragHandle(event.targetElement)) {
-                if (!this.fDraggableDataContext.selectedItems.includes(node)) {
+                if (!this.fDraggableDataContext.selectedItems.includes(node) && !node.fSelectionDisabled) {
                     this.fDraggableDataContext.selectedItems.push(node);
                     node.select();
                     this.fDraggableDataContext.isSelectedChanged = true;
@@ -2998,7 +3018,7 @@ class GetCanBeSelectedItemsHandler {
         return result;
     }
     getNodesWithRects() {
-        return this.fNodes.map((x) => {
+        return this.fNodes.filter((x) => !x.fSelectionDisabled).map((x) => {
             const rect = this.fMediator.send(new GetElementRectInFlowRequest(x.hostElement));
             return {
                 element: x,
@@ -3007,7 +3027,7 @@ class GetCanBeSelectedItemsHandler {
         });
     }
     getConnectionsWithRects() {
-        return this.fConnections.map((x) => {
+        return this.fConnections.filter((x) => !x.fSelectionDisabled).map((x) => {
             const rect = this.fMediator.send(new GetElementRectInFlowRequest(x.boundingElement));
             return {
                 element: x,
@@ -3142,26 +3162,32 @@ class SingleSelectOnPointerDown {
         }
         this.resetSelectionIfNotMultiselect(event);
         if (node) {
-            if (!this.fDraggableDataContext.selectedItems.includes(node)) {
+            if (!this.fDraggableDataContext.selectedItems.includes(node) && !node.fSelectionDisabled) {
                 this.fDraggableDataContext.selectedItems.push(node);
                 if (element?.hostElement.dataset['fNodeId'] !== node.hostElement.dataset['fNodeId']) {
                     this.fDraggableDataContext.isSelectedChanged = true;
                 }
             }
             else {
-                this.fDraggableDataContext.selectedItems.splice(this.fDraggableDataContext.selectedItems.indexOf(node), 1);
+                const index = this.fDraggableDataContext.selectedItems.indexOf(node);
+                if (index > -1) {
+                    this.fDraggableDataContext.selectedItems.splice(index, 1);
+                }
             }
         }
         else if (connection) {
             this.updateConnectionLayerHandler.handle(connection);
-            if (!this.fDraggableDataContext.selectedItems.includes(connection)) {
+            if (!this.fDraggableDataContext.selectedItems.includes(connection) && !connection.fSelectionDisabled) {
                 this.fDraggableDataContext.selectedItems.push(connection);
                 if (element?.hostElement.id !== connection.hostElement.id) {
                     this.fDraggableDataContext.isSelectedChanged = true;
                 }
             }
             else {
-                this.fDraggableDataContext.selectedItems.splice(this.fDraggableDataContext.selectedItems.indexOf(connection), 1);
+                const index = this.fDraggableDataContext.selectedItems.indexOf(connection);
+                if (index > -1) {
+                    this.fDraggableDataContext.selectedItems.splice(index, 1);
+                }
             }
         }
         this.selectIfNotSelected();
@@ -4572,5 +4598,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { CANVAS_PROVIDERS, COMMON_PROVIDERS, CONNECTIONS_PROVIDERS, CONNECTION_GRADIENT, CONNECTION_PATH, CONNECTION_TEXT, CalculateCenterBetweenPointsHandler, CalculateCenterBetweenPointsRequest, CalculateConnectionCenterHandler, CalculateConnectionCenterRequest, CalculateConnectorConnectableSideHandler, CalculateConnectorConnectableSideRequest, CanvasDragHandler, CanvasOnPointerUp, CanvasPrepareDragSequence, ClearSelectionHandler, ClearSelectionRequest, ConnectionDragHandler, ConnectionSourceDragHandler, ConnectionTargetDragHandler, CreateConnectionDragHandler, CreateConnectionOnPointerUp, CreateConnectionPrepareDragSequence, EFConnectableSide, EFConnectionBehavior, EFConnectionType, EFDraggableType, EFMarkerType, EXTERNAL_ITEM_PROVIDERS, ExternalItemDragHandler, ExternalItemOnPointerUp, ExternalItemPrepareDragSequence, FBackgroundBase, FBackgroundComponent, FBezierPathBuilder, FCanvasBase, FCanvasChangeEvent, FCanvasComponent, FCellPatternComponent, FComponentsStore, FConnectionBase, FConnectionCenterDirective, FConnectionComponent, FConnectionDragHandleComponent, FConnectionForCreateComponent, FConnectionGradientComponent, FConnectionPathComponent, FConnectionSelectionComponent, FConnectionTextComponent, FConnectionTextPathDirective, FConnectorBase, FCreateConnectionEvent, FCreateNodeEvent, FDragHandleDirective, FDraggableBase, FDraggableDataContext, FDraggableDirective, FExternalItemBase, FExternalItemDirective, FExternalItemService, FFlowBase, FFlowComponent, FFlowMediator, FFlowModule, FHandlerRegister, FLOW, FLineAlignmentBase, FLineAlignmentComponent, FMarkerBase, FMarkerDirective, FNodeBase, FNodeDirective, FNodeInputBase, FNodeInputDirective, FNodeOutletBase, FNodeOutletDirective, FNodeOutputBase, FNodeOutputDirective, FPathBuilderBase, FPathBuilderSelector, FReassignConnectionEvent, FResizeObserver, FSegmentPathBuilder, FSelectionAreaBase, FSelectionAreaComponent, FSelectionChangeEvent, FStraightPathBuilder, FZoomBase, FZoomDirective, F_BACKGROUND, F_BACKGROUND_PATTERN, F_CANVAS, F_CONNECTION_DRAG_HANDLE_CLASS, F_CONNECTION_IDENTIFIERS, F_DRAGGABLE, F_DRAG_HANDLE, F_EXTERNAL_ITEM, F_FLOW, F_LINE_ALIGNMENT, F_MARKER, F_NODE, F_NODE_INPUT, F_NODE_OUTLET, F_NODE_OUTPUT, F_SELECTED_CLASS, F_SELECTION_AREA, F_ZOOM, FindFirstCanBeConnectedOutputByOutletHandler, FindInputsUnderPointerHandler, FindInputsUnderPointerRequest, FirstNotConnectedInputOfNodeUnderPointerHandler, GetCanBeSelectedItemsHandler, GetConnectionHandler, GetConnectionVectorHandler, GetConnectionVectorRequest, GetElementRectInFlowHandler, GetElementRectInFlowRequest, GetIncomingConnectionsHandler, GetInputRectInFlowHandler, GetInputRectInFlowRequest, GetInputRectInFlowResponse, GetNodesRectHandler, GetNodesRectRequest, GetOutgoingConnectionsHandler, GetOutputRectInFlowHandler, GetOutputRectInFlowRequest, GetOutputRectInFlowResponse, GetSelectionHandler, GetSelectionRequest, InputsUnderPointerHandler, IsConnectionUnderNodeHandler, LineElement, LineService, MOUSE_EVENT_IGNORE_TIME, NODE_PROVIDERS, NearestCoordinateFinder, NodeDragHandler, NodeOnPointerUp, NodePrepareDragSequence, ReassignConnectionDragHandler, ReassignConnectionOnPointerUp, ReassignConnectionPrepareDragSequence, RedrawConnectionsHandler, RedrawConnectionsRequest, SELECTION_AREA_PROVIDERS, SINGLE_SELECT_PROVIDERS, SelectAllHandler, SelectAllRequest, SelectHandler, SelectRequest, SelectionAreaDragHandle, SelectionAreaOnPointerUp, SelectionAreaPrepareDragSequence, SingleSelectOnPointerDown, UpdateConnectionLayerHandler, UpdateNodeLayerHandler, castToConnectionBehavior, castToConnectionType, getExternalItem, getFlowUid, isExternalItem, isNode, isNodeDragHandle, isNodeInput, isNodeOutlet, isNodeOutput, mixinChangeConnectionSelection, mixinChangeConnectionVisibility };
+export { CANVAS_PROVIDERS, COMMON_PROVIDERS, CONNECTIONS_PROVIDERS, CONNECTION_GRADIENT, CONNECTION_PATH, CONNECTION_TEXT, CalculateCenterBetweenPointsHandler, CalculateCenterBetweenPointsRequest, CalculateConnectionCenterHandler, CalculateConnectionCenterRequest, CalculateConnectorConnectableSideHandler, CalculateConnectorConnectableSideRequest, CanvasDragHandler, CanvasOnPointerUp, CanvasPrepareDragSequence, ClearSelectionHandler, ClearSelectionRequest, ConnectionDragHandler, ConnectionSourceDragHandler, ConnectionTargetDragHandler, CreateConnectionDragHandler, CreateConnectionOnPointerUp, CreateConnectionPrepareDragSequence, EFConnectableSide, EFConnectionBehavior, EFConnectionType, EFDraggableType, EFMarkerType, EXTERNAL_ITEM_PROVIDERS, ExternalItemDragHandler, ExternalItemOnPointerUp, ExternalItemPrepareDragSequence, FBackgroundBase, FBackgroundComponent, FBezierPathBuilder, FCanvasBase, FCanvasChangeEvent, FCanvasComponent, FCellPatternComponent, FComponentsStore, FConnectionBase, FConnectionCenterDirective, FConnectionComponent, FConnectionDragHandleComponent, FConnectionForCreateComponent, FConnectionGradientComponent, FConnectionPathComponent, FConnectionSelectionComponent, FConnectionTextComponent, FConnectionTextPathDirective, FConnectorBase, FCreateConnectionEvent, FCreateNodeEvent, FDragHandleDirective, FDraggableBase, FDraggableDataContext, FDraggableDirective, FExternalItemBase, FExternalItemDirective, FExternalItemService, FFlowBase, FFlowComponent, FFlowMediator, FFlowModule, FHandlerRegister, FLOW, FLineAlignmentBase, FLineAlignmentComponent, FMarkerBase, FMarkerDirective, FNodeBase, FNodeDirective, FNodeInputBase, FNodeInputDirective, FNodeOutletBase, FNodeOutletDirective, FNodeOutputBase, FNodeOutputDirective, FPathBuilderBase, FPathBuilderSelector, FReassignConnectionEvent, FResizeObserver, FSegmentPathBuilder, FSelectionAreaBase, FSelectionAreaComponent, FSelectionChangeEvent, FStraightPathBuilder, FZoomBase, FZoomDirective, F_BACKGROUND, F_BACKGROUND_PATTERN, F_CANVAS, F_CONNECTION_DRAG_HANDLE_CLASS, F_CONNECTION_IDENTIFIERS, F_DRAGGABLE, F_DRAG_HANDLE, F_EXTERNAL_ITEM, F_FLOW, F_LINE_ALIGNMENT, F_MARKER, F_NODE, F_NODE_INPUT, F_NODE_OUTLET, F_NODE_OUTPUT, F_SELECTED_CLASS, F_SELECTION_AREA, F_ZOOM, FindFirstCanBeConnectedOutputByOutletHandler, FindInputsUnderPointerHandler, FindInputsUnderPointerRequest, FirstNotConnectedInputOfNodeUnderPointerHandler, GetCanBeSelectedItemsHandler, GetConnectionHandler, GetConnectionVectorHandler, GetConnectionVectorRequest, GetElementRectInFlowHandler, GetElementRectInFlowRequest, GetIncomingConnectionsHandler, GetInputRectInFlowHandler, GetInputRectInFlowRequest, GetInputRectInFlowResponse, GetNodesRectHandler, GetNodesRectRequest, GetOutgoingConnectionsHandler, GetOutputRectInFlowHandler, GetOutputRectInFlowRequest, GetOutputRectInFlowResponse, GetSelectionHandler, GetSelectionRequest, InputsUnderPointerHandler, IsConnectionUnderNodeHandler, LineElement, LineService, MOUSE_EVENT_IGNORE_TIME, NODE_PROVIDERS, NearestCoordinateFinder, NodeDragHandler, NodeOnPointerUp, NodePrepareDragSequence, ReassignConnectionDragHandler, ReassignConnectionOnPointerUp, ReassignConnectionPrepareDragSequence, RedrawConnectionsHandler, RedrawConnectionsRequest, SELECTION_AREA_PROVIDERS, SINGLE_SELECT_PROVIDERS, SelectAllHandler, SelectAllRequest, SelectHandler, SelectRequest, SelectionAreaDragHandle, SelectionAreaOnPointerUp, SelectionAreaPrepareDragSequence, SingleSelectOnPointerDown, UpdateConnectionLayerHandler, UpdateNodeLayerHandler, castToConnectableSide, castToConnectionBehavior, castToConnectionType, getExternalItem, getFlowUid, isExternalItem, isNode, isNodeDragHandle, isNodeInput, isNodeOutlet, isNodeOutput, mixinChangeConnectionSelection, mixinChangeConnectionVisibility };
 //# sourceMappingURL=foblex-flow.mjs.map