@fluentui-react-native/tester-core 0.1.1

package/lib/TestComponents/MenuButtonV1/testData.js

@@ -0,0 +1,19 @@
+import { testImage, svgProps } from '../Common/iconExamples';
+export const menuItems = [
+  {
+    itemKey: '1',
+    text: 'MenuItem 1',
+    icon: testImage,
+  },
+  {
+    itemKey: '2',
+    text: 'MenuItem 2',
+  },
+  {
+    itemKey: '3',
+    text: 'MenuItem 3',
+    disabled: true,
+  },
+];
+export const iconProps = { svgSource: svgProps, width: 12, height: 12 };
+//# sourceMappingURL=testData.js.map

package/lib/TestComponents/MenuButtonV1/testData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"testData.js","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonV1/testData.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAE7D,MAAM,CAAC,MAAM,SAAS,GAA0B;IAC9C;QACE,OAAO,EAAE,GAAG;QACZ,IAAI,EAAE,YAAY;QAClB,IAAI,EAAE,SAAS;KAChB;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;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC"}

package/lib/TestComponents/NativeDatePicker/NativeDatePickerTest.d.ts

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

package/lib/TestComponents/NativeDatePicker/NativeDatePickerTest.d.ts.map

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

package/lib/TestComponents/NativeDatePicker/NativeDatePickerTest.js

