@fluentui-react-native/default-theme 0.20.0 → 0.21.1

package/lib-commonjs/stockWebPalette.win32.js

@@ -0,0 +1,85 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getStockWebDarkPalette = exports.getStockWebPalette = void 0;
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+var theme_tokens_1 = require("@fluentui-react-native/theme-tokens");
+var createAliasTokens_1 = require("./createAliasTokens");
+var defaultColors_1 = require("./defaultColors");
+function getStockWebPalette() {
+    return __assign(__assign({}, (0, defaultColors_1.paletteFromFabricColors)({
+        black: theme_tokens_1.globalTokens.color.black,
+        neutralDark: '#201f1e',
+        neutralPrimary: '#323130',
+        neutralPrimaryAlt: '#3b3a39',
+        neutralSecondary: '#605e5c',
+        neutralSecondaryAlt: '#8a8886',
+        neutralTertiary: '#a19f9d',
+        neutralTertiaryAlt: '#c8c6c4',
+        neutralQuaternary: '#d2d0ce',
+        neutralQuaternaryAlt: '#e1dfdd',
+        neutralLight: '#edebe9',
+        neutralLighter: '#f3f2f1',
+        neutralLighterAlt: '#faf9f8',
+        white: theme_tokens_1.globalTokens.color.white,
+        // Shared Colors
+        red: theme_tokens_1.globalTokens.color.red.primary,
+        redDark: theme_tokens_1.globalTokens.color.burgundy.primary,
+        themeDarker: theme_tokens_1.globalTokens.color.brand.shade40,
+        themeDark: theme_tokens_1.globalTokens.color.brand.shade20,
+        themeDarkAlt: theme_tokens_1.globalTokens.color.brand.shade10,
+        themePrimary: theme_tokens_1.globalTokens.color.brand.primary,
+        themeSecondary: '#2b88d8',
+        themeTertiary: '#71afe5',
+        themeLight: theme_tokens_1.globalTokens.color.brand.tint40,
+        themeLighter: theme_tokens_1.globalTokens.color.brand.tint50,
+        themeLighterAlt: theme_tokens_1.globalTokens.color.brand.tint60,
+        accent: theme_tokens_1.globalTokens.color.brand.primary,
+        blackTranslucent40: 'rgba(0,0,0,.4)',
+    })), (0, createAliasTokens_1.createColorAliasTokens)('light'));
+}
+exports.getStockWebPalette = getStockWebPalette;
+function getStockWebDarkPalette() {
+    return __assign(__assign({}, (0, defaultColors_1.paletteFromFabricColors)({
+        // colors taken from fluentui DarkCustomizations.ts
+        themeDarker: '#82c7ff',
+        themeDark: theme_tokens_1.globalTokens.color.brand.tint30,
+        themeDarkAlt: theme_tokens_1.globalTokens.color.brand.tint20,
+        themePrimary: theme_tokens_1.globalTokens.color.brand.tint10,
+        themeSecondary: theme_tokens_1.globalTokens.color.brand.primary,
+        themeTertiary: '#235a85',
+        themeLight: theme_tokens_1.globalTokens.color.brand.shade30,
+        themeLighter: theme_tokens_1.globalTokens.color.brand.shade50,
+        themeLighterAlt: theme_tokens_1.globalTokens.color.brand.shade60,
+        black: theme_tokens_1.globalTokens.color.white,
+        neutralDark: '#faf9f8',
+        neutralPrimary: '#f3f2f1',
+        neutralPrimaryAlt: '#c8c6c4',
+        neutralSecondary: '#a19f9d',
+        neutralSecondaryAlt: '#979693',
+        neutralTertiary: '#797775',
+        neutralTertiaryAlt: '#484644',
+        neutralQuaternary: '#3b3a39',
+        neutralQuaternaryAlt: '#323130',
+        neutralLight: '#292827',
+        neutralLighter: '#252423',
+        neutralLighterAlt: '#201f1e',
+        white: '#1b1a19',
+        red: theme_tokens_1.globalTokens.color.red.primary,
+        accent: theme_tokens_1.globalTokens.color.brand.primary,
+        redDark: '#f1707b',
+        blackTranslucent40: 'rgba(0,0,0,.4)',
+    }, true)), (0, createAliasTokens_1.createColorAliasTokens)('dark'));
+}
+exports.getStockWebDarkPalette = getStockWebDarkPalette;
+//# sourceMappingURL=stockWebPalette.win32.js.map

