feat(HighContrast): Expose the XAML HighContrastChanged event to JS

Libraries/Components/AccessibilityInfo/AccessibilityInfo.windows.js

@@ -1,4 +1,4 @@
-/**
+/**
  * Copyright (c) 2015-present, Facebook, Inc.
  * All rights reserved.
  *
@@ -11,32 +11,55 @@
  */
 'use strict';
 
-type ChangeEventName = $Enum<{
-  change: string,
-}>;
+var NativeModules = require('NativeModules');
+var RCTDeviceEventEmitter = require('RCTDeviceEventEmitter');
+
+var RCTAccessibilityInfo = NativeModules.AccessibilityInfo;
+var HIGH_CONTRAST_EVENT = 'highContrastDidChange';
+var _subscriptions = new Map();
 
-var warning = require('fbjs/lib/warning');
+type AccessibilityEventName = $Enum<{
+  [HIGH_CONTRAST_EVENT]: string,
+}>;
 
 var AccessibilityInfo = {
 
-  fetch: function(): Promise<*> {
+  initialHighContrast: RCTAccessibilityInfo.initialHighContrast,
+
+  fetch: function(): Promise {
     return new Promise((resolve, reject) => {
-      reject('AccessibilityInfo is not supported on this platform.');
+      resolve(false);
     });
   },
 
+  fetchIsHighContrast: function (): Promise {
+    return RCTAccessibilityInfo.fetchIsHighContrast();
+  },  
+
   addEventListener: function (
-    eventName: ChangeEventName,
+    eventName: AccessibilityEventName,
     handler: Function
-  ): void {
-    warning(false, 'AccessibilityInfo is not supported on this platform.');
+  ): Object {
+    if (eventName !== HIGH_CONTRAST_EVENT) {
+      return {
+        remove() { }
+      };      
+    }
+
+    var listener = RCTDeviceEventEmitter.addListener(eventName, enabled => handler(enabled));
+
+    _subscriptions.set(handler, listener);
+
+    return listener;
   },
 
   removeEventListener: function(
-    eventName: ChangeEventName,
+    eventName: AccessibilityEventName,
     handler: Function
   ): void {
-    warning(false, 'AccessibilityInfo is not supported on this platform.');
+    var listener = _subscriptions.get(handler);
+    listener && listener.remove();
+    _subscriptions.delete(handler);  
   },
 
 };

ReactWindows/ReactNative/Modules/AccessibilityInfo/AccessibilityInfoModule.cs

@@ -0,0 +1,77 @@
+using ReactNative.Bridge;
+using ReactNative.Modules.Core;
+using System.Collections.Generic;
+using Windows.UI.ViewManagement;
+
+namespace ReactNative.Modules.Accessibilityinfo
+{
+    class AccessibilityInfoModule : ReactContextNativeModuleBase
+    {
+        private readonly AccessibilitySettings _accessibility = new AccessibilitySettings();
+        private readonly UISettings _settings = new UISettings();
+
+        private string GetRgbaString(UIElementType type)
+        {
+            var color = _settings.UIElementColor(type);
+            return "rgba(" + color.R + "," + color.G + "," + color.B + "," + color.A + ")";
+        }
+
+        private IDictionary<string, string> GetHighContrastColors()
+        {
+            return new Dictionary<string, string>
+            {
+                {  "windowText", GetRgbaString(UIElementType.WindowText) },
+                {  "hotlight", GetRgbaString(UIElementType.Hotlight) },
+                {  "grayText", GetRgbaString(UIElementType.GrayText) },
+                {  "highlightText", GetRgbaString(UIElementType.HighlightText) },
+                {  "highlight", GetRgbaString(UIElementType.Highlight) },
+                {  "buttonText", GetRgbaString(UIElementType.ButtonText) },
+                {  "buttonFace", GetRgbaString(UIElementType.ButtonFace) },
+                {  "window", GetRgbaString(UIElementType.Window) },
+            };
+        }
+
+        public AccessibilityInfoModule(ReactContext reactContext)
+            : base(reactContext)
+        {
+
+        }
+
+        public override string Name => "AccessibilityInfo";
+
+        public override IReadOnlyDictionary<string, object> Constants
+        {
+            get
+            {
+                return new Dictionary<string, object>
+                {
+                    // TODO: It would be better to have a sync GethIsHighContrast,
+                    // but this is not supported by the framework at the moment.
+                    { "initialHighContrast", _accessibility.HighContrast },
+                };
+            }
+        }
+
+        public override void Initialize()
+        {
+            _accessibility.HighContrastChanged += OnHighContrastChanged;
+        }
+
+        public override void OnReactInstanceDispose()
+        {
+            _accessibility.HighContrastChanged -= OnHighContrastChanged;
+        }
+
+        private void OnHighContrastChanged(AccessibilitySettings sender, object args)
+        {
+            Context.GetJavaScriptModule<RCTDeviceEventEmitter>()
+                .emit("highContrastDidChange", sender.HighContrast);
+        }
+
+        [ReactMethod]
+        public void fetchIsHighContrast(IPromise promise)
+        {
+            promise.Resolve(_accessibility.HighContrast);
+        }
+    }
+}

ReactWindows/ReactNative/ReactNative.csproj

@@ -110,6 +110,7 @@
     <Compile Include="DevSupport\ShakeAccelerometer.cs" />
     <Compile Include="DevSupport\WebSocketJavaScriptExecutor.cs" />
     <Compile Include="GlobalSuppressions.cs" />
+    <Compile Include="Modules\AccessibilityInfo\AccessibilityInfoModule.cs" />
     <Compile Include="Modules\Clipboard\ClipboardInstance.cs" />
     <Compile Include="Modules\Clipboard\ClipboardModule.cs" />
     <Compile Include="Modules\Clipboard\IClipboardInstance.cs" />

ReactWindows/ReactNative/Shell/MainReactPackage.cs

@@ -1,5 +1,6 @@
 using ReactNative.Animated;
 using ReactNative.Bridge;
+using ReactNative.Modules.Accessibilityinfo;
 using ReactNative.Modules.AppState;
 using ReactNative.Modules.Clipboard;
 using ReactNative.Modules.Core;
@@ -46,6 +47,7 @@ public IReadOnlyList<INativeModule> CreateNativeModules(ReactContext reactContex
         {
             return new List<INativeModule>
             {
+                new AccessibilityInfoModule(reactContext),
                 new AppStateModule(reactContext),
                 new AsyncStorageModule(),
                 //new CameraRollManager(reactContext),