Feature: Add support for NSColorWithSystemEffect to the Color API

[Saadnajmi]

Proposal: Add support for NSColorWithSystemEffect to the Color API

Summary

Starting from macOS 10.14, Apple introduced the API colorWithSystemEffect, which allows you to add system effects to colors like "pressed", "rollover" (mouse hover), and "disabled". This marks a change where Apple is telling us to use the System API to style our custom component's colors for various states, rather than coming up with the colors ourselves. Currently, this API is not accessible to react-native-macos, meaning our components won't look and feel right on the platform going forward. Let's expose this API in a similar fashion to how we expose PlatformColor and DynamicColorMacOS.

Motivation

The main motivation came from trying to handle convergence in styling between FluentUI Apple and FluentUI React Native .

In FluentUI Apple, we make use of the colorWithSystemEffect API to style our custom button. To achieve the same effect on FluentUI React Native, we need to use a native module to apply the system effect and convert the color to a hex string. This is very cumbersome, ugly, and not future proof (what if Apple decides to use a colorspace that can't be converted to the sRGB colorspace in a future release?). We shouldn't need to do this since we already have a mechanism for exposing system defined color: PlatformColor. I believe this is a perfect example of a platform specific color API that belongs in React Native.

Basic example

const viewBackgroundColor = enabled ? 'blue' : ColorWithSystemEffectMacOS('blue', 'disabled')

...

<View
  style={{
    backgroundColor: color: viewBackgroundColor,
  }}
/>

Open Questions

1. Should we style Pressable to use the new ColorWithSystemEffect API by default? The current behavior does not match the system colors.

[chrisglein]

@Saadnajmi looks like you merged the change. Okay to close?

[Saadnajmi]

@chrisglein probably OK. I wanted to ask @HeyImChris if we want to cherry pick this commit into RN 0.63, which is why I hadn't closed it yet