@fluentui-react-native/tester-core 0.1.1

package/lib-commonjs/TestComponents/MenuButtonLegacy/NestedMenuButtonTest.js

@@ -0,0 +1,219 @@
+'use strict';
+var __createBinding =
+  (this && this.__createBinding) ||
+  (Object.create
+    ? function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k;
+        var desc = Object.getOwnPropertyDescriptor(m, k);
+        if (!desc || ('get' in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+          desc = {
+            enumerable: true,
+            get: function () {
+              return m[k];
+            },
+          };
+        }
+        Object.defineProperty(o, k2, desc);
+      }
+    : function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k;
+        o[k2] = m[k];
+      });
+var __setModuleDefault =
+  (this && this.__setModuleDefault) ||
+  (Object.create
+    ? function (o, v) {
+        Object.defineProperty(o, 'default', { enumerable: true, value: v });
+      }
+    : function (o, v) {
+        o['default'] = v;
+      });
+var __importStar =
+  (this && this.__importStar) ||
+  (function () {
+    var ownKeys = function (o) {
+      ownKeys =
+        Object.getOwnPropertyNames ||
+        function (o) {
+          var ar = [];
+          for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+          return ar;
+        };
+      return ownKeys(o);
+    };
+    return function (mod) {
+      if (mod && mod.__esModule) return mod;
+      var result = {};
+      if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== 'default') __createBinding(result, mod, k[i]);
+      __setModuleDefault(result, mod);
+      return result;
+    };
+  })();
+Object.defineProperty(exports, '__esModule', { value: true });
+exports.NestedMenuButton = void 0;
+const jsx_runtime_1 = require('react/jsx-runtime');
+const React = __importStar(require('react'));
+const react_native_1 = require('react-native');
+const react_native_2 = require('@fluentui/react-native');
+const MenuButtonLegacyTestStyles_1 = require('./MenuButtonLegacyTestStyles');
+const testData_1 = require('./testData');
+const iconExamples_1 = require('../Common/iconExamples');
+const NestedMenuButton = () => {
+  const [lastMenuItemClicked, setLastMenuItemClicked] = React.useState(null);
+  const [focusOnMount, setShouldFocusOnMount] = React.useState(true);
+  const toggleFocusOnMount = React.useCallback((value) => setShouldFocusOnMount(value), [setShouldFocusOnMount]);
+  const [focusOnContainer, setShouldFocusOnContainer] = React.useState(false);
+  const toggleFocusOnContainer = React.useCallback((value) => setShouldFocusOnContainer(value), [setShouldFocusOnContainer]);
+  const onItemClick = React.useCallback(
+    (key) => {
+      setLastMenuItemClicked(key);
+    },
+    [setLastMenuItemClicked],
+  );
+  const [showSubmenu, setShowSubmenu] = React.useState(false);
+  const [isSubmenuVisible, setIsSubmenuVisible] = React.useState(false);
+  const [lastSubmenuItemClicked, setSubmenuLastItemClicked] = React.useState(null);
+  const toggleShowSubmenu = React.useCallback(() => {
+    setShowSubmenu(!showSubmenu);
+    setIsSubmenuVisible(!isSubmenuVisible);
+  }, [showSubmenu, isSubmenuVisible, setShowSubmenu, setIsSubmenuVisible]);
+  const onShowSubmenu = React.useCallback(() => {
+    setIsSubmenuVisible(true);
+  }, [setIsSubmenuVisible]);
+  const onDismissSubmenu = React.useCallback(() => {
+    setShowSubmenu(false);
+  }, [setShowSubmenu]);
+  const onSubmenuItemClick = React.useCallback(
+    (key) => {
+      setSubmenuLastItemClicked(key);
+    },
+    [setSubmenuLastItemClicked],
+  );
+  const nestedMenuItems = [
+    ...testData_1.menuItems,
+    {
+      hasSubmenu: true,
+      itemKey: '4',
+      text: 'SubmenuItem svg icon',
+      componentRef: React.useRef(null),
+      icon: testData_1.iconProps,
+      onHoverIn: toggleShowSubmenu,
+      showSubmenu,
+      submenuProps: {
+        onShow: onShowSubmenu,
+        setShowMenu: toggleShowSubmenu,
+        onDismiss: onDismissSubmenu,
+        onItemClick: onSubmenuItemClick,
+      },
+      submenuItems: [
+        {
+          icon: testData_1.iconProps,
+          text: 'SubmenuItem svg icon',
+          itemKey: '1',
+        },
+        {
+          itemKey: '2',
+          text: 'SubmenuItem 2',
+          disabled: true,
+        },
+        {
+          itemKey: '3',
+          text: 'SubmenuItem 3',
+        },
+      ],
+    },
+    {
+      itemKey: '5',
+      text: 'Menu Item',
+    },
+    {
+      hasSubmenu: true,
+      itemKey: '6',
+      text: 'SubmenuItem',
+      componentRef: React.useRef(null),
+      submenuProps: {
+        onItemClick: onSubmenuItemClick,
+      },
+      submenuItems: [
+        {
+          text: 'SubmenuItem 1',
+          itemKey: '1',
+        },
+        {
+          itemKey: '2',
+          text: 'SubmenuItem 2',
+        },
+        {
+          itemKey: '3',
+          text: 'SubmenuItem 3',
+        },
+      ],
+    },
+  ];
+  const rasterImageProps = {
+    rasterImageSource: {
+      src: iconExamples_1.testImage,
+    },
+    width: 12,
+    height: 12,
+  };
+  return jsx_runtime_1.jsx(react_native_1.View, {
+    children: jsx_runtime_1.jsxs(react_native_1.View, {
+      style: MenuButtonLegacyTestStyles_1.viewWrapperStyle,
+      children: [
+        jsx_runtime_1.jsxs(react_native_1.View, {
+          style: MenuButtonLegacyTestStyles_1.columnStyle,
+          children: [
+            jsx_runtime_1.jsxs(react_native_1.View, {
+              style: MenuButtonLegacyTestStyles_1.rowStyle,
+              children: [
+                jsx_runtime_1.jsx(react_native_1.Text, { children: 'Should Focus on Mount' }),
+                jsx_runtime_1.jsx(react_native_1.Switch, { value: focusOnMount, onValueChange: toggleFocusOnMount }),
+              ],
+            }),
+            jsx_runtime_1.jsxs(react_native_1.View, {
+              style: MenuButtonLegacyTestStyles_1.rowStyle,
+              children: [
+                jsx_runtime_1.jsx(react_native_1.Text, { children: 'Should Focus on Container' }),
+                jsx_runtime_1.jsx(react_native_1.Switch, { value: focusOnContainer, onValueChange: toggleFocusOnContainer }),
+              ],
+            }),
+          ],
+        }),
+        jsx_runtime_1.jsx(react_native_2.Separator, { vertical: true }),
+        jsx_runtime_1.jsxs(react_native_1.View, {
+          style: MenuButtonLegacyTestStyles_1.columnStyle,
+          children: [
+            jsx_runtime_1.jsxs(react_native_1.Text, {
+              children: [
+                jsx_runtime_1.jsx(react_native_1.Text, { children: 'Last Menu Item Clicked: ' }),
+                lastMenuItemClicked > 0
+                  ? jsx_runtime_1.jsx(react_native_1.Text, { style: MenuButtonLegacyTestStyles_1.textColor, children: lastMenuItemClicked })
+                  : jsx_runtime_1.jsx(react_native_1.Text, { style: MenuButtonLegacyTestStyles_1.textColor, children: 'none' }),
+              ],
+            }),
+            jsx_runtime_1.jsxs(react_native_1.Text, {
+              children: [
+                jsx_runtime_1.jsx(react_native_1.Text, { children: 'Last Submenu Item Clicked: ' }),
+                lastSubmenuItemClicked > 0
+                  ? jsx_runtime_1.jsx(react_native_1.Text, {
+                      style: MenuButtonLegacyTestStyles_1.textColor,
+                      children: lastSubmenuItemClicked,
+                    })
+                  : jsx_runtime_1.jsx(react_native_1.Text, { style: MenuButtonLegacyTestStyles_1.textColor, children: 'none' }),
+              ],
+            }),
+            jsx_runtime_1.jsx(react_native_2.MenuButton, {
+              startIcon: rasterImageProps,
+              content: 'Press for Nested MenuButton',
+              menuItems: nestedMenuItems,
+              onItemClick: onItemClick,
+            }),
+          ],
+        }),
+      ],
+    }),
+  });
+};
+exports.NestedMenuButton = NestedMenuButton;
+//# sourceMappingURL=NestedMenuButtonTest.js.map

