@fluentui-react-native/tester 0.134.23 → 0.134.25

package/lib/fluent-tester/src/TestComponents/Theme/ThemeTest.android.js

@@ -0,0 +1,100 @@
+import { __assign } from "tslib";
+import * as React from 'react';
+import { Text as TextRN, View } from 'react-native';
+import { StyleSheet } from 'react-native';
+import { Text } from '@fluentui/react-native';
+import { useFluentTheme } from '@fluentui-react-native/framework';
+import { themedStyleSheet } from '@fluentui-react-native/themed-stylesheet';
+import { THEME_TESTPAGE } from '../../../../E2E/src/Theme/consts';
+import { commonTestStyles } from '../Common/styles';
+import { Test } from '../Test';
+var getThemedStyles = themedStyleSheet(function (theme) {
+    return {
+        swatch: {
+            color: theme.colors.neutralForeground1,
+        },
+        rootView: {
+            backgroundColor: theme.colors.brandBackground,
+        },
+    };
+});
+var styles = StyleSheet.create({
+    swatchItem: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        marginVertical: 5,
+    },
+    panel: __assign(__assign({}, commonTestStyles.view), { borderWidth: 2, padding: 12, margin: 8 }),
+    pickerContainer: {
+        flexDirection: 'row',
+        justifyContent: 'space-evenly',
+    },
+    stackStyle: {
+        borderWidth: 2,
+        padding: 12,
+        margin: 8,
+    },
+});
+var Panel = function () {
+    var theme = useFluentTheme();
+    var themedStyles = getThemedStyles(theme);
+    return (React.createElement(View, null,
+        React.createElement(Text, { style: { color: theme.colors.buttonBackgroundChecked } }, "buttonBackgroundChecked styled text"),
+        React.createElement(Text, { style: { color: theme.colors.neutralForeground1 } }, "neutralForeground1 styled text"),
+        React.createElement(Text, { style: { color: theme.colors.hostColorPink } }, "hostColorPink styled text"),
+        React.createElement(Text, { style: { color: theme.colors.hostColorButtonBackground } }, "hostColorButtonBackground styled text"),
+        React.createElement(Text, { style: { color: theme.colors.hostColorBrandText } }, "hostColorBrandText styled text"),
+        React.createElement(TextRN, { style: { color: theme.colors.yellowBrandColor } }, "yellowBrandColor styled text"),
+        React.createElement(TextRN, { style: themedStyles.swatch }, "Styled RN Text")));
+};
+var getSwatchColorStyle = function (name, color) {
+    styles[name] = styles[name] || { backgroundColor: color };
+    return styles[name];
+};
+var SemanticColor = function (p) {
+    var themedStyles = getThemedStyles(useFluentTheme());
+    return (React.createElement(View, { style: styles.swatchItem },
+        React.createElement(View, { style: [getSwatchColorStyle(p.name, p.color), themedStyles.swatch] }),
+        React.createElement(Text, null, p.name)));
+};
+var SwatchList = function () {
+    var theme = useFluentTheme();
+    var palette = theme.colors;
+    var aggregator = React.useCallback(function (key) {
+        return { key: key + ' (' + palette[key] + ')', color: palette[key] };
+    }, [palette]);
+    var flattenArray = React.useCallback(function () {
+        return Object.keys(palette).sort().map(aggregator);
+    }, [palette, aggregator]);
+    var paletteAsArray = React.useMemo(flattenArray, [flattenArray]);
+    var renderSwatch = React.useCallback(function (item) {
+        var color = item.color, key = item.key;
+        return React.createElement(SemanticColor, { key: key, color: color, name: key });
+    }, []);
+    return (React.createElement(View, { style: commonTestStyles.view },
+        React.createElement(Text, null, "getColorsAndroid(theme: ITheme).palette"),
+        React.createElement(View, { style: styles.stackStyle }, paletteAsArray.map(function (item) { return renderSwatch(item); }))));
+};
+var themeSections = [
+    {
+        name: 'Component Examples',
+        testID: THEME_TESTPAGE,
+        component: Panel,
+    },
+    {
+        name: 'Theme.colors',
+        component: function () { return React.createElement(SwatchList, null); },
+    },
+];
+export var ThemeTest = function () {
+    var status = {
+        win32Status: 'Beta',
+        uwpStatus: 'Experimental',
+        iosStatus: 'Experimental',
+        macosStatus: 'Experimental',
+        androidStatus: 'Beta',
+    };
+    var description = 'The entire color palette of the controls is themeable. We provide a set of sensible defaults, but you can override all colors individually.';
+    return React.createElement(Test, { name: "Theme Test", description: description, sections: themeSections, status: status });
+};
+//# sourceMappingURL=ThemeTest.android.js.map

