@fluentui-react-native/apple-theme 0.9.8 → 0.9.11

package/src/createAppleTheme.macos.ts

@@ -2,15 +2,31 @@ import { ThemeReference } from '@fluentui-react-native/theme';
 import { Theme } from '@fluentui-react-native/theme-types';
 import { Appearance } from 'react-native';
 import { getBaseAppleThemeMacOS } from './appleTheme.macos';
+import { AccessibilityInfo } from 'react-native-macos';
+import { setIsHighContrast } from './appleHighContrast.macos';
+
+let appleThemeReference: ThemeReference;
 
 export function createAppleTheme(): ThemeReference {
-  const appleThemeReference = new ThemeReference({} as Theme, () => {
+  appleThemeReference = new ThemeReference({} as Theme, () => {
     return getBaseAppleThemeMacOS();
   });
+  // Fetch initial system settings for high contrast mode
+  highContrastHandler();
+  // Invalidate theme and set prop when high contrast setting changes
+  AccessibilityInfo.addEventListener('highContrastChanged', () => {
+    highContrastHandler();
+  });
 
   Appearance.addChangeListener(() => {
     appleThemeReference.invalidate();
   });
-
   return appleThemeReference;
 }
+
+function highContrastHandler() {
+  AccessibilityInfo.isHighContrastEnabled().then((isEnabled) => {
+    setIsHighContrast(isEnabled);
+    appleThemeReference.invalidate();
+  });
+}

package/src/createMacOSAliasTokens.ts

@@ -1,10 +1,10 @@
-import { getAliasTokens } from '@fluentui-react-native/theme-tokens';
+import { getMacOSAliasTokens } from '@fluentui-react-native/theme-tokens';
 import { AliasColorTokens, AppearanceOptions } from '@fluentui-react-native/theme-types';
-import { memoize } from '@fluentui-react-native/memo-cache';
 import { mapPipelineToTheme } from '@fluentui-react-native/theming-utils';
+import { memoize } from '@fluentui-react-native/memo-cache';
 
-function createMacOSAliasTokensWorker(mode: AppearanceOptions): AliasColorTokens {
-  const aliasTokens = getAliasTokens(mode);
+function createMacOSAliasTokensWorker(mode: AppearanceOptions, isHighContrast: boolean): AliasColorTokens {
+  const aliasTokens = getMacOSAliasTokens(mode, isHighContrast);
   return mapPipelineToTheme(aliasTokens);
 }
 

package/src/index.ts

@@ -1,2 +1,3 @@
 export * from './createAppleTheme';
 export * from './createMacOSAliasTokens';
+export * from './appleHighContrast.macos';