ngx-vflow 1.13.2 → 1.15.0

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

@@ -29,6 +29,7 @@ export declare class VflowComponent {
     private componentEventBusService;
     private keyboardService;
     private injector;
+    private flowRenderingService;
     /**
      * Size for flow view
      *
@@ -118,6 +119,7 @@ export declare class VflowComponent {
      * Signal to reading edges change
      */
     readonly edgesChange: import("@angular/core").Signal<EdgeChange[]>;
+    readonly initialized: import("@angular/core").Signal<boolean>;
     /**
      * Observable with viewport change
      */
@@ -130,6 +132,7 @@ export declare class VflowComponent {
      * Observable with edges change
      */
     readonly edgesChange$: import("rxjs").Observable<EdgeChange[]>;
+    readonly initialized$: import("rxjs").Observable<boolean>;
     protected markers: import("@angular/core").Signal<Map<number, import("ngx-vflow").Marker>>;
     protected minimap: import("@angular/core").WritableSignal<import("../../models/minimap.model").MinimapModel | null>;
     protected flowOptimization: import("@angular/core").WritableSignal<Required<Optimization>>;

package/lib/vflow/interfaces/flow-entity.interface.d.ts

@@ -1,4 +1,5 @@
-import { WritableSignal } from '@angular/core';
+import { Signal, WritableSignal } from '@angular/core';
 export interface FlowEntity {
     selected: WritableSignal<boolean>;
+    shouldLoad: Signal<boolean>;
 }

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

@@ -82,13 +82,13 @@ export interface TemplateDynamicGroupNode<T> extends SharedDynamicNode {
     data?: WritableSignal<T>;
 }
 export interface ComponentNode<T = any> extends SharedNode {
-    type: Type<CustomNodeComponent<T>>;
+    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>>;
+    type: Type<CustomDynamicNodeComponent<T>> | (() => Promise<Type<CustomDynamicNodeComponent<T>>>);
     data?: WritableSignal<T>;
     width?: WritableSignal<number>;
     height?: WritableSignal<number>;

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

@@ -22,4 +22,8 @@ export interface Optimization {
      * This should help to avoid performance issues when zooming out too much.
      */
     virtualizationZoomThreshold?: number;
+    /**
+     * The trigger for lazy loading of entities.
+     */
+    lazyLoadTrigger?: 'immediate' | 'viewport';
 }

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

@@ -10,12 +10,14 @@ export interface EdgeContext {
         markerStart: Signal<string>;
         markerEnd: Signal<string>;
         selected: Signal<boolean>;
+        shouldLoad: Signal<boolean>;
     };
 }
 export interface NodeContext {
     $implicit: {
         node: any;
         selected: Signal<boolean>;
+        shouldLoad: Signal<boolean>;
     };
 }
 export interface SvgNodeContext {
@@ -24,6 +26,7 @@ export interface SvgNodeContext {
         selected: Signal<boolean>;
         width: Signal<number>;
         height: Signal<number>;
+        shouldLoad: Signal<boolean>;
     };
 }
 export interface GroupNodeContext {
@@ -32,6 +35,7 @@ export interface GroupNodeContext {
         selected: Signal<boolean>;
         width: Signal<number>;
         height: Signal<number>;
+        shouldLoad: Signal<boolean>;
     };
 }
 export interface ConnectionContext {

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

@@ -17,6 +17,7 @@ export declare class EdgeModel implements FlowEntity, Contextable<EdgeContext> {
     floating: boolean;
     selected: import("@angular/core").WritableSignal<boolean>;
     selected$: import("rxjs").Observable<boolean>;
+    shouldLoad: import("@angular/core").Signal<boolean>;
     renderOrder: import("@angular/core").WritableSignal<number>;
     detached: import("@angular/core").Signal<boolean>;
     detached$: import("rxjs").Observable<boolean>;
@@ -42,6 +43,7 @@ export declare class EdgeModel implements FlowEntity, Contextable<EdgeContext> {
             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: {

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

@@ -15,6 +15,8 @@ export declare class NodeModel<T = unknown> implements FlowEntity, Contextable<N
     private static defaultHeight;
     private static defaultColor;
     private entitiesService;
+    private settingsService;
+    private nodeRenderingService;
     isVisible: import("@angular/core").WritableSignal<boolean>;
     point: import("@angular/core").WritableSignal<Point>;
     point$: Observable<Point>;
@@ -59,6 +61,8 @@ export declare class NodeModel<T = unknown> implements FlowEntity, Contextable<N
     dragHandlesCount: import("@angular/core").WritableSignal<number>;
     readonly magnetRadius = 20;
     isComponentType: boolean;
+    shouldLoad: import("@angular/core").Signal<boolean>;
+    componentInstance$: Observable<any>;
     text: import("@angular/core").WritableSignal<string>;
     componentTypeInputs: {
         node: Node<T> | DynamicNode<T>;

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

@@ -10,6 +10,7 @@ export declare class CustomTemplateEdgeComponent {
         markerStart: import("@angular/core").Signal<string>;
         markerEnd: import("@angular/core").Signal<string>;
         selected: import("@angular/core").Signal<boolean>;
+        shouldLoad: import("@angular/core").Signal<boolean>;
     };
     protected pull(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CustomTemplateEdgeComponent, never>;

package/lib/vflow/services/edge-rendering.service.d.ts

@@ -4,7 +4,7 @@ export declare class EdgeRenderingService {
     private flowEntitiesService;
     private flowSettingsService;
     readonly edges: import("@angular/core").Signal<EdgeModel[]>;
-    private viewportEdges;
+    readonly viewportEdges: import("@angular/core").Signal<EdgeModel[]>;
     private maxOrder;
     pull(edge: EdgeModel): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<EdgeRenderingService, never>;

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

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+export declare class FlowRenderingService {
+    private readonly nodeRenderingService;
+    private readonly edgeRenderingService;
+    private readonly flowEntitiesService;
+    private readonly settingsService;
+    flowInitialized: import("@angular/core").WritableSignal<boolean>;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<FlowRenderingService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<FlowRenderingService>;
+}

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

@@ -0,0 +1 @@
+export declare function isCallable(fn: any): boolean;

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

@@ -0,0 +1,4 @@
+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/package.json

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

package/public-api.d.ts

@@ -43,5 +43,6 @@ export { FlowEntitiesService as ɵFlowEntitiesService } from './lib/vflow/servic
 export { NodeAccessorService as ɵNodeAccessorService } from './lib/vflow/services/node-accessor.service';
 export { ViewportService as ɵViewportService } from './lib/vflow/services/viewport.service';
 export { SelectionService as ɵSelectionService } from './lib/vflow/services/selection.service';
+export { NodeRenderingService as ɵNodeRenderingService } from './lib/vflow/services/node-rendering.service';
 export { RootPointerDirective as ɵRootPointerDirective } from './lib/vflow/directives/root-pointer.directive';
 export { SpacePointContextDirective as ɵSpacePointContextDirective } from './lib/vflow/directives/space-point-context.directive';

package/testing/component-mocks/vflow-mock.component.d.ts

@@ -33,6 +33,8 @@ export declare class VflowMockComponent implements AsInterface<VflowComponent>,
     viewport: WritableSignal<ViewportState>;
     nodesChange: WritableSignal<NodeChange[]>;
     edgesChange: WritableSignal<EdgeChange[]>;
+    initialized: WritableSignal<boolean>;
+    initialized$: import("rxjs").Observable<boolean>;
     viewportChange$: import("rxjs").Observable<ViewportState>;
     nodesChange$: import("rxjs").Observable<NodeChange[]>;
     edgesChange$: import("rxjs").Observable<EdgeChange[]>;