package/lib/fluent-tester/src/TestComponents/Theme/ThemeTest.android.js.map

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

package/lib-commonjs/fluent-tester/src/FluentTesterApp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FluentTesterApp.d.ts","sourceRoot":"","sources":["../../../src/FluentTesterApp.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAIxD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAYtE,CAAC"}
+{"version":3,"file":"FluentTesterApp.d.ts","sourceRoot":"","sources":["../../../src/FluentTesterApp.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAIxD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CA8CtE,CAAC"}

package/lib-commonjs/fluent-tester/src/FluentTesterApp.js

@@ -13,7 +13,34 @@ var FluentTesterApp = function (props) {
     var isMobile = react_native_1.Platform.OS === 'android' || (react_native_1.Platform.OS === 'ios' && react_native_1.Platform.isPad === false);
     // If on iPad we are presented in a Split View or Slide Over context, show the single pane view.
     var shouldShowSinglePane = isMobile || (!isMobile && sizeClass === 'compact');
-    return (React.createElement(theme_1.ThemeProvider, { theme: index_1.testerTheme },
+    var customTheme = new theme_1.ThemeReference(index_1.testerTheme, function () {
+        return {
+            colors: { brandBackground2: 'red' }, // Overrides the buttonBackground color token, all other colors are kept in-tact.
+        };
+    }, function (theme) {
+        return {
+            colors: {
+                neutralForeground1: theme.colors.brandBackground2,
+                hostColorPink: 'pink',
+                hostColorBrandText: 'purple',
+                hostColorButtonBackground: 'yellow', // New custom color key.
+            },
+            spacing: {
+                s1: '10px',
+            },
+        };
+    }, function () {
+        // Any other recipe.
+        return {
+            colors: {
+                yellowBrandColor: 'yellow',
+                hostColorButtonBackground: 'green', // Overrides custom color key 'hostColorButtonBackground' - it is green in theme now.
+            },
+        };
+    });
+    // Use the custom colors for Android and iOS.
+    var fluentTesterTheme = isMobile ? customTheme : index_1.testerTheme;
+    return (React.createElement(theme_1.ThemeProvider, { theme: fluentTesterTheme },
         React.createElement(FluentTester_1.FluentTester, tslib_1.__assign({ enableSinglePaneView: shouldShowSinglePane }, props))));
 };
 exports.FluentTesterApp = FluentTesterApp;

package/lib-commonjs/fluent-tester/src/FluentTesterApp.js.map

@@ -1 +1 @@
-{"version":3,"file":"FluentTesterApp.js","sourceRoot":"","sources":["../../../src/FluentTesterApp.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;AAEb,mDAA+B;AAC/B,6CAAwC;AAExC,8GAAkG;AAClG,sDAA6D;AAG7D,+CAA8C;AAC9C,uCAA4C;AAErC,IAAM,eAAe,GAA+C,UAAC,KAAK;IAC/E,IAAM,SAAS,GAAG,IAAA,0DAAsB,GAAE,CAAC;IAC3C,IAAM,QAAQ,GAAG,uBAAQ,CAAC,EAAE,KAAK,SAAS,IAAI,CAAC,uBAAQ,CAAC,EAAE,KAAK,KAAK,IAAI,uBAAQ,CAAC,KAAK,KAAK,KAAK,CAAC,CAAC;IAElG,gGAAgG;IAChG,IAAM,oBAAoB,GAAG,QAAQ,IAAI,CAAC,CAAC,QAAQ,IAAI,SAAS,KAAK,SAAS,CAAC,CAAC;IAEhF,OAAO,CACL,oBAAC,qBAAa,IAAC,KAAK,EAAE,mBAAW;QAC/B,oBAAC,2BAAY,qBAAC,oBAAoB,EAAE,oBAAoB,IAAM,KAAK,EAAI,CACzD,CACjB,CAAC;AACJ,CAAC,CAAC;AAZW,QAAA,eAAe,mBAY1B"}
+{"version":3,"file":"FluentTesterApp.js","sourceRoot":"","sources":["../../../src/FluentTesterApp.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;AAEb,mDAA+B;AAC/B,6CAAwC;AAExC,8GAAkG;AAElG,sDAA6E;AAG7E,+CAA8C;AAC9C,uCAA4C;AAErC,IAAM,eAAe,GAA+C,UAAC,KAAK;IAC/E,IAAM,SAAS,GAAG,IAAA,0DAAsB,GAAE,CAAC;IAC3C,IAAM,QAAQ,GAAG,uBAAQ,CAAC,EAAE,KAAK,SAAS,IAAI,CAAC,uBAAQ,CAAC,EAAE,KAAK,KAAK,IAAI,uBAAQ,CAAC,KAAK,KAAK,KAAK,CAAC,CAAC;IAElG,gGAAgG;IAChG,IAAM,oBAAoB,GAAG,QAAQ,IAAI,CAAC,CAAC,QAAQ,IAAI,SAAS,KAAK,SAAS,CAAC,CAAC;IAEhF,IAAM,WAAW,GAAG,IAAI,sBAAc,CACpC,mBAAW,EACX;QACE,OAAO;YACL,MAAM,EAAE,EAAE,gBAAgB,EAAE,KAAK,EAAE,EAAE,iFAAiF;SACvH,CAAC;IACJ,CAAC,EACD,UAAC,KAAY;QACX,OAAO;YACL,MAAM,EAAE;gBACN,kBAAkB,EAAE,KAAK,CAAC,MAAM,CAAC,gBAAgB;gBACjD,aAAa,EAAE,MAAM;gBACrB,kBAAkB,EAAE,QAAQ;gBAC5B,yBAAyB,EAAE,QAAQ,EAAE,wBAAwB;aAC9D;YACD,OAAO,EAAE;gBACP,EAAE,EAAE,MAAM;aACX;SACF,CAAC;IACJ,CAAC,EACD;QACE,oBAAoB;QACpB,OAAO;YACL,MAAM,EAAE;gBACN,gBAAgB,EAAE,QAAQ;gBAC1B,yBAAyB,EAAE,OAAO,EAAE,qFAAqF;aAC1H;SACF,CAAC;IACJ,CAAC,CACF,CAAC;IAEF,6CAA6C;IAC7C,IAAM,iBAAiB,GAAmB,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,mBAAW,CAAC;IAE/E,OAAO,CACL,oBAAC,qBAAa,IAAC,KAAK,EAAE,iBAAiB;QACrC,oBAAC,2BAAY,qBAAC,oBAAoB,EAAE,oBAAoB,IAAM,KAAK,EAAI,CACzD,CACjB,CAAC;AACJ,CAAC,CAAC;AA9CW,QAAA,eAAe,mBA8C1B"}

package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuIcons.d.ts

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

package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuIcons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuIcons.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuIcons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAgB1B,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,iBAuB7B,CAAC"}

package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuIcons.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuIcons = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var react_native_1 = require("react-native");
+var react_native_2 = require("@fluentui/react-native");
+var menu_1 = require("@fluentui-react-native/menu");
+var stack_1 = require("@fluentui-react-native/stack");
+var iconExamples_1 = require("../Common/iconExamples");
+var styles_1 = require("../Common/styles");
+var fontBuiltInProps = {
+    fontFamily: 'Arial',
+    codepoint: 0x2663,
+};
+var svgIconsEnabled = ['ios', 'macos', 'win32', 'android'].includes(react_native_1.Platform.OS);
+var MenuIcons = function () {
+    return (react_1.default.createElement(stack_1.Stack, { style: styles_1.stackStyle },
+        react_1.default.createElement(menu_1.Menu, { hasIcons: true },
+            react_1.default.createElement(menu_1.MenuTrigger, null,
+                react_1.default.createElement(react_native_2.ButtonV1, null, "Items with icons")),
+            react_1.default.createElement(menu_1.MenuPopover, null,
+                react_1.default.createElement(menu_1.MenuList, null,
+                    react_1.default.createElement(menu_1.MenuItem, { icon: { source: iconExamples_1.testImage } }, "Option 1 image icon"),
+                    react_1.default.createElement(menu_1.MenuItem, { icon: { fontSource: tslib_1.__assign(tslib_1.__assign({}, fontBuiltInProps), { style: { textAlign: 'center', marginTop: -1 } }) } }, "Option 2 font icon"),
+                    svgIconsEnabled && react_1.default.createElement(menu_1.MenuItem, { icon: { svgSource: iconExamples_1.svgProps } }, "Option 3 svg icon"),
+                    react_1.default.createElement(menu_1.MenuItem, null, "Option 4 no icon"),
+                    react_1.default.createElement(menu_1.MenuItemCheckbox, { icon: { source: iconExamples_1.testImage }, name: "Option4" }, "Option 5 checkbox"))))));
+};
+exports.MenuIcons = MenuIcons;
+//# sourceMappingURL=MenuIcons.js.map

package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuIcons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuIcons.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuIcons.tsx"],"names":[],"mappings":";;;;AAAA,wDAA0B;AAC1B,6CAAwC;AAExC,uDAA4D;AAC5D,oDAAmH;AACnH,sDAAqD;AAErD,uDAA6D;AAC7D,2CAA8C;AAE9C,IAAM,gBAAgB,GAAG;IACvB,UAAU,EAAE,OAAO;IACnB,SAAS,EAAE,MAAM;CAClB,CAAC;AACF,IAAM,eAAe,GAAG,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,uBAAQ,CAAC,EAAY,CAAC,CAAC;AAEtF,IAAM,SAAS,GAA4B;IAChD,OAAO,CACL,8BAAC,aAAK,IAAC,KAAK,EAAE,mBAAU;QACtB,8BAAC,WAAI,IAAC,QAAQ;YACZ,8BAAC,kBAAW;gBACV,8BAAC,uBAAM,2BAA0B,CACrB;YACd,8BAAC,kBAAW;gBACV,8BAAC,eAAQ;oBACP,8BAAC,eAAQ,IAAC,IAAI,EAAE,EAAE,MAAM,EAAE,wBAAS,EAAE,0BAAgC;oBACrE,8BAAC,eAAQ,IAAC,IAAI,EAAE,EAAE,UAAU,wCAAO,gBAAgB,KAAE,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,CAAC,EAAE,GAAE,EAAE,yBAE3F;oBACV,eAAe,IAAI,8BAAC,eAAQ,IAAC,IAAI,EAAE,EAAE,SAAS,EAAE,uBAAQ,EAAE,wBAA8B;oBACzF,8BAAC,eAAQ,2BAA4B;oBACrC,8BAAC,uBAAgB,IAAC,IAAI,EAAE,EAAE,MAAM,EAAE,wBAAS,EAAE,EAAE,IAAI,EAAC,SAAS,wBAE1C,CACV,CACC,CACT,CACD,CACT,CAAC;AACJ,CAAC,CAAC;AAvBW,QAAA,SAAS,aAuBpB"}

package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuTest.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuTest.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAqT1B,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,iBAe5B,CAAC"}
+{"version":3,"file":"MenuTest.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Menu/MenuTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AA0T1B,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,iBAe5B,CAAC"}

package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuTest.js

@@ -9,6 +9,7 @@ var menu_1 = require("@fluentui-react-native/menu");
 var stack_1 = require("@fluentui-react-native/stack");
 var text_1 = require("@fluentui-react-native/text");
 var E2EMenuTest_1 = require("./E2EMenuTest");
+var MenuIcons_1 = require("./MenuIcons");
 var MenuRefs_1 = require("./MenuRefs");
 var MenuScrollView_1 = require("./MenuScrollView");
 var MenuTooltips_1 = require("./MenuTooltips");
@@ -187,6 +188,10 @@ var menuSections = [
         name: 'Menu with tooltips on items',
         component: MenuTooltips_1.MenuTooltips,
     },
+    {
+        name: 'Menu with icons',
+        component: MenuIcons_1.MenuIcons,
+    },
     {
         name: 'Menu Submenu',
         component: MenuSubMenu,

package/lib-commonjs/fluent-tester/src/TestComponents/Menu/MenuTest.js.map

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

package/lib-commonjs/fluent-tester/src/TestComponents/Theme/ThemeTest.android.d.ts

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

package/lib-commonjs/fluent-tester/src/TestComponents/Theme/ThemeTest.android.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeTest.android.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Theme/ThemeTest.android.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA+H/B,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,iBAa7B,CAAC"}

package/lib-commonjs/fluent-tester/src/TestComponents/Theme/ThemeTest.android.js

@@ -0,0 +1,104 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ThemeTest = void 0;
+var tslib_1 = require("tslib");
+var React = tslib_1.__importStar(require("react"));
+var react_native_1 = require("react-native");
+var react_native_2 = require("react-native");
+var react_native_3 = require("@fluentui/react-native");
+var framework_1 = require("@fluentui-react-native/framework");
+var themed_stylesheet_1 = require("@fluentui-react-native/themed-stylesheet");
+var consts_1 = require("../../../../E2E/src/Theme/consts");
+var styles_1 = require("../Common/styles");
+var Test_1 = require("../Test");
+var getThemedStyles = (0, themed_stylesheet_1.themedStyleSheet)(function (theme) {
+    return {
+        swatch: {
+            color: theme.colors.neutralForeground1,
+        },
+        rootView: {
+            backgroundColor: theme.colors.brandBackground,
+        },
+    };
+});
+var styles = react_native_2.StyleSheet.create({
+    swatchItem: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        marginVertical: 5,
+    },
+    panel: tslib_1.__assign(tslib_1.__assign({}, styles_1.commonTestStyles.view), { borderWidth: 2, padding: 12, margin: 8 }),
+    pickerContainer: {
+        flexDirection: 'row',
+        justifyContent: 'space-evenly',
+    },
+    stackStyle: {
+        borderWidth: 2,
+        padding: 12,
+        margin: 8,
+    },
+});
+var Panel = function () {
+    var theme = (0, framework_1.useFluentTheme)();
+    var themedStyles = getThemedStyles(theme);
+    return (React.createElement(react_native_1.View, null,
+        React.createElement(react_native_3.Text, { style: { color: theme.colors.buttonBackgroundChecked } }, "buttonBackgroundChecked styled text"),
+        React.createElement(react_native_3.Text, { style: { color: theme.colors.neutralForeground1 } }, "neutralForeground1 styled text"),
+        React.createElement(react_native_3.Text, { style: { color: theme.colors.hostColorPink } }, "hostColorPink styled text"),
+        React.createElement(react_native_3.Text, { style: { color: theme.colors.hostColorButtonBackground } }, "hostColorButtonBackground styled text"),
+        React.createElement(react_native_3.Text, { style: { color: theme.colors.hostColorBrandText } }, "hostColorBrandText styled text"),
+        React.createElement(react_native_1.Text, { style: { color: theme.colors.yellowBrandColor } }, "yellowBrandColor styled text"),
+        React.createElement(react_native_1.Text, { style: themedStyles.swatch }, "Styled RN Text")));
+};
+var getSwatchColorStyle = function (name, color) {
+    styles[name] = styles[name] || { backgroundColor: color };
+    return styles[name];
+};
+var SemanticColor = function (p) {
+    var themedStyles = getThemedStyles((0, framework_1.useFluentTheme)());
+    return (React.createElement(react_native_1.View, { style: styles.swatchItem },
+        React.createElement(react_native_1.View, { style: [getSwatchColorStyle(p.name, p.color), themedStyles.swatch] }),
+        React.createElement(react_native_3.Text, null, p.name)));
+};
+var SwatchList = function () {
+    var theme = (0, framework_1.useFluentTheme)();
+    var palette = theme.colors;
+    var aggregator = React.useCallback(function (key) {
+        return { key: key + ' (' + palette[key] + ')', color: palette[key] };
+    }, [palette]);
+    var flattenArray = React.useCallback(function () {
+        return Object.keys(palette).sort().map(aggregator);
+    }, [palette, aggregator]);
+    var paletteAsArray = React.useMemo(flattenArray, [flattenArray]);
+    var renderSwatch = React.useCallback(function (item) {
+        var color = item.color, key = item.key;
+        return React.createElement(SemanticColor, { key: key, color: color, name: key });
+    }, []);
+    return (React.createElement(react_native_1.View, { style: styles_1.commonTestStyles.view },
+        React.createElement(react_native_3.Text, null, "getColorsAndroid(theme: ITheme).palette"),
+        React.createElement(react_native_1.View, { style: styles.stackStyle }, paletteAsArray.map(function (item) { return renderSwatch(item); }))));
+};
+var themeSections = [
+    {
+        name: 'Component Examples',
+        testID: consts_1.THEME_TESTPAGE,
+        component: Panel,
+    },
+    {
+        name: 'Theme.colors',
+        component: function () { return React.createElement(SwatchList, null); },
+    },
+];
+var ThemeTest = function () {
+    var status = {
+        win32Status: 'Beta',
+        uwpStatus: 'Experimental',
+        iosStatus: 'Experimental',
+        macosStatus: 'Experimental',
+        androidStatus: 'Beta',
+    };
+    var description = 'The entire color palette of the controls is themeable. We provide a set of sensible defaults, but you can override all colors individually.';
+    return React.createElement(Test_1.Test, { name: "Theme Test", description: description, sections: themeSections, status: status });
+};
+exports.ThemeTest = ThemeTest;
+//# sourceMappingURL=ThemeTest.android.js.map

package/lib-commonjs/fluent-tester/src/TestComponents/Theme/ThemeTest.android.js.map

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-react-native/tester",
-  "version": "0.134.23",
+  "version": "0.134.25",
   "description": "A test app to test FluentUI React Native Components during development",
   "license": "MIT",
   "author": "Microsoft <fluentuinativeowners@microsoft.com>",
@@ -33,51 +33,51 @@
     "directory": "apps/fluent-tester"
   },
   "dependencies": {
-    "@fluentui-react-native/android-theme": ">=0.16.8 <1.0.0",
-    "@fluentui-react-native/apple-theme": ">=0.18.14 <1.0.0",
-    "@fluentui-react-native/avatar": "^1.7.0",
-    "@fluentui-react-native/badge": ">=0.4.31 <1.0.0",
-    "@fluentui-react-native/button": ">=0.32.36 <1.0.0",
-    "@fluentui-react-native/default-theme": ">=0.17.3 <1.0.0",
-    "@fluentui-react-native/divider": "^0.3.3",
-    "@fluentui-react-native/dropdown": ">=0.7.33 <1.0.0",
-    "@fluentui-react-native/experimental-activity-indicator": ">=0.7.20 <1.0.0",
-    "@fluentui-react-native/experimental-appearance-additions": "^0.3.4",
-    "@fluentui-react-native/experimental-avatar": ">=0.17.18 <1.0.0",
-    "@fluentui-react-native/experimental-button": "0.16.94",
-    "@fluentui-react-native/experimental-checkbox": "0.13.41",
-    "@fluentui-react-native/experimental-expander": "0.5.20",
-    "@fluentui-react-native/experimental-menu-button": ">=0.6.35 <1.0.0",
+    "@fluentui-react-native/android-theme": ">=0.16.9 <1.0.0",
+    "@fluentui-react-native/apple-theme": ">=0.18.15 <1.0.0",
+    "@fluentui-react-native/avatar": "^1.7.2",
+    "@fluentui-react-native/badge": ">=0.4.33 <1.0.0",
+    "@fluentui-react-native/button": ">=0.32.38 <1.0.0",
+    "@fluentui-react-native/default-theme": ">=0.17.4 <1.0.0",
+    "@fluentui-react-native/divider": "^0.3.5",
+    "@fluentui-react-native/dropdown": ">=0.7.35 <1.0.0",
+    "@fluentui-react-native/experimental-activity-indicator": ">=0.7.21 <1.0.0",
+    "@fluentui-react-native/experimental-appearance-additions": "^0.3.5",
+    "@fluentui-react-native/experimental-avatar": ">=0.17.19 <1.0.0",
+    "@fluentui-react-native/experimental-button": "0.16.96",
+    "@fluentui-react-native/experimental-checkbox": "0.13.42",
+    "@fluentui-react-native/experimental-expander": "0.5.21",
+    "@fluentui-react-native/experimental-menu-button": ">=0.6.37 <1.0.0",
     "@fluentui-react-native/experimental-native-date-picker": ">=0.7.6 <1.0.0",
-    "@fluentui-react-native/experimental-radio-group": "^0.9.22",
-    "@fluentui-react-native/experimental-shadow": "0.2.72",
-    "@fluentui-react-native/experimental-shimmer": "0.8.22",
-    "@fluentui-react-native/experimental-tabs": "0.8.35",
-    "@fluentui-react-native/experimental-text": ">=0.11.54 <1.0.0",
-    "@fluentui-react-native/framework": ">=0.9.3 <1.0.0",
-    "@fluentui-react-native/icon": "0.17.15",
-    "@fluentui-react-native/interactive-hooks": ">=0.22.21 <1.0.0",
-    "@fluentui-react-native/menu": "^1.4.14",
+    "@fluentui-react-native/experimental-radio-group": "^0.9.23",
+    "@fluentui-react-native/experimental-shadow": "0.2.73",
+    "@fluentui-react-native/experimental-shimmer": "0.8.23",
+    "@fluentui-react-native/experimental-tabs": "0.8.37",
+    "@fluentui-react-native/experimental-text": ">=0.11.55 <1.0.0",
+    "@fluentui-react-native/framework": ">=0.9.4 <1.0.0",
+    "@fluentui-react-native/icon": "0.17.17",
+    "@fluentui-react-native/interactive-hooks": ">=0.22.22 <1.0.0",
+    "@fluentui-react-native/menu": "^1.4.16",
     "@fluentui-react-native/merge-props": ">=0.5.3 <1.0.0",
-    "@fluentui-react-native/notification": "0.21.37",
-    "@fluentui-react-native/separator": "^0.14.17",
-    "@fluentui-react-native/stack": ">=0.7.55 <1.0.0",
-    "@fluentui-react-native/switch": "^0.8.30",
-    "@fluentui-react-native/text": ">=0.19.23 <1.0.0",
-    "@fluentui-react-native/theme": ">=0.8.1 <1.0.0",
-    "@fluentui-react-native/theme-tokens": "^0.24.3",
-    "@fluentui-react-native/theme-types": ">=0.30.3 <1.0.0",
+    "@fluentui-react-native/notification": "0.21.39",
+    "@fluentui-react-native/separator": "^0.14.18",
+    "@fluentui-react-native/stack": ">=0.7.56 <1.0.0",
+    "@fluentui-react-native/switch": "^0.8.31",
+    "@fluentui-react-native/text": ">=0.19.24 <1.0.0",
+    "@fluentui-react-native/theme": ">=0.8.2 <1.0.0",
+    "@fluentui-react-native/theme-tokens": "^0.24.4",
+    "@fluentui-react-native/theme-types": ">=0.30.4 <1.0.0",
     "@fluentui-react-native/themed-stylesheet": "^1.4.3",
-    "@fluentui-react-native/theming-utils": ">=0.23.5 <1.0.0",
-    "@fluentui-react-native/win32-theme": ">=0.25.3 <1.0.0",
-    "@fluentui/react-native": ">=0.36.6 <1.0.0",
+    "@fluentui-react-native/theming-utils": ">=0.23.6 <1.0.0",
+    "@fluentui-react-native/win32-theme": ">=0.25.4 <1.0.0",
+    "@fluentui/react-native": ">=0.36.8 <1.0.0",
     "@fortawesome/fontawesome-svg-core": "^6.2.0",
     "@fortawesome/free-solid-svg-icons": "^6.2.0",
     "@fortawesome/react-native-fontawesome": "^0.3.0",
     "@react-native-community/slider": "^4.2.0",
     "@react-native-menu/menu": "^0.1.2",
     "@react-native-picker/picker": "^2.2.1",
-    "@fluentui-react-native/spinner": "^0.2.5",
+    "@fluentui-react-native/spinner": "^0.2.6",
     "@warren-ms/react-native-icons": "^0.0.13",
     "react": "17.0.2",
     "react-native": "^0.68.0",
@@ -90,7 +90,7 @@
     "@babel/core": "^7.8.0",
     "@babel/runtime": "^7.8.0",
     "@fluentui-react-native/eslint-config-rules": "^0.1.1",
-    "@fluentui-react-native/focus-zone": "^0.11.33",
+    "@fluentui-react-native/focus-zone": "^0.11.34",
     "@fluentui-react-native/scripts": "^0.1.1",
     "@rnx-kit/cli": "^0.16.2",
     "@rnx-kit/metro-config": "^1.3.1",

package/src/FluentTesterApp.tsx

@@ -4,7 +4,8 @@ import * as React from 'react';
 import { Platform } from 'react-native';
 
 import { useHorizontalSizeClass } from '@fluentui-react-native/experimental-appearance-additions';
-import { ThemeProvider } from '@fluentui-react-native/theme';
+import type { Theme } from '@fluentui-react-native/framework';
+import { ThemeReference, ThemeProvider } from '@fluentui-react-native/theme';
 
 import type { FluentTesterProps } from './FluentTester';
 import { FluentTester } from './FluentTester';
@@ -17,8 +18,42 @@ export const FluentTesterApp: React.FunctionComponent<FluentTesterProps> = (prop
   // If on iPad we are presented in a Split View or Slide Over context, show the single pane view.
   const shouldShowSinglePane = isMobile || (!isMobile && sizeClass === 'compact');
 
+  const customTheme = new ThemeReference(
+    testerTheme,
+    () => {
+      return {
+        colors: { brandBackground2: 'red' }, // Overrides the buttonBackground color token, all other colors are kept in-tact.
+      };
+    },
+    (theme: Theme) => {
+      return {
+        colors: {
+          neutralForeground1: theme.colors.brandBackground2, // neutralBackground1 is 'red' in theme here because of previous recipe applied.
+          hostColorPink: 'pink', // New custom color key.
+          hostColorBrandText: 'purple', // New custom color key.
+          hostColorButtonBackground: 'yellow', // New custom color key.
+        },
+        spacing: {
+          s1: '10px',
+        },
+      };
+    },
+    () => {
+      // Any other recipe.
+      return {
+        colors: {
+          yellowBrandColor: 'yellow', // New custom color key.
+          hostColorButtonBackground: 'green', // Overrides custom color key 'hostColorButtonBackground' - it is green in theme now.
+        },
+      };
+    },
+  );
+
+  // Use the custom colors for Android and iOS.
+  const fluentTesterTheme: ThemeReference = isMobile ? customTheme : testerTheme;
+
   return (
-    <ThemeProvider theme={testerTheme}>
+    <ThemeProvider theme={fluentTesterTheme}>
       <FluentTester enableSinglePaneView={shouldShowSinglePane} {...props} />
     </ThemeProvider>
   );

package/src/TestComponents/Menu/MenuIcons.tsx

@@ -0,0 +1,40 @@
+import React from 'react';
+import { Platform } from 'react-native';
+
+import { ButtonV1 as Button } from '@fluentui/react-native';
+import { Menu, MenuItem, MenuItemCheckbox, MenuTrigger, MenuPopover, MenuList } from '@fluentui-react-native/menu';
+import { Stack } from '@fluentui-react-native/stack';
+
+import { testImage, svgProps } from '../Common/iconExamples';
+import { stackStyle } from '../Common/styles';
+
+const fontBuiltInProps = {
+  fontFamily: 'Arial',
+  codepoint: 0x2663,
+};
+const svgIconsEnabled = ['ios', 'macos', 'win32', 'android'].includes(Platform.OS as string);
+
+export const MenuIcons: React.FunctionComponent = () => {
+  return (
+    <Stack style={stackStyle}>
+      <Menu hasIcons>
+        <MenuTrigger>
+          <Button>Items with icons</Button>
+        </MenuTrigger>
+        <MenuPopover>
+          <MenuList>
+            <MenuItem icon={{ source: testImage }}>Option 1 image icon</MenuItem>
+            <MenuItem icon={{ fontSource: { ...fontBuiltInProps, style: { textAlign: 'center', marginTop: -1 } } }}>
+              Option 2 font icon
+            </MenuItem>
+            {svgIconsEnabled && <MenuItem icon={{ svgSource: svgProps }}>Option 3 svg icon</MenuItem>}
+            <MenuItem>Option 4 no icon</MenuItem>
+            <MenuItemCheckbox icon={{ source: testImage }} name="Option4">
+              Option 5 checkbox
+            </MenuItemCheckbox>
+          </MenuList>
+        </MenuPopover>
+      </Menu>
+    </Stack>
+  );
+};

package/src/TestComponents/Menu/MenuTest.tsx

@@ -16,6 +16,7 @@ import { Stack } from '@fluentui-react-native/stack';
 import { TextV1 as Text } from '@fluentui-react-native/text';
 
 import { E2EMenuTest } from './E2EMenuTest';
+import { MenuIcons } from './MenuIcons';
 import { MenuTriggerChildRef } from './MenuRefs';
 import { MenuScrollView } from './MenuScrollView';
 import { MenuTooltips } from './MenuTooltips';
@@ -274,6 +275,10 @@ const menuSections: TestSection[] = [
     name: 'Menu with tooltips on items',
     component: MenuTooltips,
   },
+  {
+    name: 'Menu with icons',
+    component: MenuIcons,
+  },
   {
     name: 'Menu Submenu',
     component: MenuSubMenu,