package/lib-commonjs/TestComponents/MenuButtonLegacy/NestedMenuButtonTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NestedMenuButtonTest.js","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonLegacy/NestedMenuButtonTest.tsx"],"names":[],"mappings":"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"}

package/lib-commonjs/TestComponents/MenuButtonLegacy/StandardMenuButtonTest.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const StandardMenuButton: React.FunctionComponent;
+//# sourceMappingURL=StandardMenuButtonTest.d.ts.map

package/lib-commonjs/TestComponents/MenuButtonLegacy/StandardMenuButtonTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StandardMenuButtonTest.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonLegacy/StandardMenuButtonTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,iBAwGtC,CAAC"}

package/lib-commonjs/TestComponents/MenuButtonLegacy/StandardMenuButtonTest.js

@@ -0,0 +1,198 @@
+'use strict';
+var __createBinding =
+  (this && this.__createBinding) ||
+  (Object.create
+    ? function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k;
+        var desc = Object.getOwnPropertyDescriptor(m, k);
+        if (!desc || ('get' in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+          desc = {
+            enumerable: true,
+            get: function () {
+              return m[k];
+            },
+          };
+        }
+        Object.defineProperty(o, k2, desc);
+      }
+    : function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k;
+        o[k2] = m[k];
+      });
+var __setModuleDefault =
+  (this && this.__setModuleDefault) ||
+  (Object.create
+    ? function (o, v) {
+        Object.defineProperty(o, 'default', { enumerable: true, value: v });
+      }
+    : function (o, v) {
+        o['default'] = v;
+      });
+var __importStar =
+  (this && this.__importStar) ||
+  (function () {
+    var ownKeys = function (o) {
+      ownKeys =
+        Object.getOwnPropertyNames ||
+        function (o) {
+          var ar = [];
+          for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+          return ar;
+        };
+      return ownKeys(o);
+    };
+    return function (mod) {
+      if (mod && mod.__esModule) return mod;
+      var result = {};
+      if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== 'default') __createBinding(result, mod, k[i]);
+      __setModuleDefault(result, mod);
+      return result;
+    };
+  })();
+Object.defineProperty(exports, '__esModule', { value: true });
+exports.StandardMenuButton = void 0;
+const jsx_runtime_1 = require('react/jsx-runtime');
+const React = __importStar(require('react'));
+const react_native_1 = require('react-native');
+const react_native_2 = require('@fluentui/react-native');
+const MenuButtonLegacyTestStyles_1 = require('./MenuButtonLegacyTestStyles');
+const testData_1 = require('./testData');
+const iconExamples_1 = require('../Common/iconExamples');
+const StandardMenuButton = () => {
+  const [lastMenuItemClicked, setLastMenuItemClicked] = React.useState(null);
+  const [focusOnMount, setShouldFocusOnMount] = React.useState(true);
+  const toggleFocusOnMount = React.useCallback((value) => setShouldFocusOnMount(value), [setShouldFocusOnMount]);
+  const [focusOnContainer, setShouldFocusOnContainer] = React.useState(false);
+  const toggleFocusOnContainer = React.useCallback((value) => setShouldFocusOnContainer(value), [setShouldFocusOnContainer]);
+  const onItemClick = React.useCallback(
+    (key) => {
+      setLastMenuItemClicked(key);
+    },
+    [setLastMenuItemClicked],
+  );
+  const contextualMenuProps = {
+    accessibilityLabel: 'MenuButton',
+    shouldFocusOnMount: focusOnMount,
+    shouldFocusOnContainer: focusOnContainer,
+  };
+  const iconToShow = react_native_1.Platform.select({
+    macos: iconExamples_1.testImage, //GH #931, macOS MenuButton only supports showing PNG icons
+    default: testData_1.iconProps,
+  });
+  return jsx_runtime_1.jsx(react_native_1.View, {
+    children: jsx_runtime_1.jsxs(react_native_1.View, {
+      style: MenuButtonLegacyTestStyles_1.viewWrapperStyle,
+      children: [
+        jsx_runtime_1.jsxs(react_native_1.View, {
+          style: MenuButtonLegacyTestStyles_1.columnStyle,
+          children: [
+            jsx_runtime_1.jsxs(react_native_1.View, {
+              style: MenuButtonLegacyTestStyles_1.rowStyle,
+              children: [
+                jsx_runtime_1.jsx(react_native_1.Text, { children: 'Should Focus on Mount' }),
+                jsx_runtime_1.jsx(react_native_1.Switch, { value: focusOnMount, onValueChange: toggleFocusOnMount }),
+              ],
+            }),
+            jsx_runtime_1.jsxs(react_native_1.View, {
+              style: MenuButtonLegacyTestStyles_1.rowStyle,
+              children: [
+                jsx_runtime_1.jsx(react_native_1.Text, { children: 'Should Focus on Container' }),
+                jsx_runtime_1.jsx(react_native_1.Switch, { value: focusOnContainer, onValueChange: toggleFocusOnContainer }),
+              ],
+            }),
+          ],
+        }),
+        jsx_runtime_1.jsx(react_native_2.Separator, { vertical: true }),
+        jsx_runtime_1.jsxs(react_native_1.View, {
+          style: MenuButtonLegacyTestStyles_1.columnStyle,
+          children: [
+            jsx_runtime_1.jsxs(react_native_1.Text, {
+              children: [
+                jsx_runtime_1.jsx(react_native_1.Text, { children: 'Last Menu Item Clicked: ' }),
+                lastMenuItemClicked > 0
+                  ? jsx_runtime_1.jsx(react_native_1.Text, { style: MenuButtonLegacyTestStyles_1.textColor, children: lastMenuItemClicked })
+                  : jsx_runtime_1.jsx(react_native_1.Text, { style: MenuButtonLegacyTestStyles_1.textColor, children: 'none' }),
+              ],
+            }),
+            jsx_runtime_1.jsxs(react_native_1.View, {
+              style: { ...MenuButtonLegacyTestStyles_1.rowStyle, paddingHorizontal: 5 },
+              children: [
+                jsx_runtime_1.jsxs(react_native_1.View, {
+                  style: MenuButtonLegacyTestStyles_1.columnStyle,
+                  children: [
+                    jsx_runtime_1.jsx(react_native_2.MenuButton, {
+                      content: 'Standard MenuButton',
+                      menuItems: testData_1.menuItems,
+                      onItemClick: onItemClick,
+                      contextualMenu: contextualMenuProps,
+                    }),
+                    jsx_runtime_1.jsx(react_native_1.Text, { children: 'MenuButton with icon' }),
+                    jsx_runtime_1.jsx(react_native_2.MenuButton, {
+                      startIcon: iconToShow,
+                      content: 'MenuButton',
+                      menuItems: testData_1.menuItems,
+                      onItemClick: onItemClick,
+                      contextualMenu: contextualMenuProps,
+                    }),
+                    jsx_runtime_1.jsx(react_native_1.Text, { children: 'MenuButton with only icon' }),
+                    jsx_runtime_1.jsx(react_native_2.MenuButton, {
+                      startIcon: iconToShow,
+                      menuItems: testData_1.menuItems,
+                      onItemClick: onItemClick,
+                      contextualMenu: contextualMenuProps,
+                    }),
+                    jsx_runtime_1.jsx(react_native_1.Text, { children: 'Disabled MenuButton' }),
+                    jsx_runtime_1.jsx(react_native_2.MenuButton, {
+                      disabled: true,
+                      content: 'Disabled MenuButton',
+                      menuItems: testData_1.menuItems,
+                    }),
+                  ],
+                }),
+                jsx_runtime_1.jsx(react_native_2.Separator, { vertical: true }),
+                jsx_runtime_1.jsxs(react_native_1.View, {
+                  style: MenuButtonLegacyTestStyles_1.columnStyle,
+                  children: [
+                    jsx_runtime_1.jsx(react_native_2.MenuButton, {
+                      primary: true,
+                      content: 'Primary MenuButton',
+                      menuItems: testData_1.menuItems,
+                      onItemClick: onItemClick,
+                      contextualMenu: contextualMenuProps,
+                    }),
+                    jsx_runtime_1.jsx(react_native_1.Text, { children: 'Primary MenuButton with icon' }),
+                    jsx_runtime_1.jsx(react_native_2.MenuButton, {
+                      primary: true,
+                      startIcon: iconToShow,
+                      content: 'Primary MenuButton',
+                      menuItems: testData_1.menuItems,
+                      onItemClick: onItemClick,
+                      contextualMenu: contextualMenuProps,
+                    }),
+                    jsx_runtime_1.jsx(react_native_1.Text, { children: 'Primary MenuButton with only icon' }),
+                    jsx_runtime_1.jsx(react_native_2.MenuButton, {
+                      primary: true,
+                      startIcon: iconToShow,
+                      menuItems: testData_1.menuItems,
+                      onItemClick: onItemClick,
+                      contextualMenu: contextualMenuProps,
+                    }),
+                    jsx_runtime_1.jsx(react_native_1.Text, { children: 'Primary Disabled MenuButton' }),
+                    jsx_runtime_1.jsx(react_native_2.MenuButton, {
+                      primary: true,
+                      disabled: true,
+                      content: 'Disabled Primary MenuButton',
+                      menuItems: testData_1.menuItems,
+                    }),
+                  ],
+                }),
+              ],
+            }),
+          ],
+        }),
+      ],
+    }),
+  });
+};
+exports.StandardMenuButton = StandardMenuButton;
+//# sourceMappingURL=StandardMenuButtonTest.js.map