@@ -0,0 +1,307 @@
+import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime';
+import * as React from 'react';
+import { Platform, Switch, View } from 'react-native';
+import { Text } from '@fluentui/react-native';
+import { Button } from '@fluentui-react-native/button';
+import { NativeDatePicker } from '@fluentui-react-native/experimental-native-date-picker';
+import { Stack } from '@fluentui-react-native/stack';
+import { NATIVEDATEPICKER_TESTPAGE } from './consts';
+import { stackStyle, commonTestStyles as commonStyles } from '../Common/styles';
+import { Test } from '../Test';
+const NativeDatePickerAndroidUsage = () => {
+  const today = new Date();
+  const [startDate, setStartDate] = React.useState(today);
+  const [endDate, setEndDate] = React.useState(today);
+  return _jsxs(Stack, {
+    style: stackStyle,
+    children: [
+      _jsx(Text, { variant: 'headerStandard', children: 'Selected Start Date/Time' }),
+      _jsxs(Text, { variant: 'subheaderStandard', children: [startDate?.toString(), ' ', '\n'] }),
+      _jsx(Text, { variant: 'headerStandard', children: 'Selected End Date/Time' }),
+      _jsxs(Text, { variant: 'subheaderStandard', children: [endDate?.toString() ?? 'N/A', ' ', '\n'] }),
+      _jsx(Button, {
+        content: 'Date Picker',
+        onClick: () => {
+          NativeDatePicker.present({
+            mode: 'date',
+            startDate: startDate,
+            endDate: endDate,
+            callback: (date1, date2) => {
+              console.warn(`${date1} - ${date2}`);
+              setStartDate(NativeDatePicker.parseISOString(date1));
+            },
+          });
+        },
+      }),
+      _jsx(Text, { variant: 'headerStandard', children: 'Ranged Datepicker' }),
+      _jsxs(View, {
+        style: { flexDirection: 'row' },
+        children: [
+          _jsx(Button, {
+            content: 'Start Date',
+            onClick: () => {
+              NativeDatePicker.present({
+                mode: 'dateRange',
+                dateRangeMode: 'start',
+                startDate: startDate,
+                endDate: endDate,
+                callback: (date1, date2) => {
+                  console.warn(`${date1} - ${date2}`);
+                  setStartDate(NativeDatePicker.parseISOString(date1));
+                  setEndDate(NativeDatePicker.parseISOString(date2));
+                },
+              });
+            },
+          }),
+          _jsx(Button, {
+            content: 'End Date',
+            onClick: () => {
+              NativeDatePicker.present({
+                mode: 'dateRange',
+                dateRangeMode: 'end',
+                startDate: startDate,
+                endDate: endDate,
+                callback: (date1, date2) => {
+                  console.warn(`${date1} - ${date2}`);
+                  setStartDate(NativeDatePicker.parseISOString(date1));
+                  setEndDate(NativeDatePicker.parseISOString(date2));
+                },
+              });
+            },
+          }),
+        ],
+      }),
+      _jsx(Text, { variant: 'headerStandard', children: 'Date and Time' }),
+      _jsx(Button, {
+        content: 'Date Time Picker',
+        onClick: () => {
+          NativeDatePicker.present({
+            mode: 'dateTime',
+            startDate: startDate,
+            endDate: endDate,
+            callback: (date1, date2) => {
+              console.warn(`${date1} - ${date2}`);
+              setStartDate(NativeDatePicker.parseISOString(date1));
+            },
+          });
+        },
+      }),
+      _jsx(Text, { variant: 'headerStandard', children: 'Ranged Date Time Picker' }),
+      _jsx(View, {
+        style: { flexDirection: 'row' },
+        children: _jsx(Button, {
+          content: 'Date Time Range',
+          onClick: () => {
+            NativeDatePicker.present({
+              mode: 'dateTimeRange',
+              dateRangeMode: 'start',
+              startDate: startDate,
+              endDate: endDate,
+              callback: (date1, date2) => {
+                console.warn(`${date1} - ${date2}`);
+                setStartDate(NativeDatePicker.parseISOString(date1));
+                setEndDate(NativeDatePicker.parseISOString(date2));
+              },
+            });
+          },
+        }),
+      }),
+    ],
+  });
+};
+const NativeDatePickeriOSUsage = () => {
+  const [startDate, setStartDate] = React.useState(new Date());
+  const [endDate, setEndDate] = React.useState(null);
+  const [customCalendarConfiguration, setCustomCalendarConfiguration] = React.useState(false);
+  function didPickDates(pickedStartDate, pickedEndDate) {
+    setStartDate(NativeDatePicker.parseISOString(pickedStartDate));
+    setEndDate(NativeDatePicker.parseISOString(pickedEndDate));
+  }
+  const today = new Date();
+  // Here we set up some common options and use the spread operator to copy them repeatedly into examples.
+  const fixedDates = {
+    startDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() + 7),
+    endDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() + 14),
+  };
+  const customReferenceStartDate = today;
+  const customReferenceEndDate = new Date(today.getFullYear(), today.getMonth() + 1, today.getDate());
+  const defaultReferenceStartDate = new Date(today.getFullYear() - 3, 1, 1);
+  const defaultReferenceEndDate = new Date(defaultReferenceStartDate.getFullYear() + 10, 1, 1);
+  const referenceStartDate = customCalendarConfiguration ? customReferenceStartDate : defaultReferenceStartDate;
+  const referenceEndDate = customCalendarConfiguration ? customReferenceEndDate : defaultReferenceEndDate;
+  const titles = {
+    startTitle: 'Start Title',
+    startSubitle: 'Start Subtitle',
+    startTab: 'Start Tab',
+    endTitle: 'End Title',
+    endSubtitle: 'End Subtitle',
+    endTab: 'End Tab',
+    dateTitle: 'Date Title',
+    dateSubtitle: 'Date Subtitle',
+    timeTitle: 'Time Title',
+    timeSubtitle: 'Time Subtitle',
+  };
+  return _jsxs(Stack, {
+    style: stackStyle,
+    children: [
+      _jsx(Text, { variant: 'headerStandard', children: 'Selected Start Date/Time' }),
+      _jsxs(Text, { variant: 'subheaderStandard', children: [startDate?.toString(), ' ', '\n'] }),
+      _jsx(Text, { variant: 'headerStandard', children: 'Selected End Date/Time' }),
+      _jsxs(Text, { variant: 'subheaderStandard', children: [endDate?.toString() ?? 'N/A', ' ', '\n'] }),
+      _jsx(Button, {
+        content: 'Date picker',
+        onClick: () =>
+          NativeDatePicker.present({
+            referenceStartDate: referenceStartDate,
+            referenceEndDate: referenceEndDate,
+            callback: didPickDates,
+          }),
+      }),
+      _jsx(Button, {
+        content: 'Date time picker',
+        onClick: () =>
+          NativeDatePicker.present({
+            mode: 'dateTime',
+            referenceStartDate: referenceStartDate,
+            referenceEndDate: referenceEndDate,
+            callback: didPickDates,
+          }),
+      }),
+      _jsx(Button, {
+        content: 'Preselected date',
+        onClick: () =>
+          NativeDatePicker.present({
+            startDate: fixedDates.startDate,
+            referenceStartDate: referenceStartDate,
+            referenceEndDate: referenceEndDate,
+            callback: didPickDates,
+          }),
+      }),
+      _jsx(Button, {
+        content: 'Date range (tabbed)',
+        onClick: () =>
+          NativeDatePicker.present({
+            mode: 'dateRange',
+            referenceStartDate: referenceStartDate,
+            referenceEndDate: referenceEndDate,
+            callback: didPickDates,
+          }),
+      }),
+      _jsx(Button, {
+        content: 'Date range (tabbed) remembering last selection',
+        onClick: () =>
+          NativeDatePicker.present({
+            mode: 'dateRange',
+            startDate: startDate,
+            endDate: endDate,
+            referenceStartDate: referenceStartDate,
+            referenceEndDate: referenceEndDate,
+            callback: didPickDates,
+          }),
+      }),
+      _jsx(Button, {
+        content: 'Date with custom titles',
+        onClick: () =>
+          NativeDatePicker.present({
+            ...fixedDates,
+            referenceStartDate: referenceStartDate,
+            referenceEndDate: referenceEndDate,
+            ...titles,
+            callback: didPickDates,
+          }),
+      }),
+      _jsx(Button, {
+        content: 'Date time with custom titles',
+        onClick: () =>
+          NativeDatePicker.present({
+            mode: 'dateTime',
+            ...fixedDates,
+            referenceStartDate: referenceStartDate,
+            referenceEndDate: referenceEndDate,
+            ...titles,
+            callback: didPickDates,
+          }),
+      }),
+      _jsx(Button, {
+        content: 'Date range with custom titles (paged)',
+        onClick: () =>
+          NativeDatePicker.present({
+            mode: 'dateRange',
+            dateRangePresentation: 'paged',
+            ...fixedDates,
+            referenceStartDate: referenceStartDate,
+            referenceEndDate: referenceEndDate,
+            ...titles,
+            callback: didPickDates,
+          }),
+      }),
+      _jsx(Button, {
+        content: 'Date range with custom titles (tabbed)',
+        onClick: () =>
+          NativeDatePicker.present({
+            mode: 'dateRange',
+            ...fixedDates,
+            referenceStartDate: referenceStartDate,
+            referenceEndDate: referenceEndDate,
+            ...titles,
+            callback: didPickDates,
+          }),
+      }),
+      _jsx(Button, {
+        content: 'Date time range with custom titles (tabbed)',
+        onClick: () =>
+          NativeDatePicker.present({
+            mode: 'dateTimeRange',
+            ...fixedDates,
+            referenceStartDate: referenceStartDate,
+            referenceEndDate: referenceEndDate,
+            ...titles,
+            callback: didPickDates,
+          }),
+      }),
+      _jsxs(View, {
+        style: commonStyles.switch,
+        children: [
+          _jsx(Text, { variant: 'headerStandard', children: 'Custom calendar configuration' }),
+          _jsx(Switch, {
+            value: customCalendarConfiguration,
+            onValueChange: (value) => {
+              setCustomCalendarConfiguration(value);
+            },
+          }),
+        ],
+      }),
+      _jsxs(Text, { variant: 'subheaderStandard', children: ['Reference start date: ', customReferenceStartDate.toDateString()] }),
+      _jsxs(Text, { variant: 'subheaderStandard', children: ['Reference end date: ', customReferenceEndDate.toDateString()] }),
+    ],
+  });
+};
+const nativeDatePickerSections = [
+  ...Platform.select({
+    android: [
+      {
+        name: 'Native Date Picker',
+        component: NativeDatePickerAndroidUsage,
+      },
+    ],
+    default: [
+      {
+        name: 'Native Date Picker',
+        testID: NATIVEDATEPICKER_TESTPAGE,
+        component: NativeDatePickeriOSUsage,
+      },
+    ],
+  }),
+];
+export const NativeDatePickerTest = () => {
+  const status = {
+    win32Status: 'N/A',
+    uwpStatus: 'N/A',
+    iosStatus: 'Experimental',
+    macosStatus: 'N/A',
+    androidStatus: 'Experimental',
+  };
+  const description = 'A Native date picker component using the Fluent Design System.';
+  return _jsx(Test, { name: 'Native Date Picker Test', description: description, sections: nativeDatePickerSections, status: status });
+};
+//# sourceMappingURL=NativeDatePickerTest.js.map

