@fluentui-react-native/win32-theme 0.14.13 → 0.15.0

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,sBAAsB,CAAC;AACrC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,+BAA+B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAClG,YAAY,EACV,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,mBAAmB,EACnB,2BAA2B,EAC3B,+BAA+B,GAChC,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAE,2BAA2B,EAAE,0BAA0B,EAAE,MAAM,+BAA+B,CAAC"}

package/lib-commonjs/index.js

@@ -1,10 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-(0, tslib_1.__exportStar)(require("./createOfficeTheme"), exports);
-(0, tslib_1.__exportStar)(require("./createPartialOfficeTheme"), exports);
-(0, tslib_1.__exportStar)(require("./NativeModule/index"), exports);
-(0, tslib_1.__exportStar)(require("./paletteFromOfficeColors"), exports);
-(0, tslib_1.__exportStar)(require("./createOfficeAliasTokens"), exports);
-(0, tslib_1.__exportStar)(require("./createBrandedThemeWithAlias"), exports);
+exports.getCurrentBrandAliasTokens = exports.createBrandedThemeWithAlias = exports.createOfficeAliasTokens = exports.paletteFromOfficeColors = exports.getThemingModule = exports.fallbackOfficeModule = exports.fallbackGetPalette = exports.createPartialOfficeTheme = exports.createOfficeTheme = void 0;
+var createOfficeTheme_1 = require("./createOfficeTheme");
+Object.defineProperty(exports, "createOfficeTheme", { enumerable: true, get: function () { return createOfficeTheme_1.createOfficeTheme; } });
+var createPartialOfficeTheme_1 = require("./createPartialOfficeTheme");
+Object.defineProperty(exports, "createPartialOfficeTheme", { enumerable: true, get: function () { return createPartialOfficeTheme_1.createPartialOfficeTheme; } });
+var index_1 = require("./NativeModule/index");
+Object.defineProperty(exports, "fallbackGetPalette", { enumerable: true, get: function () { return index_1.fallbackGetPalette; } });
+Object.defineProperty(exports, "fallbackOfficeModule", { enumerable: true, get: function () { return index_1.fallbackOfficeModule; } });
+Object.defineProperty(exports, "getThemingModule", { enumerable: true, get: function () { return index_1.getThemingModule; } });
+var paletteFromOfficeColors_1 = require("./paletteFromOfficeColors");
+Object.defineProperty(exports, "paletteFromOfficeColors", { enumerable: true, get: function () { return paletteFromOfficeColors_1.paletteFromOfficeColors; } });
+var createOfficeAliasTokens_1 = require("./createOfficeAliasTokens");
+Object.defineProperty(exports, "createOfficeAliasTokens", { enumerable: true, get: function () { return createOfficeAliasTokens_1.createOfficeAliasTokens; } });
+var createBrandedThemeWithAlias_1 = require("./createBrandedThemeWithAlias");
+Object.defineProperty(exports, "createBrandedThemeWithAlias", { enumerable: true, get: function () { return createBrandedThemeWithAlias_1.createBrandedThemeWithAlias; } });
+Object.defineProperty(exports, "getCurrentBrandAliasTokens", { enumerable: true, get: function () { return createBrandedThemeWithAlias_1.getCurrentBrandAliasTokens; } });
 //# sourceMappingURL=index.js.map

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,mEAAoC;AACpC,0EAA2C;AAC3C,oEAAqC;AACrC,yEAA0C;AAC1C,yEAA0C;AAC1C,6EAA8C"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,yDAAwD;AAA/C,sHAAA,iBAAiB,OAAA;AAC1B,uEAAsE;AAA7D,oIAAA,wBAAwB,OAAA;AACjC,8CAAkG;AAAzF,2GAAA,kBAAkB,OAAA;AAAE,6GAAA,oBAAoB,OAAA;AAAE,yGAAA,gBAAgB,OAAA;AAUnE,qEAAoE;AAA3D,kIAAA,uBAAuB,OAAA;AAChC,qEAAoE;AAA3D,kIAAA,uBAAuB,OAAA;AAChC,6EAAwG;AAA/F,0IAAA,2BAA2B,OAAA;AAAE,yIAAA,0BAA0B,OAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-react-native/win32-theme",
-  "version": "0.14.13",
+  "version": "0.15.0",
   "description": "Win32 office theme that works with the theming native module",
   "repository": {
     "type": "git",
@@ -27,12 +27,12 @@
   "author": "",
   "license": "MIT",
   "dependencies": {
-    "@fluentui-react-native/default-theme": ">=0.9.11 <1.0.0",
+    "@fluentui-react-native/default-theme": ">=0.9.14 <1.0.0",
     "@fluentui-react-native/memo-cache": "^1.1.7",
-    "@fluentui-react-native/theme-tokens": ">=0.13.0 <1.0.0",
-    "@fluentui-react-native/theme-types": ">=0.14.0 <1.0.0",
-    "@fluentui-react-native/theme": ">=0.6.5 <1.0.0",
-    "@fluentui-react-native/theming-utils": ">=0.9.0 <1.0.0",
+    "@fluentui-react-native/theme-tokens": ">=0.14.0 <1.0.0",
+    "@fluentui-react-native/theme-types": ">=0.14.1 <1.0.0",
+    "@fluentui-react-native/theme": ">=0.6.6 <1.0.0",
+    "@fluentui-react-native/theming-utils": ">=0.9.3 <1.0.0",
     "tslib": "^2.3.1"
   },
   "devDependencies": {

package/src/black/tokens-alias.ts

@@ -0,0 +1,3 @@
+import aliasTokens from '../generated/black/tokens-aliases.json';
+
+export default aliasTokens;

package/src/colorful/tokens-alias.ts

@@ -0,0 +1,3 @@
+import aliasTokens from '../generated/colorful/tokens-aliases.json';
+
+export default aliasTokens;

package/src/createAliasesFromPalette.ts

@@ -1,6 +1,20 @@
 import { AliasColorTokens, OfficePalette } from '@fluentui-react-native/theme-types';
 
-export function createAliasesFromPalette(palette: OfficePalette): Partial<AliasColorTokens> {
+export function createAliasesFromPalette(palette: OfficePalette, isHighContrast: boolean): Partial<AliasColorTokens> {
+  // Workaround for getting checkmark to have correct color in HC
+  // while native code doesn't support PlatformColor
+  if (isHighContrast) {
+    return {
+      neutralForeground1: palette.Text,
+      neutralForeground2: palette.TextSecondary,
+      neutralForeground4: palette.TextCtlSubtlePlaceholder,
+      neutralForegroundDisabled: palette.TextDisabled,
+      neutralForegroundOnBrand: palette.TextCtlEmphasis,
+      neutralForegroundOnBrandHover: palette.TextCtlEmphasisHover,
+      neutralForegroundOnBrandPressed: palette.TextCtlEmphasisPressed,
+    };
+  }
+
   return {
     neutralForeground1: palette.Text,
     neutralForeground2: palette.TextSecondary,
@@ -38,6 +52,10 @@ export function createAliasesFromPalette(palette: OfficePalette): Partial<AliasC
     brandBackgroundHover: palette.BkgCtlEmphasisHover,
     brandBackgroundPressed: palette.BkgCtlEmphasisPressed,
 
+    compoundBrandBackground1: palette.BkgToggleSwitchOn,
+    compoundBrandBackground1Hover: palette.BkgToggleSwitchOnHover,
+    compoundBrandBackground1Pressed: palette.BkgToggleSwitchOnPressed,
+
     neutralStrokeAccessible: palette.StrokeOnlySelected,
     neutralStrokeAccessibleHover: palette.StrokeOnlyHover,
     neutralStrokeAccessiblePressed: palette.StrokeOnlyPressed,

package/src/createOfficeAliasTokens.ts

@@ -1,4 +1,4 @@
-import { getOfficeAliasTokens } from '@fluentui-react-native/theme-tokens';
+import { getOfficeAliasTokens } from './getOfficeAliasTokens';
 import { AliasColorTokens } from '@fluentui-react-native/theme-types';
 import { memoize } from '@fluentui-react-native/memo-cache';
 import { mapPipelineToTheme } from '@fluentui-react-native/theming-utils';

package/src/createOfficeTheme.ts

@@ -49,7 +49,7 @@ export function createOfficeTheme(options: ThemeOptions = {}): ThemeReference {
         return {};
       }
 
-      return { colors: createAliasesFromPalette(theme.host.palette) };
+      return { colors: createAliasesFromPalette(theme.host.palette, ref.themeName === 'HighContrast') };
     },
   );
 

package/src/darkGray/tokens-alias.ts

@@ -0,0 +1,3 @@
+import aliasTokens from '../generated/darkGray/tokens-aliases.json';
+
+export default aliasTokens;

package/src/generated/black/tokens-aliases.json

@@ -0,0 +1,292 @@
+{
+  "body": {
+    "fontFamily": "\"Segoe UI\", Roboto, \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
+    "fontLineHeight": 20,
+    "fontSize": 14,
+    "fontWeight": "400"
+  },
+  "bodyStrong": {
+    "fontFamily": "\"Segoe UI\", Roboto, \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
+    "fontLineHeight": 20,
+    "fontSize": 14,
+    "fontWeight": "600"
+  },
+  "borderless": {
+    "strokeAlignment": "inner",
+    "strokeColorRest": "transparent",
+    "strokeColorHover": "transparent",
+    "strokeColorPressed": "transparent",
+    "strokeColorDisabled": "transparent",
+    "strokeWidth": 1
+  },
+  "brandBackground": {
+    "fillColorRest": "#185abd",
+    "fillColorHover": "#1651aa",
+    "fillColorPressed": "#0e336a",
+    "fillColorSelected": "#13458f"
+  },
+  "brandBackground2": {
+    "fillColorRest": "#d2e0f4"
+  },
+  "brandBackgroundStatic": {
+    "fillColorRest": "#185abd"
+  },
+  "brandForeground1": {
+    "fillColorRest": "#aec6eb"
+  },
+  "brandForeground2": {
+    "fillColorRest": "#d2e0f4"
+  },
+  "brandForegroundLink": {
+    "fillColorRest": "#aec6eb",
+    "fillColorHover": "#d2e0f4",
+    "fillColorPressed": "#2e6ac5",
+    "fillColorSelected": "#d2e0f4"
+  },
+  "brandStroke1": {
+    "strokeColorRest": "#185abd",
+    "strokeWidth": 1
+  },
+  "brandStroke2": {
+    "strokeColorRest": "#6794d7",
+    "strokeWidth": 1
+  },
+  "caption": {
+    "fontFamily": "\"Segoe UI\", Roboto, \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
+    "fontLineHeight": 16,
+    "fontSize": 12,
+    "fontWeight": "400"
+  },
+  "compoundBrandBackground1": {
+    "fillColorRest": "#185abd",
+    "fillColorHover": "#1651aa",
+    "fillColorPressed": "#0e336a"
+  },
+  "compoundBrandForeground1": {
+    "fillColorRest": "#aec6eb",
+    "fillColorHover": "#d2e0f4",
+    "fillColorPressed": "#2e6ac5"
+  },
+  "compoundBrandStroke1": {
+    "strokeColorRest": "#185abd",
+    "strokeColorHover": "#1651aa",
+    "strokeColorPressed": "#0e336a",
+    "strokeWidth": 1
+  },
+  "display": {
+    "fontFamily": "\"Segoe UI\", Roboto, \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
+    "fontLineHeight": 92,
+    "fontSize": 68,
+    "fontWeight": "600"
+  },
+  "headline": {
+    "fontFamily": "\"Segoe UI\", Roboto, \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
+    "fontLineHeight": 28,
+    "fontSize": 20,
+    "fontWeight": "600"
+  },
+  "largeTitle": {
+    "fontFamily": "\"Segoe UI\", Roboto, \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
+    "fontLineHeight": 52,
+    "fontSize": 40,
+    "fontWeight": "600"
+  },
+  "neutralBackground1": {
+    "fillColorRest": "#292929",
+    "fillColorHover": "#3d3d3d",
+    "fillColorPressed": "#1f1f1f",
+    "fillColorSelected": "#383838"
+  },
+  "neutralBackground2": {
+    "fillColorRest": "#1f1f1f",
+    "fillColorHover": "#333333",
+    "fillColorPressed": "#141414",
+    "fillColorSelected": "#2e2e2e"
+  },
+  "neutralBackground3": {
+    "fillColorRest": "#141414",
+    "fillColorHover": "#292929",
+    "fillColorPressed": "#0a0a0a",
+    "fillColorSelected": "#242424"
+  },
+  "neutralBackground4": {
+    "fillColorRest": "#0a0a0a",
+    "fillColorHover": "#1f1f1f",
+    "fillColorPressed": "#000000",
+    "fillColorSelected": "#1a1a1a"
+  },
+  "neutralBackground5": {
+    "fillColorRest": "#000000",
+    "fillColorHover": "#141414",
+    "fillColorPressed": "#050505",
+    "fillColorSelected": "#0f0f0f"
+  },
+  "neutralBackground6": {
+    "fillColorRest": "#333333"
+  },
+  "neutralBackgroundDisabled": {
+    "fillColorRest": "#141414"
+  },
+  "neutralBackgroundInverted": {
+    "fillColorRest": "#ffffff"
+  },
+  "neutralForeground1": {
+    "fillColorRest": "#ffffff",
+    "fillColorHover": "#ffffff",
+    "fillColorPressed": "#ffffff",
+    "fillColorSelected": "#ffffff"
+  },
+  "neutralForeground2": {
+    "fillColorRest": "#d6d6d6",
+    "fillColorHover": "#ffffff",
+    "fillColorPressed": "#ffffff",
+    "fillColorBrandHover": "#d2e0f4",
+    "fillColorBrandPressed": "#2e6ac5",
+    "fillColorBrandSelected": "#d2e0f4",
+    "fillColorSelected": "#ffffff"
+  },
+  "neutralForeground3": {
+    "fillColorRest": "#adadad",
+    "fillColorHover": "#d6d6d6",
+    "fillColorPressed": "#d6d6d6",
+    "fillColorBrandHover": "#d2e0f4",
+    "fillColorBrandPressed": "#2e6ac5",
+    "fillColorBrandSelected": "#d2e0f4",
+    "fillColorSelected": "#d6d6d6"
+  },
+  "neutralForeground4": {
+    "fillColorRest": "#999999"
+  },
+  "neutralForegroundDisabled": {
+    "fillColorRest": "#5c5c5c"
+  },
+  "neutralForegroundInverted": {
+    "fillColorRest": "#000000"
+  },
+  "neutralForegroundInvertedLink": {
+    "fillColorRest": "#292929",
+    "fillColorHover": "#292929",
+    "fillColorPressed": "#292929",
+    "fillColorSelected": "#292929"
+  },
+  "neutralForegroundOnBrand": {
+    "fillColorRest": "#ffffff",
+    "fillColorHover": "#ffffff",
+    "fillColorPressed": "#ffffff",
+    "fillColorSelected": "#ffffff"
+  },
+  "neutralStencil1": {
+    "fillColorRest": "#333333"
+  },
+  "neutralStencil2": {
+    "fillColorRest": "#575757"
+  },
+  "neutralStroke1": {
+    "strokeColorRest": "#666666",
+    "strokeColorHover": "#757575",
+    "strokeColorPressed": "#6b6b6b",
+    "strokeColorSelected": "#707070",
+    "strokeWidth": 1
+  },
+  "neutralStroke2": {
+    "strokeColorRest": "#525252",
+    "strokeWidth": 1
+  },
+  "neutralStroke3": {
+    "strokeColorRest": "#3d3d3d",
+    "strokeWidth": 1
+  },
+  "neutralStrokeAccessible": {
+    "strokeColorRest": "#adadad",
+    "strokeColorHover": "#bdbdbd",
+    "strokeColorPressed": "#b3b3b3",
+    "strokeColorSelected": "#185abd",
+    "strokeWidth": 1
+  },
+  "neutralStrokeDisabled": {
+    "strokeColorRest": "#424242",
+    "strokeWidth": 1
+  },
+  "redBackground1": {
+    "fillColorRest": "#230308"
+  },
+  "redBackground2": {
+    "fillColorRest": "#420610"
+  },
+  "redBackground3": {
+    "fillColorRest": "#750b1c"
+  },
+  "redBorder1": {
+    "strokeColorRest": "#750b1c",
+    "strokeWidth": 1
+  },
+  "redBorder2": {
+    "strokeColorRest": "#962f3f",
+    "strokeWidth": 1
+  },
+  "redBorderActive": {
+    "strokeColorRest": "#ac4f5e",
+    "strokeWidth": 1
+  },
+  "redForeground1": {
+    "fillColorRest": "#ac4f5e"
+  },
+  "redForeground2": {
+    "fillColorRest": "#d69ca5"
+  },
+  "redForeground3": {
+    "fillColorRest": "#962f3f"
+  },
+  "strokeFocus1": {
+    "strokeColorRest": "#000000",
+    "strokeWidth": 1
+  },
+  "strokeFocus2": {
+    "strokeColorRest": "#ffffff",
+    "strokeWidth": 1
+  },
+  "subheadline": {
+    "fontFamily": "\"Segoe UI\", Roboto, \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
+    "fontLineHeight": 22,
+    "fontSize": 16,
+    "fontWeight": "600"
+  },
+  "subtleBackground": {
+    "fillColorRest": "transparent",
+    "fillColorHover": "#3d3d3d",
+    "fillColorPressed": "#1f1f1f",
+    "fillColorSelected": "#383838"
+  },
+  "title1": {
+    "fontFamily": "\"Segoe UI\", Roboto, \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
+    "fontLineHeight": 40,
+    "fontSize": 32,
+    "fontWeight": "600"
+  },
+  "title2": {
+    "fontFamily": "\"Segoe UI\", Roboto, \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
+    "fontLineHeight": 36,
+    "fontSize": 28,
+    "fontWeight": "600"
+  },
+  "title3": {
+    "fontFamily": "\"Segoe UI\", Roboto, \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
+    "fontLineHeight": 32,
+    "fontSize": 24,
+    "fontWeight": "600"
+  },
+  "transparentBackground": {
+    "fillColorRest": "transparent",
+    "fillColorHover": "transparent",
+    "fillColorPressed": "transparent",
+    "fillColorSelected": "transparent"
+  },
+  "transparentStroke": {
+    "strokeAlignment": "inner",
+    "strokeColorRest": "transparent",
+    "strokeColorHover": "transparent",
+    "strokeColorPressed": "transparent",
+    "strokeColorDisabled": "transparent",
+    "strokeWidth": 1
+  }
+}