package/lib-commonjs/TestComponents/MenuButtonLegacy/StandardMenuButtonTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StandardMenuButtonTest.js","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonLegacy/StandardMenuButtonTest.tsx"],"names":[],"mappings":"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"}

package/lib-commonjs/TestComponents/MenuButtonLegacy/index.d.ts

@@ -0,0 +1,2 @@
+export * from './MenuButtonLegacyTest';
+//# sourceMappingURL=index.d.ts.map

package/lib-commonjs/TestComponents/MenuButtonLegacy/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonLegacy/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC"}

package/lib-commonjs/TestComponents/MenuButtonLegacy/index.js

@@ -0,0 +1,29 @@
+'use strict';
+var __createBinding =
+  (this && this.__createBinding) ||
+  (Object.create
+    ? function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k;
+        var desc = Object.getOwnPropertyDescriptor(m, k);
+        if (!desc || ('get' in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+          desc = {
+            enumerable: true,
+            get: function () {
+              return m[k];
+            },
+          };
+        }
+        Object.defineProperty(o, k2, desc);
+      }
+    : function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k;
+        o[k2] = m[k];
+      });
+var __exportStar =
+  (this && this.__exportStar) ||
+  function (m, exports) {
+    for (var p in m) if (p !== 'default' && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+  };
+Object.defineProperty(exports, '__esModule', { value: true });
+__exportStar(require('./MenuButtonLegacyTest'), exports);
+//# sourceMappingURL=index.js.map

package/lib-commonjs/TestComponents/MenuButtonLegacy/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonLegacy/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,yDAAuC"}

package/lib-commonjs/TestComponents/MenuButtonLegacy/testData.d.ts

@@ -0,0 +1,8 @@
+import type { MenuButtonItemProps } from '@fluentui/react-native';
+export declare const menuItems: MenuButtonItemProps[];
+export declare const iconProps: {
+  svgSource: import('@fluentui-react-native/icon').SvgIconProps;
+  width: number;
+  height: number;
+};
+//# sourceMappingURL=testData.d.ts.map

package/lib-commonjs/TestComponents/MenuButtonLegacy/testData.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"testData.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonLegacy/testData.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAKlE,eAAO,MAAM,SAAS,EAAE,mBAAmB,EAgB1C,CAAC;AAEF,eAAO,MAAM,SAAS;;;;CAAiD,CAAC"}