package/lib/TestComponents/NativeDatePicker/NativeDatePickerTest.js.map

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

package/lib/TestComponents/NativeDatePicker/consts.d.ts

@@ -0,0 +1,3 @@
+export declare const HOMEPAGE_NATIVEDATEPICKER_BUTTON = 'Homepage_NativeDatePicker_Button';
+export declare const NATIVEDATEPICKER_TESTPAGE = 'NativeDatePicker_TestPage';
+//# sourceMappingURL=consts.d.ts.map

package/lib/TestComponents/NativeDatePicker/consts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/NativeDatePicker/consts.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,gCAAgC,qCAAqC,CAAC;AACnF,eAAO,MAAM,yBAAyB,8BAA8B,CAAC"}

package/lib/TestComponents/NativeDatePicker/consts.js

@@ -0,0 +1,3 @@
+export const HOMEPAGE_NATIVEDATEPICKER_BUTTON = 'Homepage_NativeDatePicker_Button';
+export const NATIVEDATEPICKER_TESTPAGE = 'NativeDatePicker_TestPage';
+//# sourceMappingURL=consts.js.map

package/lib/TestComponents/NativeDatePicker/consts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"consts.js","sourceRoot":"","sources":["../../../src/TestComponents/NativeDatePicker/consts.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gCAAgC,GAAG,kCAAkC,CAAC;AACnF,MAAM,CAAC,MAAM,yBAAyB,GAAG,2BAA2B,CAAC"}

