feat(VirtualizedGrid): expose virtualized list ref in the virtualized grid

docs/api.md

@@ -335,6 +335,13 @@ VirtualizedGrids only support vertical orientation (vertically scrollable), but
 | `descendingArrowContainerStyle`   | `ViewStyle`                                              | For web TVs cursor handling. Style of the view which wraps the descending arrow. Hover this view will trigger the scroll.                                                                                                                                                                                                  |
 | `scrollInterval`                  | `number`                                                 | For web TVs cursor handling. Speed of the pointer scroll. It represents the interval in ms between every item scrolled. Default value is set to 100.                                                                                                                                                                       |
 
+The `SpatialNavigationVirtualizedGrid` component ref expose the following methods:
+
+| Name       | Type                      | Description                                                    |
+| ---------- | ------------------------- | -------------------------------------------------------------- |
+| `focus`    | `(index: number) => void` | Give the focus to the selected node and scroll if needed.      |
+| `scrollTo` | `(index: number) => void` | Scroll to the selected node if needed, without appyling focus. |
+
 ## Example Usage
 
 ```jsx

packages/lib/src/spatial-navigation/components/virtualizedGrid/SpatialNavigationVirtualizedGrid.tsx

@@ -11,6 +11,7 @@ import { useSpatialNavigator } from '../../context/SpatialNavigatorContext';
 import { ParentIdContext, useParentId } from '../../context/ParentIdContext';
 import { typedMemo } from '../../helpers/TypedMemo';
 import { convertToGrid } from './helpers/convertToGrid';
+import { SpatialNavigationVirtualizedGridRef } from '../../types/SpatialNavigationVirtualizedGridRef';
 
 type SpatialNavigationVirtualizedGridProps<T> = Pick<
   SpatialNavigationVirtualizedListWithScrollProps<T>,
@@ -35,6 +36,7 @@ type SpatialNavigationVirtualizedGridProps<T> = Pick<
     numberOfColumns: number;
     /** Used to modify every row style */
     rowContainerStyle?: ViewStyle;
+    ref?: React.LegacyRef<SpatialNavigationVirtualizedGridRef>;
   };
 
 export type GridRowType<T> = {
@@ -194,6 +196,7 @@ export const SpatialNavigationVirtualizedGrid = typedMemo(
     onEndReachedThresholdRowsNumber,
     nbMaxOfItems,
     rowContainerStyle,
+    ref,
     ...props
   }: SpatialNavigationVirtualizedGridProps<T>) => {
     if (header && !headerSize) throw new Error('You must provide a headerSize when using a header');
@@ -247,6 +250,7 @@ export const SpatialNavigationVirtualizedGrid = typedMemo(
 
     return (
       <SpatialNavigationVirtualizedList
+        ref={ref}
         data={gridRowsWithHeaderIfProvided}
         itemSize={itemSize}
         additionalItemsRendered={additionalRenderedRows}

packages/lib/src/spatial-navigation/components/virtualizedList/SpatialNavigationVirtualizedListWithScroll.tsx

@@ -197,12 +197,15 @@ export const SpatialNavigationVirtualizedListWithScroll = typedMemo(
         [deviceTypeRef],
       );
 
-      const scrollTo = useCallback((index: number) => {
-        if (idRef.current) {
-          const newId = idRef.current.getNthVirtualNodeID(index);
-          spatialNavigator.grabFocusDeferred(newId);
-        }
-      }, [idRef, spatialNavigator]);
+      const scrollTo = useCallback(
+        (index: number) => {
+          if (idRef.current) {
+            const newId = idRef.current.getNthVirtualNodeID(index);
+            spatialNavigator.grabFocusDeferred(newId);
+          }
+        },
+        [idRef, spatialNavigator],
+      );
 
       useImperativeHandle(
         ref,

packages/lib/src/spatial-navigation/types/SpatialNavigationVirtualizedGridRef.ts

@@ -0,0 +1,3 @@
+import { SpatialNavigationVirtualizedListRef } from './SpatialNavigationVirtualizedListRef';
+
+export type SpatialNavigationVirtualizedGridRef = SpatialNavigationVirtualizedListRef;