@fluentui-react-native/tester 0.62.7 → 0.63.2

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

@@ -107,6 +107,7 @@ const Submenu: React.FunctionComponent = () => {
         <MenuList>
           <MenuItem content="A nested MenuItem" />
           <MenuItem content="A second nested MenuItem" />
+          <Submenu />
         </MenuList>
       </MenuPopover>
     </Menu>

package/src/FluentTester/TestComponents/Shadow/ShadowTest.tsx

@@ -0,0 +1,39 @@
+import * as React from 'react';
+import { Text } from 'react-native';
+import { Test, TestSection, PlatformStatus } from '../Test';
+import { SHADOW_TESTPAGE } from './consts';
+
+const ShadowDepthRampTest: React.FunctionComponent = () => {
+  return <Text>TODO</Text>;
+};
+
+const ShadowButtonTest: React.FunctionComponent = () => {
+  return <Text>TODO</Text>;
+};
+
+const shadowSections: TestSection[] = [
+  {
+    name: 'Shadow Depth Ramp',
+    testID: SHADOW_TESTPAGE,
+    component: ShadowDepthRampTest,
+  },
+  {
+    name: 'Shadows on Button Examples',
+    testID: SHADOW_TESTPAGE,
+    component: ShadowButtonTest,
+  },
+];
+
+export const ShadowTest: React.FunctionComponent = () => {
+  const status: PlatformStatus = {
+    win32Status: 'Experimental',
+    uwpStatus: 'Experimental',
+    iosStatus: 'Experimental',
+    macosStatus: 'Experimental',
+    androidStatus: 'Experimental',
+  };
+
+  const description = 'A Shadow component using the Fluent Design System. Shadow components can be added to other components.';
+
+  return <Test name="Shadow Test" description={description} sections={shadowSections} status={status} />;
+};

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

@@ -0,0 +1,2 @@
+export const HOMEPAGE_SHADOW_BUTTON = 'Homepage_Shadow_Button';
+export const SHADOW_TESTPAGE = 'Shadow_TestPage';

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

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

package/src/FluentTester/testPages.macos.ts

@@ -15,6 +15,7 @@ import { HOMEPAGE_PRESSABLE_BUTTON, PressableTest } from './TestComponents/Press
 import { HOMEPAGE_SHIMMER_BUTTON, ShimmerTest } from './TestComponents/Shimmer';
 import { HOMEPAGE_RADIOGROUP_BUTTON, RadioGroupTest } from './TestComponents/RadioGroup';
 import { HOMEPAGE_SEPARATOR_BUTTON, SeparatorTest } from './TestComponents/Separator';
+import { HOMEPAGE_SHADOW_BUTTON, ShadowTest } from './TestComponents/Shadow';
 import { HOMEPAGE_SVG_BUTTON, SvgTest } from './TestComponents/Svg';
 import { HOMEPAGE_TEXT_BUTTON, TextTest } from './TestComponents/Text';
 import { HOMEPAGE_THEME_BUTTON, ThemeTest } from './TestComponents/Theme';
@@ -133,6 +134,11 @@ export const tests: TestDescription[] = [
     component: SeparatorTest,
     testPage: HOMEPAGE_SEPARATOR_BUTTON,
   },
+  {
+    name: 'Shadow Test',
+    component: ShadowTest,
+    testPage: HOMEPAGE_SHADOW_BUTTON,
+  },
   {
     name: 'Shimmer Test',
     component: ShimmerTest,

package/src/FluentTester/testPages.ts

@@ -10,6 +10,7 @@ import { HOMEPAGE_PERSONACOIN_BUTTON, PersonaCoinTest } from './TestComponents/P
 import { HOMEPAGE_PRESSABLE_BUTTON, PressableTest } from './TestComponents/Pressable';
 import { HOMEPAGE_RADIOGROUP_BUTTON, RadioGroupTest } from './TestComponents/RadioGroup';
 import { HOMEPAGE_SEPARATOR_BUTTON, SeparatorTest } from './TestComponents/Separator';
+import { HOMEPAGE_SHADOW_BUTTON, ShadowTest } from './TestComponents/Shadow';
 import { HOMEPAGE_SHIMMER_BUTTON, ShimmerTest } from './TestComponents/Shimmer';
 import { HOMEPAGE_SVG_BUTTON, SvgTest } from './TestComponents/Svg';
 import { HOMEPAGE_TEXT_BUTTON, TextTest } from './TestComponents/Text';
@@ -73,6 +74,11 @@ export const tests: TestDescription[] = [
     component: LinkTest,
     testPage: HOMEPAGE_LINK_BUTTON,
   },
+  {
+    name: 'Shadow Test',
+    component: ShadowTest,
+    testPage: HOMEPAGE_SHADOW_BUTTON,
+  },
   {
     name: 'Separator Test',
     component: SeparatorTest,