ngx-vflow 1.16.3 → 2.0.0

package/lib/vflow/interfaces/node.interface.d.ts

@@ -1,81 +1,61 @@
 import { Type, WritableSignal } from '@angular/core';
 import { Point } from './point.interface';
-import { CustomNodeComponent } from '../public-components/custom-node/custom-node.component';
-import { CustomDynamicNodeComponent } from '../public-components/custom-dynamic-node/custom-dynamic-node.component';
 import { NodePreview } from './node-preview.interface';
+import { CustomNodeComponent } from '../public-components/custom-node/custom-node.component';
+import { UnwrapSignal } from '../types/unwrap-signal.type';
+export declare const NODE_DEFAULTS: {
+    point: {
+        x: number;
+        y: number;
+    };
+    width: number;
+    height: number;
+    draggable: boolean;
+    parentId: null;
+    preview: {
+        style: {};
+    };
+    selected: boolean;
+    color: string;
+    resizable: boolean;
+    text: string;
+    data: {};
+};
 export type Node<T = any> = DefaultNode | HtmlTemplateNode<T> | SvgTemplateNode<T> | ComponentNode<T> | DefaultGroupNode | TemplateGroupNode<T>;
-export type DynamicNode<T = any> = DefaultDynamicNode | HtmlTemplateDynamicNode<T> | SvgTemplateDynamicNode<T> | ComponentDynamicNode<T> | DefaultDynamicGroupNode | TemplateDynamicGroupNode<T>;
 export interface SharedNode {
-    id: string;
-    point: Point;
-    draggable?: boolean;
-    parentId?: string | null;
-    preview?: NodePreview;
-}
-export interface SharedDynamicNode {
     id: string;
     point: WritableSignal<Point>;
     draggable?: WritableSignal<boolean>;
     parentId?: WritableSignal<string | null>;
     preview?: WritableSignal<NodePreview>;
+    selected?: WritableSignal<boolean>;
 }
 export interface DefaultNode extends SharedNode {
-    type: 'default';
-    text?: string;
-    width?: number;
-    height?: number;
-}
-export interface DefaultDynamicNode extends SharedDynamicNode {
     type: 'default';
     text?: WritableSignal<string>;
     width?: WritableSignal<number>;
     height?: WritableSignal<number>;
 }
 export interface HtmlTemplateNode<T = any> extends SharedNode {
-    type: 'html-template';
-    data?: T;
-    width?: number;
-    height?: number;
-}
-export interface SvgTemplateNode<T = any> extends SharedNode {
-    type: 'svg-template';
-    width: number;
-    height: number;
-    data?: T;
-}
-export interface HtmlTemplateDynamicNode<T = any> extends SharedDynamicNode {
     type: 'html-template';
     data?: WritableSignal<T>;
     width?: WritableSignal<number>;
     height?: WritableSignal<number>;
 }
