Fix(react-menu-grid-preview): Merge onKeyDown handlers (#35216)

Author: adamsamec

change/@fluentui-react-menu-grid-preview-ec566fa8-0636-4e57-b294-361f35f21698.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Merge onKeyDown handlers for MenuGrid component",
+  "packageName": "@fluentui/react-menu-grid-preview",
+  "email": "adam.samec@gmail.com",
+  "dependentChangeType": "patch"
+}

packages/react-components/react-menu-grid-preview/library/src/components/MenuGrid/useMenuGrid.ts

@@ -1,5 +1,11 @@
 import * as React from 'react';
-import { useMergedRefs, getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
+import {
+  useMergedRefs,
+  useEventCallback,
+  mergeCallbacks,
+  getIntrinsicElementProps,
+  slot,
+} from '@fluentui/react-utilities';
 
 import { useTableCompositeNavigation } from '@fluentui/react-table';
 import type { MenuGridProps, MenuGridState } from './MenuGrid.types';
@@ -13,6 +19,7 @@ export const useMenuGrid_unstable = (props: MenuGridProps, ref: React.Ref<HTMLDi
   const validateNestingRef = useValidateNesting('MenuGrid');
   const triggerId = useMenuContext_unstable(context => context.triggerId);
   const { tableRowTabsterAttribute, tableTabsterAttribute, onTableKeyDown } = useTableCompositeNavigation();
+  const onKeyDown = useEventCallback(mergeCallbacks(props.onKeyDown, onTableKeyDown));
 
   return {
     components: {
@@ -23,9 +30,9 @@ export const useMenuGrid_unstable = (props: MenuGridProps, ref: React.Ref<HTMLDi
         ref: useMergedRefs(ref, validateNestingRef),
         role: 'grid',
         'aria-labelledby': triggerId,
-        onKeyDown: onTableKeyDown,
         ...tableTabsterAttribute,
         ...props,
+        onKeyDown,
       }),
       { elementType: 'div' },
     ),