package/lib-commonjs/TestComponents/MenuButtonLegacy/testData.js

@@ -0,0 +1,24 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+exports.iconProps = exports.menuItems = void 0;
+const e2e_testing_1 = require('@fluentui-react-native/e2e-testing');
+const iconExamples_1 = require('../Common/iconExamples');
+exports.menuItems = [
+  {
+    itemKey: '1',
+    text: 'MenuItem 1',
+    icon: iconExamples_1.testImage,
+    testID: e2e_testing_1.MENU_ITEM_1_COMPONENT,
+  },
+  {
+    itemKey: '2',
+    text: 'MenuItem 2',
+  },
+  {
+    itemKey: '3',
+    text: 'MenuItem 3',
+    disabled: true,
+  },
+];
+exports.iconProps = { svgSource: iconExamples_1.svgProps, width: 12, height: 12 };
+//# sourceMappingURL=testData.js.map

package/lib-commonjs/TestComponents/MenuButtonLegacy/testData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"testData.js","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonLegacy/testData.ts"],"names":[],"mappings":";;;AACA,oEAA2E;AAE3E,yDAA6D;AAEhD,QAAA,SAAS,GAA0B;IAC9C;QACE,OAAO,EAAE,GAAG;QACZ,IAAI,EAAE,YAAY;QAClB,IAAI,EAAE,wBAAS;QACf,MAAM,EAAE,mCAAqB;KAC9B;IACD;QACE,OAAO,EAAE,GAAG;QACZ,IAAI,EAAE,YAAY;KACnB;IACD;QACE,OAAO,EAAE,GAAG;QACZ,IAAI,EAAE,YAAY;QAClB,QAAQ,EAAE,IAAI;KACf;CACF,CAAC;AAEW,QAAA,SAAS,GAAG,EAAE,SAAS,EAAE,uBAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC"}

