diff --git a/src/container/FlowRenderer/index.tsx b/src/container/FlowRenderer/index.tsx index da3f8e1b..b59f295e 100644 --- a/src/container/FlowRenderer/index.tsx +++ b/src/container/FlowRenderer/index.tsx @@ -12,15 +12,15 @@ import NodesSelection from '../../components/NodesSelection'; interface FlowRendererProps extends Omit< - GraphViewProps, - | 'elements' - | 'snapToGrid' - | 'nodeTypes' - | 'edgeTypes' - | 'snapGrid' - | 'connectionLineType' - | 'arrowHeadColor' - | 'onlyRenderVisibleNodes' + GraphViewProps, + | 'elements' + | 'snapToGrid' + | 'nodeTypes' + | 'edgeTypes' + | 'snapGrid' + | 'connectionLineType' + | 'arrowHeadColor' + | 'onlyRenderVisibleNodes' > { children: ReactNode; } @@ -48,11 +48,12 @@ const FlowRenderer = ({ onSelectionContextMenu, }: FlowRendererProps) => { const zoomPane = useRef(null); + const rendererNode = useRef(null); const unsetNodesSelection = useStoreActions((actions) => actions.unsetNodesSelection); const nodesSelectionActive = useStoreState((state) => state.nodesSelectionActive); const selectionKeyPressed = useKeyPress(selectionKeyCode); - useResizeHandler(zoomPane); + useResizeHandler(rendererNode); useGlobalKeyHandler({ onElementsRemove, deleteKeyCode }); useD3Zoom({ @@ -92,7 +93,7 @@ const FlowRenderer = ({ ); return ( -
+
{children} {nodesSelectionActive && ( @@ -103,7 +104,13 @@ const FlowRenderer = ({ onSelectionContextMenu={onSelectionContextMenu} /> )} -
+
); };