@fluentui-react-native/tester 0.170.27 → 0.170.29

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

@@ -0,0 +1,69 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StandardMenuButton = void 0;
+const tslib_1 = require("tslib");
+/**
+ * Copyright (c) Microsoft Corporation.
+ * Licensed under the MIT License.
+ * @format
+ */
+const React = tslib_1.__importStar(require("react"));
+const react_native_1 = require("react-native");
+const react_native_2 = require("@fluentui/react-native");
+const experimental_menu_button_1 = require("@fluentui-react-native/experimental-menu-button");
+const MenuButtonV1TestStyles_1 = require("./MenuButtonV1TestStyles");
+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,
+        default: testData_1.iconProps,
+    });
+    return (React.createElement(react_native_1.View, null,
+        React.createElement(react_native_1.View, { style: MenuButtonV1TestStyles_1.viewWrapperStyle },
+            React.createElement(react_native_1.View, { style: MenuButtonV1TestStyles_1.columnStyle },
+                React.createElement(react_native_1.View, { style: MenuButtonV1TestStyles_1.rowStyle },
+                    React.createElement(react_native_1.Text, null, "Should Focus on Mount"),
+                    React.createElement(react_native_1.Switch, { value: focusOnMount, onValueChange: toggleFocusOnMount })),
+                React.createElement(react_native_1.View, { style: MenuButtonV1TestStyles_1.rowStyle },
+                    React.createElement(react_native_1.Text, null, "Should Focus on Container"),
+                    React.createElement(react_native_1.Switch, { value: focusOnContainer, onValueChange: toggleFocusOnContainer }))),
+            React.createElement(react_native_2.Separator, { vertical: true }),
+            React.createElement(react_native_1.View, { style: MenuButtonV1TestStyles_1.columnStyle },
+                React.createElement(react_native_1.Text, null,
+                    React.createElement(react_native_1.Text, null, "Last Menu Item Clicked: "),
+                    lastMenuItemClicked > 0 ? React.createElement(react_native_1.Text, { style: MenuButtonV1TestStyles_1.textColor }, lastMenuItemClicked) : React.createElement(react_native_1.Text, { style: MenuButtonV1TestStyles_1.textColor }, "none")),
+                React.createElement(react_native_1.View, { style: { ...MenuButtonV1TestStyles_1.rowStyle, paddingHorizontal: 5 } },
+                    React.createElement(react_native_1.View, { style: MenuButtonV1TestStyles_1.columnStyle },
+                        React.createElement(experimental_menu_button_1.MenuButton, { content: "Standard MenuButton", tooltip: "Standard MenuButton tooltip", menuItems: testData_1.menuItems, onItemClick: onItemClick, contextualMenu: contextualMenuProps }),
+                        React.createElement(react_native_1.Text, null, "MenuButton with icon"),
+                        React.createElement(experimental_menu_button_1.MenuButton, { icon: iconToShow, content: "MenuButton", menuItems: testData_1.menuItems, onItemClick: onItemClick, contextualMenu: contextualMenuProps }),
+                        React.createElement(react_native_1.Text, null, "MenuButton with only icon"),
+                        React.createElement(experimental_menu_button_1.MenuButton, { icon: iconToShow, menuItems: testData_1.menuItems, onItemClick: onItemClick, contextualMenu: contextualMenuProps }),
+                        React.createElement(react_native_1.Text, null, "Disabled MenuButton"),
+                        React.createElement(experimental_menu_button_1.MenuButton, { disabled: true, content: "Disabled MenuButton", menuItems: testData_1.menuItems })),
+                    React.createElement(react_native_2.Separator, { vertical: true }),
+                    React.createElement(react_native_1.View, { style: MenuButtonV1TestStyles_1.columnStyle },
+                        React.createElement(experimental_menu_button_1.MenuButton, { appearance: "primary", content: "Primary MenuButton", menuItems: testData_1.menuItems, onItemClick: onItemClick, contextualMenu: contextualMenuProps }),
+                        React.createElement(react_native_1.Text, null, "Primary MenuButton with icon"),
+                        React.createElement(experimental_menu_button_1.MenuButton, { appearance: "primary", icon: iconToShow, content: "Primary MenuButton", menuItems: testData_1.menuItems, onItemClick: onItemClick, contextualMenu: contextualMenuProps }),
+                        React.createElement(react_native_1.Text, null, "Primary MenuButton with only icon"),
+                        React.createElement(experimental_menu_button_1.MenuButton, { appearance: "primary", icon: iconToShow, menuItems: testData_1.menuItems, onItemClick: onItemClick, contextualMenu: contextualMenuProps }),
+                        React.createElement(react_native_1.Text, null, "Primary Disabled MenuButton"),
+                        React.createElement(experimental_menu_button_1.MenuButton, { appearance: "primary", disabled: true, content: "Disabled Primary MenuButton", menuItems: testData_1.menuItems })))))));
+};
+exports.StandardMenuButton = StandardMenuButton;
+//# sourceMappingURL=StandardMenuButtonTest.js.map

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

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

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

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

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

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./MenuButtonV1Test"), exports);
+//# sourceMappingURL=index.js.map

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

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

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

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

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

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.iconProps = exports.menuItems = void 0;
+const iconExamples_1 = require("../Common/iconExamples");
+exports.menuItems = [
+    {
+        itemKey: '1',
+        text: 'MenuItem 1',
+        icon: iconExamples_1.testImage,
+    },
+    {
+        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/MenuButtonV1/testData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"testData.js","sourceRoot":"","sources":["../../../src/TestComponents/MenuButtonV1/testData.ts"],"names":[],"mappings":";;;AAGA,yDAA6D;AAEhD,QAAA,SAAS,GAA0B;IAC9C;QACE,OAAO,EAAE,GAAG;QACZ,IAAI,EAAE,YAAY;QAClB,IAAI,EAAE,wBAAS;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;AAEW,QAAA,SAAS,GAAG,EAAE,SAAS,EAAE,uBAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC"}

package/lib-commonjs/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-commonjs/TestComponents/NativeDatePicker/NativeDatePickerTest.js

@@ -0,0 +1,251 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NativeDatePickerTest = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_native_1 = require("react-native");
+const react_native_2 = require("@fluentui/react-native");
+const button_1 = require("@fluentui-react-native/button");
+const experimental_native_date_picker_1 = require("@fluentui-react-native/experimental-native-date-picker");
+const stack_1 = require("@fluentui-react-native/stack");
+const consts_1 = require("./consts");
+const styles_1 = require("../Common/styles");
+const Test_1 = require("../Test");
+const NativeDatePickerAndroidUsage = () => {
+    const today = new Date();
+    const [startDate, setStartDate] = React.useState(today);
+    const [endDate, setEndDate] = React.useState(today);
+    return (React.createElement(stack_1.Stack, { style: styles_1.stackStyle },
+        React.createElement(react_native_2.Text, { variant: "headerStandard" }, "Selected Start Date/Time"),
+        React.createElement(react_native_2.Text, { variant: "subheaderStandard" },
+            startDate?.toString(),
+            " ",
+            '\n'),
+        React.createElement(react_native_2.Text, { variant: "headerStandard" }, "Selected End Date/Time"),
+        React.createElement(react_native_2.Text, { variant: "subheaderStandard" },
+            endDate?.toString() ?? 'N/A',
+            " ",
+            '\n'),
+        React.createElement(button_1.Button, { content: "Date Picker", onClick: () => {
+                experimental_native_date_picker_1.NativeDatePicker.present({
+                    mode: 'date',
+                    startDate: startDate,
+                    endDate: endDate,
+                    callback: (date1, date2) => {
+                        console.warn(`${date1} - ${date2}`);
+                        setStartDate(experimental_native_date_picker_1.NativeDatePicker.parseISOString(date1));
+                    },
+                });
+            } }),
+        React.createElement(react_native_2.Text, { variant: "headerStandard" }, "Ranged Datepicker"),
+        React.createElement(react_native_1.View, { style: { flexDirection: 'row' } },
+            React.createElement(button_1.Button, { content: "Start Date", onClick: () => {
+                    experimental_native_date_picker_1.NativeDatePicker.present({
+                        mode: 'dateRange',
+                        dateRangeMode: 'start',
+                        startDate: startDate,
+                        endDate: endDate,
+                        callback: (date1, date2) => {
+                            console.warn(`${date1} - ${date2}`);
+                            setStartDate(experimental_native_date_picker_1.NativeDatePicker.parseISOString(date1));
+                            setEndDate(experimental_native_date_picker_1.NativeDatePicker.parseISOString(date2));
+                        },
+                    });
+                } }),
+            React.createElement(button_1.Button, { content: "End Date", onClick: () => {
+                    experimental_native_date_picker_1.NativeDatePicker.present({
+                        mode: 'dateRange',
+                        dateRangeMode: 'end',
+                        startDate: startDate,
+                        endDate: endDate,
+                        callback: (date1, date2) => {
+                            console.warn(`${date1} - ${date2}`);
+                            setStartDate(experimental_native_date_picker_1.NativeDatePicker.parseISOString(date1));
+                            setEndDate(experimental_native_date_picker_1.NativeDatePicker.parseISOString(date2));
+                        },
+                    });
+                } })),
+        React.createElement(react_native_2.Text, { variant: "headerStandard" }, "Date and Time"),
+        React.createElement(button_1.Button, { content: "Date Time Picker", onClick: () => {
+                experimental_native_date_picker_1.NativeDatePicker.present({
+                    mode: 'dateTime',
+                    startDate: startDate,
+                    endDate: endDate,
+                    callback: (date1, date2) => {
+                        console.warn(`${date1} - ${date2}`);
+                        setStartDate(experimental_native_date_picker_1.NativeDatePicker.parseISOString(date1));
+                    },
+                });
+            } }),
+        React.createElement(react_native_2.Text, { variant: "headerStandard" }, "Ranged Date Time Picker"),
+        React.createElement(react_native_1.View, { style: { flexDirection: 'row' } },
+            React.createElement(button_1.Button, { content: "Date Time Range", onClick: () => {
+                    experimental_native_date_picker_1.NativeDatePicker.present({
+                        mode: 'dateTimeRange',
+                        dateRangeMode: 'start',
+                        startDate: startDate,
+                        endDate: endDate,
+                        callback: (date1, date2) => {
+                            console.warn(`${date1} - ${date2}`);
+                            setStartDate(experimental_native_date_picker_1.NativeDatePicker.parseISOString(date1));
+                            setEndDate(experimental_native_date_picker_1.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(experimental_native_date_picker_1.NativeDatePicker.parseISOString(pickedStartDate));
+        setEndDate(experimental_native_date_picker_1.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 (React.createElement(stack_1.Stack, { style: styles_1.stackStyle },
+        React.createElement(react_native_2.Text, { variant: "headerStandard" }, "Selected Start Date/Time"),
+        React.createElement(react_native_2.Text, { variant: "subheaderStandard" },
+            startDate?.toString(),
+            " ",
+            '\n'),
+        React.createElement(react_native_2.Text, { variant: "headerStandard" }, "Selected End Date/Time"),
+        React.createElement(react_native_2.Text, { variant: "subheaderStandard" },
+            endDate?.toString() ?? 'N/A',
+            " ",
+            '\n'),
+        React.createElement(button_1.Button, { content: "Date picker", onClick: () => experimental_native_date_picker_1.NativeDatePicker.present({
+                referenceStartDate: referenceStartDate,
+                referenceEndDate: referenceEndDate,
+                callback: didPickDates,
+            }) }),
+        React.createElement(button_1.Button, { content: "Date time picker", onClick: () => experimental_native_date_picker_1.NativeDatePicker.present({
+                mode: 'dateTime',
+                referenceStartDate: referenceStartDate,
+                referenceEndDate: referenceEndDate,
+                callback: didPickDates,
+            }) }),
+        React.createElement(button_1.Button, { content: "Preselected date", onClick: () => experimental_native_date_picker_1.NativeDatePicker.present({
+                startDate: fixedDates.startDate,
+                referenceStartDate: referenceStartDate,
+                referenceEndDate: referenceEndDate,
+                callback: didPickDates,
+            }) }),
+        React.createElement(button_1.Button, { content: "Date range (tabbed)", onClick: () => experimental_native_date_picker_1.NativeDatePicker.present({
+                mode: 'dateRange',
+                referenceStartDate: referenceStartDate,
+                referenceEndDate: referenceEndDate,
+                callback: didPickDates,
+            }) }),
+        React.createElement(button_1.Button, { content: "Date range (tabbed) remembering last selection", onClick: () => experimental_native_date_picker_1.NativeDatePicker.present({
+                mode: 'dateRange',
+                startDate: startDate,
+                endDate: endDate,
+                referenceStartDate: referenceStartDate,
+                referenceEndDate: referenceEndDate,
+                callback: didPickDates,
+            }) }),
+        React.createElement(button_1.Button, { content: "Date with custom titles", onClick: () => experimental_native_date_picker_1.NativeDatePicker.present({
+                ...fixedDates,
+                referenceStartDate: referenceStartDate,
+                referenceEndDate: referenceEndDate,
+                ...titles,
+                callback: didPickDates,
+            }) }),
+        React.createElement(button_1.Button, { content: "Date time with custom titles", onClick: () => experimental_native_date_picker_1.NativeDatePicker.present({
+                mode: 'dateTime',
+                ...fixedDates,
+                referenceStartDate: referenceStartDate,
+                referenceEndDate: referenceEndDate,
+                ...titles,
+                callback: didPickDates,
+            }) }),
+        React.createElement(button_1.Button, { content: "Date range with custom titles (paged)", onClick: () => experimental_native_date_picker_1.NativeDatePicker.present({
+                mode: 'dateRange',
+                dateRangePresentation: 'paged',
+                ...fixedDates,
+                referenceStartDate: referenceStartDate,
+                referenceEndDate: referenceEndDate,
+                ...titles,
+                callback: didPickDates,
+            }) }),
+        React.createElement(button_1.Button, { content: "Date range with custom titles (tabbed)", onClick: () => experimental_native_date_picker_1.NativeDatePicker.present({
+                mode: 'dateRange',
+                ...fixedDates,
+                referenceStartDate: referenceStartDate,
+                referenceEndDate: referenceEndDate,
+                ...titles,
+                callback: didPickDates,
+            }) }),
+        React.createElement(button_1.Button, { content: "Date time range with custom titles (tabbed)", onClick: () => experimental_native_date_picker_1.NativeDatePicker.present({
+                mode: 'dateTimeRange',
+                ...fixedDates,
+                referenceStartDate: referenceStartDate,
+                referenceEndDate: referenceEndDate,
+                ...titles,
+                callback: didPickDates,
+            }) }),
+        React.createElement(react_native_1.View, { style: styles_1.commonTestStyles.switch },
+            React.createElement(react_native_2.Text, { variant: "headerStandard" }, "Custom calendar configuration"),
+            React.createElement(react_native_1.Switch, { value: customCalendarConfiguration, onValueChange: (value) => {
+                    setCustomCalendarConfiguration(value);
+                } })),
+        React.createElement(react_native_2.Text, { variant: "subheaderStandard" },
+            "Reference start date: ",
+            customReferenceStartDate.toDateString()),
+        React.createElement(react_native_2.Text, { variant: "subheaderStandard" },
+            "Reference end date: ",
+            customReferenceEndDate.toDateString())));
+};
+const nativeDatePickerSections = [
+    ...react_native_1.Platform.select({
+        android: [
+            {
+                name: 'Native Date Picker',
+                component: NativeDatePickerAndroidUsage,
+            },
+        ],
+        default: [
+            {
+                name: 'Native Date Picker',
+                testID: consts_1.NATIVEDATEPICKER_TESTPAGE,
+                component: NativeDatePickeriOSUsage,
+            },
+        ],
+    }),
+];
+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 React.createElement(Test_1.Test, { name: "Native Date Picker Test", description: description, sections: nativeDatePickerSections, status: status });
+};
+exports.NativeDatePickerTest = NativeDatePickerTest;
+//# sourceMappingURL=NativeDatePickerTest.js.map

package/lib-commonjs/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-commonjs/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-commonjs/TestComponents/NativeDatePicker/consts.js.map

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

package/lib-commonjs/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-commonjs/TestComponents/NativeDatePicker/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./NativeDatePickerTest"), exports);
+tslib_1.__exportStar(require("./consts"), exports);
+//# sourceMappingURL=index.js.map

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

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

package/lib-commonjs/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-commonjs/TestComponents/Notification/NotificationTest.js

@@ -0,0 +1,207 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NotificationTest = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_native_1 = require("react-native");
+const button_1 = require("@fluentui-react-native/button");
+const notification_1 = require("@fluentui-react-native/notification");
+const text_1 = require("@fluentui-react-native/text");
+const play_button_svg_1 = tslib_1.__importDefault(require("../../../assets/play_button.svg"));
+const StyledPicker_1 = require("../Common/StyledPicker");
+const styles_1 = require("../Common/styles");
+const Test_1 = require("../Test");
+const svgProps = {
+    src: play_button_svg_1.default,
+};
+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 = react_native_1.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 (React.createElement(react_native_1.View, null,
+        React.createElement(StyledPicker_1.StyledPicker, { prompt: "Variant", selected: variant, onChange: setVariant, collection: notification_1.NotificationVariants.filter((variant) => !variant.endsWith('Bar')) }),
+        React.createElement(react_native_1.TextInput, { value: title, onChangeText: setTitle, style: styles.textInput }),
+        React.createElement(react_native_1.TextInput, { value: message, onChangeText: setMessage, style: styles.textInput }),
+        React.createElement(react_native_1.TextInput, { value: action, onChangeText: setAction, style: styles.textInput }),
+        React.createElement(react_native_1.View, { style: styles_1.commonTestStyles.switch },
+            React.createElement(text_1.TextV1, null, "Show icon "),
+            React.createElement(react_native_1.Switch, { value: showIcon, onValueChange: setShowIcon })),
+        React.createElement(react_native_1.View, { style: styles_1.commonTestStyles.switch },
+            React.createElement(text_1.TextV1, null, "Show title "),
+            React.createElement(react_native_1.Switch, { value: showTitle, onValueChange: setShowTitle })),
+        React.createElement(react_native_1.View, { style: styles.notification },
+            React.createElement(notification_1.Notification, { variant: variant, icon: showIcon ? iconProps : undefined, title: showTitle ? title : undefined, action: action, onPress: () => {
+                    console.log('Notification tapped');
+                }, onActionPress: () => {
+                    console.log('Notification action tapped');
+                } }, message))));
+};
+const CustomBar = () => {
+    const [variant, setVariant] = React.useState('primaryBar');
+    const [message, setMessage] = React.useState('Updating...');
+    return (React.createElement(react_native_1.View, null,
+        React.createElement(StyledPicker_1.StyledPicker, { prompt: "Variant", selected: variant, onChange: setVariant, collection: notification_1.NotificationVariants.filter((variant) => variant.endsWith('Bar')) }),
+        React.createElement(react_native_1.TextInput, { value: message, onChangeText: setMessage, style: styles.textInput }),
+        React.createElement(react_native_1.View, { style: styles.notification },
+            React.createElement(notification_1.Notification, { variant: variant, onPress: () => {
+                    console.log('Notification tapped');
+                } }, message))));
+};
+const PrimaryWithAutoHide = () => {
+    const [visible, setVisible] = React.useState(true);
+    const onButtonPress = () => setVisible(!visible);
+    const [hidden, setHidden] = React.useState(!visible);
+    const height = React.useRef(new react_native_1.Animated.Value(0)).current;
+    const show = React.useCallback(() => {
+        setHidden(false);
+        react_native_1.Animated.sequence([
+            react_native_1.Animated.spring(height, {
+                toValue: SHOW_HEIGHT,
+                bounciness: 16,
+                speed: 20,
+                useNativeDriver: USE_NATIVE_DRIVER_IOS,
+            }),
+            react_native_1.Animated.delay(AUTO_HIDE_DURATION),
+            react_native_1.Animated.timing(height, {
+                toValue: 0,
+                duration: HIDE_DURATION,
+                useNativeDriver: USE_NATIVE_DRIVER_IOS,
+            }),
+        ]).start(() => {
+            setHidden(true);
+            setVisible(false);
+        });
+    }, [height]);
+    const hide = React.useCallback(() => {
+        react_native_1.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 (React.createElement(react_native_1.View, null,
+        React.createElement(button_1.ButtonV1, { appearance: "subtle", onClick: onButtonPress, style: styles.button }, visible ? 'Hide' : 'Show'),
+        !hidden && (React.createElement(react_native_1.Animated.View, { style: animatedViewProps },
+            React.createElement(notification_1.Notification, { variant: 'primary', action: "Undo", onPress: () => {
+                    console.log('Notification tapped');
+                }, onActionPress: () => {
+                    console.log('Undo tapped');
+                } }, "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 react_native_1.Animated.Value(0)).current;
+    const show = () => {
+        setHidden(false);
+        react_native_1.Animated.sequence([
+            react_native_1.Animated.timing(height, {
+                toValue: SHOW_HEIGHT,
+                duration: BAR_SHOW_DURATION,
+                useNativeDriver: USE_NATIVE_DRIVER_IOS,
+            }),
+            react_native_1.Animated.delay(AUTO_HIDE_DURATION),
+            react_native_1.Animated.timing(height, {
+                toValue: 0,
+                duration: HIDE_DURATION,
+                useNativeDriver: USE_NATIVE_DRIVER_IOS,
+            }),
+        ]).start(() => {
+            setHidden(true);
+            setVisible(false);
+        });
+    };
+    const hide = () => {
+        react_native_1.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 (React.createElement(react_native_1.View, null,
+        React.createElement(button_1.ButtonV1, { appearance: "subtle", onClick: onButtonPress, style: styles.button }, visible ? 'Hide' : 'Show'),
+        !hidden && (React.createElement(react_native_1.Animated.View, { style: animatedViewProps },
+            React.createElement(notification_1.Notification, { variant: 'primaryBar', onPress: () => {
+                    console.log('Notification tapped');
+                } }, "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,
+    },
+];
+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 React.createElement(Test_1.Test, { name: "Notification Test", description: description, spec: spec, sections: notificationSections, status: status });
+};
+exports.NotificationTest = NotificationTest;
+//# sourceMappingURL=NotificationTest.js.map