package/lib-commonjs/TestComponents/MenuButtonV1/CustomizedMenuButtonTest.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const CustomizedMenuButton: React.FunctionComponent;
+//# sourceMappingURL=CustomizedMenuButtonTest.d.ts.map

package/lib-commonjs/TestComponents/MenuButtonV1/CustomizedMenuButtonTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomizedMenuButtonTest.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonV1/CustomizedMenuButtonTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAoB/B,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,iBAaxC,CAAC"}

package/lib-commonjs/TestComponents/MenuButtonV1/CustomizedMenuButtonTest.js

@@ -0,0 +1,38 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+exports.CustomizedMenuButton = void 0;
+const jsx_runtime_1 = require('react/jsx-runtime');
+const react_native_1 = require('react-native');
+const react_native_2 = require('@fluentui/react-native');
+const MenuButtonV1TestStyles_1 = require('./MenuButtonV1TestStyles');
+const testData_1 = require('./testData');
+const StyledMenuButton = react_native_2.MenuButton.customize({
+  button: {
+    borderRadius: 4,
+    backgroundColor: '#0095ff',
+    borderWidth: 0,
+    color: '#fff',
+    variant: 'heroSemibold',
+    fontFamily: 'Georgia',
+  },
+  contextualMenu: { backgroundColor: '#a9dbff' },
+});
+const CustomizedMenuButton = () => {
+  return jsx_runtime_1.jsxs(react_native_1.View, {
+    children: [
+      jsx_runtime_1.jsx(react_native_1.View, {
+        style: MenuButtonV1TestStyles_1.viewWrapperStyle,
+        children: jsx_runtime_1.jsx(react_native_1.View, {
+          style: MenuButtonV1TestStyles_1.columnStyle,
+          children: jsx_runtime_1.jsx(react_native_1.View, {
+            style: MenuButtonV1TestStyles_1.rowStyle,
+            children: jsx_runtime_1.jsx(react_native_1.Text, { children: 'MenuButton with customized UI' }),
+          }),
+        }),
+      }),
+      jsx_runtime_1.jsx(StyledMenuButton, { content: 'styled MenuButton', menuItems: testData_1.menuItems }),
+    ],
+  });
+};
+exports.CustomizedMenuButton = CustomizedMenuButton;
+//# sourceMappingURL=CustomizedMenuButtonTest.js.map

