feat(react): Support Mutiple useOnSelectionChange Hook subscribers

packages/react/src/components/SelectionListener/index.tsx

@@ -33,7 +33,7 @@ const SelectionListener = memo(({ onSelectionChange }: SelectionListenerProps) =
   useEffect(() => {
     const params = { nodes: selectedNodes, edges: selectedEdges };
     onSelectionChange?.(params);
-    store.getState().onSelectionChange?.(params);
+    store.getState().onSelectionChange.forEach((fn) => fn(params));
   }, [selectedNodes, selectedEdges, onSelectionChange]);
 
   return null;

packages/react/src/hooks/useOnSelectionChange.ts

@@ -4,14 +4,19 @@ import { useStoreApi } from './useStore';
 import type { OnSelectionChangeFunc } from '../types';
 
 export type UseOnSelectionChangeOptions = {
-  onChange?: OnSelectionChangeFunc;
+  onChange: OnSelectionChangeFunc;
 };
 
 function useOnSelectionChange({ onChange }: UseOnSelectionChangeOptions) {
   const store = useStoreApi();
 
   useEffect(() => {
-    store.setState({ onSelectionChange: onChange });
+    const addedOnSelectionChange = [...store.getState().onSelectionChange, onChange];
+    store.setState({ onSelectionChange: addedOnSelectionChange });
+    return () => {
+      const removedOnSelectionChange = store.getState().onSelectionChange.filter((fn) => fn !== onChange);
+      store.setState({ onSelectionChange: removedOnSelectionChange });
+    };
   }, [onChange]);
 }
 

packages/react/src/store/initialState.ts

@@ -92,6 +92,7 @@ const getInitialState = ({
     connectionRadius: 20,
     onError: () => null,
     isValidConnection: undefined,
+    onSelectionChange: [],
 
     lib: 'react',
   };

packages/react/src/types/store.ts

@@ -123,8 +123,8 @@ export type ReactFlowStore = {
   onViewportChangeStart?: OnViewportChange;
   onViewportChange?: OnViewportChange;
   onViewportChangeEnd?: OnViewportChange;
-
-  onSelectionChange?: OnSelectionChangeFunc;
+  
+  onSelectionChange: OnSelectionChangeFunc[];
 
   ariaLiveMessage: string;
   autoPanOnConnect: boolean;