ngx-vflow 0.4.0 → 0.6.0

package/lib/vflow/components/node/node.component.d.ts

@@ -1,18 +1,13 @@
-import { AfterViewInit, ElementRef, Injector, NgZone, OnDestroy, OnInit, TemplateRef } from '@angular/core';
+import { AfterViewInit, ElementRef, Injector, OnDestroy, OnInit, TemplateRef } from '@angular/core';
 import { NodeModel } from '../../models/node.model';
-import { HandleService } from '../../services/handle.service';
 import { HandleModel } from '../../models/handle.model';
 import { WithInjector } from '../../decorators/run-in-injection-context.decorator';
 import * as i0 from "@angular/core";
 export type HandleState = 'valid' | 'invalid' | 'idle';
 export declare class NodeComponent implements OnInit, AfterViewInit, OnDestroy, WithInjector {
     injector: Injector;
-    protected handleService: HandleService;
-    protected zone: NgZone;
-    nodeModel: NodeModel;
-    nodeHtmlTemplate?: TemplateRef<any>;
-    nodeContentRef: ElementRef<SVGGraphicsElement>;
-    htmlWrapperRef: ElementRef<HTMLDivElement>;
+    private handleService;
+    private zone;
     private draggableService;
     private flowStatusService;
     private flowEntitiesService;
@@ -20,12 +15,18 @@ export declare class NodeComponent implements OnInit, AfterViewInit, OnDestroy,
     private flowSettingsService;
     private selectionService;
     private hostRef;
+    nodeModel: NodeModel;
+    nodeHtmlTemplate?: TemplateRef<any>;
+    nodeContentRef: ElementRef<SVGGraphicsElement>;
+    htmlWrapperRef: ElementRef<HTMLDivElement>;
     protected showMagnet: import("@angular/core").Signal<boolean>;
+    protected styleWidth: import("@angular/core").Signal<string>;
+    protected styleHeight: import("@angular/core").Signal<string>;
     private subscription;
     ngOnInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
-    protected startConnection(event: MouseEvent, handle: HandleModel): void;
+    protected startConnection(event: Event, handle: HandleModel): void;
     protected endConnection(): void;
     /**
      * TODO srp

package/lib/vflow/components/vflow/vflow.component.d.ts

@@ -22,6 +22,7 @@ export declare class VflowComponent {
     private edgesChangeService;
     private nodeRenderingService;
     private flowSettingsService;
+    private componentEventBusService;
     private injector;
     /**
      * Size for flow view
@@ -76,6 +77,12 @@ export declare class VflowComponent {
      */
     set edges(newEdges: Edge[]);
     protected edgeModels: Signal<EdgeModel[]>;
+    /**
+     * Event that accumulates all custom node events
+     *
+     * @experimental
+     */
+    onComponentNodeEvent: any;
     protected nodeHtmlDirective?: NodeHtmlTemplateDirective;
     protected edgeTemplateDirective?: EdgeTemplateDirective;
     protected edgeLabelHtmlDirective?: EdgeLabelHtmlTemplateDirective;
@@ -102,7 +109,7 @@ export declare class VflowComponent {
      */
     readonly nodesChange$: import("rxjs").Observable<NodeChange[]>;
     /**
-     * Observable with nodes change
+     * Observable with edges change
      */
     readonly edgesChange$: import("rxjs").Observable<EdgeChange[]>;
     protected flowWidth: Signal<string | number>;
@@ -139,6 +146,6 @@ export declare class VflowComponent {
     protected trackNodes(idx: number, { node }: NodeModel): Node<unknown>;
     protected trackEdges(idx: number, { edge }: EdgeModel): Edge<unknown>;
     static ɵfac: i0.ɵɵFactoryDeclaration<VflowComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<VflowComponent, "vflow", never, { "view": { "alias": "view"; "required": false; }; "minZoom": { "alias": "minZoom"; "required": false; }; "maxZoom": { "alias": "maxZoom"; "required": false; }; "handlePositions": { "alias": "handlePositions"; "required": false; }; "background": { "alias": "background"; "required": false; }; "entitiesSelectable": { "alias": "entitiesSelectable"; "required": false; }; "connection": { "alias": "connection"; "required": false; }; "nodes": { "alias": "nodes"; "required": true; }; "edges": { "alias": "edges"; "required": false; }; }, {}, ["nodeHtmlDirective", "edgeTemplateDirective", "edgeLabelHtmlDirective", "connectionTemplateDirective"], never, false, [{ directive: typeof i1.ConnectionControllerDirective; inputs: {}; outputs: { "onConnect": "onConnect"; }; }, { directive: typeof i2.ChangesControllerDirective; inputs: {}; outputs: { "onNodesChange": "onNodesChange"; "onEdgesChange": "onEdgesChange"; }; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<VflowComponent, "vflow", never, { "view": { "alias": "view"; "required": false; }; "minZoom": { "alias": "minZoom"; "required": false; }; "maxZoom": { "alias": "maxZoom"; "required": false; }; "handlePositions": { "alias": "handlePositions"; "required": false; }; "background": { "alias": "background"; "required": false; }; "entitiesSelectable": { "alias": "entitiesSelectable"; "required": false; }; "connection": { "alias": "connection"; "required": false; }; "nodes": { "alias": "nodes"; "required": true; }; "edges": { "alias": "edges"; "required": false; }; }, { "onComponentNodeEvent": "onComponentNodeEvent"; }, ["nodeHtmlDirective", "edgeTemplateDirective", "edgeLabelHtmlDirective", "connectionTemplateDirective"], never, false, [{ directive: typeof i1.ConnectionControllerDirective; inputs: {}; outputs: { "onConnect": "onConnect"; }; }, { directive: typeof i2.ChangesControllerDirective; inputs: {}; outputs: { "onNodesChange": "onNodesChange"; "onNodesChange.position": "onNodesChange.position"; "onNodesChange.position.single": "onNodesChange.position.single"; "onNodesChange.position.many": "onNodesChange.position.many"; "onNodesChange.add": "onNodesChange.add"; "onNodesChange.add.single": "onNodesChange.add.single"; "onNodesChange.add.many": "onNodesChange.add.many"; "onNodesChange.remove": "onNodesChange.remove"; "onNodesChange.remove.single": "onNodesChange.remove.single"; "onNodesChange.remove.many": "onNodesChange.remove.many"; "onNodesChange.select": "onNodesChange.select"; "onNodesChange.select.single": "onNodesChange.select.single"; "onNodesChange.select.many": "onNodesChange.select.many"; "onEdgesChange": "onEdgesChange"; "onEdgesChange.detached": "onEdgesChange.detached"; "onEdgesChange.detached.single": "onEdgesChange.detached.single"; "onEdgesChange.detached.many": "onEdgesChange.detached.many"; "onEdgesChange.add": "onEdgesChange.add"; "onEdgesChange.add.single": "onEdgesChange.add.single"; "onEdgesChange.add.many": "onEdgesChange.add.many"; "onEdgesChange.remove": "onEdgesChange.remove"; "onEdgesChange.remove.single": "onEdgesChange.remove.single"; "onEdgesChange.remove.many": "onEdgesChange.remove.many"; "onEdgesChange.select": "onEdgesChange.select"; "onEdgesChange.select.single": "onEdgesChange.select.single"; "onEdgesChange.select.many": "onEdgesChange.select.many"; }; }]>;
     static ngAcceptInputType_connection: i3.ConnectionSettings;
 }

package/lib/vflow/directives/changes-controller.directive.d.ts

@@ -1,8 +1,8 @@
-import { EventEmitter } from '@angular/core';
-import { NodeChange } from '../types/node-change.type';
+import { NodeAddChange, NodeChange, NodePositionChange, NodeRemoveChange, NodeSelectedChange } from '../types/node-change.type';
 import { EdgeChangesService } from '../services/edge-changes.service';
 import { NodesChangeService } from '../services/node-changes.service';
-import { EdgeChange } from '../types/edge-change.type';
+import { Observable } from 'rxjs';
+import { EdgeAddChange, EdgeChange, EdgeDetachedChange, EdgeRemoveChange, EdgeSelectChange } from '../types/edge-change.type';
 import * as i0 from "@angular/core";
 export declare class ChangesControllerDirective {
     protected nodesChangeService: NodesChangeService;
@@ -10,13 +10,39 @@ export declare class ChangesControllerDirective {
     /**
      * Watch nodes change
      */
-    onNodesChange: EventEmitter<NodeChange[]>;
+    onNodesChange: Observable<NodeChange[]>;
+    onNodesChangePosition: Observable<NodePositionChange[]>;
+    onNodesChangePositionSignle: Observable<NodePositionChange>;
+    onNodesChangePositionMany: Observable<NodePositionChange[]>;
+    onNodesChangeAdd: Observable<NodeAddChange[]>;
+    onNodesChangeAddSingle: Observable<NodeAddChange>;
+    onNodesChangeAddMany: Observable<NodeAddChange[]>;
+    onNodesChangeRemove: Observable<NodeRemoveChange[]>;
+    onNodesChangeRemoveSingle: Observable<NodeRemoveChange>;
+    onNodesChangeRemoveMany: Observable<NodeRemoveChange[]>;
+    onNodesChangeSelect: Observable<NodeSelectedChange[]>;
+    onNodesChangeSelectSingle: Observable<NodeSelectedChange>;
+    onNodesChangeSelectMany: Observable<NodeSelectedChange[]>;
     /**
-     * Watch nodes change
+     * Watch edges change
      */
-    onEdgesChange: EventEmitter<EdgeChange[]>;
-    protected nodesChangeProxySubscription: import("rxjs").Subscription;
-    protected edgesChangeProxySubscription: import("rxjs").Subscription;
+    onEdgesChange: Observable<EdgeChange[]>;
+    onNodesChangeDetached: Observable<EdgeDetachedChange[]>;
+    onNodesChangeDetachedSingle: Observable<EdgeDetachedChange>;
+    onNodesChangeDetachedMany: Observable<EdgeDetachedChange[]>;
+    onEdgesChangeAdd: Observable<EdgeAddChange[]>;
+    onEdgeChangeAddSingle: Observable<EdgeAddChange>;
+    onEdgeChangeAddMany: Observable<EdgeAddChange[]>;
+    onEdgeChangeRemove: Observable<EdgeRemoveChange[]>;
+    onEdgeChangeRemoveSingle: Observable<EdgeRemoveChange>;
+    onEdgeChangeRemoveMany: Observable<EdgeRemoveChange[]>;
+    onEdgeChangeSelect: Observable<EdgeSelectChange[]>;
+    onEdgeChangeSelectSingle: Observable<EdgeSelectChange>;
+    onEdgeChangeSelectMany: Observable<EdgeSelectChange[]>;
+    private nodeChangesOfType;
+    private edgeChangesOfType;
+    private singleChange;
+    private manyChanges;
     static ɵfac: i0.ɵɵFactoryDeclaration<ChangesControllerDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ChangesControllerDirective, "[changesController]", never, {}, { "onNodesChange": "onNodesChange"; "onEdgesChange": "onEdgesChange"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ChangesControllerDirective, "[changesController]", never, {}, { "onNodesChange": "onNodesChange"; "onNodesChangePosition": "onNodesChange.position"; "onNodesChangePositionSignle": "onNodesChange.position.single"; "onNodesChangePositionMany": "onNodesChange.position.many"; "onNodesChangeAdd": "onNodesChange.add"; "onNodesChangeAddSingle": "onNodesChange.add.single"; "onNodesChangeAddMany": "onNodesChange.add.many"; "onNodesChangeRemove": "onNodesChange.remove"; "onNodesChangeRemoveSingle": "onNodesChange.remove.single"; "onNodesChangeRemoveMany": "onNodesChange.remove.many"; "onNodesChangeSelect": "onNodesChange.select"; "onNodesChangeSelectSingle": "onNodesChange.select.single"; "onNodesChangeSelectMany": "onNodesChange.select.many"; "onEdgesChange": "onEdgesChange"; "onNodesChangeDetached": "onEdgesChange.detached"; "onNodesChangeDetachedSingle": "onEdgesChange.detached.single"; "onNodesChangeDetachedMany": "onEdgesChange.detached.many"; "onEdgesChangeAdd": "onEdgesChange.add"; "onEdgeChangeAddSingle": "onEdgesChange.add.single"; "onEdgeChangeAddMany": "onEdgesChange.add.many"; "onEdgeChangeRemove": "onEdgesChange.remove"; "onEdgeChangeRemoveSingle": "onEdgesChange.remove.single"; "onEdgeChangeRemoveMany": "onEdgesChange.remove.many"; "onEdgeChangeSelect": "onEdgesChange.select"; "onEdgeChangeSelectSingle": "onEdgesChange.select.single"; "onEdgeChangeSelectMany": "onEdgesChange.select.many"; }, never, never, true, never>;
 }

package/lib/vflow/directives/pointer.directive.d.ts

@@ -0,0 +1,21 @@
+import { EventEmitter } from '@angular/core';
+import { RootPointerDirective } from './root-pointer.directive';
+import * as i0 from "@angular/core";
+export declare class PointerDirective {
+    protected hostElement: Element;
+    protected pointerMovementDirective: RootPointerDirective;
+    protected pointerOver: EventEmitter<Event>;
+    protected pointerOut: EventEmitter<Event>;
+    protected pointerStart: EventEmitter<Event>;
+    protected pointerEnd: EventEmitter<Event>;
+    protected onPointerStart(event: Event): void;
+    protected onPointerEnd(event: Event): void;
+    protected onMouseOver(event: Event): void;
+    protected onMouseOut(event: Event): void;
+    private wasPointerOver;
+    protected touchEnd: import("rxjs").Subscription;
+    protected touchOverOut: import("rxjs").Subscription;
+    private handleTouchOverAndOut;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PointerDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PointerDirective, "[pointerStart], [pointerEnd], [pointerOver], [pointerOut]", never, {}, { "pointerOver": "pointerOver"; "pointerOut": "pointerOut"; "pointerStart": "pointerStart"; "pointerEnd": "pointerEnd"; }, never, never, false, never>;
+}

package/lib/vflow/directives/root-pointer.directive.d.ts

@@ -0,0 +1,40 @@
+import { Observable } from 'rxjs';
+import * as i0 from "@angular/core";
+export declare class RootPointerDirective {
+    private host;
+    private initialTouch$;
+    mouseMovement$: Observable<{
+        x: number;
+        y: number;
+        originalEvent: MouseEvent;
+    }>;
+    touchMovement$: Observable<{
+        x: number;
+        y: number;
+        target: Element | null;
+        originalEvent: TouchEvent;
+    }>;
+    touchEnd$: Observable<{
+        x: number;
+        y: number;
+        target: Element | null;
+        originalEvent: TouchEvent;
+    }>;
+    pointerMovement$: Observable<{
+        x: number;
+        y: number;
+        originalEvent: MouseEvent;
+    } | {
+        x: number;
+        y: number;
+        target: Element | null;
+        originalEvent: TouchEvent;
+    }>;
+    /**
+     * We should know when user started a touch in order to not
+     * show old touch position when connection creation is started
+     */
+    setInitialTouch(event: TouchEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RootPointerDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<RootPointerDirective, "svg[rootPointer]", never, {}, {}, never, never, false, never>;
+}

package/lib/vflow/directives/space-point-context.directive.d.ts

@@ -2,13 +2,23 @@ import { Signal } from '@angular/core';
 import { Point } from '../interfaces/point.interface';
 import * as i0 from "@angular/core";
 export declare class SpacePointContextDirective {
+    private pointerMovementDirective;
+    private rootSvg;
+    private host;
     /**
      * Signal with current mouse position in svg space
      */
     svgCurrentSpacePoint: Signal<Point>;
-    private rootSvg;
-    private host;
-    private mouseMovement;
+    pointerMovement: Signal<{
+        x: number;
+        y: number;
+        originalEvent: MouseEvent;
+    } | {
+        x: number;
+        y: number;
+        target: Element | null;
+        originalEvent: TouchEvent;
+    } | undefined>;
     static ɵfac: i0.ɵɵFactoryDeclaration<SpacePointContextDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<SpacePointContextDirective, "g[spacePointContext]", never, {}, {}, never, never, false, never>;
 }

package/lib/vflow/interfaces/component-node-event.interface.d.ts

@@ -0,0 +1,32 @@
+import { EventEmitter } from "@angular/core";
+import { CustomNodeComponent } from "../public-components/custom-node.component";
+type EventInfo<T> = T extends EventEmitter<infer U> ? U : never;
+type EventKeys<T> = {
+    [K in keyof T]: T[K] extends EventEmitter<any> ? K : never;
+}[keyof T];
+type EventShape<T, K extends keyof T> = {
+    [P in K]: {
+        eventName: P;
+        eventPayload: EventInfo<T[P]>;
+    };
+}[K];
+type EventsFromComponent<T> = EventShape<T, EventKeys<T>>;
+/**
+ * Event of custom component node
+ *
+ * Generic accepts array of custom components and merge their event emitters for type-safe
+ * event handling
+ *
+ * @experimental
+ */
+export type ComponentNodeEvent<T extends CustomNodeComponent[]> = {
+    nodeId: string;
+} & {
+    [I in keyof T]: EventsFromComponent<T[I]>;
+}[number];
+export type AnyComponentNodeEvent = {
+    nodeId: string;
+    eventName: string;
+    eventPayload: unknown;
+};
+export {};

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

@@ -1,5 +1,7 @@
+import { Type } from "@angular/core";
 import { Point } from "./point.interface";
-export type Node<T = unknown> = SharedNode & (DefaultNode | HtmlTemplateNode<T>);
+import { CustomNodeComponent } from "../public-components/custom-node.component";
+export type Node<T = unknown> = SharedNode & (DefaultNode | HtmlTemplateNode<T> | ComponentNode<T>);
 export interface SharedNode {
     id: string;
     point: Point;
@@ -8,8 +10,14 @@ export interface SharedNode {
 export interface DefaultNode {
     type: 'default';
     text?: string;
+    width?: number;
+    height?: number;
 }
 export interface HtmlTemplateNode<T = unknown> {
     type: 'html-template';
     data?: T;
 }
+export interface ComponentNode<T = unknown> {
+    type: Type<CustomNodeComponent<T>>;
+    data?: T;
+}

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

@@ -1,10 +1,17 @@
 import { Node } from '../interfaces/node.interface';
 import { HandleModel } from './handle.model';
 import { FlowEntity } from '../interfaces/flow-entity.interface';
+import { Point } from '../interfaces/point.interface';
 export declare class NodeModel<T = unknown> implements FlowEntity {
     node: Node<T>;
+    static defaultTypeSize: {
+        width: number;
+        height: number;
+    };
     private flowSettingsService;
-    point: import("@angular/core").WritableSignal<{
+    private internalPoint$;
+    private throttledPoint$;
+    point: import("@angular/core").Signal<{
         x: number;
         y: number;
     }>;
@@ -26,5 +33,11 @@ export declare class NodeModel<T = unknown> implements FlowEntity {
     handles$: import("rxjs").Observable<HandleModel[]>;
     draggable: boolean;
     readonly magnetRadius = 20;
+    isComponentType: boolean;
+    componentTypeInputs: import("@angular/core").Signal<{
+        node: Node<T>;
+        _selected: boolean;
+    }>;
     constructor(node: Node<T>);
+    setPoint(point: Point): void;
 }

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

@@ -0,0 +1,20 @@
+import { DestroyRef, OnInit } from "@angular/core";
+import { ComponentNode, SharedNode } from '../interfaces/node.interface';
+import * as i0 from "@angular/core";
+export declare abstract class CustomNodeComponent<T = unknown> implements OnInit {
+    private eventBus;
+    protected destroyRef: DestroyRef;
+    /**
+     * Reference to node bound to this component
+     */
+    node: SharedNode & ComponentNode<T>;
+    set _selected(value: boolean);
+    /**
+     * Signal with selected state of node
+     */
+    selected: import("@angular/core").WritableSignal<boolean>;
+    ngOnInit(): void;
+    private trackEvents;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CustomNodeComponent<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CustomNodeComponent<any>, never, never, { "node": { "alias": "node"; "required": false; }; "_selected": { "alias": "_selected"; "required": false; }; }, {}, never, never, false, never>;
+}

package/lib/vflow/services/component-event-bus.service.d.ts

@@ -0,0 +1,9 @@
+import { AnyComponentNodeEvent } from '../interfaces/component-node-event.interface';
+import * as i0 from "@angular/core";
+export declare class ComponentEventBusService {
+    private _event$;
+    event$: import("rxjs").Observable<AnyComponentNodeEvent>;
+    pushEvent(event: AnyComponentNodeEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ComponentEventBusService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ComponentEventBusService>;
+}

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

@@ -5,7 +5,10 @@ import * as i0 from "@angular/core";
 export interface ViewportForSelection {
     start: ViewportState;
     end: ViewportState;
-    target: Element;
+    /**
+     * Target may not exist if viewport change made programmatically
+     */
+    target?: Element;
 }
 export declare class SelectionService {
     private static delta;

package/lib/vflow/vflow.module.d.ts

@@ -12,10 +12,12 @@ import * as i10 from "./directives/reference.directive";
 import * as i11 from "./directives/root-svg-context.directive";
 import * as i12 from "./directives/handle-size-controller.directive";
 import * as i13 from "./directives/selectable.directive";
-import * as i14 from "./directives/template.directive";
-import * as i15 from "@angular/common";
+import * as i14 from "./directives/pointer.directive";
+import * as i15 from "./directives/root-pointer.directive";
+import * as i16 from "./directives/template.directive";
+import * as i17 from "@angular/common";
 export declare class VflowModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<VflowModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<VflowModule, [typeof i1.VflowComponent, typeof i2.NodeComponent, typeof i3.EdgeComponent, typeof i4.EdgeLabelComponent, typeof i5.ConnectionComponent, typeof i6.HandleComponent, typeof i7.DefsComponent, typeof i8.SpacePointContextDirective, typeof i9.MapContextDirective, typeof i10.RootSvgReferenceDirective, typeof i11.RootSvgContextDirective, typeof i12.HandleSizeControllerDirective, typeof i13.SelectableDirective, typeof i14.NodeHtmlTemplateDirective, typeof i14.EdgeLabelHtmlTemplateDirective, typeof i14.EdgeTemplateDirective, typeof i14.ConnectionTemplateDirective, typeof i14.HandleTemplateDirective], [typeof i15.CommonModule], [typeof i1.VflowComponent, typeof i6.HandleComponent, typeof i13.SelectableDirective, typeof i14.NodeHtmlTemplateDirective, typeof i14.EdgeLabelHtmlTemplateDirective, typeof i14.EdgeTemplateDirective, typeof i14.ConnectionTemplateDirective, typeof i14.HandleTemplateDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<VflowModule, [typeof i1.VflowComponent, typeof i2.NodeComponent, typeof i3.EdgeComponent, typeof i4.EdgeLabelComponent, typeof i5.ConnectionComponent, typeof i6.HandleComponent, typeof i7.DefsComponent, typeof i8.SpacePointContextDirective, typeof i9.MapContextDirective, typeof i10.RootSvgReferenceDirective, typeof i11.RootSvgContextDirective, typeof i12.HandleSizeControllerDirective, typeof i13.SelectableDirective, typeof i14.PointerDirective, typeof i15.RootPointerDirective, typeof i16.NodeHtmlTemplateDirective, typeof i16.EdgeLabelHtmlTemplateDirective, typeof i16.EdgeTemplateDirective, typeof i16.ConnectionTemplateDirective, typeof i16.HandleTemplateDirective], [typeof i17.CommonModule], [typeof i1.VflowComponent, typeof i6.HandleComponent, typeof i13.SelectableDirective, typeof i16.NodeHtmlTemplateDirective, typeof i16.EdgeLabelHtmlTemplateDirective, typeof i16.EdgeTemplateDirective, typeof i16.ConnectionTemplateDirective, typeof i16.HandleTemplateDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<VflowModule>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ngx-vflow",
-  "version": "0.4.0",
+  "version": "0.6.0",
   "license": "MIT",
   "homepage": "https://www.ngx-vflow.org/",
   "author": "Artem Mangilev",

package/public-api.d.ts

@@ -9,11 +9,13 @@ export * from './lib/vflow/interfaces/connection-settings.interface';
 export * from './lib/vflow/interfaces/handle-positions.interface';
 export * from './lib/vflow/interfaces/marker.interface';
 export { ViewportState } from './lib/vflow/interfaces/viewport.interface';
+export * from './lib/vflow/interfaces/component-node-event.interface';
 export * from './lib/vflow/types/node-change.type';
 export * from './lib/vflow/types/edge-change.type';
 export * from './lib/vflow/types/position.type';
 export * from './lib/vflow/components/vflow/vflow.component';
 export * from './lib/vflow/components/handle/handle.component';
+export * from './lib/vflow/public-components/custom-node.component';
 export * from './lib/vflow/directives/template.directive';
 export * from './lib/vflow/directives/connection-controller.directive';
 export * from './lib/vflow/directives/changes-controller.directive';