package/lib/TestComponents/NativeDatePicker/index.d.ts

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

package/lib/TestComponents/NativeDatePicker/index.d.ts.map

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

package/lib/TestComponents/NativeDatePicker/index.js

@@ -0,0 +1,3 @@
+export * from './NativeDatePickerTest';
+export * from './consts';
+//# sourceMappingURL=index.js.map

package/lib/TestComponents/NativeDatePicker/index.js.map

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

package/lib/TestComponents/Notification/NotificationTest.d.ts

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

package/lib/TestComponents/Notification/NotificationTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationTest.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/Notification/NotificationTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAqR/B,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,iBAcpC,CAAC"}

package/lib/TestComponents/Notification/NotificationTest.js

@@ -0,0 +1,257 @@
+import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime';
+import * as React from 'react';
+import { Animated, StyleSheet, Switch, TextInput, View } from 'react-native';
+import { ButtonV1 as Button } from '@fluentui-react-native/button';
+import { Notification, NotificationVariants } from '@fluentui-react-native/notification';
+import { TextV1 as Text } from '@fluentui-react-native/text';
+import PlayButton from '../../../assets/play_button.svg';
+import { StyledPicker } from '../Common/StyledPicker';
+import { commonTestStyles as commonStyles } from '../Common/styles';
+import { Test } from '../Test';
+const svgProps = {
+  src: PlayButton,
+};
+const iconProps = { svgSource: svgProps };
+const SHOW_HEIGHT = -50;
+const BAR_SHOW_DURATION = 300;
+const HIDE_DURATION = 250;
+const AUTO_HIDE_DURATION = 3000;
+const USE_NATIVE_DRIVER_IOS = true;
+const styles = StyleSheet.create({
+  button: {
+    alignSelf: 'center',
+    marginBottom: 50,
+  },
+  notification: {
+    marginTop: 10,
+  },
+  textInput: {
+    borderWidth: 1,
+  },
+});
+const CustomToast = () => {
+  const [variant, setVariant] = React.useState('primary');
+  const [title, setTitle] = React.useState("Kat's iPhoneX");
+  const [message, setMessage] = React.useState('Listen to Emails • 7 mins');
+  const [action, setAction] = React.useState('Listen');
+  const [showIcon, setShowIcon] = React.useState(true);
+  const [showTitle, setShowTitle] = React.useState(true);
+  return _jsxs(View, {
+    children: [
+      _jsx(StyledPicker, {
+        prompt: 'Variant',
+        selected: variant,
+        onChange: setVariant,
+        collection: NotificationVariants.filter((variant) => !variant.endsWith('Bar')),
+      }),
+      _jsx(TextInput, { value: title, onChangeText: setTitle, style: styles.textInput }),
+      _jsx(TextInput, { value: message, onChangeText: setMessage, style: styles.textInput }),
+      _jsx(TextInput, { value: action, onChangeText: setAction, style: styles.textInput }),
+      _jsxs(View, {
+        style: commonStyles.switch,
+        children: [_jsx(Text, { children: 'Show icon ' }), _jsx(Switch, { value: showIcon, onValueChange: setShowIcon })],
+      }),
+      _jsxs(View, {
+        style: commonStyles.switch,
+        children: [_jsx(Text, { children: 'Show title ' }), _jsx(Switch, { value: showTitle, onValueChange: setShowTitle })],
+      }),
+      _jsx(View, {
+        style: styles.notification,
+        children: _jsx(Notification, {
+          variant: variant,
+          icon: showIcon ? iconProps : undefined,
+          title: showTitle ? title : undefined,
+          action: action,
+          onPress: () => {
+            console.log('Notification tapped');
+          },
+          onActionPress: () => {
+            console.log('Notification action tapped');
+          },
+          children: message,
+        }),
+      }),
+    ],
+  });
+};
+const CustomBar = () => {
+  const [variant, setVariant] = React.useState('primaryBar');
+  const [message, setMessage] = React.useState('Updating...');
+  return _jsxs(View, {
+    children: [
+      _jsx(StyledPicker, {
+        prompt: 'Variant',
+        selected: variant,
+        onChange: setVariant,
+        collection: NotificationVariants.filter((variant) => variant.endsWith('Bar')),
+      }),
+      _jsx(TextInput, { value: message, onChangeText: setMessage, style: styles.textInput }),
+      _jsx(View, {
+        style: styles.notification,
+        children: _jsx(Notification, {
+          variant: variant,
+          onPress: () => {
+            console.log('Notification tapped');
+          },
+          children: message,
+        }),
+      }),
+    ],
+  });
+};
+const PrimaryWithAutoHide = () => {
+  const [visible, setVisible] = React.useState(true);
+  const onButtonPress = () => setVisible(!visible);
+  const [hidden, setHidden] = React.useState(!visible);
+  const height = React.useRef(new Animated.Value(0)).current;
+  const show = React.useCallback(() => {
+    setHidden(false);
+    Animated.sequence([
+      Animated.spring(height, {
+        toValue: SHOW_HEIGHT,
+        bounciness: 16,
+        speed: 20,
+        useNativeDriver: USE_NATIVE_DRIVER_IOS,
+      }),
+      Animated.delay(AUTO_HIDE_DURATION),
+      Animated.timing(height, {
+        toValue: 0,
+        duration: HIDE_DURATION,
+        useNativeDriver: USE_NATIVE_DRIVER_IOS,
+      }),
+    ]).start(() => {
+      setHidden(true);
+      setVisible(false);
+    });
+  }, [height]);
+  const hide = React.useCallback(() => {
+    Animated.timing(height, {
+      toValue: 0,
+      duration: HIDE_DURATION,
+      useNativeDriver: USE_NATIVE_DRIVER_IOS,
+    }).start(() => {
+      setHidden(true);
+    });
+  }, [height]);
+  React.useLayoutEffect(() => {
+    if (visible) {
+      show();
+    } else {
+      hide();
+    }
+  }, [visible, show, hide]);
+  const animatedViewProps = {
+    transform: [{ translateY: height }],
+  };
+  return _jsxs(View, {
+    children: [
+      _jsx(Button, { appearance: 'subtle', onClick: onButtonPress, style: styles.button, children: visible ? 'Hide' : 'Show' }),
+      !hidden &&
+        _jsx(Animated.View, {
+          style: animatedViewProps,
+          children: _jsx(Notification, {
+            variant: 'primary',
+            action: 'Undo',
+            onPress: () => {
+              console.log('Notification tapped');
+            },
+            onActionPress: () => {
+              console.log('Undo tapped');
+            },
+            children: 'Mail Archived',
+          }),
+        }),
+    ],
+  });
+};
+const PrimaryBarWithAutoHide = () => {
+  const [visible, setVisible] = React.useState(true);
+  const onButtonPress = () => setVisible(!visible);
+  const [hidden, setHidden] = React.useState(!visible);
+  const height = React.useRef(new Animated.Value(0)).current;
+  const show = () => {
+    setHidden(false);
+    Animated.sequence([
+      Animated.timing(height, {
+        toValue: SHOW_HEIGHT,
+        duration: BAR_SHOW_DURATION,
+        useNativeDriver: USE_NATIVE_DRIVER_IOS,
+      }),
+      Animated.delay(AUTO_HIDE_DURATION),
+      Animated.timing(height, {
+        toValue: 0,
+        duration: HIDE_DURATION,
+        useNativeDriver: USE_NATIVE_DRIVER_IOS,
+      }),
+    ]).start(() => {
+      setHidden(true);
+      setVisible(false);
+    });
+  };
+  const hide = () => {
+    Animated.timing(height, {
+      toValue: 0,
+      duration: HIDE_DURATION,
+      useNativeDriver: USE_NATIVE_DRIVER_IOS,
+    }).start(() => {
+      setHidden(true);
+    });
+  };
+  React.useLayoutEffect(() => {
+    if (visible) {
+      show();
+    } else {
+      hide();
+    }
+  }, [visible, height]);
+  const animatedViewProps = {
+    transform: [{ translateY: height }],
+  };
+  return _jsxs(View, {
+    children: [
+      _jsx(Button, { appearance: 'subtle', onClick: onButtonPress, style: styles.button, children: visible ? 'Hide' : 'Show' }),
+      !hidden &&
+        _jsx(Animated.View, {
+          style: animatedViewProps,
+          children: _jsx(Notification, {
+            variant: 'primaryBar',
+            onPress: () => {
+              console.log('Notification tapped');
+            },
+            children: 'Mail Sent',
+          }),
+        }),
+    ],
+  });
+};
+const notificationSections = [
+  {
+    name: 'Custom Toast',
+    component: CustomToast,
+  },
+  {
+    name: 'Custom Bar',
+    component: CustomBar,
+  },
+  {
+    name: 'Primary with auto-hide',
+    component: PrimaryWithAutoHide,
+  },
+  {
+    name: 'Primary Bar with auto-hide',
+    component: PrimaryBarWithAutoHide,
+  },
+];
+export const NotificationTest = () => {
+  const status = {
+    win32Status: 'Backlog',
+    uwpStatus: 'Backlog',
+    iosStatus: 'Production',
+    macosStatus: 'Backlog',
+    androidStatus: 'Backlog',
+  };
+  const description = 'Testing notification component';
+  const spec = 'https://github.com/microsoft/fluentui-react-native/blob/main/packages/components/Notification/SPEC.md';
+  return _jsx(Test, { name: 'Notification Test', description: description, spec: spec, sections: notificationSections, status: status });
+};
+//# sourceMappingURL=NotificationTest.js.map