ngx-vflow 0.1.7 → 0.1.9

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

@@ -1,8 +1,7 @@
-import { Injector, Signal } from '@angular/core';
+import { Signal } from '@angular/core';
 import { Node } from '../../interfaces/node.interface';
 import { MapContextDirective } from '../../directives/map-context.directive';
 import { NodeModel } from '../../models/node.model';
-import { ViewportService } from '../../services/viewport.service';
 import { Edge } from '../../interfaces/edge.interface';
 import { EdgeModel } from '../../models/edge.model';
 import { ConnectionTemplateDirective, EdgeLabelHtmlTemplateDirective, EdgeTemplateDirective, HandleTemplateDirective, NodeHtmlTemplateDirective } from '../../directives/template.directive';
@@ -10,10 +9,7 @@ import { HandlePositions } from '../../interfaces/handle-positions.interface';
 import { FlowModel } from '../../models/flow.model';
 import { Point } from '../../interfaces/point.interface';
 import { ViewportState } from '../../interfaces/viewport.interface';
-import { FlowEntitiesService } from '../../services/flow-entities.service';
 import { ConnectionModel } from '../../models/connection.model';
-import { NodesChangeService } from '../../services/node-changes.service';
-import { EdgeChangesService } from '../../services/edge-changes.service';
 import { NodeChange } from '../../types/node-change.type';
 import { EdgeChange } from '../../types/edge-change.type';
 import * as i0 from "@angular/core";
@@ -21,11 +17,11 @@ import * as i1 from "../../directives/connection-controller.directive";
 import * as i2 from "../../directives/changes-controller.directive";
 import * as i3 from "../../interfaces/connection-settings.interface";
 export declare class VflowComponent {
-    protected viewportService: ViewportService;
-    protected flowEntitiesService: FlowEntitiesService;
-    protected nodesChangeService: NodesChangeService;
-    protected edgesChangeService: EdgeChangesService;
-    protected injector: Injector;
+    private viewportService;
+    private flowEntitiesService;
+    private nodesChangeService;
+    private edgesChangeService;
+    private injector;
     /**
      * Size for flow view
      *
@@ -37,33 +33,99 @@ export declare class VflowComponent {
         number,
         number
     ] | 'auto');
+    /**
+     * Minimum zoom value
+     */
     minZoom: number;
+    /**
+     * Maximum zoom value
+     */
     maxZoom: number;
+    /**
+     * Object that controls flow direction.
+     *
+     * For example, if you want to archieve right to left direction
+     * then you need to pass these positions { source: 'left', target: 'right' }
+     *
+     * ! Be carefult using this field, it may depricate in future releases !
+     */
     set handlePositions(handlePositions: HandlePositions);
+    /**
+     * Background color for flow
+     */
     background: string;
+    /**
+     * Settings for connection (it renders when user tries to create edge between nodes)
+     *
+     * You need to pass `ConnectionSettings` in this input.
+     */
     set connection(connection: ConnectionModel);
     get connection(): ConnectionModel;
+    /**
+     * Nodes to render
+     */
     set nodes(newNodes: Node[]);
-    get nodeModels(): NodeModel<unknown>[];
+    protected get nodeModels(): NodeModel<unknown>[];
+    /**
+     * Edges to render
+     */
     set edges(newEdges: Edge[]);
-    get edgeModels(): EdgeModel[];
+    protected get edgeModels(): EdgeModel[];
     protected nodeHtmlDirective?: NodeHtmlTemplateDirective;
     protected edgeTemplateDirective?: EdgeTemplateDirective;
     protected edgeLabelHtmlDirective?: EdgeLabelHtmlTemplateDirective;
     protected connectionTemplateDirective?: ConnectionTemplateDirective;
     protected handleTemplateDirective?: HandleTemplateDirective;
     protected mapContext: MapContextDirective;
+    /**
+     * Signal for reading viewport change
+     */
     readonly viewport: Signal<ViewportState>;
+    /**
+     * Signal for reading nodes change
+     */
     readonly nodesChange: Signal<NodeChange[]>;
+    /**
+     * Signal to reading edges change
+     */
     readonly edgesChange: Signal<EdgeChange[]>;
-    readonly viewportChanges$: import("rxjs").Observable<ViewportState>;
+    /**
+     * Observable with viewport change
+     */
+    readonly viewportChange$: import("rxjs").Observable<ViewportState>;
+    /**
+     * Observable with nodes change
+     */
     readonly nodesChange$: import("rxjs").Observable<NodeChange[]>;
+    /**
+     * Observable with nodes change
+     */
     readonly edgesChange$: import("rxjs").Observable<EdgeChange[]>;
     protected flowModel: FlowModel;
     protected markers: Signal<Map<number, import("ngx-vflow").Marker>>;
+    /**
+     * Change viewport to specified state
+     *
+     * @param viewport viewport state
+     */
     viewportTo(viewport: ViewportState): void;
+    /**
+     * Change zoom
+     *
+     * @param zoom zoom value
+     */
     zoomTo(zoom: number): void;
+    /**
+     * Move to specified coordinate
+     *
+     * @param point point where to move
+     */
     panTo(point: Point): void;
+    /**
+     * Get node by id
+     *
+     * @param id node id
+     */
     getNode<T = unknown>(id: string): Node<T> | undefined;
     protected trackNodes(idx: number, { node }: NodeModel): string;
     protected trackEdges(idx: number, { edge }: EdgeModel): string;

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

@@ -7,7 +7,13 @@ import * as i0 from "@angular/core";
 export declare class ChangesControllerDirective {
     protected nodesChangeService: NodesChangeService;
     protected edgesChangeService: EdgeChangesService;
+    /**
+     * Watch nodes change
+     */
     onNodesChange: EventEmitter<NodeChange[]>;
+    /**
+     * Watch nodes change
+     */
     onEdgesChange: EventEmitter<EdgeChange[]>;
     protected nodesChangeProxySubscription: import("rxjs").Subscription;
     protected edgesChangeProxySubscription: import("rxjs").Subscription;

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

@@ -2,6 +2,14 @@ import { EventEmitter } from '@angular/core';
 import { Connection } from '../interfaces/connection.interface';
 import * as i0 from "@angular/core";
 export declare class ConnectionControllerDirective {
+    /**
+     * This event fires when user tries to create new Edge.
+     *
+     * `Connection` is an entity that contains data about source and target nodes.
+     *
+     * Also it's important to note, that this event only fires when connection is valid by validator function in `ConnectionSettings`,
+     * by default without passing the validator every connection concidered valid.
+     */
     onConnect: EventEmitter<Connection>;
     private statusService;
     private flowEntitiesService;

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

@@ -1,16 +1,15 @@
 import { Point } from "./point.interface";
 export type Node<T = unknown> = SharedNode & (DefaultNode | HtmlTemplateNode<T>);
-interface SharedNode {
+export interface SharedNode {
     id: string;
     point: Point;
     draggable?: boolean;
 }
-interface DefaultNode {
+export interface DefaultNode {
     type: 'default';
     text?: string;
 }
-interface HtmlTemplateNode<T = unknown> {
+export interface HtmlTemplateNode<T = unknown> {
     type: 'html-template';
     data?: T;
 }
-export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ngx-vflow",
-  "version": "0.1.7",
+  "version": "0.1.9",
   "license": "MIT",
   "peerDependencies": {
     "@angular/common": "^16.2.0 || 17.x",