package/lib-commonjs/TestComponents/MenuButtonV1/CustomizedMenuButtonTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomizedMenuButtonTest.js","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonV1/CustomizedMenuButtonTest.tsx"],"names":[],"mappings":";;;;AACA,+CAA0C;AAE1C,yDAAoD;AAEpD,qEAAmF;AACnF,yCAAuC;AAEvC,MAAM,gBAAgB,GAAG,yBAAU,CAAC,SAAS,CAAC;IAC5C,MAAM,EAAE;QACN,YAAY,EAAE,CAAC;QACf,eAAe,EAAE,SAAS;QAC1B,WAAW,EAAE,CAAC;QACd,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,cAAc;QACvB,UAAU,EAAE,SAAS;KACtB;IACD,cAAc,EAAE,EAAE,eAAe,EAAE,SAAS,EAAE;CAC/C,CAAC,CAAC;AAEI,MAAM,oBAAoB,GAA4B,GAAG,EAAE,CAAC;IACjE,OAAO,CACL,mBAAC,mBAAI;YACH,kBAAC,mBAAI,IAAC,KAAK,EAAE,yCAAgB,YAC3B,kBAAC,mBAAI,IAAC,KAAK,EAAE,oCAAW,YACtB,kBAAC,mBAAI,IAAC,KAAK,EAAE,iCAAQ,YACnB,kBAAC,mBAAI,gDAAqC,GACrC,GACF,GACF,EACP,kBAAC,gBAAgB,IAAC,OAAO,EAAC,mBAAmB,EAAC,SAAS,EAAE,oBAAS,GAAI;YACjE,CACR,CAAC;AAAA,CACH,CAAC;AAbW,QAAA,oBAAoB,GAApB,oBAAoB,CAa/B"}

package/lib-commonjs/TestComponents/MenuButtonV1/MenuButtonV1E2ETest.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const MenuButtonV1E2ETest: React.FunctionComponent;
+//# sourceMappingURL=MenuButtonV1E2ETest.d.ts.map

package/lib-commonjs/TestComponents/MenuButtonV1/MenuButtonV1E2ETest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuButtonV1E2ETest.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonV1/MenuButtonV1E2ETest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgB/B,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,iBAqDvC,CAAC"}