@fluentui-react-native/menu 0.5.2 → 0.6.0

package/CHANGELOG.json

@@ -2,7 +2,22 @@
   "name": "@fluentui-react-native/menu",
   "entries": [
     {
-      "date": "Wed, 11 May 2022 19:33:47 GMT",
+      "date": "Wed, 11 May 2022 22:26:13 GMT",
+      "tag": "@fluentui-react-native/menu_v0.6.0",
+      "version": "0.6.0",
+      "comments": {
+        "minor": [
+          {
+            "author": "ruaraki@microsoft.com",
+            "package": "@fluentui-react-native/menu",
+            "commit": "0a383e3d6a736a89e628c14d27d82388cf154f2b",
+            "comment": "Dismiss and openOnHover"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 11 May 2022 19:33:59 GMT",
       "tag": "@fluentui-react-native/menu_v0.5.2",
       "version": "0.5.2",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,20 @@
 # Change Log - @fluentui-react-native/menu
 
-This log was last generated on Wed, 11 May 2022 19:33:47 GMT and should not be manually modified.
+This log was last generated on Wed, 11 May 2022 22:26:13 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## 0.6.0
+
+Wed, 11 May 2022 22:26:13 GMT
+
+### Minor changes
+
+- Dismiss and openOnHover (ruaraki@microsoft.com)
+
 ## 0.5.2
 
-Wed, 11 May 2022 19:33:47 GMT
+Wed, 11 May 2022 19:33:59 GMT
 
 ### Patches
 

package/lib/Menu/Menu.types.d.ts

@@ -1,12 +1,17 @@
 import type { IViewProps } from '@fluentui-react-native/adapters';
+import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import React from 'react';
 export declare const menuName = "Menu";
 export interface MenuProps extends Omit<IViewProps, 'onPress'> {
+    defaultOpen?: boolean;
     open?: boolean;
+    onOpenChange?: (e: InteractionEvent, isOpen: boolean) => void;
+    openOnHover?: boolean;
 }
 export interface MenuState extends MenuProps {
+    isControlled: boolean;
     isSubmenu: boolean;
-    setOpen: (isOpen: boolean) => void;
+    setOpen: (e: InteractionEvent, isOpen: boolean) => void;
     triggerRef: React.RefObject<React.Component>;
 }
 //# sourceMappingURL=Menu.types.d.ts.map

package/lib/Menu/Menu.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.types.d.ts","sourceRoot":"","sources":["../../src/Menu/Menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,QAAQ,SAAS,CAAC;AAE/B,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;IAC5D,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,SAAU,SAAQ,SAAS;IAC1C,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;CAC9C"}
+{"version":3,"file":"Menu.types.d.ts","sourceRoot":"","sources":["../../src/Menu/Menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,QAAQ,SAAS,CAAC;AAE/B,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;IAC5D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9D,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,SAAU,SAAQ,SAAS;IAC1C,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxD,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;CAC9C"}

package/lib/Menu/Menu.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.types.js","sourceRoot":"","sources":["../../src/Menu/Menu.types.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,IAAM,QAAQ,GAAG,MAAM,CAAC"}
+{"version":3,"file":"Menu.types.js","sourceRoot":"","sources":["../../src/Menu/Menu.types.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,IAAM,QAAQ,GAAG,MAAM,CAAC"}

package/lib/Menu/useMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMenu.d.ts","sourceRoot":"","sources":["../../src/Menu/useMenu.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD,eAAO,MAAM,OAAO,UAAW,SAAS,KAAG,SAY1C,CAAC"}
+{"version":3,"file":"useMenu.d.ts","sourceRoot":"","sources":["../../src/Menu/useMenu.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD,eAAO,MAAM,OAAO,UAAW,SAAS,KAAG,SAe1C,CAAC"}

package/lib/Menu/useMenu.js

@@ -1,18 +1,28 @@
+import { __assign } from "tslib";
 import React from 'react';
 import { useMenuContext } from '../context/menuContext';
 export var useMenu = function (props) {
-    var _a = useMenuOpenState(props), open = _a[0], setOpen = _a[1];
     var triggerRef = React.useRef(null);
     var context = useMenuContext();
     var isSubmenu = context.triggerRef !== null;
-    return {
-        open: open,
-        setOpen: setOpen,
-        triggerRef: triggerRef,
-        isSubmenu: isSubmenu,
-    };
+    var isControlled = typeof props.open !== 'undefined';
+    var _a = useMenuOpenState(isControlled, props), open = _a[0], setOpen = _a[1];
+    return __assign(__assign({}, props), { open: open, setOpen: setOpen, triggerRef: triggerRef, isSubmenu: isSubmenu, isControlled: isControlled });
 };
-var useMenuOpenState = function (props) {
-    return React.useState(props.open);
+var useMenuOpenState = function (isControlled, props) {
+    var defaultOpen = props.defaultOpen, onOpenChange = props.onOpenChange, open = props.open;
+    var initialState = typeof defaultOpen !== 'undefined' ? defaultOpen : !!open;
+    var _a = React.useState(initialState), openInternal = _a[0], setOpenInternal = _a[1];
+    var state = isControlled ? open : openInternal;
+    var setOpen = React.useCallback(function (e, isOpen) {
+        var openPrev = state;
+        if (!isControlled) {
+            setOpenInternal(isOpen);
+        }
+        if (onOpenChange && openPrev !== isOpen) {
+            onOpenChange(e, isOpen);
+        }
+    }, [isControlled, state, onOpenChange, setOpenInternal]);
+    return [state, setOpen];
 };
 //# sourceMappingURL=useMenu.js.map

package/lib/Menu/useMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenu.js","sourceRoot":"","sources":["../../src/Menu/useMenu.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGxD,MAAM,CAAC,IAAM,OAAO,GAAG,UAAC,KAAgB;IAChC,IAAA,KAAkB,gBAAgB,CAAC,KAAK,CAAC,EAAxC,IAAI,QAAA,EAAE,OAAO,QAA2B,CAAC;IAChD,IAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACtC,IAAM,OAAO,GAAG,cAAc,EAAE,CAAC;IACjC,IAAM,SAAS,GAAG,OAAO,CAAC,UAAU,KAAK,IAAI,CAAC;IAE9C,OAAO;QACL,IAAI,MAAA;QACJ,OAAO,SAAA;QACP,UAAU,YAAA;QACV,SAAS,WAAA;KACV,CAAC;AACJ,CAAC,CAAC;AAEF,IAAM,gBAAgB,GAAG,UAAC,KAAgB;IACxC,OAAO,KAAK,CAAC,QAAQ,CAAU,KAAK,CAAC,IAAI,CAAC,CAAC;AAC7C,CAAC,CAAC"}
+{"version":3,"file":"useMenu.js","sourceRoot":"","sources":["../../src/Menu/useMenu.ts"],"names":[],"mappings":";AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGxD,MAAM,CAAC,IAAM,OAAO,GAAG,UAAC,KAAgB;IACtC,IAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACtC,IAAM,OAAO,GAAG,cAAc,EAAE,CAAC;IACjC,IAAM,SAAS,GAAG,OAAO,CAAC,UAAU,KAAK,IAAI,CAAC;IAC9C,IAAM,YAAY,GAAG,OAAO,KAAK,CAAC,IAAI,KAAK,WAAW,CAAC;IACjD,IAAA,KAAkB,gBAAgB,CAAC,YAAY,EAAE,KAAK,CAAC,EAAtD,IAAI,QAAA,EAAE,OAAO,QAAyC,CAAC;IAE9D,6BACK,KAAK,KACR,IAAI,MAAA,EACJ,OAAO,SAAA,EACP,UAAU,YAAA,EACV,SAAS,WAAA,EACT,YAAY,cAAA,IACZ;AACJ,CAAC,CAAC;AAEF,IAAM,gBAAgB,GAAG,UAAC,YAAqB,EAAE,KAAgB;IACvD,IAAA,WAAW,GAAyB,KAAK,YAA9B,EAAE,YAAY,GAAW,KAAK,aAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;IAClD,IAAM,YAAY,GAAG,OAAO,WAAW,KAAK,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IACzE,IAAA,KAAkC,KAAK,CAAC,QAAQ,CAAU,YAAY,CAAC,EAAtE,YAAY,QAAA,EAAE,eAAe,QAAyC,CAAC;IAE9E,IAAM,KAAK,GAAG,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC;IAEjD,IAAM,OAAO,GAAG,KAAK,CAAC,WAAW,CAC/B,UAAC,CAAmB,EAAE,MAAe;QACnC,IAAM,QAAQ,GAAG,KAAK,CAAC;QACvB,IAAI,CAAC,YAAY,EAAE;YACjB,eAAe,CAAC,MAAM,CAAC,CAAC;SACzB;QACD,IAAI,YAAY,IAAI,QAAQ,KAAK,MAAM,EAAE;YACvC,YAAY,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;SACzB;IACH,CAAC,EACD,CAAC,YAAY,EAAE,KAAK,EAAE,YAAY,EAAE,eAAe,CAAC,CACrD,CAAC;IAEF,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;AAC1B,CAAC,CAAC"}

package/lib/Menu/useMenuContextValue.js

@@ -1,4 +1,5 @@
+import { __assign } from "tslib";
 export var useMenuContextValue = function (state) {
-    return { open: state.open, setOpen: state.setOpen, triggerRef: state.triggerRef, isSubmenu: state.isSubmenu };
+    return __assign({}, state);
 };
 //# sourceMappingURL=useMenuContextValue.js.map

package/lib/Menu/useMenuContextValue.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuContextValue.js","sourceRoot":"","sources":["../../src/Menu/useMenuContextValue.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,IAAM,mBAAmB,GAAG,UAAC,KAAgB;IAClD,OAAO,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;AAChH,CAAC,CAAC"}
+{"version":3,"file":"useMenuContextValue.js","sourceRoot":"","sources":["../../src/Menu/useMenuContextValue.ts"],"names":[],"mappings":";AAGA,MAAM,CAAC,IAAM,mBAAmB,GAAG,UAAC,KAAgB;IAClD,oBAAY,KAAK,EAAG;AACtB,CAAC,CAAC"}

package/lib/MenuPopover/MenuPopover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPopover.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAmB,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAGxE,eAAO,MAAM,WAAW,iFAWtB,CAAC;AAGH,eAAe,WAAW,CAAC"}
+{"version":3,"file":"MenuPopover.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAmB,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAGxE,eAAO,MAAM,WAAW,iFAiBtB,CAAC;AAGH,eAAe,WAAW,CAAC"}

package/lib/MenuPopover/MenuPopover.js

@@ -7,7 +7,7 @@ export var MenuPopover = stagedComponent(function (props) {
     var state = useMenuPopover(props);
     var theme = useFluentTheme();
     return function (_rest, children) {
-        return (React.createElement(Callout, { target: state.triggerRef, borderWidth: 1, borderColor: theme.colors.neutralStrokeAccessible }, children));
+        return (React.createElement(Callout, { borderWidth: 1, borderColor: theme.colors.neutralStrokeAccessible, target: state.triggerRef, onDismiss: state.onDismiss, dismissBehaviors: state.dismissBehaviors }, children));
     };
 });
 MenuPopover.displayName = menuPopoverName;

package/lib/MenuPopover/MenuPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPopover.js","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AACnF,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AACzD,OAAO,EAAE,eAAe,EAAoB,MAAM,qBAAqB,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,MAAM,CAAC,IAAM,WAAW,GAAG,eAAe,CAAC,UAAC,KAAuB;IACjE,IAAM,KAAK,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;IACpC,IAAM,KAAK,GAAG,cAAc,EAAE,CAAC;IAE/B,OAAO,UAAC,KAAuB,EAAE,QAAyB;QACxD,OAAO,CACL,oBAAC,OAAO,IAAC,MAAM,EAAE,KAAK,CAAC,UAAU,EAAE,WAAW,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,uBAAuB,IACjG,QAAQ,CACD,CACX,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,WAAW,CAAC,WAAW,GAAG,eAAe,CAAC;AAE1C,eAAe,WAAW,CAAC"}
+{"version":3,"file":"MenuPopover.js","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AACnF,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AACzD,OAAO,EAAE,eAAe,EAAoB,MAAM,qBAAqB,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,MAAM,CAAC,IAAM,WAAW,GAAG,eAAe,CAAC,UAAC,KAAuB;IACjE,IAAM,KAAK,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;IACpC,IAAM,KAAK,GAAG,cAAc,EAAE,CAAC;IAE/B,OAAO,UAAC,KAAuB,EAAE,QAAyB;QACxD,OAAO,CACL,oBAAC,OAAO,IACN,WAAW,EAAE,CAAC,EACd,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,uBAAuB,EACjD,MAAM,EAAE,KAAK,CAAC,UAAU,EACxB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,IAEvC,QAAQ,CACD,CACX,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,WAAW,CAAC,WAAW,GAAG,eAAe,CAAC;AAE1C,eAAe,WAAW,CAAC"}

package/lib/MenuPopover/MenuPopover.types.d.ts

@@ -1,9 +1,12 @@
 /// <reference types="react" />
 import type { IViewProps } from '@fluentui-react-native/adapters';
+import { DismissBehaviors } from '@fluentui-react-native/callout';
 export declare const menuPopoverName = "MenuPopover";
 export interface MenuPopoverProps extends Omit<IViewProps, 'onPress'> {
 }
 export interface MenuPopoverState {
+    dismissBehaviors: DismissBehaviors[];
+    onDismiss: () => void;
     triggerRef: React.RefObject<React.Component>;
 }
 //# sourceMappingURL=MenuPopover.types.d.ts.map

package/lib/MenuPopover/MenuPopover.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPopover.types.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAElE,eAAO,MAAM,eAAe,gBAAgB,CAAC;AAE7C,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;CAAG;AAExE,MAAM,WAAW,gBAAgB;IAC/B,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;CAC9C"}
+{"version":3,"file":"MenuPopover.types.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAElE,eAAO,MAAM,eAAe,gBAAgB,CAAC;AAE7C,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;CAAG;AAExE,MAAM,WAAW,gBAAgB;IAC/B,gBAAgB,EAAE,gBAAgB,EAAE,CAAC;IACrC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;CAC9C"}

package/lib/MenuPopover/MenuPopover.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPopover.types.js","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.types.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,eAAe,GAAG,aAAa,CAAC"}
+{"version":3,"file":"MenuPopover.types.js","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.types.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,IAAM,eAAe,GAAG,aAAa,CAAC"}

package/lib/MenuPopover/useMenuPopover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuPopover.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEzE,eAAO,MAAM,cAAc,WAAY,gBAAgB,KAAG,gBAMzD,CAAC"}
+{"version":3,"file":"useMenuPopover.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEzE,eAAO,MAAM,cAAc,WAAY,gBAAgB,KAAG,gBAWzD,CAAC"}

package/lib/MenuPopover/useMenuPopover.js

@@ -1,7 +1,13 @@
+import React from 'react';
 import { useMenuContext } from '../context/menuContext';
 export var useMenuPopover = function (_props) {
     var context = useMenuContext();
+    var setOpen = context.setOpen;
     var triggerRef = context.triggerRef;
-    return { triggerRef: triggerRef };
+    var onDismiss = React.useCallback(function () { return setOpen(undefined, false /* isOpen */); }, [setOpen]);
+    var dismissBehaviors = context.isControlled
+        ? ['preventDismissOnKeyDown', 'preventDismissOnClickOutside']
+        : undefined;
+    return { triggerRef: triggerRef, onDismiss: onDismiss, dismissBehaviors: dismissBehaviors };
 };
 //# sourceMappingURL=useMenuPopover.js.map

package/lib/MenuPopover/useMenuPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuPopover.js","sourceRoot":"","sources":["../../src/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGxD,MAAM,CAAC,IAAM,cAAc,GAAG,UAAC,MAAwB;IACrD,IAAM,OAAO,GAAG,cAAc,EAAE,CAAC;IAEjC,IAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;IAEtC,OAAO,EAAE,UAAU,YAAA,EAAE,CAAC;AACxB,CAAC,CAAC"}
+{"version":3,"file":"useMenuPopover.js","sourceRoot":"","sources":["../../src/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGxD,MAAM,CAAC,IAAM,cAAc,GAAG,UAAC,MAAwB;IACrD,IAAM,OAAO,GAAG,cAAc,EAAE,CAAC;IACjC,IAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;IAEhC,IAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;IACtC,IAAM,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC,cAAM,OAAA,OAAO,CAAC,SAAS,EAAE,KAAK,CAAC,YAAY,CAAC,EAAtC,CAAsC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAC7F,IAAM,gBAAgB,GAAG,OAAO,CAAC,YAAY;QAC3C,CAAC,CAAE,CAAC,yBAAyB,EAAE,8BAA8B,CAAwB;QACrF,CAAC,CAAC,SAAS,CAAC;IAEd,OAAO,EAAE,UAAU,YAAA,EAAE,SAAS,WAAA,EAAE,gBAAgB,kBAAA,EAAE,CAAC;AACrD,CAAC,CAAC"}

package/lib/MenuTrigger/useMenuTrigger.d.ts

@@ -2,7 +2,8 @@
 import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import { MenuTriggerProps } from './MenuTrigger.types';
 export declare const useMenuTrigger: (_props: MenuTriggerProps) => {
-    onClick: (_e: InteractionEvent) => void;
+    onClick: (e: InteractionEvent) => void;
+    onHoverIn: (e: InteractionEvent) => void;
     componentRef: import("react").RefObject<import("react").Component<{}, {}, any>>;
 };
 //# sourceMappingURL=useMenuTrigger.d.ts.map

package/lib/MenuTrigger/useMenuTrigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuTrigger.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEvD,eAAO,MAAM,cAAc,WAAY,gBAAgB;kBAOhC,gBAAgB;;CAKtC,CAAC"}
+{"version":3,"file":"useMenuTrigger.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEvD,eAAO,MAAM,cAAc,WAAY,gBAAgB;iBAcjC,gBAAgB;mBANd,gBAAgB;;CAWvC,CAAC"}

package/lib/MenuTrigger/useMenuTrigger.js

@@ -3,10 +3,16 @@ export var useMenuTrigger = function (_props) {
     var context = useMenuContext();
     var setOpen = context.setOpen;
     var open = context.open;
+    var openOnHover = context.openOnHover;
     var triggerRef = context.triggerRef;
-    var onClick = function (_e) {
-        setOpen(!open);
+    var onHoverIn = function (e) {
+        if (openOnHover) {
+            setOpen(e, true /* isOpen */);
+        }
     };
-    return { onClick: onClick, componentRef: triggerRef };
+    var onClick = function (e) {
+        setOpen(e, !open);
+    };
+    return { onClick: onClick, onHoverIn: onHoverIn, componentRef: triggerRef };
 };
 //# sourceMappingURL=useMenuTrigger.js.map

package/lib/MenuTrigger/useMenuTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuTrigger.js","sourceRoot":"","sources":["../../src/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAIxD,MAAM,CAAC,IAAM,cAAc,GAAG,UAAC,MAAwB;IACrD,IAAM,OAAO,GAAG,cAAc,EAAE,CAAC;IAEjC,IAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;IAChC,IAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAC1B,IAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;IAEtC,IAAM,OAAO,GAAG,UAAC,EAAoB;QACnC,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,OAAO,EAAE,OAAO,SAAA,EAAE,YAAY,EAAE,UAAU,EAAE,CAAC;AAC/C,CAAC,CAAC"}
+{"version":3,"file":"useMenuTrigger.js","sourceRoot":"","sources":["../../src/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAIxD,MAAM,CAAC,IAAM,cAAc,GAAG,UAAC,MAAwB;IACrD,IAAM,OAAO,GAAG,cAAc,EAAE,CAAC;IAEjC,IAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;IAChC,IAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAC1B,IAAM,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC;IACxC,IAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;IAEtC,IAAM,SAAS,GAAG,UAAC,CAAmB;QACpC,IAAI,WAAW,EAAE;YACf,OAAO,CAAC,CAAC,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;SAC/B;IACH,CAAC,CAAC;IAEF,IAAM,OAAO,GAAG,UAAC,CAAmB;QAClC,OAAO,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC,CAAC;IAEF,OAAO,EAAE,OAAO,SAAA,EAAE,SAAS,WAAA,EAAE,YAAY,EAAE,UAAU,EAAE,CAAC;AAC1D,CAAC,CAAC"}

package/lib/context/menuContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menuContext.d.ts","sourceRoot":"","sources":["../../src/context/menuContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD;;GAEG;AACH,oBAAY,gBAAgB,GAAG,SAAS,CAAC;AAEzC,eAAO,MAAM,WAAW,0BAKtB,CAAC;AAEH,eAAO,MAAM,YAAY,2BAAuB,CAAC;AACjD,eAAO,MAAM,cAAc,iBAAsC,CAAC"}
+{"version":3,"file":"menuContext.d.ts","sourceRoot":"","sources":["../../src/context/menuContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD;;GAEG;AACH,oBAAY,gBAAgB,GAAG,SAAS,CAAC;AAEzC,eAAO,MAAM,WAAW,0BAMtB,CAAC;AAEH,eAAO,MAAM,YAAY,2BAAuB,CAAC;AACjD,eAAO,MAAM,cAAc,iBAAsC,CAAC"}

package/lib/context/menuContext.js

@@ -1,5 +1,6 @@
 import * as React from 'react';
 export var MenuContext = React.createContext({
+    isControlled: false,
     isSubmenu: false,
     open: false,
     setOpen: function () { return false; },

package/lib/context/menuContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"menuContext.js","sourceRoot":"","sources":["../../src/context/menuContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC,aAAa,CAAmB;IAC/D,SAAS,EAAE,KAAK;IAChB,IAAI,EAAE,KAAK;IACX,OAAO,EAAE,cAAM,OAAA,KAAK,EAAL,CAAK;IACpB,UAAU,EAAE,IAAI;CACjB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,YAAY,GAAG,WAAW,CAAC,QAAQ,CAAC;AACjD,MAAM,CAAC,IAAM,cAAc,GAAG,cAAM,OAAA,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAA7B,CAA6B,CAAC"}
+{"version":3,"file":"menuContext.js","sourceRoot":"","sources":["../../src/context/menuContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,CAAC,IAAM,WAAW,GAAG,KAAK,CAAC,aAAa,CAAmB;IAC/D,YAAY,EAAE,KAAK;IACnB,SAAS,EAAE,KAAK;IAChB,IAAI,EAAE,KAAK;IACX,OAAO,EAAE,cAAM,OAAA,KAAK,EAAL,CAAK;IACpB,UAAU,EAAE,IAAI;CACjB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,YAAY,GAAG,WAAW,CAAC,QAAQ,CAAC;AACjD,MAAM,CAAC,IAAM,cAAc,GAAG,cAAM,OAAA,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAA7B,CAA6B,CAAC"}

package/lib-commonjs/Menu/Menu.types.d.ts

@@ -1,12 +1,17 @@
 import type { IViewProps } from '@fluentui-react-native/adapters';
+import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import React from 'react';
 export declare const menuName = "Menu";
 export interface MenuProps extends Omit<IViewProps, 'onPress'> {
+    defaultOpen?: boolean;
     open?: boolean;
+    onOpenChange?: (e: InteractionEvent, isOpen: boolean) => void;
+    openOnHover?: boolean;
 }
 export interface MenuState extends MenuProps {
+    isControlled: boolean;
     isSubmenu: boolean;
-    setOpen: (isOpen: boolean) => void;
+    setOpen: (e: InteractionEvent, isOpen: boolean) => void;
     triggerRef: React.RefObject<React.Component>;
 }
 //# sourceMappingURL=Menu.types.d.ts.map

package/lib-commonjs/Menu/Menu.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.types.d.ts","sourceRoot":"","sources":["../../src/Menu/Menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,QAAQ,SAAS,CAAC;AAE/B,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;IAC5D,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,SAAU,SAAQ,SAAS;IAC1C,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;CAC9C"}
+{"version":3,"file":"Menu.types.d.ts","sourceRoot":"","sources":["../../src/Menu/Menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,QAAQ,SAAS,CAAC;AAE/B,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;IAC5D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9D,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,SAAU,SAAQ,SAAS;IAC1C,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxD,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;CAC9C"}

package/lib-commonjs/Menu/Menu.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.types.js","sourceRoot":"","sources":["../../src/Menu/Menu.types.ts"],"names":[],"mappings":";;;AAGa,QAAA,QAAQ,GAAG,MAAM,CAAC"}
+{"version":3,"file":"Menu.types.js","sourceRoot":"","sources":["../../src/Menu/Menu.types.ts"],"names":[],"mappings":";;;AAIa,QAAA,QAAQ,GAAG,MAAM,CAAC"}

package/lib-commonjs/Menu/useMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMenu.d.ts","sourceRoot":"","sources":["../../src/Menu/useMenu.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD,eAAO,MAAM,OAAO,UAAW,SAAS,KAAG,SAY1C,CAAC"}
+{"version":3,"file":"useMenu.d.ts","sourceRoot":"","sources":["../../src/Menu/useMenu.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD,eAAO,MAAM,OAAO,UAAW,SAAS,KAAG,SAe1C,CAAC"}

package/lib-commonjs/Menu/useMenu.js

@@ -5,19 +5,28 @@ var tslib_1 = require("tslib");
 var react_1 = (0, tslib_1.__importDefault)(require("react"));
 var menuContext_1 = require("../context/menuContext");
 var useMenu = function (props) {
-    var _a = useMenuOpenState(props), open = _a[0], setOpen = _a[1];
     var triggerRef = react_1.default.useRef(null);
     var context = (0, menuContext_1.useMenuContext)();
     var isSubmenu = context.triggerRef !== null;
-    return {
-        open: open,
-        setOpen: setOpen,
-        triggerRef: triggerRef,
-        isSubmenu: isSubmenu,
-    };
+    var isControlled = typeof props.open !== 'undefined';
+    var _a = useMenuOpenState(isControlled, props), open = _a[0], setOpen = _a[1];
+    return (0, tslib_1.__assign)((0, tslib_1.__assign)({}, props), { open: open, setOpen: setOpen, triggerRef: triggerRef, isSubmenu: isSubmenu, isControlled: isControlled });
 };
 exports.useMenu = useMenu;
-var useMenuOpenState = function (props) {
-    return react_1.default.useState(props.open);
+var useMenuOpenState = function (isControlled, props) {
+    var defaultOpen = props.defaultOpen, onOpenChange = props.onOpenChange, open = props.open;
+    var initialState = typeof defaultOpen !== 'undefined' ? defaultOpen : !!open;
+    var _a = react_1.default.useState(initialState), openInternal = _a[0], setOpenInternal = _a[1];
+    var state = isControlled ? open : openInternal;
+    var setOpen = react_1.default.useCallback(function (e, isOpen) {
+        var openPrev = state;
+        if (!isControlled) {
+            setOpenInternal(isOpen);
+        }
+        if (onOpenChange && openPrev !== isOpen) {
+            onOpenChange(e, isOpen);
+        }
+    }, [isControlled, state, onOpenChange, setOpenInternal]);
+    return [state, setOpen];
 };
 //# sourceMappingURL=useMenu.js.map

package/lib-commonjs/Menu/useMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenu.js","sourceRoot":"","sources":["../../src/Menu/useMenu.ts"],"names":[],"mappings":";;;;AAAA,6DAA0B;AAC1B,sDAAwD;AAGjD,IAAM,OAAO,GAAG,UAAC,KAAgB;IAChC,IAAA,KAAkB,gBAAgB,CAAC,KAAK,CAAC,EAAxC,IAAI,QAAA,EAAE,OAAO,QAA2B,CAAC;IAChD,IAAM,UAAU,GAAG,eAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACtC,IAAM,OAAO,GAAG,IAAA,4BAAc,GAAE,CAAC;IACjC,IAAM,SAAS,GAAG,OAAO,CAAC,UAAU,KAAK,IAAI,CAAC;IAE9C,OAAO;QACL,IAAI,MAAA;QACJ,OAAO,SAAA;QACP,UAAU,YAAA;QACV,SAAS,WAAA;KACV,CAAC;AACJ,CAAC,CAAC;AAZW,QAAA,OAAO,WAYlB;AAEF,IAAM,gBAAgB,GAAG,UAAC,KAAgB;IACxC,OAAO,eAAK,CAAC,QAAQ,CAAU,KAAK,CAAC,IAAI,CAAC,CAAC;AAC7C,CAAC,CAAC"}
+{"version":3,"file":"useMenu.js","sourceRoot":"","sources":["../../src/Menu/useMenu.ts"],"names":[],"mappings":";;;;AACA,6DAA0B;AAC1B,sDAAwD;AAGjD,IAAM,OAAO,GAAG,UAAC,KAAgB;IACtC,IAAM,UAAU,GAAG,eAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACtC,IAAM,OAAO,GAAG,IAAA,4BAAc,GAAE,CAAC;IACjC,IAAM,SAAS,GAAG,OAAO,CAAC,UAAU,KAAK,IAAI,CAAC;IAC9C,IAAM,YAAY,GAAG,OAAO,KAAK,CAAC,IAAI,KAAK,WAAW,CAAC;IACjD,IAAA,KAAkB,gBAAgB,CAAC,YAAY,EAAE,KAAK,CAAC,EAAtD,IAAI,QAAA,EAAE,OAAO,QAAyC,CAAC;IAE9D,uDACK,KAAK,KACR,IAAI,MAAA,EACJ,OAAO,SAAA,EACP,UAAU,YAAA,EACV,SAAS,WAAA,EACT,YAAY,cAAA,IACZ;AACJ,CAAC,CAAC;AAfW,QAAA,OAAO,WAelB;AAEF,IAAM,gBAAgB,GAAG,UAAC,YAAqB,EAAE,KAAgB;IACvD,IAAA,WAAW,GAAyB,KAAK,YAA9B,EAAE,YAAY,GAAW,KAAK,aAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;IAClD,IAAM,YAAY,GAAG,OAAO,WAAW,KAAK,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IACzE,IAAA,KAAkC,eAAK,CAAC,QAAQ,CAAU,YAAY,CAAC,EAAtE,YAAY,QAAA,EAAE,eAAe,QAAyC,CAAC;IAE9E,IAAM,KAAK,GAAG,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC;IAEjD,IAAM,OAAO,GAAG,eAAK,CAAC,WAAW,CAC/B,UAAC,CAAmB,EAAE,MAAe;QACnC,IAAM,QAAQ,GAAG,KAAK,CAAC;QACvB,IAAI,CAAC,YAAY,EAAE;YACjB,eAAe,CAAC,MAAM,CAAC,CAAC;SACzB;QACD,IAAI,YAAY,IAAI,QAAQ,KAAK,MAAM,EAAE;YACvC,YAAY,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;SACzB;IACH,CAAC,EACD,CAAC,YAAY,EAAE,KAAK,EAAE,YAAY,EAAE,eAAe,CAAC,CACrD,CAAC;IAEF,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;AAC1B,CAAC,CAAC"}

package/lib-commonjs/Menu/useMenuContextValue.js

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useMenuContextValue = void 0;
+var tslib_1 = require("tslib");
 var useMenuContextValue = function (state) {
-    return { open: state.open, setOpen: state.setOpen, triggerRef: state.triggerRef, isSubmenu: state.isSubmenu };
+    return (0, tslib_1.__assign)({}, state);
 };
 exports.useMenuContextValue = useMenuContextValue;
 //# sourceMappingURL=useMenuContextValue.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"useMenuContextValue.js","sourceRoot":"","sources":["../../src/Menu/useMenuContextValue.ts"],"names":[],"mappings":";;;AAGO,IAAM,mBAAmB,GAAG,UAAC,KAAgB;IAClD,OAAO,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;AAChH,CAAC,CAAC;AAFW,QAAA,mBAAmB,uBAE9B"}
+{"version":3,"file":"useMenuContextValue.js","sourceRoot":"","sources":["../../src/Menu/useMenuContextValue.ts"],"names":[],"mappings":";;;;AAGO,IAAM,mBAAmB,GAAG,UAAC,KAAgB;IAClD,iCAAY,KAAK,EAAG;AACtB,CAAC,CAAC;AAFW,QAAA,mBAAmB,uBAE9B"}

package/lib-commonjs/MenuPopover/MenuPopover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPopover.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAmB,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAGxE,eAAO,MAAM,WAAW,iFAWtB,CAAC;AAGH,eAAe,WAAW,CAAC"}
+{"version":3,"file":"MenuPopover.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAmB,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAGxE,eAAO,MAAM,WAAW,iFAiBtB,CAAC;AAGH,eAAe,WAAW,CAAC"}

package/lib-commonjs/MenuPopover/MenuPopover.js

@@ -11,7 +11,7 @@ exports.MenuPopover = (0, framework_1.stagedComponent)(function (props) {
     var state = (0, useMenuPopover_1.useMenuPopover)(props);
     var theme = (0, framework_1.useFluentTheme)();
     return function (_rest, children) {
-        return (react_1.default.createElement(callout_1.Callout, { target: state.triggerRef, borderWidth: 1, borderColor: theme.colors.neutralStrokeAccessible }, children));
+        return (react_1.default.createElement(callout_1.Callout, { borderWidth: 1, borderColor: theme.colors.neutralStrokeAccessible, target: state.triggerRef, onDismiss: state.onDismiss, dismissBehaviors: state.dismissBehaviors }, children));
     };
 });
 exports.MenuPopover.displayName = MenuPopover_types_1.menuPopoverName;

package/lib-commonjs/MenuPopover/MenuPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPopover.js","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":";;;;AAAA,6DAA0B;AAC1B,8DAAmF;AACnF,0DAAyD;AACzD,yDAAwE;AACxE,mDAAkD;AAErC,QAAA,WAAW,GAAG,IAAA,2BAAe,EAAC,UAAC,KAAuB;IACjE,IAAM,KAAK,GAAG,IAAA,+BAAc,EAAC,KAAK,CAAC,CAAC;IACpC,IAAM,KAAK,GAAG,IAAA,0BAAc,GAAE,CAAC;IAE/B,OAAO,UAAC,KAAuB,EAAE,QAAyB;QACxD,OAAO,CACL,8BAAC,iBAAO,IAAC,MAAM,EAAE,KAAK,CAAC,UAAU,EAAE,WAAW,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,uBAAuB,IACjG,QAAQ,CACD,CACX,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,mBAAW,CAAC,WAAW,GAAG,mCAAe,CAAC;AAE1C,kBAAe,mBAAW,CAAC"}
+{"version":3,"file":"MenuPopover.js","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.tsx"],"names":[],"mappings":";;;;AAAA,6DAA0B;AAC1B,8DAAmF;AACnF,0DAAyD;AACzD,yDAAwE;AACxE,mDAAkD;AAErC,QAAA,WAAW,GAAG,IAAA,2BAAe,EAAC,UAAC,KAAuB;IACjE,IAAM,KAAK,GAAG,IAAA,+BAAc,EAAC,KAAK,CAAC,CAAC;IACpC,IAAM,KAAK,GAAG,IAAA,0BAAc,GAAE,CAAC;IAE/B,OAAO,UAAC,KAAuB,EAAE,QAAyB;QACxD,OAAO,CACL,8BAAC,iBAAO,IACN,WAAW,EAAE,CAAC,EACd,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,uBAAuB,EACjD,MAAM,EAAE,KAAK,CAAC,UAAU,EACxB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,IAEvC,QAAQ,CACD,CACX,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,mBAAW,CAAC,WAAW,GAAG,mCAAe,CAAC;AAE1C,kBAAe,mBAAW,CAAC"}

package/lib-commonjs/MenuPopover/MenuPopover.types.d.ts

@@ -1,9 +1,12 @@
 /// <reference types="react" />
 import type { IViewProps } from '@fluentui-react-native/adapters';
+import { DismissBehaviors } from '@fluentui-react-native/callout';
 export declare const menuPopoverName = "MenuPopover";
 export interface MenuPopoverProps extends Omit<IViewProps, 'onPress'> {
 }
 export interface MenuPopoverState {
+    dismissBehaviors: DismissBehaviors[];
+    onDismiss: () => void;
     triggerRef: React.RefObject<React.Component>;
 }
 //# sourceMappingURL=MenuPopover.types.d.ts.map

package/lib-commonjs/MenuPopover/MenuPopover.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPopover.types.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAElE,eAAO,MAAM,eAAe,gBAAgB,CAAC;AAE7C,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;CAAG;AAExE,MAAM,WAAW,gBAAgB;IAC/B,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;CAC9C"}
+{"version":3,"file":"MenuPopover.types.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAElE,eAAO,MAAM,eAAe,gBAAgB,CAAC;AAE7C,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;CAAG;AAExE,MAAM,WAAW,gBAAgB;IAC/B,gBAAgB,EAAE,gBAAgB,EAAE,CAAC;IACrC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;CAC9C"}

package/lib-commonjs/MenuPopover/MenuPopover.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPopover.types.js","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.types.ts"],"names":[],"mappings":";;;AAEa,QAAA,eAAe,GAAG,aAAa,CAAC"}
+{"version":3,"file":"MenuPopover.types.js","sourceRoot":"","sources":["../../src/MenuPopover/MenuPopover.types.ts"],"names":[],"mappings":";;;AAGa,QAAA,eAAe,GAAG,aAAa,CAAC"}

package/lib-commonjs/MenuPopover/useMenuPopover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuPopover.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEzE,eAAO,MAAM,cAAc,WAAY,gBAAgB,KAAG,gBAMzD,CAAC"}
+{"version":3,"file":"useMenuPopover.d.ts","sourceRoot":"","sources":["../../src/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEzE,eAAO,MAAM,cAAc,WAAY,gBAAgB,KAAG,gBAWzD,CAAC"}

package/lib-commonjs/MenuPopover/useMenuPopover.js

@@ -1,11 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useMenuPopover = void 0;
+var tslib_1 = require("tslib");
+var react_1 = (0, tslib_1.__importDefault)(require("react"));
 var menuContext_1 = require("../context/menuContext");
 var useMenuPopover = function (_props) {
     var context = (0, menuContext_1.useMenuContext)();
+    var setOpen = context.setOpen;
     var triggerRef = context.triggerRef;
-    return { triggerRef: triggerRef };
+    var onDismiss = react_1.default.useCallback(function () { return setOpen(undefined, false /* isOpen */); }, [setOpen]);
+    var dismissBehaviors = context.isControlled
+        ? ['preventDismissOnKeyDown', 'preventDismissOnClickOutside']
+        : undefined;
+    return { triggerRef: triggerRef, onDismiss: onDismiss, dismissBehaviors: dismissBehaviors };
 };
 exports.useMenuPopover = useMenuPopover;
 //# sourceMappingURL=useMenuPopover.js.map

package/lib-commonjs/MenuPopover/useMenuPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuPopover.js","sourceRoot":"","sources":["../../src/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":";;;AAAA,sDAAwD;AAGjD,IAAM,cAAc,GAAG,UAAC,MAAwB;IACrD,IAAM,OAAO,GAAG,IAAA,4BAAc,GAAE,CAAC;IAEjC,IAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;IAEtC,OAAO,EAAE,UAAU,YAAA,EAAE,CAAC;AACxB,CAAC,CAAC;AANW,QAAA,cAAc,kBAMzB"}
+{"version":3,"file":"useMenuPopover.js","sourceRoot":"","sources":["../../src/MenuPopover/useMenuPopover.ts"],"names":[],"mappings":";;;;AAAA,6DAA0B;AAE1B,sDAAwD;AAGjD,IAAM,cAAc,GAAG,UAAC,MAAwB;IACrD,IAAM,OAAO,GAAG,IAAA,4BAAc,GAAE,CAAC;IACjC,IAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;IAEhC,IAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;IACtC,IAAM,SAAS,GAAG,eAAK,CAAC,WAAW,CAAC,cAAM,OAAA,OAAO,CAAC,SAAS,EAAE,KAAK,CAAC,YAAY,CAAC,EAAtC,CAAsC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAC7F,IAAM,gBAAgB,GAAG,OAAO,CAAC,YAAY;QAC3C,CAAC,CAAE,CAAC,yBAAyB,EAAE,8BAA8B,CAAwB;QACrF,CAAC,CAAC,SAAS,CAAC;IAEd,OAAO,EAAE,UAAU,YAAA,EAAE,SAAS,WAAA,EAAE,gBAAgB,kBAAA,EAAE,CAAC;AACrD,CAAC,CAAC;AAXW,QAAA,cAAc,kBAWzB"}

package/lib-commonjs/MenuTrigger/useMenuTrigger.d.ts

@@ -2,7 +2,8 @@
 import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import { MenuTriggerProps } from './MenuTrigger.types';
 export declare const useMenuTrigger: (_props: MenuTriggerProps) => {
-    onClick: (_e: InteractionEvent) => void;
+    onClick: (e: InteractionEvent) => void;
+    onHoverIn: (e: InteractionEvent) => void;
     componentRef: import("react").RefObject<import("react").Component<{}, {}, any>>;
 };
 //# sourceMappingURL=useMenuTrigger.d.ts.map

package/lib-commonjs/MenuTrigger/useMenuTrigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuTrigger.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEvD,eAAO,MAAM,cAAc,WAAY,gBAAgB;kBAOhC,gBAAgB;;CAKtC,CAAC"}
+{"version":3,"file":"useMenuTrigger.d.ts","sourceRoot":"","sources":["../../src/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAC5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEvD,eAAO,MAAM,cAAc,WAAY,gBAAgB;iBAcjC,gBAAgB;mBANd,gBAAgB;;CAWvC,CAAC"}

package/lib-commonjs/MenuTrigger/useMenuTrigger.js

@@ -6,11 +6,17 @@ var useMenuTrigger = function (_props) {
     var context = (0, menuContext_1.useMenuContext)();
     var setOpen = context.setOpen;
     var open = context.open;
+    var openOnHover = context.openOnHover;
     var triggerRef = context.triggerRef;
-    var onClick = function (_e) {
-        setOpen(!open);
+    var onHoverIn = function (e) {
+        if (openOnHover) {
+            setOpen(e, true /* isOpen */);
+        }
     };
-    return { onClick: onClick, componentRef: triggerRef };
+    var onClick = function (e) {
+        setOpen(e, !open);
+    };
+    return { onClick: onClick, onHoverIn: onHoverIn, componentRef: triggerRef };
 };
 exports.useMenuTrigger = useMenuTrigger;
 //# sourceMappingURL=useMenuTrigger.js.map

package/lib-commonjs/MenuTrigger/useMenuTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuTrigger.js","sourceRoot":"","sources":["../../src/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":";;;AAAA,sDAAwD;AAIjD,IAAM,cAAc,GAAG,UAAC,MAAwB;IACrD,IAAM,OAAO,GAAG,IAAA,4BAAc,GAAE,CAAC;IAEjC,IAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;IAChC,IAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAC1B,IAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;IAEtC,IAAM,OAAO,GAAG,UAAC,EAAoB;QACnC,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,OAAO,EAAE,OAAO,SAAA,EAAE,YAAY,EAAE,UAAU,EAAE,CAAC;AAC/C,CAAC,CAAC;AAZW,QAAA,cAAc,kBAYzB"}
+{"version":3,"file":"useMenuTrigger.js","sourceRoot":"","sources":["../../src/MenuTrigger/useMenuTrigger.ts"],"names":[],"mappings":";;;AAAA,sDAAwD;AAIjD,IAAM,cAAc,GAAG,UAAC,MAAwB;IACrD,IAAM,OAAO,GAAG,IAAA,4BAAc,GAAE,CAAC;IAEjC,IAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;IAChC,IAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAC1B,IAAM,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC;IACxC,IAAM,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;IAEtC,IAAM,SAAS,GAAG,UAAC,CAAmB;QACpC,IAAI,WAAW,EAAE;YACf,OAAO,CAAC,CAAC,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;SAC/B;IACH,CAAC,CAAC;IAEF,IAAM,OAAO,GAAG,UAAC,CAAmB;QAClC,OAAO,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC,CAAC;IAEF,OAAO,EAAE,OAAO,SAAA,EAAE,SAAS,WAAA,EAAE,YAAY,EAAE,UAAU,EAAE,CAAC;AAC1D,CAAC,CAAC;AAnBW,QAAA,cAAc,kBAmBzB"}

package/lib-commonjs/context/menuContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menuContext.d.ts","sourceRoot":"","sources":["../../src/context/menuContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD;;GAEG;AACH,oBAAY,gBAAgB,GAAG,SAAS,CAAC;AAEzC,eAAO,MAAM,WAAW,0BAKtB,CAAC;AAEH,eAAO,MAAM,YAAY,2BAAuB,CAAC;AACjD,eAAO,MAAM,cAAc,iBAAsC,CAAC"}
+{"version":3,"file":"menuContext.d.ts","sourceRoot":"","sources":["../../src/context/menuContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD;;GAEG;AACH,oBAAY,gBAAgB,GAAG,SAAS,CAAC;AAEzC,eAAO,MAAM,WAAW,0BAMtB,CAAC;AAEH,eAAO,MAAM,YAAY,2BAAuB,CAAC;AACjD,eAAO,MAAM,cAAc,iBAAsC,CAAC"}

package/lib-commonjs/context/menuContext.js

@@ -4,6 +4,7 @@ exports.useMenuContext = exports.MenuProvider = exports.MenuContext = void 0;
 var tslib_1 = require("tslib");
 var React = (0, tslib_1.__importStar)(require("react"));
 exports.MenuContext = React.createContext({
+    isControlled: false,
     isSubmenu: false,
     open: false,
     setOpen: function () { return false; },

package/lib-commonjs/context/menuContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"menuContext.js","sourceRoot":"","sources":["../../src/context/menuContext.ts"],"names":[],"mappings":";;;;AAAA,wDAA+B;AAQlB,QAAA,WAAW,GAAG,KAAK,CAAC,aAAa,CAAmB;IAC/D,SAAS,EAAE,KAAK;IAChB,IAAI,EAAE,KAAK;IACX,OAAO,EAAE,cAAM,OAAA,KAAK,EAAL,CAAK;IACpB,UAAU,EAAE,IAAI;CACjB,CAAC,CAAC;AAEU,QAAA,YAAY,GAAG,mBAAW,CAAC,QAAQ,CAAC;AAC1C,IAAM,cAAc,GAAG,cAAM,OAAA,KAAK,CAAC,UAAU,CAAC,mBAAW,CAAC,EAA7B,CAA6B,CAAC;AAArD,QAAA,cAAc,kBAAuC"}
+{"version":3,"file":"menuContext.js","sourceRoot":"","sources":["../../src/context/menuContext.ts"],"names":[],"mappings":";;;;AAAA,wDAA+B;AAQlB,QAAA,WAAW,GAAG,KAAK,CAAC,aAAa,CAAmB;IAC/D,YAAY,EAAE,KAAK;IACnB,SAAS,EAAE,KAAK;IAChB,IAAI,EAAE,KAAK;IACX,OAAO,EAAE,cAAM,OAAA,KAAK,EAAL,CAAK;IACpB,UAAU,EAAE,IAAI;CACjB,CAAC,CAAC;AAEU,QAAA,YAAY,GAAG,mBAAW,CAAC,QAAQ,CAAC;AAC1C,IAAM,cAAc,GAAG,cAAM,OAAA,KAAK,CAAC,UAAU,CAAC,mBAAW,CAAC,EAA7B,CAA6B,CAAC;AAArD,QAAA,cAAc,kBAAuC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-react-native/menu",
-  "version": "0.5.2",
+  "version": "0.6.0",
   "description": "A cross-platform Menu component using the Fluent Design System",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",

package/src/Menu/Menu.types.ts

@@ -1,14 +1,19 @@
 import type { IViewProps } from '@fluentui-react-native/adapters';
+import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import React from 'react';
 
 export const menuName = 'Menu';
 
 export interface MenuProps extends Omit<IViewProps, 'onPress'> {
+  defaultOpen?: boolean;
   open?: boolean;
+  onOpenChange?: (e: InteractionEvent, isOpen: boolean) => void;
+  openOnHover?: boolean;
 }
 
 export interface MenuState extends MenuProps {
+  isControlled: boolean;
   isSubmenu: boolean;
-  setOpen: (isOpen: boolean) => void;
+  setOpen: (e: InteractionEvent, isOpen: boolean) => void;
   triggerRef: React.RefObject<React.Component>;
 }

package/src/Menu/useMenu.ts

@@ -1,21 +1,44 @@
+import { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
 import React from 'react';
 import { useMenuContext } from '../context/menuContext';
 import { MenuProps, MenuState } from './Menu.types';
 
 export const useMenu = (props: MenuProps): MenuState => {
-  const [open, setOpen] = useMenuOpenState(props);
   const triggerRef = React.useRef(null);
   const context = useMenuContext();
   const isSubmenu = context.triggerRef !== null;
+  const isControlled = typeof props.open !== 'undefined';
+  const [open, setOpen] = useMenuOpenState(isControlled, props);
 
   return {
+    ...props,
     open,
     setOpen,
     triggerRef,
     isSubmenu,
+    isControlled,
   };
 };
 
-const useMenuOpenState = (props: MenuProps) => {
-  return React.useState<boolean>(props.open);
+const useMenuOpenState = (isControlled: boolean, props: MenuProps): [boolean, (e: InteractionEvent, isOpen: boolean) => void] => {
+  const { defaultOpen, onOpenChange, open } = props;
+  const initialState = typeof defaultOpen !== 'undefined' ? defaultOpen : !!open;
+  const [openInternal, setOpenInternal] = React.useState<boolean>(initialState);
+
+  const state = isControlled ? open : openInternal;
+
+  const setOpen = React.useCallback(
+    (e: InteractionEvent, isOpen: boolean) => {
+      const openPrev = state;
+      if (!isControlled) {
+        setOpenInternal(isOpen);
+      }
+      if (onOpenChange && openPrev !== isOpen) {
+        onOpenChange(e, isOpen);
+      }
+    },
+    [isControlled, state, onOpenChange, setOpenInternal],
+  );
+
+  return [state, setOpen];
 };

package/src/Menu/useMenuContextValue.ts

@@ -2,5 +2,5 @@ import { MenuContextValue } from '../context/menuContext';
 import { MenuState } from './Menu.types';
 
 export const useMenuContextValue = (state: MenuState): MenuContextValue => {
-  return { open: state.open, setOpen: state.setOpen, triggerRef: state.triggerRef, isSubmenu: state.isSubmenu };
+  return { ...state };
 };

package/src/MenuPopover/MenuPopover.tsx

@@ -10,7 +10,13 @@ export const MenuPopover = stagedComponent((props: MenuPopoverProps) => {
 
   return (_rest: MenuPopoverProps, children: React.ReactNode) => {
     return (
-      <Callout target={state.triggerRef} borderWidth={1} borderColor={theme.colors.neutralStrokeAccessible}>
+      <Callout
+        borderWidth={1}
+        borderColor={theme.colors.neutralStrokeAccessible}
+        target={state.triggerRef}
+        onDismiss={state.onDismiss}
+        dismissBehaviors={state.dismissBehaviors}
+      >
         {children}
       </Callout>
     );

package/src/MenuPopover/MenuPopover.types.ts

@@ -1,9 +1,12 @@
 import type { IViewProps } from '@fluentui-react-native/adapters';
+import { DismissBehaviors } from '@fluentui-react-native/callout';
 
 export const menuPopoverName = 'MenuPopover';
 
 export interface MenuPopoverProps extends Omit<IViewProps, 'onPress'> {}
 
 export interface MenuPopoverState {
+  dismissBehaviors: DismissBehaviors[];
+  onDismiss: () => void;
   triggerRef: React.RefObject<React.Component>;
 }

package/src/MenuPopover/useMenuPopover.ts

@@ -1,10 +1,17 @@
+import React from 'react';
+import { DismissBehaviors } from '@fluentui-react-native/callout';
 import { useMenuContext } from '../context/menuContext';
 import { MenuPopoverProps, MenuPopoverState } from './MenuPopover.types';
 
 export const useMenuPopover = (_props: MenuPopoverProps): MenuPopoverState => {
   const context = useMenuContext();
+  const setOpen = context.setOpen;
 
   const triggerRef = context.triggerRef;
+  const onDismiss = React.useCallback(() => setOpen(undefined, false /* isOpen */), [setOpen]);
+  const dismissBehaviors = context.isControlled
+    ? (['preventDismissOnKeyDown', 'preventDismissOnClickOutside'] as DismissBehaviors[])
+    : undefined;
 
-  return { triggerRef };
+  return { triggerRef, onDismiss, dismissBehaviors };
 };

package/src/MenuTrigger/useMenuTrigger.ts

@@ -7,11 +7,18 @@ export const useMenuTrigger = (_props: MenuTriggerProps) => {
 
   const setOpen = context.setOpen;
   const open = context.open;
+  const openOnHover = context.openOnHover;
   const triggerRef = context.triggerRef;
 
-  const onClick = (_e: InteractionEvent) => {
-    setOpen(!open);
+  const onHoverIn = (e: InteractionEvent) => {
+    if (openOnHover) {
+      setOpen(e, true /* isOpen */);
+    }
   };
 
-  return { onClick, componentRef: triggerRef };
+  const onClick = (e: InteractionEvent) => {
+    setOpen(e, !open);
+  };
+
+  return { onClick, onHoverIn, componentRef: triggerRef };
 };

package/src/context/menuContext.ts

@@ -7,6 +7,7 @@ import type { MenuState } from '../Menu/Menu.types';
 export type MenuContextValue = MenuState;
 
 export const MenuContext = React.createContext<MenuContextValue>({
+  isControlled: false,
   isSubmenu: false,
   open: false,
   setOpen: () => false,