@fluentui-react-native/tester 0.59.19 → 0.59.22

package/lib-commonjs/FluentTester/testPages.win32.js.map

@@ -1 +1 @@
-{"version":3,"file":"testPages.win32.js","sourceRoot":"","sources":["../../src/FluentTester/testPages.win32.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"testPages.win32.js","sourceRoot":"","sources":["../../src/FluentTester/testPages.win32.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-react-native/tester",
-  "version": "0.59.19",
+  "version": "0.59.22",
   "description": "A test app to test FluentUI React Native Components during development",
   "license": "MIT",
   "author": "Microsoft <fluentuinativeowners@microsoft.com>",
@@ -26,31 +26,32 @@
   },
   "dependencies": {
     "@fluentui-react-native/android-theme": ">=0.7.0 <1.0.0",
-    "@fluentui-react-native/apple-theme": ">=0.11.2 <1.0.0",
-    "@fluentui-react-native/badge": ">=0.0.26 <1.0.0",
-    "@fluentui-react-native/button": ">=0.22.17 <1.0.0",
-    "@fluentui-react-native/default-theme": ">=0.10.0 <1.0.0",
-    "@fluentui-react-native/experimental-activity-indicator": ">=0.5.21 <1.0.0",
-    "@fluentui-react-native/experimental-avatar": ">=0.14.13 <1.0.0",
-    "@fluentui-react-native/experimental-button": "0.15.17",
-    "@fluentui-react-native/experimental-checkbox": "0.10.15",
-    "@fluentui-react-native/experimental-drawer": ">=0.1.5 <1.0.0",
+    "@fluentui-react-native/apple-theme": ">=0.11.3 <1.0.0",
+    "@fluentui-react-native/badge": ">=0.0.28 <1.0.0",
+    "@fluentui-react-native/button": ">=0.22.18 <1.0.0",
+    "@fluentui-react-native/default-theme": ">=0.10.1 <1.0.0",
+    "@fluentui-react-native/experimental-activity-indicator": ">=0.5.22 <1.0.0",
+    "@fluentui-react-native/experimental-avatar": ">=0.14.15 <1.0.0",
+    "@fluentui-react-native/experimental-button": "0.15.18",
+    "@fluentui-react-native/experimental-checkbox": "0.10.16",
+    "@fluentui-react-native/experimental-drawer": ">=0.1.6 <1.0.0",
     "@fluentui-react-native/experimental-native-date-picker": ">=0.4.1 <1.0.0",
-    "@fluentui-react-native/experimental-expander": "0.3.23",
-    "@fluentui-react-native/experimental-menu-button": ">=0.3.32 <1.0.0",
-    "@fluentui-react-native/experimental-shimmer": "0.6.25",
-    "@fluentui-react-native/experimental-tabs": "0.4.40",
-    "@fluentui-react-native/experimental-text": ">=0.7.22 <1.0.0",
-    "@fluentui-react-native/framework": ">=0.7.22 <1.0.0",
-    "@fluentui-react-native/icon": "0.11.17",
-    "@fluentui-react-native/interactive-hooks": ">=0.15.2 <1.0.0",
-    "@fluentui-react-native/stack": ">=0.6.22 <1.0.0",
+    "@fluentui-react-native/experimental-expander": "0.3.24",
+    "@fluentui-react-native/experimental-menu-button": ">=0.3.33 <1.0.0",
+    "@fluentui-react-native/experimental-shimmer": "0.6.26",
+    "@fluentui-react-native/experimental-tabs": "0.4.41",
+    "@fluentui-react-native/experimental-text": ">=0.7.23 <1.0.0",
+    "@fluentui-react-native/framework": ">=0.7.23 <1.0.0",
+    "@fluentui-react-native/icon": "0.11.18",
+    "@fluentui-react-native/interactive-hooks": ">=0.15.3 <1.0.0",
+    "@fluentui-react-native/menu": ">=0.2.0 <1.0.0",
+    "@fluentui-react-native/stack": ">=0.6.23 <1.0.0",
     "@fluentui-react-native/theme": ">=0.6.6 <1.0.0",
     "@fluentui-react-native/theme-types": ">=0.14.1 <1.0.0",
     "@fluentui-react-native/themed-stylesheet": "^1.3.3",
     "@fluentui-react-native/theming-utils": ">=0.10.0 <1.0.0",
-    "@fluentui-react-native/win32-theme": ">=0.16.1 <1.0.0",
-    "@fluentui/react-native": ">=0.28.12 <1.0.0",
+    "@fluentui-react-native/win32-theme": ">=0.16.2 <1.0.0",
+    "@fluentui/react-native": ">=0.28.13 <1.0.0",
     "@react-native-community/slider": "^4.2.0",
     "@react-native-menu/menu": "^0.1.2",
     "@react-native-picker/picker": "^2.2.1",

package/src/E2E/MenuButton/pages/MenuButtonPageObject.win.ts

@@ -1,7 +1,7 @@
 import {
   MENU_BUTTON_TESTPAGE,
   MENU_BUTTON_TEST_COMPONENT,
-  HOMEPAGE_MENU_BUTTON,
+  HOMEPAGE_MENUBUTTON_BUTTON,
   MENU_BUTTON_NO_A11Y_LABEL_COMPONENT,
   MENU_ITEM_1_COMPONENT,
 } from '../../../FluentTester/TestComponents/MenuButton/consts';
@@ -69,7 +69,7 @@ class MenuButtonPageObject extends BasePage {
   }
 
   get _pageButton() {
-    return By(HOMEPAGE_MENU_BUTTON);
+    return By(HOMEPAGE_MENUBUTTON_BUTTON);
   }
 
   get _menuItem() {

package/src/E2E/common/NavigateAppPage.macos.ts

@@ -7,7 +7,7 @@ import { HOMEPAGE_FOCUSTRAPZONE_BUTTON } from '../../FluentTester/TestComponents
 import { HOMEPAGE_FOCUSZONE_BUTTON } from '../../FluentTester/TestComponents/FocusZone/consts';
 import { HOMEPAGE_ICON_BUTTON } from '../../FluentTester/TestComponents/Icon/consts';
 import { HOMEPAGE_LINK_BUTTON } from '../../FluentTester/TestComponents/Link/consts';
-import { HOMEPAGE_MENU_BUTTON } from '../../FluentTester/TestComponents/MenuButton/consts';
+import { HOMEPAGE_MENUBUTTON_BUTTON } from '../../FluentTester/TestComponents/MenuButton/consts';
 import { HOMEPAGE_PERSONA_BUTTON } from '../../FluentTester/TestComponents/Persona/consts';
 import { HOMEPAGE_PERSONACOIN_BUTTON } from '../../FluentTester/TestComponents/PersonaCoin/consts';
 import { HOMEPAGE_PRESSABLE_BUTTON } from '../../FluentTester/TestComponents/Pressable/consts';
@@ -138,7 +138,7 @@ class NavigateAppPage extends BasePage {
   }
 
   private get menuButtonPage() {
-    return By(HOMEPAGE_MENU_BUTTON);
+    return By(HOMEPAGE_MENUBUTTON_BUTTON);
   }
 
   private get personaPage() {

package/src/E2E/common/NavigateAppPage.win.ts

@@ -9,7 +9,7 @@ import { HOMEPAGE_FOCUSTRAPZONE_BUTTON } from '../../FluentTester/TestComponents
 import { HOMEPAGE_FOCUSZONE_BUTTON } from '../../FluentTester/TestComponents/FocusZone/consts';
 import { HOMEPAGE_ICON_BUTTON } from '../../FluentTester/TestComponents/Icon/consts';
 import { HOMEPAGE_LINK_BUTTON } from '../../FluentTester/TestComponents/Link/consts';
-import { HOMEPAGE_MENU_BUTTON } from '../../FluentTester/TestComponents/MenuButton/consts';
+import { HOMEPAGE_MENUBUTTON_BUTTON } from '../../FluentTester/TestComponents/MenuButton/consts';
 import { HOMEPAGE_EXPERIMENTAL_MENU_BUTTON } from '../../FluentTester/TestComponents/MenuButtonExperimental/consts';
 import { HOMEPAGE_PERSONA_BUTTON } from '../../FluentTester/TestComponents/Persona/consts';
 import { HOMEPAGE_PERSONACOIN_BUTTON } from '../../FluentTester/TestComponents/PersonaCoin/consts';
@@ -176,7 +176,7 @@ class NavigateAppPage extends BasePage {
   }
 
   private get menuButtonPage() {
-    return By(HOMEPAGE_MENU_BUTTON);
+    return By(HOMEPAGE_MENUBUTTON_BUTTON);
   }
 
   private get menuButtonExperimentalPage() {

package/src/FluentTester/TestComponents/Avatar/BasicAvatar.tsx

@@ -1,12 +1,14 @@
 import React, { useState, useCallback, FunctionComponent } from 'react';
 import {
   AvatarSize,
+  AvatarSizes,
   AvatarColor,
   JSAvatar,
   AvatarPresence,
   AvatarActive,
   AvatarActiveAppearance,
 } from '@fluentui-react-native/experimental-avatar';
+import { PresenceBadgeStatuses } from '@fluentui-react-native/badge';
 import { Switch, View, Text, Picker, ColorValue } from 'react-native';
 import { satyaPhotoUrl, undefinedText } from './../PersonaCoin/styles';
 import { commonTestStyles as commonStyles } from '../Common/styles';
@@ -18,18 +20,7 @@ type WithUndefined<T> = T | typeof undefinedText;
 const avatarActive: AvatarActive[] = ['unset', 'active', 'inactive'];
 const avatarActiveAppearance: AvatarActiveAppearance[] = ['ring', 'shadow', 'glow', 'ring-shadow', 'ring-glow'];
 
-const allSizes: WithUndefined<AvatarSize>[] = [
-  undefinedText,
-  'size8',
-  'size24',
-  'size32',
-  'size40',
-  'size48',
-  'size56',
-  'size72',
-  'size100',
-  'size120',
-];
+const allSizes: WithUndefined<AvatarSize>[] = [undefinedText, ...AvatarSizes];
 
 const allColors: WithUndefined<AvatarColor>[] = [
   undefinedText,
@@ -55,7 +46,7 @@ const allColors: WithUndefined<AvatarColor>[] = [
   'brown',
 ];
 
-const allPresences: WithUndefined<AvatarPresence>[] = [undefinedText, 'none', 'online', 'offline', 'busy', 'dnd', 'blocked', 'away'];
+const allPresences: WithUndefined<AvatarPresence>[] = [undefinedText, ...PresenceBadgeStatuses];
 
 const StyledPicker = (props) => {
   const { prompt, selected, onChange, collection } = props;
@@ -78,7 +69,7 @@ export const StandardUsage: FunctionComponent = () => {
   const [activeAppearance, setActiveAppearance] = useState<AvatarActiveAppearance>('ring');
   const [imageSize, setImageSize] = useState<WithUndefined<AvatarSize>>('size72');
   const [coinColor, setCoinColor] = useState<WithUndefined<AvatarColor>>('brass');
-  const [presence, setPresence] = useState<WithUndefined<AvatarPresence>>('online');
+  const [presence, setPresence] = useState<WithUndefined<AvatarPresence>>('available');
 
   const onActiveChange = useCallback((value) => setActive(value), []);
   const onActiveAppearanceChange = useCallback((value) => setActiveAppearance(value), []);

package/src/FluentTester/TestComponents/Badge/BadgeTest.tsx

@@ -70,7 +70,7 @@ export const BasicBadge: React.FunctionComponent = () => {
           <Text>Presence Badge</Text>
           <PresenceBadge presence="available" size="largest" />
           <PresenceBadge presence="available" isOutOfOffice={true} size="large" />
-          <PresenceBadge presence="doNotDisturb" text="doNotDisturb" isOutOfOffice={true} />
+          <PresenceBadge presence="doNotDisturb" isOutOfOffice={true} />
           <PresenceBadge presence="away" size="small" />
           <PresenceBadge presence="busy" size="smallest" />
           <PresenceBadge presence="offline" />

package/src/FluentTester/TestComponents/Menu/MenuTest.tsx

@@ -0,0 +1,48 @@
+import * as React from 'react';
+import { View } from 'react-native';
+import { ButtonV1 as Button } from '@fluentui/react-native';
+import { Menu, MenuTrigger, MenuPopover } from '@fluentui-react-native/menu';
+import { Stack } from '@fluentui-react-native/stack';
+import { Text } from '@fluentui-react-native/experimental-text';
+import { stackStyle } from '../Common/styles';
+import { MENU_TESTPAGE } from './consts';
+import { Test, TestSection, PlatformStatus } from '../Test';
+
+const MenuDefault: React.FunctionComponent = () => {
+  return (
+    <Stack style={stackStyle}>
+      <Menu>
+        <MenuTrigger>
+          <Button>Test</Button>
+        </MenuTrigger>
+        <MenuPopover>
+          <View style={{ backgroundColor: 'red', height: 50, width: 200 }}>
+            <Text>Hello world!!!</Text>
+          </View>
+        </MenuPopover>
+      </Menu>
+    </Stack>
+  );
+};
+
+const menuSections: TestSection[] = [
+  {
+    name: 'Menu Default',
+    testID: MENU_TESTPAGE,
+    component: MenuDefault,
+  },
+];
+
+export const MenuTest: React.FunctionComponent = () => {
+  const status: PlatformStatus = {
+    win32Status: 'Experimental',
+    uwpStatus: 'Backlog',
+    iosStatus: 'Backlog',
+    macosStatus: 'Experimental',
+    androidStatus: 'Backlog',
+  };
+
+  const description = '!!!!!!!TODO TODO TODO TODO!!!!!!!!';
+
+  return <Test name="Menu Test" description={description} sections={menuSections} status={status}></Test>;
+};

package/src/FluentTester/TestComponents/Menu/consts.ts

@@ -0,0 +1,2 @@
+export const HOMEPAGE_MENU_BUTTON = 'Homepage_Menu_Button';
+export const MENU_TESTPAGE = 'Menu_TestPage';

package/src/FluentTester/TestComponents/Menu/index.ts

@@ -0,0 +1,2 @@
+export * from './MenuTest';
+export * from './consts';

package/src/FluentTester/TestComponents/MenuButton/consts.ts

@@ -1,4 +1,4 @@
-export const HOMEPAGE_MENU_BUTTON = 'Homepage_MenuButton_Button';
+export const HOMEPAGE_MENUBUTTON_BUTTON = 'Homepage_MenuButton_Button';
 export const MENU_BUTTON_TESTPAGE = 'MenuButton_TestPage';
 
 /* E2E Testing Menu_Button 1 */

package/src/FluentTester/testPages.macos.ts

@@ -18,7 +18,7 @@ import { HOMEPAGE_SEPARATOR_BUTTON, SeparatorTest } from './TestComponents/Separ
 import { HOMEPAGE_SVG_BUTTON, SvgTest } from './TestComponents/Svg';
 import { HOMEPAGE_TEXT_BUTTON, TextTest } from './TestComponents/Text';
 import { HOMEPAGE_THEME_BUTTON, ThemeTest } from './TestComponents/Theme';
-import { HOMEPAGE_MENU_BUTTON, MenuButtonTest } from './TestComponents/MenuButton';
+import { HOMEPAGE_MENUBUTTON_BUTTON, MenuButtonTest } from './TestComponents/MenuButton';
 import { HOMEPAGE_TOKEN_BUTTON, TokenTest } from './TestComponents/Tokens';
 import { HOMEPAGE_TABS_BUTTON, TabsTest } from './TestComponents/Tabs';
 import { HOMEPAGE_EXPERIMENTAL_TABS_BUTTON, ExperimentalTabsTest } from './TestComponents/TabsExperimental';
@@ -100,7 +100,7 @@ export const tests: TestDescription[] = [
   {
     name: 'MenuButton Test',
     component: MenuButtonTest,
-    testPage: HOMEPAGE_MENU_BUTTON,
+    testPage: HOMEPAGE_MENUBUTTON_BUTTON,
   },
   {
     name: 'Persona Test',

package/src/FluentTester/testPages.ts

@@ -19,12 +19,13 @@ import { HOMEPAGE_ICON_BUTTON, IconTest } from './TestComponents/Icon';
 import { CalloutTest, HOMEPAGE_CALLOUT_BUTTON } from './TestComponents/Callout';
 import { ContextualMenuTest, HOMEPAGE_CONTEXTUALMENU_BUTTON } from './TestComponents/ContextualMenu';
 import { ActivityIndicatorTest, HOMEPAGE_ACTIVITY_INDICATOR_BUTTON } from './TestComponents/ActivityIndicator';
-import { MenuButtonTest, HOMEPAGE_MENU_BUTTON } from './TestComponents/MenuButton';
+import { MenuButtonTest, HOMEPAGE_MENUBUTTON_BUTTON } from './TestComponents/MenuButton';
 import { HOMEPAGE_TOKEN_BUTTON, TokenTest } from './TestComponents/Tokens';
 import { ExpanderTest, HOMEPAGE_EXPANDER_BUTTON } from './TestComponents/Expander';
 import { HOMEPAGE_CHECKBOX_EXPERIMENTAL_BUTTON, ExperimentalCheckboxTest } from './TestComponents/CheckboxExperimental';
 import { HOMEPAGE_EXPERIMENTAL_TEXT_BUTTON, TextExperimentalTest } from './TestComponents/TextExperimental';
 import { ExperimentalMenuButtonTest, HOMEPAGE_EXPERIMENTAL_MENU_BUTTON } from './TestComponents/MenuButtonExperimental';
+import { MenuTest, HOMEPAGE_MENU_BUTTON } from './TestComponents/Menu';
 
 export const tests: TestDescription[] = [
   {
@@ -145,7 +146,7 @@ export const tests: TestDescription[] = [
   {
     name: 'MenuButton Test',
     component: MenuButtonTest,
-    testPage: HOMEPAGE_MENU_BUTTON,
+    testPage: HOMEPAGE_MENUBUTTON_BUTTON,
   },
   {
     name: 'Tokens Test',
@@ -162,4 +163,9 @@ export const tests: TestDescription[] = [
     component: ExperimentalMenuButtonTest,
     testPage: HOMEPAGE_EXPERIMENTAL_MENU_BUTTON,
   },
+  {
+    name: 'Menu Test',
+    component: MenuTest,
+    testPage: HOMEPAGE_MENU_BUTTON,
+  },
 ];

package/src/FluentTester/testPages.win32.ts

@@ -7,7 +7,7 @@ import { ContextualMenuTest, HOMEPAGE_CONTEXTUALMENU_BUTTON } from './TestCompon
 import { FocusTrapTest, HOMEPAGE_FOCUSTRAPZONE_BUTTON } from './TestComponents/FocusTrapZone';
 import { FocusZoneTest, HOMEPAGE_FOCUSZONE_BUTTON } from './TestComponents/FocusZone';
 import { HOMEPAGE_LINK_BUTTON, LinkTest } from './TestComponents/Link';
-import { MenuButtonTest, HOMEPAGE_MENU_BUTTON } from './TestComponents/MenuButton';
+import { MenuButtonTest, HOMEPAGE_MENUBUTTON_BUTTON } from './TestComponents/MenuButton';
 import { HOMEPAGE_PERSONA_BUTTON, PersonaTest } from './TestComponents/Persona';
 import { HOMEPAGE_PERSONACOIN_BUTTON, PersonaCoinTest } from './TestComponents/PersonaCoin';
 import { HOMEPAGE_PRESSABLE_BUTTON, PressableTest } from './TestComponents/Pressable';
@@ -26,6 +26,7 @@ import { TestDescription } from './TestComponents';
 import { HOMEPAGE_CHECKBOX_EXPERIMENTAL_BUTTON, ExperimentalCheckboxTest } from './TestComponents/CheckboxExperimental';
 import { ExperimentalMenuButtonTest, HOMEPAGE_EXPERIMENTAL_MENU_BUTTON } from './TestComponents/MenuButtonExperimental';
 import { ActivityIndicatorTest, HOMEPAGE_ACTIVITY_INDICATOR_BUTTON } from './TestComponents/ActivityIndicator';
+import { MenuTest, HOMEPAGE_MENU_BUTTON } from './TestComponents/Menu';
 // --> testPage import insert
 
 export const tests: TestDescription[] = [
@@ -92,7 +93,7 @@ export const tests: TestDescription[] = [
   {
     name: 'MenuButton Test',
     component: MenuButtonTest,
-    testPage: HOMEPAGE_MENU_BUTTON,
+    testPage: HOMEPAGE_MENUBUTTON_BUTTON,
   },
   {
     name: 'Persona Test',
@@ -164,5 +165,10 @@ export const tests: TestDescription[] = [
     component: ExperimentalMenuButtonTest,
     testPage: HOMEPAGE_EXPERIMENTAL_MENU_BUTTON,
   },
+  {
+    name: 'Menu Test',
+    component: MenuTest,
+    testPage: HOMEPAGE_MENU_BUTTON,
+  },
   // --> testPage component insert,,
 ];