ngx-reactflow - npm Package Compare versions

Comparing version 1.0.23 to 1.1.0

package.json

 {
   "name": "ngx-reactflow",
-  "version": "1.0.23",
+  "version": "1.1.0",
   "repository": {
@@ -23,2 +23,3 @@ "url": "https://github.com/knackstedt/dotglitch-ngx/tree/main/packages/reactflow"
   "peerDependencies": {
+    "@dotglitch/ngx-common": ">=1.1.40",
     "@angular/common": ">=15.0.0",
@@ -34,7 +35,3 @@ "@angular/core": ">=15.0.0",
   "sideEffects": false,
-  "module": "fesm2015/ngx-reactflow.mjs",
-  "es2020": "fesm2020/ngx-reactflow.mjs",
-  "esm2020": "esm2020/ngx-reactflow.mjs",
-  "fesm2020": "fesm2020/ngx-reactflow.mjs",
-  "fesm2015": "fesm2015/ngx-reactflow.mjs",
+  "module": "fesm2022/ngx-reactflow.mjs",
   "typings": "index.d.ts",
@@ -47,9 +44,7 @@ "exports": {
       "types": "./index.d.ts",
-      "esm2020": "./esm2020/ngx-reactflow.mjs",
-      "es2020": "./fesm2020/ngx-reactflow.mjs",
-      "es2015": "./fesm2015/ngx-reactflow.mjs",
-      "node": "./fesm2015/ngx-reactflow.mjs",
-      "default": "./fesm2020/ngx-reactflow.mjs"
+      "esm2022": "./esm2022/ngx-reactflow.mjs",
+      "esm": "./esm2022/ngx-reactflow.mjs",
+      "default": "./fesm2022/ngx-reactflow.mjs"
     }
   }
 }

reactflow.component.d.ts

@@ -1,30 +0,28 @@
-import { AfterViewInit, EventEmitter, OnChanges, OnDestroy, SimpleChanges, ViewContainerRef } from '@angular/core';
+import { EventEmitter } from '@angular/core';
 import * as React from 'react';
 import { Node, Connection, NodeChange, EdgeChange, OnConnectStartParams, ReactFlowInstance, OnSelectionChangeParams } from 'reactflow';
 import { Edge, DefaultEdgeOptions, HandleType, NodeTypes, EdgeTypes, ConnectionLineType, ConnectionLineComponent, ConnectionMode, KeyCode, NodeOrigin, Viewport, CoordinateExtent, PanOnScrollMode, FitViewOptions, PanelPosition, ProOptions, OnError } from 'reactflow';
+import { ReactMagicWrapperComponent } from '@dotglitch/ngx-common';
 import * as i0 from "@angular/core";
-export declare class ReactFlowComponent implements OnChanges, OnDestroy, AfterViewInit {
-    private ngContainer;
-    private _root;
+export declare class ReactFlowComponent extends ReactMagicWrapperComponent {
+    ngReactComponent: React.FunctionComponent<any>;
     nodes?: Node<any, string | undefined>[] | undefined;
     edges?: Edge<any>[] | undefined;
-    defaultNodes?: Node<any, string | undefined>[] | undefined;
-    defaultEdges?: Edge<any>[] | undefined;
     defaultEdgeOptions?: DefaultEdgeOptions | undefined;
-    onNodeClick: EventEmitter<[MouseEvent, Node<any, string>]>;
-    onNodeDoubleClick: EventEmitter<[MouseEvent, Node<any, string>]>;
-    onNodeMouseEnter: EventEmitter<[MouseEvent, Node<any, string>]>;
-    onNodeMouseMove: EventEmitter<[MouseEvent, Node<any, string>]>;
-    onNodeMouseLeave: EventEmitter<[MouseEvent, Node<any, string>]>;
-    onNodeContextMenu: EventEmitter<[MouseEvent, Node<any, string>]>;
-    onNodeDragStart: EventEmitter<[MouseEvent, Node<any, string>, Node<any, string>[]]>;
-    onNodeDrag: EventEmitter<[MouseEvent, Node<any, string>, Node<any, string>[]]>;
-    onNodeDragStop: EventEmitter<[MouseEvent, Node<any, string>, Node<any, string>[]]>;
-    onEdgeClick: EventEmitter<[MouseEvent, Node<any, string>]>;
+    onNodeClick: EventEmitter<[MouseEvent, Node]>;
+    onNodeDoubleClick: EventEmitter<[MouseEvent, Node]>;
+    onNodeMouseEnter: EventEmitter<[MouseEvent, Node]>;
+    onNodeMouseMove: EventEmitter<[MouseEvent, Node]>;
+    onNodeMouseLeave: EventEmitter<[MouseEvent, Node]>;
+    onNodeContextMenu: EventEmitter<[MouseEvent, Node]>;
+    onNodeDragStart: EventEmitter<[MouseEvent, Node, Node[]]>;
+    onNodeDrag: EventEmitter<[MouseEvent, Node, Node[]]>;
+    onNodeDragStop: EventEmitter<[MouseEvent, Node, Node[]]>;
+    onEdgeClick: EventEmitter<[MouseEvent, Node]>;
     onEdgeUpdate: EventEmitter<[any, Connection]>;
-    onEdgeContextMenu: EventEmitter<[MouseEvent, Edge<any>]>;
-    onEdgeMouseEnter: EventEmitter<[MouseEvent, Edge<any>]>;
-    onEdgeMouseMove: EventEmitter<[MouseEvent, Edge<any>]>;
-    onEdgeMouseLeave: EventEmitter<[MouseEvent, Edge<any>]>;
-    onEdgeDoubleClick: EventEmitter<[MouseEvent, Edge<any>]>;
+    onEdgeContextMenu: EventEmitter<[MouseEvent, Edge]>;
+    onEdgeMouseEnter: EventEmitter<[MouseEvent, Edge]>;
+    onEdgeMouseMove: EventEmitter<[MouseEvent, Edge]>;
+    onEdgeMouseLeave: EventEmitter<[MouseEvent, Edge]>;
+    onEdgeDoubleClick: EventEmitter<[MouseEvent, Edge]>;
     onEdgeUpdateStart: EventEmitter<[MouseEvent, Edge<any>, HandleType]>;
@@ -34,7 +32,7 @@ onEdgeUpdateEnd: EventEmitter<[MouseEvent, Edge<any>, HandleType]>;
     onEdgesChange: EventEmitter<[EdgeChange[]]>;
-    onNodesDelete: EventEmitter<[Node<any, string>[]]>;
-    onEdgesDelete: EventEmitter<[Edge<any>[]]>;
-    onSelectionDragStart: EventEmitter<[MouseEvent, Node<any, string>[]]>;
-    onSelectionDrag: EventEmitter<[MouseEvent, Node<any, string>[]]>;
-    onSelectionDragStop: EventEmitter<[MouseEvent, Node<any, string>[]]>;
+    onNodesDelete: EventEmitter<[Node[]]>;
+    onEdgesDelete: EventEmitter<[Edge[]]>;
+    onSelectionDragStart: EventEmitter<[MouseEvent, Node[]]>;
+    onSelectionDrag: EventEmitter<[MouseEvent, Node[]]>;
+    onSelectionDragStop: EventEmitter<[MouseEvent, Node[]]>;
     onSelectionStart: EventEmitter<[MouseEvent]>;
@@ -60,2 +58,3 @@ onSelectionEnd: EventEmitter<[MouseEvent]>;
     onError: EventEmitter<OnError>;
+    id?: string | undefined;
     nodeTypes?: NodeTypes | undefined;
@@ -83,3 +82,2 @@ edgeTypes?: EdgeTypes | undefined;
     edgesFocusable?: boolean | undefined;
-    initNodeOrigin?: NodeOrigin | undefined;
     elementsSelectable?: boolean | undefined;
@@ -116,10 +114,4 @@ selectNodesOnDrag?: boolean | undefined;
     connectionRadius?: number | undefined;
-    constructor(ngContainer: ViewContainerRef);
-    ngOnChanges(changes: SimpleChanges): void;
-    ngAfterViewInit(): void;
-    ngOnDestroy(): void;
-    private _handleEvent;
-    private _render;
     static ɵfac: i0.ɵɵFactoryDeclaration<ReactFlowComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ReactFlowComponent, "ngx-reactflow", never, { "nodes": "nodes"; "edges": "edges"; "defaultNodes": "defaultNodes"; "defaultEdges": "defaultEdges"; "defaultEdgeOptions": "defaultEdgeOptions"; "nodeTypes": "nodeTypes"; "edgeTypes": "edgeTypes"; "connectionLineType": "connectionLineType"; "connectionLineStyle": "connectionLineStyle"; "connectionLineComponent": "connectionLineComponent"; "connectionLineContainerStyle": "connectionLineContainerStyle"; "connectionMode": "connectionMode"; "deleteKeyCode": "deleteKeyCode"; "selectionKeyCode": "selectionKeyCode"; "selectionOnDrag": "selectionOnDrag"; "selectionMode": "selectionMode"; "panActivationKeyCode": "panActivationKeyCode"; "multiSelectionKeyCode": "multiSelectionKeyCode"; "zoomActivationKeyCode": "zoomActivationKeyCode"; "snapToGrid": "snapToGrid"; "snapGrid": "snapGrid"; "onlyRenderVisibleElements": "onlyRenderVisibleElements"; "nodesDraggable": "nodesDraggable"; "nodesConnectable": "nodesConnectable"; "nodesFocusable": "nodesFocusable"; "nodeOrigin": "nodeOrigin"; "edgesFocusable": "edgesFocusable"; "initNodeOrigin": "initNodeOrigin"; "elementsSelectable": "elementsSelectable"; "selectNodesOnDrag": "selectNodesOnDrag"; "panOnDrag": "panOnDrag"; "minZoom": "minZoom"; "maxZoom": "maxZoom"; "defaultViewport": "defaultViewport"; "translateExtent": "translateExtent"; "preventScrolling": "preventScrolling"; "nodeExtent": "nodeExtent"; "defaultMarkerColor": "defaultMarkerColor"; "zoomOnScroll": "zoomOnScroll"; "zoomOnPinch": "zoomOnPinch"; "panOnScroll": "panOnScroll"; "panOnScrollSpeed": "panOnScrollSpeed"; "panOnScrollMode": "panOnScrollMode"; "zoomOnDoubleClick": "zoomOnDoubleClick"; "edgeUpdaterRadius": "edgeUpdaterRadius"; "noDragClassName": "noDragClassName"; "noWheelClassName": "noWheelClassName"; "noPanClassName": "noPanClassName"; "fitView": "fitView"; "fitViewOptions": "fitViewOptions"; "connectOnClick": "connectOnClick"; "attributionPosition": "attributionPosition"; "proOptions": "proOptions"; "elevateNodesOnSelect": "elevateNodesOnSelect"; "elevateEdgesOnSelect": "elevateEdgesOnSelect"; "disableKeyboardA11y": "disableKeyboardA11y"; "autoPanOnNodeDrag": "autoPanOnNodeDrag"; "autoPanOnConnect": "autoPanOnConnect"; "connectionRadius": "connectionRadius"; }, { "onNodeClick": "onNodeClick"; "onNodeDoubleClick": "onNodeDoubleClick"; "onNodeMouseEnter": "onNodeMouseEnter"; "onNodeMouseMove": "onNodeMouseMove"; "onNodeMouseLeave": "onNodeMouseLeave"; "onNodeContextMenu": "onNodeContextMenu"; "onNodeDragStart": "onNodeDragStart"; "onNodeDrag": "onNodeDrag"; "onNodeDragStop": "onNodeDragStop"; "onEdgeClick": "onEdgeClick"; "onEdgeUpdate": "onEdgeUpdate"; "onEdgeContextMenu": "onEdgeContextMenu"; "onEdgeMouseEnter": "onEdgeMouseEnter"; "onEdgeMouseMove": "onEdgeMouseMove"; "onEdgeMouseLeave": "onEdgeMouseLeave"; "onEdgeDoubleClick": "onEdgeDoubleClick"; "onEdgeUpdateStart": "onEdgeUpdateStart"; "onEdgeUpdateEnd": "onEdgeUpdateEnd"; "onNodesChange": "onNodesChange"; "onEdgesChange": "onEdgesChange"; "onNodesDelete": "onNodesDelete"; "onEdgesDelete": "onEdgesDelete"; "onSelectionDragStart": "onSelectionDragStart"; "onSelectionDrag": "onSelectionDrag"; "onSelectionDragStop": "onSelectionDragStop"; "onSelectionStart": "onSelectionStart"; "onSelectionEnd": "onSelectionEnd"; "onSelectionContextMenu": "onSelectionContextMenu"; "onConnect": "onConnect"; "onConnectStart": "onConnectStart"; "onConnectEnd": "onConnectEnd"; "onClickConnectStart": "onClickConnectStart"; "onClickConnectEnd": "onClickConnectEnd"; "onInit": "onInit"; "onMove": "onMove"; "onMoveStart": "onMoveStart"; "onMoveEnd": "onMoveEnd"; "onSelectionChange": "onSelectionChange"; "onPaneScroll": "onPaneScroll"; "onPaneClick": "onPaneClick"; "onPaneContextMenu": "onPaneContextMenu"; "onPaneMouseEnter": "onPaneMouseEnter"; "onPaneMouseMove": "onPaneMouseMove"; "onPaneMouseLeave": "onPaneMouseLeave"; "onError": "onError"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ReactFlowComponent, "ngx-reactflow", never, { "nodes": { "alias": "nodes"; "required": false; }; "edges": { "alias": "edges"; "required": false; }; "defaultEdgeOptions": { "alias": "defaultEdgeOptions"; "required": false; }; "id": { "alias": "id"; "required": false; }; "nodeTypes": { "alias": "nodeTypes"; "required": false; }; "edgeTypes": { "alias": "edgeTypes"; "required": false; }; "connectionLineType": { "alias": "connectionLineType"; "required": false; }; "connectionLineStyle": { "alias": "connectionLineStyle"; "required": false; }; "connectionLineComponent": { "alias": "connectionLineComponent"; "required": false; }; "connectionLineContainerStyle": { "alias": "connectionLineContainerStyle"; "required": false; }; "connectionMode": { "alias": "connectionMode"; "required": false; }; "deleteKeyCode": { "alias": "deleteKeyCode"; "required": false; }; "selectionKeyCode": { "alias": "selectionKeyCode"; "required": false; }; "selectionOnDrag": { "alias": "selectionOnDrag"; "required": false; }; "selectionMode": { "alias": "selectionMode"; "required": false; }; "panActivationKeyCode": { "alias": "panActivationKeyCode"; "required": false; }; "multiSelectionKeyCode": { "alias": "multiSelectionKeyCode"; "required": false; }; "zoomActivationKeyCode": { "alias": "zoomActivationKeyCode"; "required": false; }; "snapToGrid": { "alias": "snapToGrid"; "required": false; }; "snapGrid": { "alias": "snapGrid"; "required": false; }; "onlyRenderVisibleElements": { "alias": "onlyRenderVisibleElements"; "required": false; }; "nodesDraggable": { "alias": "nodesDraggable"; "required": false; }; "nodesConnectable": { "alias": "nodesConnectable"; "required": false; }; "nodesFocusable": { "alias": "nodesFocusable"; "required": false; }; "nodeOrigin": { "alias": "nodeOrigin"; "required": false; }; "edgesFocusable": { "alias": "edgesFocusable"; "required": false; }; "elementsSelectable": { "alias": "elementsSelectable"; "required": false; }; "selectNodesOnDrag": { "alias": "selectNodesOnDrag"; "required": false; }; "panOnDrag": { "alias": "panOnDrag"; "required": false; }; "minZoom": { "alias": "minZoom"; "required": false; }; "maxZoom": { "alias": "maxZoom"; "required": false; }; "defaultViewport": { "alias": "defaultViewport"; "required": false; }; "translateExtent": { "alias": "translateExtent"; "required": false; }; "preventScrolling": { "alias": "preventScrolling"; "required": false; }; "nodeExtent": { "alias": "nodeExtent"; "required": false; }; "defaultMarkerColor": { "alias": "defaultMarkerColor"; "required": false; }; "zoomOnScroll": { "alias": "zoomOnScroll"; "required": false; }; "zoomOnPinch": { "alias": "zoomOnPinch"; "required": false; }; "panOnScroll": { "alias": "panOnScroll"; "required": false; }; "panOnScrollSpeed": { "alias": "panOnScrollSpeed"; "required": false; }; "panOnScrollMode": { "alias": "panOnScrollMode"; "required": false; }; "zoomOnDoubleClick": { "alias": "zoomOnDoubleClick"; "required": false; }; "edgeUpdaterRadius": { "alias": "edgeUpdaterRadius"; "required": false; }; "noDragClassName": { "alias": "noDragClassName"; "required": false; }; "noWheelClassName": { "alias": "noWheelClassName"; "required": false; }; "noPanClassName": { "alias": "noPanClassName"; "required": false; }; "fitView": { "alias": "fitView"; "required": false; }; "fitViewOptions": { "alias": "fitViewOptions"; "required": false; }; "connectOnClick": { "alias": "connectOnClick"; "required": false; }; "attributionPosition": { "alias": "attributionPosition"; "required": false; }; "proOptions": { "alias": "proOptions"; "required": false; }; "elevateNodesOnSelect": { "alias": "elevateNodesOnSelect"; "required": false; }; "elevateEdgesOnSelect": { "alias": "elevateEdgesOnSelect"; "required": false; }; "disableKeyboardA11y": { "alias": "disableKeyboardA11y"; "required": false; }; "autoPanOnNodeDrag": { "alias": "autoPanOnNodeDrag"; "required": false; }; "autoPanOnConnect": { "alias": "autoPanOnConnect"; "required": false; }; "connectionRadius": { "alias": "connectionRadius"; "required": false; }; }, { "onNodeClick": "onNodeClick"; "onNodeDoubleClick": "onNodeDoubleClick"; "onNodeMouseEnter": "onNodeMouseEnter"; "onNodeMouseMove": "onNodeMouseMove"; "onNodeMouseLeave": "onNodeMouseLeave"; "onNodeContextMenu": "onNodeContextMenu"; "onNodeDragStart": "onNodeDragStart"; "onNodeDrag": "onNodeDrag"; "onNodeDragStop": "onNodeDragStop"; "onEdgeClick": "onEdgeClick"; "onEdgeUpdate": "onEdgeUpdate"; "onEdgeContextMenu": "onEdgeContextMenu"; "onEdgeMouseEnter": "onEdgeMouseEnter"; "onEdgeMouseMove": "onEdgeMouseMove"; "onEdgeMouseLeave": "onEdgeMouseLeave"; "onEdgeDoubleClick": "onEdgeDoubleClick"; "onEdgeUpdateStart": "onEdgeUpdateStart"; "onEdgeUpdateEnd": "onEdgeUpdateEnd"; "onNodesChange": "onNodesChange"; "onEdgesChange": "onEdgesChange"; "onNodesDelete": "onNodesDelete"; "onEdgesDelete": "onEdgesDelete"; "onSelectionDragStart": "onSelectionDragStart"; "onSelectionDrag": "onSelectionDrag"; "onSelectionDragStop": "onSelectionDragStop"; "onSelectionStart": "onSelectionStart"; "onSelectionEnd": "onSelectionEnd"; "onSelectionContextMenu": "onSelectionContextMenu"; "onConnect": "onConnect"; "onConnectStart": "onConnectStart"; "onConnectEnd": "onConnectEnd"; "onClickConnectStart": "onClickConnectStart"; "onClickConnectEnd": "onClickConnectEnd"; "onInit": "onInit"; "onMove": "onMove"; "onMoveStart": "onMoveStart"; "onMoveEnd": "onMoveEnd"; "onSelectionChange": "onSelectionChange"; "onPaneScroll": "onPaneScroll"; "onPaneClick": "onPaneClick"; "onPaneContextMenu": "onPaneContextMenu"; "onPaneMouseEnter": "onPaneMouseEnter"; "onPaneMouseMove": "onPaneMouseMove"; "onPaneMouseLeave": "onPaneMouseLeave"; "onError": "onError"; }, never, never, true, never>;
 }

reactflow.d.ts

@@ -1,111 +0,6 @@
-import * as React from 'react';
-import { FunctionComponent, ReactEventHandler } from 'react';
-import { Node, Edge, ConnectionLineComponent, ConnectionLineType, ConnectionMode, CoordinateExtent, DefaultEdgeOptions, EdgeMouseHandler, EdgeTypes, FitViewOptions, HandleType, KeyCode, NodeDragHandler, NodeMouseHandler, NodeOrigin, NodeTypes, OnConnect, OnConnectEnd, OnConnectStart, OnEdgesChange, OnEdgesDelete, OnEdgeUpdateFunc, OnError, OnInit, OnMove, OnNodesChange, OnNodesDelete, OnSelectionChangeFunc, PanelPosition, PanOnScrollMode, ProOptions, SelectionDragHandler, Viewport } from 'reactflow';
-export interface IReactFlowProps {
-    props: {
-        nodes?: Node<any, string | undefined>[] | undefined;
-        edges?: Edge<any>[] | undefined;
-        defaultNodes?: Node<any, string | undefined>[] | undefined;
-        defaultEdges?: Edge<any>[] | undefined;
-        defaultEdgeOptions?: DefaultEdgeOptions | undefined;
-        onNodeClick?: NodeMouseHandler | undefined;
-        onNodeDoubleClick?: NodeMouseHandler | undefined;
-        onNodeMouseEnter?: NodeMouseHandler | undefined;
-        onNodeMouseMove?: NodeMouseHandler | undefined;
-        onNodeMouseLeave?: NodeMouseHandler | undefined;
-        onNodeContextMenu?: NodeMouseHandler | undefined;
-        onNodeDragStart?: NodeDragHandler | undefined;
-        onNodeDrag?: NodeDragHandler | undefined;
-        onNodeDragStop?: NodeDragHandler | undefined;
-        onEdgeClick?: ((event: import("react").MouseEvent<Element, MouseEvent>, node: Edge<any>) => void) | undefined;
-        onEdgeUpdate?: OnEdgeUpdateFunc<any> | undefined;
-        onEdgeContextMenu?: EdgeMouseHandler | undefined;
-        onEdgeMouseEnter?: EdgeMouseHandler | undefined;
-        onEdgeMouseMove?: EdgeMouseHandler | undefined;
-        onEdgeMouseLeave?: EdgeMouseHandler | undefined;
-        onEdgeDoubleClick?: EdgeMouseHandler | undefined;
-        onEdgeUpdateStart?: ((event: import("react").MouseEvent<Element, MouseEvent>, edge: Edge<any>, handleType: HandleType) => void) | undefined;
-        onEdgeUpdateEnd?: ((event: MouseEvent | TouchEvent, edge: Edge<any>, handleType: HandleType) => void) | undefined;
-        onNodesChange?: OnNodesChange | undefined;
-        onEdgesChange?: OnEdgesChange | undefined;
-        onNodesDelete?: OnNodesDelete | undefined;
-        onEdgesDelete?: OnEdgesDelete | undefined;
-        onSelectionDragStart?: SelectionDragHandler | undefined;
-        onSelectionDrag?: SelectionDragHandler | undefined;
-        onSelectionDragStop?: SelectionDragHandler | undefined;
-        onSelectionStart?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
-        onSelectionEnd?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
-        onSelectionContextMenu?: ((event: import("react").MouseEvent<Element, MouseEvent>, nodes: Node<any, string | undefined>[]) => void) | undefined;
-        onConnect?: OnConnect | undefined;
-        onConnectStart?: OnConnectStart | undefined;
-        onConnectEnd?: OnConnectEnd | undefined;
-        onClickConnectStart?: OnConnectStart | undefined;
-        onClickConnectEnd?: OnConnectEnd | undefined;
-        onInit?: OnInit<any, any> | undefined;
-        onMove?: OnMove | undefined;
-        onMoveStart?: OnMove | undefined;
-        onMoveEnd?: OnMove | undefined;
-        onSelectionChange?: OnSelectionChangeFunc | undefined;
-        onPaneScroll?: ((event?: import("react").WheelEvent<Element> | undefined) => void) | undefined;
-        onPaneClick?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
-        onPaneContextMenu?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
-        onPaneMouseEnter?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
-        onPaneMouseMove?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
-        onPaneMouseLeave?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
-        nodeTypes?: NodeTypes | undefined;
-        edgeTypes?: EdgeTypes | undefined;
-        connectionLineType?: ConnectionLineType | undefined;
-        connectionLineStyle?: React.CSSProperties | undefined;
-        connectionLineComponent?: ConnectionLineComponent | undefined;
-        connectionLineContainerStyle?: React.CSSProperties | undefined;
-        connectionMode?: ConnectionMode | undefined;
-        deleteKeyCode?: KeyCode | null | undefined;
-        selectionKeyCode?: KeyCode | null | undefined;
-        selectionOnDrag?: boolean | undefined;
-        selectionMode?: SelectionMode | undefined;
-        panActivationKeyCode?: KeyCode | null | undefined;
-        multiSelectionKeyCode?: KeyCode | null | undefined;
-        zoomActivationKeyCode?: KeyCode | null | undefined;
-        snapToGrid?: boolean | undefined;
-        snapGrid?: [number, number] | undefined;
-        onlyRenderVisibleElements?: boolean | undefined;
-        nodesDraggable?: boolean | undefined;
-        nodesConnectable?: boolean | undefined;
-        nodesFocusable?: boolean | undefined;
-        nodeOrigin?: NodeOrigin | undefined;
-        edgesFocusable?: boolean | undefined;
-        elementsSelectable?: boolean | undefined;
-        selectNodesOnDrag?: boolean | undefined;
-        panOnDrag?: boolean | number[] | undefined;
-        minZoom?: number | undefined;
-        maxZoom?: number | undefined;
-        defaultViewport?: Viewport | undefined;
-        translateExtent?: CoordinateExtent | undefined;
-        preventScrolling?: boolean | undefined;
-        nodeExtent?: CoordinateExtent | undefined;
-        defaultMarkerColor?: string | undefined;
-        zoomOnScroll?: boolean | undefined;
-        zoomOnPinch?: boolean | undefined;
-        panOnScroll?: boolean | undefined;
-        panOnScrollSpeed?: number | undefined;
-        panOnScrollMode?: PanOnScrollMode | undefined;
-        zoomOnDoubleClick?: boolean | undefined;
-        edgeUpdaterRadius?: number | undefined;
-        noDragClassName?: string | undefined;
-        noWheelClassName?: string | undefined;
-        noPanClassName?: string | undefined;
-        fitView?: boolean | undefined;
-        fitViewOptions?: FitViewOptions | undefined;
-        connectOnClick?: boolean | undefined;
-        attributionPosition?: PanelPosition | undefined;
-        proOptions?: ProOptions | undefined;
-        elevateNodesOnSelect?: boolean | undefined;
-        elevateEdgesOnSelect?: boolean | undefined;
-        disableKeyboardA11y?: boolean | undefined;
-        autoPanOnNodeDrag?: boolean | undefined;
-        autoPanOnConnect?: boolean | undefined;
-        connectionRadius?: number | undefined;
-        onError?: ReactEventHandler<HTMLDivElement> & OnError | undefined;
-    };
-}
-export declare const ReactFlowWrappableComponent: FunctionComponent<IReactFlowProps>;
+import { FunctionComponent } from 'react';
+/**
+ * ReactFlowProvider fixes some internal context
+ * issues with ReactFlow
+ */
+export declare const ReactFlowWrappableComponent: FunctionComponent<any>;

README.md

@@ -0,7 +1,8 @@
+> :warning: This library has been moved to [ngx-xyflow](https://www.npmjs.com/package/ngx-xyflow)!
 
 # Reactflow wrapper for Angular
 
-[![npm](https://img.shields.io/npm/v/@dotglitch/dotglitch-ngx.svg)](https://www.npmjs.com/package/@dotglitch/dotglitch-ngx)
-[![npm](https://img.shields.io/npm/dm/@dotglitch/dotglitch-ngx.svg)](https://www.npmjs.com/package/@dotglitch/dotglitch-ngx)
-[![npm downloads](https://img.shields.io/npm/dt/@dotglitch/dotglitch-ngx.svg)](https://npmjs.org/@dotglitch/dotglitch-ngx)
+[![npm](https://img.shields.io/npm/v/ngx-reactflow.svg)](https://www.npmjs.com/package/ngx-reactflow)
+[![npm](https://img.shields.io/npm/dm/ngx-reactflow.svg)](https://www.npmjs.com/package/ngx-reactflow)
+[![npm downloads](https://img.shields.io/npm/dt/ngx-reactflow.svg)](https://npmjs.org/ngx-reactflow)
 [![GitHub stars](https://img.shields.io/github/stars/knackstedt/dotglitch-ngx.svg?label=GitHub%20Stars&style=flat)](https://github.com/knackstedt/dotglitch-ngx)
@@ -13,5 +14,2 @@
 
-| :warning:        This library is still in alpha stages, some things may not work correctly.   |
-|-----------------------------------------|
-| If you find any bugs, please open a [PR](https://github.com/knackstedt/dotglitch-ngx/issues). |
 
@@ -29,3 +27,5 @@ ## Installation
 ```
-    
+
+> You will also want to set `useDefineForClassFields: false` in your tsconfig.json
+
 ## Getting started
@@ -54,1 +54,4 @@
 
+
+## Using Custom nodes
+

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

55

5.77%

Number of low supply chain risk alerts

5

-28.57%

Worsened metrics

Total package byte prevSize

113786

-51.33%

Dependency count

7

16.67%

Number of package files

12

-25%

Lines of code

902

-57.37%

Number of medium supply chain risk alerts

1

Infinity%

No dependency changes