update actionMenu export (#3179)

Author: LFDanLu

packages/@react-spectrum/menu/src/ActionMenu.tsx

@@ -18,7 +18,7 @@ import intlMessages from '../intl/*.json';
 import {Menu} from './Menu';
 import {MenuTrigger} from './MenuTrigger';
 import More from '@spectrum-icons/workflow/More';
-import React from 'react';
+import React, {forwardRef, ReactElement} from 'react';
 import {SpectrumActionMenuProps} from '@react-types/menu';
 import {useMessageFormatter} from '@react-aria/i18n';
 import {useSlotProps} from '@react-spectrum/utils';
@@ -57,5 +57,5 @@ function ActionMenu<T extends object>(props: SpectrumActionMenuProps<T>, ref: Fo
 /**
  * ActionMenu combines an ActionButton with a Menu for simple "more actions" use cases.
  */
-let _ActionMenu = React.forwardRef(ActionMenu);
+const _ActionMenu = forwardRef(ActionMenu) as <T>(props: SpectrumActionMenuProps<T> & {ref?: FocusableRef<HTMLButtonElement>}) => ReactElement;
 export {_ActionMenu as ActionMenu};

packages/@react-spectrum/menu/stories/ActionMenu.stories.tsx

@@ -170,3 +170,21 @@ export const WithTooltip = () => (
     <Tooltip>Actions</Tooltip>
   </TooltipTrigger>
 );
+
+export const Dynamic = () => {
+  const items = [
+    {key: 'a', label: 'Cut'},
+    {key: 'a', label: 'Copy'},
+    {key: 'a', label: 'Paste'}
+  ];
+
+  return (
+    <ActionMenu items={items}>
+      {(item) => (
+        <Item key={item.key}>
+          {item.label}
+        </Item>
+      )}
+    </ActionMenu>
+  );
+};