package/lib-commonjs/stockWebPalette.win32.js.map

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-react-native/default-theme",
-  "version": "0.20.0",
+  "version": "0.21.1",
   "description": "Typing only package for fluentui-react-native theme types",
   "repository": {
     "type": "git",
@@ -28,10 +28,10 @@
   "license": "MIT",
   "dependencies": {
     "@fluentui-react-native/memo-cache": "^1.3.1",
-    "@fluentui-react-native/theme": ">=0.10.0 <1.0.0",
-    "@fluentui-react-native/theme-tokens": "^0.26.0",
-    "@fluentui-react-native/theme-types": ">=0.33.0 <1.0.0",
-    "@fluentui-react-native/theming-utils": ">=0.25.0 <1.0.0",
+    "@fluentui-react-native/theme": ">=0.10.1 <1.0.0",
+    "@fluentui-react-native/theme-tokens": "^0.26.1",
+    "@fluentui-react-native/theme-types": ">=0.34.0 <1.0.0",
+    "@fluentui-react-native/theming-utils": ">=0.25.1 <1.0.0",
     "assert-never": "^1.2.1"
   },
   "devDependencies": {

package/src/__tests__/__snapshots__/default-theme.test.ts.snap

@@ -1072,27 +1072,16 @@ exports[`createDefaultTheme test themeOption - { appearance: 'dark', defaultAppe
     "brandStroke1": "#2e6ac5",
     "brandStroke2": "#0e336a",
     "brandedBackground": "#2e6ac5",
-    "brandedBorder": "#aec6eb",
     "brandedCheckedBackground": "#484644",
     "brandedCheckedContent": "#faf9f8",
     "brandedCheckedHoveredBackground": "#292827",
     "brandedCheckedHoveredContent": "#f3f2f1",
-    "brandedContent": "#1b1a19",
     "brandedDisabledBackground": "#252423",
     "brandedDisabledBorder": "#252423",
     "brandedDisabledContent": "#3b3a39",
     "brandedDisabledIcon": "#3b3a39",
-    "brandedFocusedBackground": "#6794d7",
-    "brandedFocusedBorder": "#82c7ff",
-    "brandedFocusedContent": "#1b1a19",
-    "brandedFocusedIcon": "#1b1a19",
     "brandedFocusedSecondaryContent": "#201f1e",
-    "brandedHoveredBackground": "#6794d7",
-    "brandedHoveredBorder": "#82c7ff",
-    "brandedHoveredContent": "#1b1a19",
-    "brandedHoveredIcon": "#1b1a19",
     "brandedHoveredSecondaryContent": "#201f1e",
-    "brandedIcon": "#1b1a19",
     "brandedPressedBackground": "#aec6eb",
     "brandedPressedBorder": "#82c7ff",
     "brandedPressedContent": "#1b1a19",
@@ -1745,27 +1734,16 @@ exports[`createDefaultTheme test themeOption - { appearance: 'dynamic', defaultA
     "brandStroke1": "#2e6ac5",
     "brandStroke2": "#0e336a",
     "brandedBackground": "#2e6ac5",
-    "brandedBorder": "#aec6eb",
     "brandedCheckedBackground": "#484644",
     "brandedCheckedContent": "#faf9f8",
     "brandedCheckedHoveredBackground": "#292827",
     "brandedCheckedHoveredContent": "#f3f2f1",
-    "brandedContent": "#1b1a19",
     "brandedDisabledBackground": "#252423",
     "brandedDisabledBorder": "#252423",
     "brandedDisabledContent": "#3b3a39",
     "brandedDisabledIcon": "#3b3a39",
-    "brandedFocusedBackground": "#6794d7",
-    "brandedFocusedBorder": "#82c7ff",
-    "brandedFocusedContent": "#1b1a19",
-    "brandedFocusedIcon": "#1b1a19",
     "brandedFocusedSecondaryContent": "#201f1e",
-    "brandedHoveredBackground": "#6794d7",
-    "brandedHoveredBorder": "#82c7ff",
-    "brandedHoveredContent": "#1b1a19",
-    "brandedHoveredIcon": "#1b1a19",
     "brandedHoveredSecondaryContent": "#201f1e",
-    "brandedIcon": "#1b1a19",
     "brandedPressedBackground": "#aec6eb",
     "brandedPressedBorder": "#82c7ff",
     "brandedPressedContent": "#1b1a19",
@@ -2474,27 +2452,16 @@ exports[`createDefaultTheme test themeOption - { appearance: 'highContrast', def
       ],
     },
     "brandedBackground": "#000000",
-    "brandedBorder": "#ffffff",
     "brandedCheckedBackground": "#1aebff",
     "brandedCheckedContent": "#000000",
     "brandedCheckedHoveredBackground": "#1aebff",
     "brandedCheckedHoveredContent": "#000000",
-    "brandedContent": "#ffffff",
     "brandedDisabledBackground": "#000000",
     "brandedDisabledBorder": "#3ff23f",
     "brandedDisabledContent": "#3ff23f",
     "brandedDisabledIcon": "#3ff23f",
-    "brandedFocusedBackground": "#000000",
-    "brandedFocusedBorder": "#ffffff",
-    "brandedFocusedContent": "#ffffff",
-    "brandedFocusedIcon": "#ffffff",
     "brandedFocusedSecondaryContent": "#ffffff",
-    "brandedHoveredBackground": "#1aebff",
-    "brandedHoveredBorder": "#1aebff",
-    "brandedHoveredContent": "#000000",
-    "brandedHoveredIcon": "#000000",
     "brandedHoveredSecondaryContent": "#000000",
-    "brandedIcon": "#ffffff",
     "brandedPressedBackground": "#1aebff",
     "brandedPressedBorder": "#1aebff",
     "brandedPressedContent": "#000000",
@@ -3659,27 +3626,16 @@ exports[`createDefaultTheme test themeOption - { appearance: 'light', defaultApp
     "brandStroke1": "#185abd",
     "brandStroke2": "#d2e0f4",
     "brandedBackground": "#185abd",
-    "brandedBorder": "#13458f",
     "brandedCheckedBackground": "#c8c6c4",
     "brandedCheckedContent": "#201f1e",
     "brandedCheckedHoveredBackground": "#edebe9",
     "brandedCheckedHoveredContent": "#201f1e",
-    "brandedContent": "#ffffff",
     "brandedDisabledBackground": "#f3f2f1",
     "brandedDisabledBorder": "#f3f2f1",
     "brandedDisabledContent": "#d2d0ce",
     "brandedDisabledIcon": "#d2d0ce",
-    "brandedFocusedBackground": "#1651aa",
-    "brandedFocusedBorder": "#004578",
-    "brandedFocusedContent": "#ffffff",
-    "brandedFocusedIcon": "#ffffff",
     "brandedFocusedSecondaryContent": "#faf9f8",
-    "brandedHoveredBackground": "#1651aa",
-    "brandedHoveredBorder": "#004578",
-    "brandedHoveredContent": "#ffffff",
-    "brandedHoveredIcon": "#ffffff",
     "brandedHoveredSecondaryContent": "#faf9f8",
-    "brandedIcon": "#ffffff",
     "brandedPressedBackground": "#13458f",
     "brandedPressedBorder": "#004578",
     "brandedPressedContent": "#ffffff",
@@ -4332,27 +4288,16 @@ exports[`createDefaultTheme test themeOption - { appearance: undefined, defaultA
     "brandStroke1": "#185abd",
     "brandStroke2": "#d2e0f4",
     "brandedBackground": "#185abd",
-    "brandedBorder": "#13458f",
     "brandedCheckedBackground": "#c8c6c4",
     "brandedCheckedContent": "#201f1e",
     "brandedCheckedHoveredBackground": "#edebe9",
     "brandedCheckedHoveredContent": "#201f1e",
-    "brandedContent": "#ffffff",
     "brandedDisabledBackground": "#f3f2f1",
     "brandedDisabledBorder": "#f3f2f1",
     "brandedDisabledContent": "#d2d0ce",
     "brandedDisabledIcon": "#d2d0ce",
-    "brandedFocusedBackground": "#1651aa",
-    "brandedFocusedBorder": "#004578",
-    "brandedFocusedContent": "#ffffff",
-    "brandedFocusedIcon": "#ffffff",
     "brandedFocusedSecondaryContent": "#faf9f8",
-    "brandedHoveredBackground": "#1651aa",
-    "brandedHoveredBorder": "#004578",
-    "brandedHoveredContent": "#ffffff",
-    "brandedHoveredIcon": "#ffffff",
     "brandedHoveredSecondaryContent": "#faf9f8",
-    "brandedIcon": "#ffffff",
     "brandedPressedBackground": "#13458f",
     "brandedPressedBorder": "#004578",
     "brandedPressedContent": "#ffffff",
@@ -5524,27 +5469,16 @@ exports[`defaultFluentDarkTheme test 1`] = `
     "brandStroke1": "#2e6ac5",
     "brandStroke2": "#0e336a",
     "brandedBackground": "#2e6ac5",
-    "brandedBorder": "#aec6eb",
     "brandedCheckedBackground": "#484644",
     "brandedCheckedContent": "#faf9f8",
     "brandedCheckedHoveredBackground": "#292827",
     "brandedCheckedHoveredContent": "#f3f2f1",
-    "brandedContent": "#1b1a19",
     "brandedDisabledBackground": "#252423",
     "brandedDisabledBorder": "#252423",
     "brandedDisabledContent": "#3b3a39",
     "brandedDisabledIcon": "#3b3a39",
-    "brandedFocusedBackground": "#6794d7",
-    "brandedFocusedBorder": "#82c7ff",
-    "brandedFocusedContent": "#1b1a19",
-    "brandedFocusedIcon": "#1b1a19",
     "brandedFocusedSecondaryContent": "#201f1e",
-    "brandedHoveredBackground": "#6794d7",
-    "brandedHoveredBorder": "#82c7ff",
-    "brandedHoveredContent": "#1b1a19",
-    "brandedHoveredIcon": "#1b1a19",
     "brandedHoveredSecondaryContent": "#201f1e",
-    "brandedIcon": "#1b1a19",
     "brandedPressedBackground": "#aec6eb",
     "brandedPressedBorder": "#82c7ff",
     "brandedPressedContent": "#1b1a19",
@@ -6197,27 +6131,16 @@ exports[`defaultFluentTheme test 1`] = `
     "brandStroke1": "#185abd",
     "brandStroke2": "#d2e0f4",
     "brandedBackground": "#185abd",
-    "brandedBorder": "#13458f",
     "brandedCheckedBackground": "#c8c6c4",
     "brandedCheckedContent": "#201f1e",
     "brandedCheckedHoveredBackground": "#edebe9",
     "brandedCheckedHoveredContent": "#201f1e",
-    "brandedContent": "#ffffff",
     "brandedDisabledBackground": "#f3f2f1",
     "brandedDisabledBorder": "#f3f2f1",
     "brandedDisabledContent": "#d2d0ce",
     "brandedDisabledIcon": "#d2d0ce",
-    "brandedFocusedBackground": "#1651aa",
-    "brandedFocusedBorder": "#004578",
-    "brandedFocusedContent": "#ffffff",
-    "brandedFocusedIcon": "#ffffff",
     "brandedFocusedSecondaryContent": "#faf9f8",
-    "brandedHoveredBackground": "#1651aa",
-    "brandedHoveredBorder": "#004578",
-    "brandedHoveredContent": "#ffffff",
-    "brandedHoveredIcon": "#ffffff",
     "brandedHoveredSecondaryContent": "#faf9f8",
-    "brandedIcon": "#ffffff",
     "brandedPressedBackground": "#13458f",
     "brandedPressedBorder": "#004578",
     "brandedPressedContent": "#ffffff",

package/src/defaultColors.ts

@@ -158,19 +158,6 @@ export function paletteFromFabricColors(p: FabricWebPalette, isInverted?: boolea
     ghostDisabledIcon: p.neutralTertiary,
 
     brandedBackground: p.themePrimary,
-    brandedBorder: p.themeDark,
-    brandedContent: p.white,
-    brandedIcon: p.white,
-
-    brandedHoveredBackground: p.themeDarkAlt,
-    brandedHoveredBorder: p.themeDarker,
-    brandedHoveredContent: p.white,
-    brandedHoveredIcon: p.white,
-
-    brandedFocusedBackground: p.themeDarkAlt,
-    brandedFocusedBorder: p.themeDarker,
-    brandedFocusedContent: p.white,
-    brandedFocusedIcon: p.white,
 
     brandedPressedBackground: p.themeDark,
     brandedPressedBorder: p.themeDarker,
@@ -222,106 +209,6 @@ export function paletteFromFabricColors(p: FabricWebPalette, isInverted?: boolea
   };
 }
 
-export function getStockWebPalette(): ThemeColorDefinition {
-  return {
-    ...paletteFromFabricColors({
-      black: globalTokens.color.black,
-      neutralDark: '#201f1e',
-      neutralPrimary: '#323130',
-      neutralPrimaryAlt: '#3b3a39',
-      neutralSecondary: '#605e5c',
-      neutralSecondaryAlt: '#8a8886',
-      neutralTertiary: '#a19f9d',
-      neutralTertiaryAlt: '#c8c6c4',
-      neutralQuaternary: '#d2d0ce',
-      neutralQuaternaryAlt: '#e1dfdd',
-      neutralLight: '#edebe9',
-      neutralLighter: '#f3f2f1',
-      neutralLighterAlt: '#faf9f8',
-      white: globalTokens.color.white,
-      // Shared Colors
-      red: globalTokens.color.red.primary,
-      redDark: globalTokens.color.burgundy.primary,
-
-      // @ts-ignore
-      accent: globalTokens.color.brand80,
-      blackTranslucent40: 'rgba(0,0,0,.4)',
-
-      // Colors to be deprecated
-      // @ts-ignore
-      themeDarker: globalTokens.color.brand40,
-      // @ts-ignore
-      themeDark: globalTokens.color.brand60,
-      // @ts-ignore
-      themeDarkAlt: globalTokens.color.brand70,
-      // @ts-ignore
-      themePrimary: globalTokens.color.brand80,
-      // @ts-ignore
-      themeSecondary: globalTokens.color.brand90,
-      // @ts-ignore
-      themeTertiary: globalTokens.color.brand120,
-      // @ts-ignore
-      themeLight: globalTokens.color.brand140,
-      // @ts-ignore
-      themeLighter: globalTokens.color.brand150,
-      // @ts-ignore
-      themeLighterAlt: globalTokens.color.brand160,
-    }),
-    ...createColorAliasTokens('light'),
-  };
-}
-
-export function getStockWebDarkPalette(): ThemeColorDefinition {
-  return {
-    ...paletteFromFabricColors(
-      {
-        // colors taken from fluentui DarkCustomizations.ts
-        black: globalTokens.color.white,
-        neutralDark: '#faf9f8',
-        neutralPrimary: '#f3f2f1',
-        neutralPrimaryAlt: '#c8c6c4',
-        neutralSecondary: '#a19f9d',
-        neutralSecondaryAlt: '#979693',
-        neutralTertiary: '#797775',
-        neutralTertiaryAlt: '#484644',
-        neutralQuaternary: '#3b3a39',
-        neutralQuaternaryAlt: '#323130',
-        neutralLight: '#292827',
-        neutralLighter: '#252423',
-        neutralLighterAlt: '#201f1e',
-        white: '#1b1a19',
-        red: globalTokens.color.red.primary,
-        // @ts-ignore
-        accent: globalTokens.color.brand40,
-        redDark: '#f1707b',
-        blackTranslucent40: 'rgba(0,0,0,.4)',
-
-        // Colors to be deprecated
-        // @ts-ignore
-        themeDarker: globalTokens.color.brand110,
-        // @ts-ignore
-        themeDark: globalTokens.color.brand100,
-        // @ts-ignore
-        themeDarkAlt: globalTokens.color.brand100,
-        // @ts-ignore
-        themePrimary: globalTokens.color.brand90,
-        // @ts-ignore
-        themeSecondary: globalTokens.color.brand90,
-        // @ts-ignore
-        themeTertiary: globalTokens.color.brand60,
-        // @ts-ignore
-        themeLight: globalTokens.color.brand50,
-        // @ts-ignore
-        themeLighter: globalTokens.color.brand40,
-        // @ts-ignore
-        themeLighterAlt: globalTokens.color.brand30,
-      },
-      true,
-    ),
-    ...createColorAliasTokens('dark'),
-  };
-}
-
 export function getStockWebHCPalette(): ThemeColorDefinition {
   return {
     background: '#000000',
@@ -470,19 +357,6 @@ export function getStockWebHCPalette(): ThemeColorDefinition {
     ghostDisabledIcon: '#3ff23f',
 
     brandedBackground: '#000000',
-    brandedBorder: '#ffffff',
-    brandedContent: '#ffffff',
-    brandedIcon: '#ffffff',
-
-    brandedHoveredBackground: '#1aebff',
-    brandedHoveredBorder: '#1aebff',
-    brandedHoveredContent: '#000000',
-    brandedHoveredIcon: '#000000',
-
-    brandedFocusedBackground: '#000000',
-    brandedFocusedBorder: '#ffffff',
-    brandedFocusedContent: '#ffffff',
-    brandedFocusedIcon: '#ffffff',
 
     brandedPressedBackground: '#1aebff',
     brandedPressedBorder: '#1aebff',

package/src/defaultTheme.ts

@@ -4,7 +4,8 @@ import { globalTokens } from '@fluentui-react-native/theme-tokens';
 import type { Theme, Typography, Spacing, FontWeightValue, FontSize, FontSizes, Variants } from '@fluentui-react-native/theme-types';
 
 import { createShadowAliasTokens } from './createAliasTokens';
-import { getStockWebPalette, getStockWebDarkPalette, getStockWebHCPalette } from './defaultColors';
+import { getStockWebHCPalette } from './defaultColors';
+import { getStockWebPalette, getStockWebDarkPalette } from './stockWebPalette';
 
 function _defaultTypography(): Typography {
   const defaultsDict = {

package/src/stockWebPalette.macos.ts

@@ -0,0 +1,82 @@
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+import { globalTokens } from '@fluentui-react-native/theme-tokens';
+import type { ThemeColorDefinition } from '@fluentui-react-native/theme-types';
+
+import { createColorAliasTokens } from './createAliasTokens';
+import { paletteFromFabricColors } from './defaultColors';
+
+export function getStockWebPalette(): ThemeColorDefinition {
+  return {
+    ...paletteFromFabricColors({
+      black: globalTokens.color.black,
+      neutralDark: '#201f1e',
+      neutralPrimary: '#323130',
+      neutralPrimaryAlt: '#3b3a39',
+      neutralSecondary: '#605e5c',
+      neutralSecondaryAlt: '#8a8886',
+      neutralTertiary: '#a19f9d',
+      neutralTertiaryAlt: '#c8c6c4',
+      neutralQuaternary: '#d2d0ce',
+      neutralQuaternaryAlt: '#e1dfdd',
+      neutralLight: '#edebe9',
+      neutralLighter: '#f3f2f1',
+      neutralLighterAlt: '#faf9f8',
+      white: globalTokens.color.white,
+      // Shared Colors
+      red: globalTokens.color.red.primary,
+      redDark: globalTokens.color.burgundy.primary,
+
+      themeDarker: globalTokens.color.brand.shade40,
+      themeDark: globalTokens.color.brand.shade20,
+      themeDarkAlt: globalTokens.color.brand.shade10,
+      themePrimary: globalTokens.color.brand.primary,
+      themeSecondary: '#2b88d8',
+      themeTertiary: '#71afe5',
+      themeLight: globalTokens.color.brand.tint40,
+      themeLighter: globalTokens.color.brand.tint50,
+      themeLighterAlt: globalTokens.color.brand.tint60,
+      accent: globalTokens.color.brand.primary,
+      blackTranslucent40: 'rgba(0,0,0,.4)',
+    }),
+    ...createColorAliasTokens('light'),
+  };
+}
+
+export function getStockWebDarkPalette(): ThemeColorDefinition {
+  return {
+    ...paletteFromFabricColors(
+      {
+        // colors taken from fluentui DarkCustomizations.ts
+        themeDarker: '#82c7ff',
+        themeDark: globalTokens.color.brand.tint30,
+        themeDarkAlt: globalTokens.color.brand.tint20,
+        themePrimary: globalTokens.color.brand.tint10,
+        themeSecondary: globalTokens.color.brand.primary,
+        themeTertiary: '#235a85',
+        themeLight: globalTokens.color.brand.shade30,
+        themeLighter: globalTokens.color.brand.shade50,
+        themeLighterAlt: globalTokens.color.brand.shade60,
+        black: globalTokens.color.white,
+        neutralDark: '#faf9f8',
+        neutralPrimary: '#f3f2f1',
+        neutralPrimaryAlt: '#c8c6c4',
+        neutralSecondary: '#a19f9d',
+        neutralSecondaryAlt: '#979693',
+        neutralTertiary: '#797775',
+        neutralTertiaryAlt: '#484644',
+        neutralQuaternary: '#3b3a39',
+        neutralQuaternaryAlt: '#323130',
+        neutralLight: '#292827',
+        neutralLighter: '#252423',
+        neutralLighterAlt: '#201f1e',
+        white: '#1b1a19',
+        red: globalTokens.color.red.primary,
+        accent: globalTokens.color.brand.primary,
+        redDark: '#f1707b',
+        blackTranslucent40: 'rgba(0,0,0,.4)',
+      },
+      true,
+    ),
+    ...createColorAliasTokens('dark'),
+  };
+}

package/src/stockWebPalette.ts

@@ -0,0 +1,106 @@
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+import { globalTokens } from '@fluentui-react-native/theme-tokens';
+import type { ThemeColorDefinition } from '@fluentui-react-native/theme-types';
+
+import { createColorAliasTokens } from './createAliasTokens';
+import { paletteFromFabricColors } from './defaultColors';
+
+export function getStockWebPalette(): ThemeColorDefinition {
+  return {
+    ...paletteFromFabricColors({
+      black: globalTokens.color.black,
+      neutralDark: '#201f1e',
+      neutralPrimary: '#323130',
+      neutralPrimaryAlt: '#3b3a39',
+      neutralSecondary: '#605e5c',
+      neutralSecondaryAlt: '#8a8886',
+      neutralTertiary: '#a19f9d',
+      neutralTertiaryAlt: '#c8c6c4',
+      neutralQuaternary: '#d2d0ce',
+      neutralQuaternaryAlt: '#e1dfdd',
+      neutralLight: '#edebe9',
+      neutralLighter: '#f3f2f1',
+      neutralLighterAlt: '#faf9f8',
+      white: globalTokens.color.white,
+      // Shared Colors
+      red: globalTokens.color.red.primary,
+      redDark: globalTokens.color.burgundy.primary,
+
+      // @ts-ignore
+      accent: globalTokens.color.brand80,
+      blackTranslucent40: 'rgba(0,0,0,.4)',
+
+      // Colors to be deprecated
+      // @ts-ignore
+      themeDarker: globalTokens.color.brand40,
+      // @ts-ignore
+      themeDark: globalTokens.color.brand60,
+      // @ts-ignore
+      themeDarkAlt: globalTokens.color.brand70,
+      // @ts-ignore
+      themePrimary: globalTokens.color.brand80,
+      // @ts-ignore
+      themeSecondary: globalTokens.color.brand90,
+      // @ts-ignore
+      themeTertiary: globalTokens.color.brand120,
+      // @ts-ignore
+      themeLight: globalTokens.color.brand140,
+      // @ts-ignore
+      themeLighter: globalTokens.color.brand150,
+      // @ts-ignore
+      themeLighterAlt: globalTokens.color.brand160,
+    }),
+    ...createColorAliasTokens('light'),
+  };
+}
+
+export function getStockWebDarkPalette(): ThemeColorDefinition {
+  return {
+    ...paletteFromFabricColors(
+      {
+        // colors taken from fluentui DarkCustomizations.ts
+        black: globalTokens.color.white,
+        neutralDark: '#faf9f8',
+        neutralPrimary: '#f3f2f1',
+        neutralPrimaryAlt: '#c8c6c4',
+        neutralSecondary: '#a19f9d',
+        neutralSecondaryAlt: '#979693',
+        neutralTertiary: '#797775',
+        neutralTertiaryAlt: '#484644',
+        neutralQuaternary: '#3b3a39',
+        neutralQuaternaryAlt: '#323130',
+        neutralLight: '#292827',
+        neutralLighter: '#252423',
+        neutralLighterAlt: '#201f1e',
+        white: '#1b1a19',
+        red: globalTokens.color.red.primary,
+        // @ts-ignore
+        accent: globalTokens.color.brand40,
+        redDark: '#f1707b',
+        blackTranslucent40: 'rgba(0,0,0,.4)',
+
+        // Colors to be deprecated
+        // @ts-ignore
+        themeDarker: globalTokens.color.brand110,
+        // @ts-ignore
+        themeDark: globalTokens.color.brand100,
+        // @ts-ignore
+        themeDarkAlt: globalTokens.color.brand100,
+        // @ts-ignore
+        themePrimary: globalTokens.color.brand90,
+        // @ts-ignore
+        themeSecondary: globalTokens.color.brand90,
+        // @ts-ignore
+        themeTertiary: globalTokens.color.brand60,
+        // @ts-ignore
+        themeLight: globalTokens.color.brand50,
+        // @ts-ignore
+        themeLighter: globalTokens.color.brand40,
+        // @ts-ignore
+        themeLighterAlt: globalTokens.color.brand30,
+      },
+      true,
+    ),
+    ...createColorAliasTokens('dark'),
+  };
+}