-export interface SvgTemplateDynamicNode<T = any> extends SharedDynamicNode {
+export interface SvgTemplateNode<T = any> extends SharedNode {
     type: 'svg-template';
     width: WritableSignal<number>;
     height: WritableSignal<number>;
     data?: WritableSignal<T>;
 }
 export interface DefaultGroupNode extends SharedNode {
-    type: 'default-group';
-    width: number;
-    height: number;
-    color?: string;
-    resizable?: boolean;
-}
-export interface DefaultDynamicGroupNode extends SharedDynamicNode {
     type: 'default-group';
     width: WritableSignal<number>;
     height: WritableSignal<number>;
     color?: WritableSignal<string>;
     resizable?: WritableSignal<boolean>;
 }
-export interface TemplateGroupNode<T> extends SharedNode {
-    type: 'template-group';
-    width: number;
-    height: number;
-    data?: T;
-}
-export interface TemplateDynamicGroupNode<T> extends SharedDynamicNode {
+export interface TemplateGroupNode<T = any> extends SharedNode {
     type: 'template-group';
     width: WritableSignal<number>;
     height: WritableSignal<number>;
@@ -83,27 +63,28 @@ export interface TemplateDynamicGroupNode<T> extends SharedDynamicNode {
 }
 export interface ComponentNode<T = any> extends SharedNode {
     type: Type<CustomNodeComponent<T>> | (() => Promise<Type<CustomNodeComponent<T>>>);
-    data?: T;
-    width?: number;
-    height?: number;
-}
-export interface ComponentDynamicNode<T = any> extends SharedDynamicNode {
-    type: Type<CustomDynamicNodeComponent<T>> | (() => Promise<Type<CustomDynamicNodeComponent<T>>>);
     data?: WritableSignal<T>;
     width?: WritableSignal<number>;
     height?: WritableSignal<number>;
 }
-export declare function isStaticNode<T>(node: Node<T> | DynamicNode<T>): node is Node<T>;
-export declare function isDynamicNode<T>(node: Node<T> | DynamicNode<T>): node is DynamicNode<T>;
-export declare function isComponentStaticNode<T>(node: Node<T>): node is ComponentNode<T>;
-export declare function isComponentDynamicNode<T>(node: DynamicNode<T>): node is ComponentDynamicNode<T>;
-export declare function isTemplateStaticNode<T>(node: Node<T>): node is HtmlTemplateNode<T>;
-export declare function isTemplateDynamicNode<T>(node: DynamicNode<T>): node is HtmlTemplateDynamicNode<T>;
-export declare function isSvgTemplateStaticNode<T>(node: Node<T>): node is SvgTemplateNode<T>;
-export declare function isSvgTemplateDynamicNode<T>(node: DynamicNode<T>): node is SvgTemplateDynamicNode<T>;
-export declare function isDefaultStaticNode(node: Node): node is DefaultNode;
-export declare function isDefaultDynamicNode(node: DynamicNode): node is DefaultDynamicNode;
-export declare function isDefaultStaticGroupNode(node: Node): node is DefaultGroupNode;
-export declare function isDefaultDynamicGroupNode(node: DynamicNode): node is DefaultDynamicGroupNode;
-export declare function isTemplateStaticGroupNode<T>(node: Node<T>): node is TemplateGroupNode<T>;
-export declare function isTemplateDynamicGroupNode<T>(node: DynamicNode<T>): node is TemplateDynamicGroupNode<T>;
+export declare function isComponentNode<T>(node: Node<T>): node is ComponentNode<T>;
+export declare function isTemplateNode<T>(node: Node<T>): node is HtmlTemplateNode<T>;
+export declare function isSvgTemplateNode<T>(node: Node<T>): node is SvgTemplateNode<T>;
+export declare function isDefaultNode(node: Node): node is DefaultNode;
+export declare function isDefaultGroupNode(node: Node): node is DefaultGroupNode;
+export declare function isTemplateGroupNode<T>(node: Node<T>): node is TemplateGroupNode<T>;
+export type StaticNode<T = unknown> = UnwrapSignal<DefaultNode> | UnwrapSignal<HtmlTemplateNode<T>> | UnwrapSignal<SvgTemplateNode<T>> | UnwrapSignal<ComponentNode<T>> | UnwrapSignal<DefaultGroupNode> | UnwrapSignal<TemplateGroupNode<T>>;
+export declare function createNode<T>(node: StaticNode<T>): Required<Node<T>>;
+export declare function createNode<T>(node: StaticNode<T>, options: {
+    useDefaults: true;
+}): Required<Node<T>>;
+export declare function createNode<T>(node: StaticNode<T>, options: {
+    useDefaults: false;
+}): Node<T>;
+export declare function createNodes<T = unknown>(nodes: StaticNode<T>[]): Required<Node<T>>[];
+export declare function createNodes<T = unknown>(nodes: StaticNode<T>[], options: {
+    useDefaults: true;
+}): Required<Node<T>>[];
+export declare function createNodes<T = unknown>(nodes: StaticNode<T>[], options: {
+    useDefaults: false;
+}): Node<T>[];

package/lib/vflow/interfaces/selection-strategy.interface.d.ts

@@ -0,0 +1,16 @@
+import { FlowEntity } from './flow-entity.interface';
+import { ViewportState } from './viewport.interface';
+export interface SelectionContext {
+    entities: FlowEntity[];
+    isMultiSelectionActive: boolean;
+}
+export interface ViewportChangeContext {
+    start: ViewportState;
+    end: ViewportState;
+    target: Element;
+    delta: number;
+}
+export interface SelectionStrategy {
+    select(entity: FlowEntity | null, context: SelectionContext): void;
+    handleViewportChange(viewport: ViewportChangeContext, context: SelectionContext): void;
+}

package/lib/vflow/interfaces/template-context.interface.d.ts

@@ -3,9 +3,11 @@ import { Edge } from './edge.interface';
 import { HtmlTemplateEdgeLabel } from './edge-label.interface';
 import { Point } from './point.interface';
 import { HandleState } from '../models/handle.model';
+import { HtmlTemplateNode, SvgTemplateNode, TemplateGroupNode } from './node.interface';
 export interface EdgeContext {
     $implicit: {
         edge: Edge<any>;
+        data: Signal<any>;
         path: Signal<string>;
         markerStart: Signal<string>;
         markerEnd: Signal<string>;
@@ -15,14 +17,16 @@ export interface EdgeContext {
 }
 export interface NodeContext {
     $implicit: {
-        node: any;
+        node: HtmlTemplateNode;
+        data: Signal<any>;
         selected: Signal<boolean>;
         shouldLoad: Signal<boolean>;
     };
 }
 export interface SvgNodeContext {
     $implicit: {
-        node: any;
+        node: SvgTemplateNode;
+        data: Signal<any>;
         selected: Signal<boolean>;
         width: Signal<number>;
         height: Signal<number>;
@@ -31,7 +35,8 @@ export interface SvgNodeContext {
 }
 export interface GroupNodeContext {
     $implicit: {
-        node: any;
+        node: TemplateGroupNode;
+        data: Signal<any>;
         selected: Signal<boolean>;
         width: Signal<number>;
         height: Signal<number>;

package/lib/vflow/models/connection.model.d.ts

@@ -7,6 +7,6 @@ export declare class ConnectionModel {
     type: EdgeType;
     validator: ConnectionValidatorFn;
     mode: ConnectionMode;
+    allowSelfConnections: boolean;
     constructor(settings: ConnectionSettings);
-    private getValidators;
 }

package/lib/vflow/models/edge.model.d.ts

@@ -1,4 +1,4 @@
-import { EdgeLabelPosition } from '../interfaces/edge-label.interface';
+import { EdgeLabel } from '../interfaces/edge-label.interface';
 import { Edge, Curve, EdgeType } from '../interfaces/edge.interface';
 import { EdgeLabelModel } from './edge-label.model';
 import { NodeModel } from './node.model';
@@ -6,15 +6,25 @@ import { FlowEntity } from '../interfaces/flow-entity.interface';
 import { Contextable } from '../interfaces/contextable.interface';
 import { EdgeContext } from '../interfaces/template-context.interface';
 import { HandleModel } from './handle.model';
+import { Marker } from '../interfaces/marker.interface';
 export declare class EdgeModel implements FlowEntity, Contextable<EdgeContext> {
     edge: Edge;
     private readonly flowEntitiesService;
     source: import("@angular/core").WritableSignal<NodeModel<unknown> | undefined>;
     target: import("@angular/core").WritableSignal<NodeModel<unknown> | undefined>;
-    curve: Curve;
+    curve: import("@angular/core").WritableSignal<Curve>;
     type: EdgeType;
-    reconnectable: boolean | 'source' | 'target';
-    floating: boolean;
+    reconnectable: import("@angular/core").WritableSignal<boolean | "source" | "target">;
+    floating: import("@angular/core").WritableSignal<boolean>;
+    markers: import("@angular/core").WritableSignal<{
+        start?: Marker;
+        end?: Marker;
+    }>;
+    edgeLabels: import("@angular/core").WritableSignal<{
+        start?: EdgeLabel | undefined;
+        center?: EdgeLabel | undefined;
+        end?: EdgeLabel | undefined;
+    }>;
     selected: import("@angular/core").WritableSignal<boolean>;
     selected$: import("rxjs").Observable<boolean>;
     shouldLoad: import("@angular/core").Signal<boolean>;
@@ -28,27 +38,14 @@ export declare class EdgeModel implements FlowEntity, Contextable<EdgeContext> {
         sourceHandle: HandleModel | null;
         targetHandle: HandleModel | null;
     }>;
-    /**
-     * TODO: not reactive
-     */
     markerStartUrl: import("@angular/core").Signal<string>;
-    /**
-     * TODO: not reactive
-     */
     markerEndUrl: import("@angular/core").Signal<string>;
-    context: {
-        $implicit: {
-            edge: Edge<unknown>;
-            path: import("@angular/core").Signal<string>;
-            markerStart: import("@angular/core").Signal<string>;
-            markerEnd: import("@angular/core").Signal<string>;
-            selected: import("@angular/core").Signal<boolean>;
-            shouldLoad: import("@angular/core").Signal<boolean>;
-        };
-    };
-    edgeLabels: {
-        [position in EdgeLabelPosition]?: EdgeLabelModel;
-    };
+    context: EdgeContext;
+    labelModels: import("@angular/core").Signal<{
+        start?: EdgeLabelModel | undefined;
+        center?: EdgeLabelModel | undefined;
+        end?: EdgeLabelModel | undefined;
+    }>;
     constructor(edge: Edge);
     private getPathFactoryParams;
 }

package/lib/vflow/models/handle.model.d.ts

@@ -35,7 +35,7 @@ export declare class HandleModel {
                 y: number;
             }>;
             state: import("@angular/core").WritableSignal<HandleState>;
-            node: import("ngx-vflow").Node<unknown> | import("ngx-vflow").DynamicNode<unknown>;
+            node: import("ngx-vflow").Node<unknown>;
         };
     };
     constructor(rawHandle: NodeHandle, parentNode: NodeModel);

package/lib/vflow/models/node.model.d.ts

@@ -1,5 +1,5 @@
 import { TemplateRef } from '@angular/core';
-import { DynamicNode, Node } from '../interfaces/node.interface';
+import { Node } from '../interfaces/node.interface';
 import { HandleModel } from './handle.model';
 import { FlowEntity } from '../interfaces/flow-entity.interface';
 import { Point } from '../interfaces/point.interface';
@@ -10,10 +10,7 @@ import { NodePreview } from '../interfaces/node-preview.interface';
 export declare class NodeModel<T = unknown> implements FlowEntity, Contextable<NodeContext | GroupNodeContext | {
     $implicit: object;
 }> {
-    rawNode: Node<T> | DynamicNode<T>;
-    private static defaultWidth;
-    private static defaultHeight;
-    private static defaultColor;
+    rawNode: Node<T>;
     private entitiesService;
     private settingsService;
     private nodeRenderingService;
@@ -65,7 +62,7 @@ export declare class NodeModel<T = unknown> implements FlowEntity, Contextable<N
     componentInstance$: Observable<any>;
     text: import("@angular/core").WritableSignal<string>;
     componentTypeInputs: {
-        node: Node<T> | DynamicNode<T>;
+        node: Node<T>;
     };
     parent: import("@angular/core").Signal<NodeModel<unknown> | null>;
     children: import("@angular/core").Signal<NodeModel<unknown>[]>;
@@ -78,6 +75,6 @@ export declare class NodeModel<T = unknown> implements FlowEntity, Contextable<N
         $implicit: {};
     };
     private parentId;
-    constructor(rawNode: Node<T> | DynamicNode<T>);
+    constructor(rawNode: Node<T>);
     setPoint(point: Point): void;
 }

package/lib/vflow/public-components/custom-node/custom-node.component.d.ts

@@ -9,5 +9,5 @@ export declare abstract class CustomNodeComponent<T = any> extends CustomNodeBas
     node: import("@angular/core").InputSignal<ComponentNode<T>>;
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CustomNodeComponent<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<CustomNodeComponent<any>, never, never, { "node": { "alias": "node"; "required": true; "isSignal": true; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CustomNodeComponent<any>, never, never, { "node": { "alias": "node"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/lib/vflow/public-components/custom-template-edge/custom-template-edge.component.d.ts

@@ -5,7 +5,8 @@ export declare class CustomTemplateEdgeComponent {
     private edgeRenderingService;
     protected model: import("../../models/edge.model").EdgeModel;
     protected context: {
-        edge: import("ngx-vflow").Edge<unknown>;
+        edge: import("ngx-vflow").Edge<any>;
+        data: import("@angular/core").Signal<any>;
         path: import("@angular/core").Signal<string>;
         markerStart: import("@angular/core").Signal<string>;
         markerEnd: import("@angular/core").Signal<string>;

package/lib/vflow/public-components/minimap/minimap.component.d.ts

@@ -41,7 +41,7 @@ export declare class MiniMapComponent implements OnInit {
     protected boundsViewport: import("@angular/core").Signal<import("ngx-vflow").ViewportState>;
     protected minimapTransform: import("@angular/core").Signal<string>;
     ngOnInit(): void;
-    protected trackNodes(idx: number, { rawNode }: NodeModel): import("ngx-vflow").Node<unknown> | import("ngx-vflow").DynamicNode<unknown>;
+    protected trackNodes(idx: number, { rawNode }: NodeModel): import("ngx-vflow").Node<unknown>;
     static ɵfac: i0.ɵɵFactoryDeclaration<MiniMapComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<MiniMapComponent, "mini-map", never, { "maskColor": { "alias": "maskColor"; "required": false; "isSignal": true; }; "strokeColor": { "alias": "strokeColor"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "scaleOnHover": { "alias": "scaleOnHover"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/lib/vflow/services/draggable.service.d.ts

@@ -4,6 +4,8 @@ export declare class DraggableService {
     private entitiesService;
     private settingsService;
     private flowStatusService;
+    private viewportService;
+    private injector;
     /**
      * Enable draggable behavior for element.
      *
@@ -40,6 +42,7 @@ export declare class DraggableService {
      * @todo make it unit testable
      */
     private alignToGrid;
+    private moveNodesOnAutoPan$;
     static ɵfac: i0.ɵɵFactoryDeclaration<DraggableService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<DraggableService>;
 }

package/lib/vflow/services/flow-entities.service.d.ts

@@ -5,11 +5,11 @@ import { ConnectionModel } from '../models/connection.model';
 import { Marker } from '../interfaces/marker.interface';
 import { FlowEntity } from '../interfaces/flow-entity.interface';
 import { MinimapModel } from '../models/minimap.model';
-import { DynamicNode, Node } from '../interfaces/node.interface';
+import { Node } from '../interfaces/node.interface';
 import * as i0 from "@angular/core";
 export declare class FlowEntitiesService {
     readonly nodes: WritableSignal<NodeModel<unknown>[]>;
-    readonly rawNodes: Signal<Node[] | DynamicNode[]>;
+    readonly rawNodes: Signal<Node[]>;
     readonly edges: WritableSignal<EdgeModel[]>;
     readonly rawEdges: Signal<import("ngx-vflow").Edge<unknown>[]>;
     readonly validEdges: Signal<EdgeModel[]>;

package/lib/vflow/services/flow-settings.service.d.ts

@@ -1,11 +1,13 @@
 import { WritableSignal } from '@angular/core';
 import { Background } from '../types/background.type';
 import { Optimization } from '../interfaces/optimization.interface';
+import { SelectionMode } from '../types/selection-mode.type';
 import * as i0 from "@angular/core";
 export declare class FlowSettingsService {
     entitiesSelectable: WritableSignal<boolean>;
     elevateNodesOnSelect: WritableSignal<boolean>;
     elevateEdgesOnSelect: WritableSignal<boolean>;
+    autoPan: WritableSignal<boolean>;
     /**
      * @see {VflowComponent.view}
      */
@@ -23,6 +25,7 @@ export declare class FlowSettingsService {
     background: WritableSignal<Background>;
     snapGrid: WritableSignal<[number, number]>;
     optimization: WritableSignal<Required<Optimization>>;
+    selectionMode: WritableSignal<SelectionMode>;
     static ɵfac: i0.ɵɵFactoryDeclaration<FlowSettingsService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<FlowSettingsService>;
 }

package/lib/vflow/services/flow-status.service.d.ts

@@ -17,10 +17,20 @@ export interface FlowStatusConnectionValidation {
         valid: boolean;
     };
 }
-export interface FlowStatusConnectionEnd {
-    state: 'connection-end';
+export interface FlowStatusConnectionRelease {
+    state: 'connection-release';
     payload: ConnectionInternal;
 }
+export interface FlowStatusConnectionReleaseValidated {
+    state: 'connection-release-validated';
+    payload: ConnectionInternal & {
+        valid: boolean;
+    };
+}
+export interface FlowStatusConnectionDropped {
+    state: 'connection-dropped';
+    payload: Omit<ConnectionInternal, 'target' | 'targetHandle'>;
+}
 export interface FlowStatusReconnectionStart {
     state: 'reconnection-start';
     payload: Omit<ConnectionInternal, 'target' | 'targetHandle'> & {
@@ -34,12 +44,25 @@ export interface FlowStatusReconnectionValidation {
         oldEdge: EdgeModel;
     };
 }
-export interface FlowStatusReconnectionEnd {
-    state: 'reconnection-end';
+export interface FlowStatusReconnectionRelease {
+    state: 'reconnection-release';
     payload: ConnectionInternal & {
         oldEdge: EdgeModel;
     };
 }
+export interface FlowStatusReconnectionReleaseValidated {
+    state: 'reconnection-release-validated';
+    payload: ConnectionInternal & {
+        oldEdge: EdgeModel;
+        valid: boolean;
+    };
+}
+export interface FlowStatusReconnectionDropped {
+    state: 'reconnection-dropped';
+    payload: Omit<ConnectionInternal, 'target' | 'targetHandle'> & {
+        oldEdge: EdgeModel;
+    };
+}
 export interface FlowStatusNodeDragStart {
     state: 'node-drag-start';
     payload: {
@@ -52,16 +75,21 @@ export interface FlowStatusNodeDragEnd {
         node: NodeModel;
     };
 }
-export type FlowStatus = FlowStatusIdle | FlowStatusConnectionStart | FlowStatusConnectionValidation | FlowStatusConnectionEnd | FlowStatusReconnectionStart | FlowStatusReconnectionValidation | FlowStatusReconnectionEnd | FlowStatusNodeDragStart | FlowStatusNodeDragEnd;
+export type FlowStatus = FlowStatusIdle | FlowStatusConnectionStart | FlowStatusConnectionValidation | FlowStatusConnectionRelease | FlowStatusConnectionReleaseValidated | FlowStatusConnectionDropped | FlowStatusReconnectionStart | FlowStatusReconnectionValidation | FlowStatusReconnectionRelease | FlowStatusReconnectionReleaseValidated | FlowStatusReconnectionDropped | FlowStatusNodeDragStart | FlowStatusNodeDragEnd;
 export declare class FlowStatusService {
     readonly status: import("@angular/core").WritableSignal<FlowStatus>;
+    readonly status$: import("rxjs").Observable<FlowStatus>;
     setIdleStatus(): void;
     setConnectionStartStatus(source: NodeModel, sourceHandle: HandleModel): void;
     setReconnectionStartStatus(source: NodeModel, sourceHandle: HandleModel, oldEdge: EdgeModel): void;
     setConnectionValidationStatus(valid: boolean, source: NodeModel, target: NodeModel, sourceHandle: HandleModel, targetHandle: HandleModel): void;
     setReconnectionValidationStatus(valid: boolean, source: NodeModel, target: NodeModel, sourceHandle: HandleModel, targetHandle: HandleModel, oldEdge: EdgeModel): void;
-    setConnectionEndStatus(source: NodeModel, target: NodeModel, sourceHandle: HandleModel, targetHandle: HandleModel): void;
-    setReconnectionEndStatus(source: NodeModel, target: NodeModel, sourceHandle: HandleModel, targetHandle: HandleModel, oldEdge: EdgeModel): void;
+    setConnectionReleaseStatus(source: NodeModel, target: NodeModel, sourceHandle: HandleModel, targetHandle: HandleModel): void;
+    setConnectionReleaseValidatedStatus(source: NodeModel, target: NodeModel, sourceHandle: HandleModel, targetHandle: HandleModel, valid: boolean): void;
+    setConnectionDroppedStatus(source: NodeModel, sourceHandle: HandleModel): void;
+    setReconnectionReleaseStatus(source: NodeModel, target: NodeModel, sourceHandle: HandleModel, targetHandle: HandleModel, oldEdge: EdgeModel): void;
+    setReconnectionReleaseValidatedStatus(source: NodeModel, target: NodeModel, sourceHandle: HandleModel, targetHandle: HandleModel, oldEdge: EdgeModel, valid: boolean): void;
+    setReconnectionDroppedStatus(source: NodeModel, sourceHandle: HandleModel, oldEdge: EdgeModel): void;
     setNodeDragStartStatus(node: NodeModel): void;
     setNodeDragEndStatus(node: NodeModel): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<FlowStatusService, never>;

package/lib/vflow/services/selection.service.d.ts

@@ -14,8 +14,11 @@ export declare class SelectionService {
     private static delta;
     private flowEntitiesService;
     private keyboardService;
+    private flowSettingsService;
+    private strategies;
+    private currentStrategy;
     protected viewport$: Subject<ViewportForSelection>;
-    protected resetSelection: import("rxjs").Subscription;
+    protected viewportChangeSub: import("rxjs").Subscription;
     setViewport(viewport: ViewportForSelection): void;
     select(entity: FlowEntity | null): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SelectionService, never>;

package/lib/vflow/strategies/default-selection.strategy.d.ts

@@ -0,0 +1,6 @@
+import { SelectionStrategy, SelectionContext, ViewportChangeContext } from '../interfaces/selection-strategy.interface';
+import { FlowEntity } from '../interfaces/flow-entity.interface';
+export declare class DefaultSelectionStrategy implements SelectionStrategy {
+    select(entity: FlowEntity | null, context: SelectionContext): void;
+    handleViewportChange(viewport: ViewportChangeContext, context: SelectionContext): void;
+}

package/lib/vflow/strategies/manual-selection.strategy.d.ts

@@ -0,0 +1,5 @@
+import { SelectionStrategy } from '../interfaces/selection-strategy.interface';
+export declare class ManualSelectionStrategy implements SelectionStrategy {
+    select(): void;
+    handleViewportChange(): void;
+}

package/lib/vflow/types/selection-mode.type.d.ts

@@ -0,0 +1 @@
+export type SelectionMode = 'default' | 'manual';

package/lib/vflow/types/unwrap-signal.type.d.ts

@@ -0,0 +1,4 @@
+import { Signal } from '@angular/core';
+export type UnwrapSignal<T> = {
+    [K in keyof T]: NonNullable<T[K]> extends Signal<infer U> ? (undefined extends T[K] ? U | undefined : U) : T[K];
+};

package/lib/vflow/utils/adjust-direction.d.ts

@@ -1,11 +1,7 @@
 import { ConnectionInternal } from '../interfaces/connection.internal.interface';
 /**
- * This function contains a hack-y behavior.
- * If the handles are of the same type (source-source or target-target),
- * it returns nodes where source === target and
- * handles where sourceHandle === targetHandle
+ * Adjust connection direction based on handle types.
+ *
  *
- * This leads to that notSelfValidator returns false for these cases,
- * exactly what we need for strict connection type
  */
 export declare function adjustDirection(connection: ConnectionInternal): ConnectionInternal;

package/lib/vflow/utils/identity-checker/reference-identity-checker.d.ts

@@ -1,12 +1,12 @@
 import { NodeModel } from '../../models/node.model';
-import { DynamicNode, Node } from '../../interfaces/node.interface';
+import { Node } from '../../interfaces/node.interface';
 import { EdgeModel } from '../../models/edge.model';
 import { Edge } from '../../interfaces/edge.interface';
 export declare class ReferenceIdentityChecker {
     /**
      * Create new models for new node references and keep old models for old node references
      */
-    static nodes(newNodes: Node[] | DynamicNode[], oldNodeModels: NodeModel[]): (NodeModel<unknown> | NodeModel<any>)[];
+    static nodes(newNodes: Node[], oldNodeModels: NodeModel[]): (NodeModel<unknown> | NodeModel<any>)[];
     /**
      * Create new models for new edge references and keep old models for old edge references
      */

package/lib/vflow/utils/is-vflow-component.d.ts

@@ -1,4 +1,2 @@
-import { CustomDynamicNodeComponent } from '../public-components/custom-dynamic-node/custom-dynamic-node.component';
 import { CustomNodeComponent } from '../public-components/custom-node/custom-node.component';
 export declare function isCustomNodeComponent(type: any): type is CustomNodeComponent;
-export declare function isCustomDynamicNodeComponent(type: any): type is CustomDynamicNodeComponent;

package/lib/vflow/utils/signals/to-lazy-signal.d.ts

@@ -2,19 +2,19 @@ import { type Signal } from '@angular/core';
 import { type ToSignalOptions } from '@angular/core/rxjs-interop';
 import type { Observable, Subscribable } from 'rxjs';
 export declare function toLazySignal<T>(source: Observable<T> | Subscribable<T>): Signal<T | undefined>;
-export declare function toLazySignal<T>(source: Observable<T> | Subscribable<T>, options: ToSignalOptions & {
+export declare function toLazySignal<T>(source: Observable<T> | Subscribable<T>, options: ToSignalOptions<T> & {
     initialValue?: undefined;
     requireSync?: false;
 }): Signal<T | undefined>;
-export declare function toLazySignal<T>(source: Observable<T> | Subscribable<T>, options: ToSignalOptions & {
+export declare function toLazySignal<T>(source: Observable<T> | Subscribable<T>, options: ToSignalOptions<T> & {
     initialValue?: null;
     requireSync?: false;
 }): Signal<T | null>;
-export declare function toLazySignal<T>(source: Observable<T> | Subscribable<T>, options: ToSignalOptions & {
+export declare function toLazySignal<T>(source: Observable<T> | Subscribable<T>, options: ToSignalOptions<T> & {
     initialValue?: undefined;
     requireSync: true;
 }): Signal<T>;
-export declare function toLazySignal<T, const U extends T>(source: Observable<T> | Subscribable<T>, options: ToSignalOptions & {
+export declare function toLazySignal<T, const U extends T>(source: Observable<T> | Subscribable<T>, options: ToSignalOptions<T> & {
     initialValue: U;
     requireSync?: false;
 }): Signal<T | U>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ngx-vflow",
-  "version": "1.16.3",
+  "version": "2.0.0",
   "license": "MIT",
   "homepage": "https://www.ngx-vflow.org/",
   "author": "Artem Mangilev",
@@ -16,8 +16,8 @@
     "type": "git"
   },
   "peerDependencies": {
-    "@angular/common": "^17.3.12 || 18.x || 19.x || 20.x",
-    "@angular/core": "^17.3.12 || 18.x || 19.x || 20.x",
+    "@angular/common": "^19.2.17 || 20.x || 21.x",
+    "@angular/core": "^19.2.17 || 20.x || 21.x",
     "d3-drag": "^3.0.0",
     "d3-selection": "^3.0.0",
     "d3-zoom": "^3.0.0",
@@ -37,14 +37,10 @@
     },
     ".": {
       "types": "./index.d.ts",
-      "esm2022": "./esm2022/ngx-vflow.mjs",
-      "esm": "./esm2022/ngx-vflow.mjs",
       "default": "./fesm2022/ngx-vflow.mjs"
     },
     "./testing": {
       "types": "./testing/index.d.ts",
-      "esm2022": "./esm2022/testing/ngx-vflow-testing.mjs",
-      "esm": "./esm2022/testing/ngx-vflow-testing.mjs",
       "default": "./fesm2022/ngx-vflow-testing.mjs"
     }
   }