refactor(lib): forward ref closes #1050

src/container/ReactFlow/index.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo, CSSProperties, HTMLAttributes, MouseEvent, WheelEvent } from 'react';
+import React, { useMemo, CSSProperties, HTMLAttributes, MouseEvent, WheelEvent, forwardRef } from 'react';
 import cc from 'classcat';
 
 import GraphView from '../GraphView';
@@ -119,7 +119,11 @@ export interface ReactFlowProps extends Omit<HTMLAttributes<HTMLDivElement>, 'on
   edgeTypesId?: string;
 }
 
-const ReactFlow = ({
+export type ReactFlowRefType = HTMLDivElement;
+
+const ReactFlow = forwardRef<ReactFlowRefType, ReactFlowProps>(
+  (
+    {
       elements = [],
       className,
       nodeTypes = defaultNodeTypes,
@@ -190,13 +194,15 @@ const ReactFlow = ({
       nodeTypesId = '1',
       edgeTypesId = '1',
       ...rest
-}: ReactFlowProps) => {
+    },
+    ref
+  ) => {
     const nodeTypesParsed = useMemo(() => createNodeTypes(nodeTypes), [nodeTypesId]);
     const edgeTypesParsed = useMemo(() => createEdgeTypes(edgeTypes), [edgeTypesId]);
     const reactFlowClasses = cc(['react-flow', className]);
 
     return (
-    <div {...rest} className={reactFlowClasses}>
+      <div {...rest} ref={ref} className={reactFlowClasses}>
         <Wrapper>
           <GraphView
             onLoad={onLoad}
@@ -269,7 +275,8 @@ const ReactFlow = ({
         </Wrapper>
       </div>
     );
-};
+  }
+);
 
 ReactFlow.displayName = 'ReactFlow';