@fluentui-react-native/menu 0.9.1 → 0.10.0

package/src/MenuPopover/MenuPopover.types.ts

@@ -7,6 +7,8 @@ export interface MenuPopoverProps extends Omit<IViewProps, 'onPress'> {}
 
 export interface MenuPopoverState {
   dismissBehaviors: DismissBehaviors[];
+  doNotTakePointerCapture: boolean;
   onDismiss: () => void;
+  setInitialFocus: boolean;
   triggerRef: React.RefObject<React.Component>;
 }

package/src/MenuPopover/useMenuPopover.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { Platform } from 'react-native';
 import { DismissBehaviors } from '@fluentui-react-native/callout';
 import { useMenuContext } from '../context/menuContext';
 import { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';
@@ -13,5 +14,10 @@ export const useMenuPopover = (_props: MenuPopoverProps): MenuPopoverState => {
     ? (['preventDismissOnKeyDown', 'preventDismissOnClickOutside'] as DismissBehaviors[])
     : undefined;
 
-  return { triggerRef, onDismiss, dismissBehaviors };
+  // Initial focus behavior differs per platform, Windows platforms move focus
+  // automatically onto first element of Callout
+  const setInitialFocus = Platform.OS === ('win32' as any) || Platform.OS === 'windows';
+  const doNotTakePointerCapture = context.openOnHover;
+
+  return { triggerRef, onDismiss, dismissBehaviors, doNotTakePointerCapture, setInitialFocus };
 };

package/src/MenuTrigger/useMenuTrigger.ts

@@ -1,6 +1,7 @@
 import { useMenuContext } from '../context/menuContext';
 import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import { MenuTriggerProps } from './MenuTrigger.types';
+import { Platform } from 'react-native';
 
 export const useMenuTrigger = (_props: MenuTriggerProps) => {
   const context = useMenuContext();
@@ -10,15 +11,26 @@ export const useMenuTrigger = (_props: MenuTriggerProps) => {
   const openOnHover = context.openOnHover;
   const triggerRef = context.triggerRef;
 
+  const delayHover = Platform.select({
+    macos: 100,
+    default: 500, // win32
+  });
+
   const onHoverIn = (e: InteractionEvent) => {
     if (openOnHover) {
       setOpen(e, true /* isOpen */);
     }
   };
 
+  const onHoverOut = (e: InteractionEvent) => {
+    if (openOnHover) {
+      setOpen(e, false /* isOpen */);
+    }
+  };
+
   const onClick = (e: InteractionEvent) => {
     setOpen(e, !open);
   };
 
-  return { onClick, onHoverIn, componentRef: triggerRef };
+  return { onClick, onHoverIn, onHoverOut, componentRef: triggerRef, delayHoverIn: delayHover, delayHoverOut: delayHover };
 };

package/src/index.ts

@@ -3,5 +3,6 @@ export { MenuTrigger } from './MenuTrigger/MenuTrigger';
 export { MenuPopover } from './MenuPopover/MenuPopover';
 export { MenuItem } from './MenuItem/MenuItem';
 export { MenuItemCheckbox } from './MenuItemCheckbox/MenuItemCheckbox';
+export { MenuItemRadio } from './MenuItemRadio/MenuItemRadio';
 export { MenuList } from './MenuList/MenuList';
 export { MenuDivider } from './MenuDivider/MenuDivider';

package/lib/MenuList/useMenuContextValue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useMenuContextValue.d.ts","sourceRoot":"","sources":["../../src/MenuList/useMenuContextValue.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,eAAO,MAAM,uBAAuB,UAAW,aAAa,KAAG,oBAE9D,CAAC"}

package/lib/MenuList/useMenuContextValue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useMenuContextValue.js","sourceRoot":"","sources":["../../src/MenuList/useMenuContextValue.ts"],"names":[],"mappings":";AAGA,MAAM,CAAC,IAAM,uBAAuB,GAAG,UAAC,KAAoB;IAC1D,oBAAY,KAAK,EAAG;AACtB,CAAC,CAAC"}

package/lib-commonjs/MenuList/useMenuContextValue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useMenuContextValue.d.ts","sourceRoot":"","sources":["../../src/MenuList/useMenuContextValue.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,eAAO,MAAM,uBAAuB,UAAW,aAAa,KAAG,oBAE9D,CAAC"}

package/lib-commonjs/MenuList/useMenuContextValue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useMenuContextValue.js","sourceRoot":"","sources":["../../src/MenuList/useMenuContextValue.ts"],"names":[],"mappings":";;;;AAGO,IAAM,uBAAuB,GAAG,UAAC,KAAoB;IAC1D,iCAAY,KAAK,EAAG;AACtB,CAAC,CAAC;AAFW,QAAA,uBAAuB,2BAElC"}