not-react-native-macos 0.87.1-rc.3 → 0.87.1-rc.5

package/Libraries/Components/View/ViewPropTypes.js

@@ -128,6 +128,96 @@ type FocusEventProps = Readonly<{
   onFocusCapture?: ?(event: FocusEvent) => void,
 }>;
 
+// [macOS] Props that only exist on macOS. They are declared here rather than in
+// a .macos file because ViewPropTypes is shared, and a prop that is simply
+// absent on other platforms costs them nothing. The native side is
+// HostPlatformViewProps under components/view/platform/macos. macOS]
+/**
+ * A key the view means to act on itself. A modifier left out is a wildcard:
+ * `{key: 'c'}` matches Cmd-C and a bare c alike.
+ *
+ * @platform macos
+ */
+export type HandledKeyEvent = Readonly<{
+  key: string,
+  altKey?: ?boolean,
+  ctrlKey?: ?boolean,
+  metaKey?: ?boolean,
+  shiftKey?: ?boolean,
+}>;
+
+type MacOSViewProps = Readonly<{
+  /**
+   * Keys this view handles itself, suppressing AppKit's own interpretation of
+   * them -- Tab moving focus, Escape cancelling, an unclaimed key beeping.
+   *
+   * Separate from `onKeyDown`, deliberately: listening to a key does not change
+   * what it does, so a view that observes Tab still lets Tab move focus. Only
+   * listing a key here claims it.
+   *
+   * @platform macos
+   */
+  keyDownEvents?: ?$ReadOnlyArray<HandledKeyEvent>,
+
+  /**
+   * As `keyDownEvents`, for key release.
+   *
+   * @platform macos
+   */
+  keyUpEvents?: ?$ReadOnlyArray<HandledKeyEvent>,
+
+  /**
+   * The view's help tag, shown when the pointer rests over it.
+   *
+   * @platform macos
+   */
+  tooltip?: ?string,
+
+  /**
+   * Receive the click that activates a background window, rather than letting
+   * it be swallowed to bring the window forward.
+   *
+   * @platform macos
+   */
+  acceptsFirstMouse?: ?boolean,
+
+  /**
+   * Let the view blend with what is behind it when inside a vibrancy effect.
+   *
+   * @platform macos
+   */
+  allowsVibrancy?: ?boolean,
+
+  /**
+   * Draw the focus ring while the view is first responder. Defaults to true.
+   *
+   * @platform macos
+   */
+  enableFocusRing?: ?boolean,
+
+  /**
+   * Whether dragging the view moves the window. AppKit defaults this to true;
+   * set it false for a view that should handle its own drags.
+   *
+   * @platform macos
+   */
+  mouseDownCanMoveWindow?: ?boolean,
+
+  /**
+   * Called on a double click.
+   *
+   * @platform macos
+   */
+  onDoubleClick?: ?(event: MouseEvent) => void,
+
+  /**
+   * Called on a secondary (right) click.
+   *
+   * @platform macos
+   */
+  onAuxClick?: ?(event: MouseEvent) => void,
+}>;
+
 type KeyEventProps = Readonly<{
   onKeyDown?: ?(event: KeyDownEvent) => void,
   onKeyDownCapture?: ?(event: KeyDownEvent) => void,
@@ -566,6 +656,7 @@ export type ViewProps = Readonly<{
   ...DirectEventProps,
   ...GestureResponderHandlers,
   ...MouseEventProps,
+  ...MacOSViewProps, // [macOS]
   ...PointerEventProps,
   ...FocusEventProps,
   ...KeyEventProps,

package/Libraries/NativeComponent/BaseViewConfig.macos.js

@@ -1,4 +1,4 @@
-/*
+/**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
@@ -8,16 +8,73 @@
  * @format
  */
 
-// [macOS] macOS resolves as `.macos` -> `.native` -> shared, so without this
-// file `BaseViewConfig` re-exports itself: the shared file is a
-// stub that expects a platform-suffixed sibling to answer. Point it at the iOS
-// implementation, which is what this fork uses on macOS wherever upstream has
-// no platform-neutral one. macOS]
+// [macOS] The view config decides which props reach native at all: anything
+// missing from `validAttributes` is dropped before it ever gets to C++. So the
+// macOS-only props declared in HostPlatformViewProps have to be listed here as
+// well, or setting them does nothing.
+//
+// Everything iOS declares still applies, so this extends that config rather
+// than replacing it. Names match microsoft/react-native-macos. macOS]
 
-// NOTE: This file supports backwards compatibility of subpath (deep) imports
-// from 'react-native' with platform-specific extensions. It can be deleted
-// once we remove the "./*" mapping from package.json "exports".
+import type {PartialViewConfigWithoutName} from './PlatformBaseViewConfig';
 
-import BaseViewConfig from './BaseViewConfig.ios';
+// $FlowFixMe[cannot-resolve-module] macOS shares the iOS base config.
+import PlatformBaseViewConfigIOS from './BaseViewConfig.ios';
+import {ConditionallyIgnoredEventHandlers} from './ViewConfigIgnore';
 
-export default BaseViewConfig;
+const bubblingEventTypes = {
+  ...PlatformBaseViewConfigIOS.bubblingEventTypes,
+  topKeyDown: {
+    phasedRegistrationNames: {
+      captured: 'onKeyDownCapture',
+      bubbled: 'onKeyDown',
+    },
+  },
+  topKeyUp: {
+    phasedRegistrationNames: {
+      captured: 'onKeyUpCapture',
+      bubbled: 'onKeyUp',
+    },
+  },
+};
+
+const directEventTypes = {
+  ...PlatformBaseViewConfigIOS.directEventTypes,
+  topDoubleClick: {registrationName: 'onDoubleClick'},
+  topAuxClick: {registrationName: 'onAuxClick'},
+  topMouseEnter: {registrationName: 'onMouseEnter'},
+  topMouseLeave: {registrationName: 'onMouseLeave'},
+};
+
+const validAttributesForNonEventProps = {
+  acceptsFirstMouse: true,
+  allowsVibrancy: true,
+  enableFocusRing: true,
+  focusable: true,
+  keyDownEvents: true,
+  keyUpEvents: true,
+  mouseDownCanMoveWindow: true,
+  tooltip: true,
+};
+
+const validAttributesForEventProps = ConditionallyIgnoredEventHandlers({
+  onAuxClick: true,
+  onDoubleClick: true,
+  onKeyDown: true,
+  onKeyUp: true,
+  onMouseEnter: true,
+  onMouseLeave: true,
+});
+
+const PlatformBaseViewConfigMacOS: PartialViewConfigWithoutName = {
+  bubblingEventTypes,
+  directEventTypes,
+  validAttributes: {
+    ...PlatformBaseViewConfigIOS.validAttributes,
+    ...validAttributesForNonEventProps,
+    // $FlowFixMe[exponential-spread]
+    ...validAttributesForEventProps,
+  },
+};
+
+export default PlatformBaseViewConfigMacOS;

package/Libraries/NativeComponent/ViewConfigIgnore.js

@@ -39,7 +39,11 @@ export function DynamicallyInjectedByGestureHandler<T extends {...}>(
 export function ConditionallyIgnoredEventHandlers<
   const T extends {readonly [name: string]: true},
 >(value: T): T | void {
-  if (Platform.OS === 'ios') {
+  // [macOS] macOS declares its view props the same way iOS does, so it keeps
+  // these too. Reporting Platform.OS as 'macos' without this drops every event
+  // handler in the base view config -- including iOS's own -- and nothing that
+  // depends on them ever fires. macOS]
+  if (Platform.OS === 'ios' || Platform.OS === 'macos') {
     return value;
   }
   return undefined;

package/Libraries/StyleSheet/PlatformColorValueTypes.macos.js

@@ -1,4 +1,4 @@
-/*
+/**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
@@ -8,14 +8,151 @@
  * @format
  */
 
-// [macOS] macOS resolves as `.macos` -> `.native` -> shared, so without this
-// file `PlatformColorValueTypes` re-exports itself: the shared file is a
-// stub that expects a platform-suffixed sibling to answer. Point it at the iOS
-// implementation, which is what this fork uses on macOS wherever upstream has
-// no platform-neutral one. macOS]
+// [macOS] The macOS colour types.
+//
+// `semantic` and `dynamic` carry over from iOS unchanged -- RCTConvert resolves
+// both on this platform, and semantic names are looked up on NSColor, so
+// AppKit's whole vocabulary (labelColor, windowBackgroundColor,
+// controlAccentColor, ...) works. What iOS has no equivalent for is
+// `colorWithSystemEffect`, AppKit's pressed / disabled / rollover variants of a
+// colour, so that is added here. macOS]
 
-// NOTE: This file supports backwards compatibility of subpath (deep) imports
-// from 'react-native' with platform-specific extensions. It can be deleted
-// once we remove the "./*" mapping from package.json "exports".
 
-export * from './PlatformColorValueTypes.ios';
+import type {ProcessedColorValue} from './processColor';
+import type {ColorValue, NativeColorValue} from './StyleSheet';
+
+/** The actual type of the opaque NativeColorValue on macOS platform */
+type LocalNativeColorValue = {
+  semantic?: Array<string>,
+  colorWithSystemEffect?: {
+    baseColor: ?(ColorValue | ProcessedColorValue),
+    systemEffect: string,
+  },
+  dynamic?: {
+    light: ?(ColorValue | ProcessedColorValue),
+    dark: ?(ColorValue | ProcessedColorValue),
+    highContrastLight?: ?(ColorValue | ProcessedColorValue),
+    highContrastDark?: ?(ColorValue | ProcessedColorValue),
+  },
+};
+
+export const PlatformColor = (...names: Array<string>): NativeColorValue => {
+  // $FlowExpectedError[incompatible-type] LocalNativeColorValue is the iOS LocalNativeColorValue type
+  return {semantic: names} as LocalNativeColorValue;
+};
+
+export type DynamicColorMacOSTuplePrivate = {
+  light: ColorValue,
+  dark: ColorValue,
+  highContrastLight?: ColorValue,
+  highContrastDark?: ColorValue,
+};
+
+export const DynamicColorMacOSPrivate = (
+  tuple: DynamicColorMacOSTuplePrivate,
+): ColorValue => {
+  return {
+    dynamic: {
+      light: tuple.light,
+      dark: tuple.dark,
+      highContrastLight: tuple.highContrastLight,
+      highContrastDark: tuple.highContrastDark,
+    },
+    /* $FlowExpectedError[incompatible-type]
+     * LocalNativeColorValue is the actual type of the opaque NativeColorValue on macOS platform */
+  } as LocalNativeColorValue;
+};
+
+export type SystemEffectMacOSPrivate =
+  | 'none'
+  | 'pressed'
+  | 'deepPressed'
+  | 'disabled'
+  | 'rollover';
+
+export const ColorWithSystemEffectMacOSPrivate = (
+  color: ColorValue,
+  effect: SystemEffectMacOSPrivate,
+): ColorValue => {
+  return {
+    colorWithSystemEffect: {
+      baseColor: color,
+      systemEffect: effect,
+    },
+    /* $FlowExpectedError[incompatible-type]
+     * LocalNativeColorValue is the actual type of the opaque NativeColorValue */
+  } as LocalNativeColorValue;
+};
+
+const _normalizeColorObject = (
+  color: LocalNativeColorValue,
+): ?LocalNativeColorValue => {
+  if ('colorWithSystemEffect' in color && color.colorWithSystemEffect !== undefined) {
+    const normalizeColor = require('./normalizeColor').default;
+    const spec = color.colorWithSystemEffect;
+    return {
+      colorWithSystemEffect: {
+        // $FlowFixMe[incompatible-call]
+        baseColor: normalizeColor(spec.baseColor),
+        systemEffect: spec.systemEffect,
+      },
+    };
+  } else if ('semantic' in color) {
+    // an AppKit or iOS semantic colour
+    return color;
+  } else if ('dynamic' in color && color.dynamic !== undefined) {
+    const normalizeColor = require('./normalizeColor').default;
+
+    // a dynamic, appearance aware color
+    const dynamic = color.dynamic;
+    const dynamicColor: LocalNativeColorValue = {
+      dynamic: {
+        // $FlowFixMe[incompatible-use]
+        light: normalizeColor(dynamic.light),
+        // $FlowFixMe[incompatible-use]
+        dark: normalizeColor(dynamic.dark),
+        // $FlowFixMe[incompatible-use]
+        highContrastLight: normalizeColor(dynamic.highContrastLight),
+        // $FlowFixMe[incompatible-use]
+        highContrastDark: normalizeColor(dynamic.highContrastDark),
+      },
+    };
+    return dynamicColor;
+  }
+  return null;
+};
+
+export const normalizeColorObject: (
+  color: NativeColorValue,
+  /* $FlowExpectedError[incompatible-type]
+   * LocalNativeColorValue is the actual type of the opaque NativeColorValue on macOS platform */
+) => ?ProcessedColorValue = _normalizeColorObject;
+
+const _processColorObject = (
+  color: LocalNativeColorValue,
+): ?LocalNativeColorValue => {
+  if ('dynamic' in color && color.dynamic != null) {
+    const processColor = require('./processColor').default;
+    const dynamic = color.dynamic;
+    const dynamicColor: LocalNativeColorValue = {
+      dynamic: {
+        // $FlowFixMe[incompatible-use]
+        light: processColor(dynamic.light),
+        // $FlowFixMe[incompatible-use]
+        dark: processColor(dynamic.dark),
+        // $FlowFixMe[incompatible-use]
+        highContrastLight: processColor(dynamic.highContrastLight),
+        // $FlowFixMe[incompatible-use]
+        highContrastDark: processColor(dynamic.highContrastDark),
+      },
+    };
+    return dynamicColor;
+  }
+  return color;
+};
+
+export const processColorObject: (
+  color: NativeColorValue,
+  /* $FlowExpectedError[incompatible-type]
+   * LocalNativeColorValue is the actual type of the opaque NativeColorValue on macOS platform */
+) => ?NativeColorValue = _processColorObject;

package/Libraries/StyleSheet/PlatformColorValueTypesMacOS.js

@@ -0,0 +1,34 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+// [macOS] The off-macOS stand-in, matching how PlatformColorValueTypesIOS.js
+// behaves elsewhere: importing is fine, calling is not.
+
+import type {ColorValue} from './StyleSheet';
+
+export type DynamicColorMacOSTuple = {
+  light: ColorValue,
+  dark: ColorValue,
+  highContrastLight?: ColorValue,
+  highContrastDark?: ColorValue,
+};
+
+export const DynamicColorMacOS = (_tuple: DynamicColorMacOSTuple): ColorValue => {
+  throw new Error('DynamicColorMacOS is not available on this platform.');
+};
+
+export type SystemEffectMacOS = 'none' | 'pressed' | 'deepPressed' | 'disabled' | 'rollover';
+
+export const ColorWithSystemEffectMacOS = (
+  _color: ColorValue,
+  _effect: SystemEffectMacOS,
+): ColorValue => {
+  throw new Error('ColorWithSystemEffectMacOS is not available on this platform.');
+};

package/Libraries/StyleSheet/PlatformColorValueTypesMacOS.macos.js

@@ -0,0 +1,55 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+// [macOS] The public macOS colour API, mirroring PlatformColorValueTypesIOS.
+
+'use strict';
+
+import type {ColorValue} from './StyleSheet';
+
+import {
+  ColorWithSystemEffectMacOSPrivate,
+  DynamicColorMacOSPrivate,
+  // $FlowFixMe[cannot-resolve-module] resolved by the macOS platform extension
+} from './PlatformColorValueTypes.macos';
+
+export type DynamicColorMacOSTuple = {
+  light: ColorValue,
+  dark: ColorValue,
+  highContrastLight?: ColorValue,
+  highContrastDark?: ColorValue,
+};
+
+/**
+ * A colour that follows the system appearance, the macOS counterpart of
+ * `DynamicColorIOS`.
+ */
+export const DynamicColorMacOS = (tuple: DynamicColorMacOSTuple): ColorValue => {
+  return DynamicColorMacOSPrivate({
+    light: tuple.light,
+    dark: tuple.dark,
+    highContrastLight: tuple.highContrastLight,
+    highContrastDark: tuple.highContrastDark,
+  });
+};
+
+export type SystemEffectMacOS = 'none' | 'pressed' | 'deepPressed' | 'disabled' | 'rollover';
+
+/**
+ * A colour with one of AppKit's system effects applied. There is no iOS
+ * equivalent: UIKit expects the caller to supply the pressed or disabled
+ * colour, where AppKit derives it.
+ */
+export const ColorWithSystemEffectMacOS = (
+  color: ColorValue,
+  effect: SystemEffectMacOS,
+): ColorValue => {
+  return ColorWithSystemEffectMacOSPrivate(color, effect);
+};

package/Libraries/Types/CoreEventTypes.js

@@ -351,6 +351,17 @@ export type KeyEvent = Readonly<{
    * @see https://developer.mozilla.org/en-US/docs/Web/API/CompositionEvent/isComposing
    */
   isComposing?: boolean,
+  // [macOS] Modifiers AppKit reports and no other platform has. Optional, so
+  // shared code that never reads them is unaffected.
+  /** @platform macos */
+  capsLockKey?: boolean,
+  /** @platform macos */
+  numericPadKey?: boolean,
+  /** @platform macos */
+  helpKey?: boolean,
+  /** @platform macos */
+  functionKey?: boolean,
+  // macOS]
 }>;
 
 export type KeyUpEvent = NativeSyntheticEvent<KeyEvent>;

package/React/Base/RCTConvert.mm

@@ -850,6 +850,26 @@ static UIColor *RCTColorFromSemanticColorName(NSString *semanticColorName)
   NSDictionary<NSString *, NSDictionary *> *colorMap = RCTSemanticColorsMap();
   UIColor *color = nil;
   NSDictionary<NSString *, id> *colorInfo = colorMap[semanticColorName];
+
+#if TARGET_OS_OSX // [macOS
+  // The map above is iOS's vocabulary. AppKit has its own -- labelColor,
+  // windowBackgroundColor, controlAccentColor and the rest -- and they are all
+  // class properties on NSColor, so asking NSColor directly covers every one of
+  // them without a second table to keep in sync. Only reached for names iOS
+  // does not define, so iOS names keep their mapping and their fallbacks.
+  if (colorInfo == nil) {
+    SEL appKitSelector = NSSelectorFromString(semanticColorName);
+    if (appKitSelector != nil && [UIColor respondsToSelector:appKitSelector]) {
+      IMP imp = [[UIColor class] methodForSelector:appKitSelector];
+      id (*getColor)(id, SEL) = (id (*)(id, SEL))imp;
+      id candidate = getColor([UIColor class], appKitSelector);
+      if ([candidate isKindOfClass:[UIColor class]]) {
+        return candidate;
+      }
+    }
+  }
+#endif // macOS]
+
   if (colorInfo) {
     NSString *semanticColorSelector = colorInfo[RCTSelector];
     if (semanticColorSelector == nil) {
@@ -1040,6 +1060,35 @@ void RCTSetDefaultColorSpace(RCTColorSpace colorSpace)
         RCTLogConvertError(json, @"a UIColor. Expected an iOS dynamic appearance aware color.");
         return nil;
       }
+#if TARGET_OS_OSX // [macOS
+    } else if ((value = [dictionary objectForKey:@"colorWithSystemEffect"])) {
+      // AppKit's pressed / disabled / rollover variants of a colour. There is
+      // no UIKit equivalent, so this arm exists only on macOS.
+      NSDictionary *spec = value;
+      UIColor *baseColor = [RCTConvert UIColor:[spec objectForKey:@"baseColor"]];
+      NSString *effect = [RCTConvert NSString:[spec objectForKey:@"systemEffect"]];
+      if (baseColor == nil) {
+        RCTLogConvertError(json, @"a UIColor. colorWithSystemEffect needs a baseColor.");
+        return nil;
+      }
+      static NSDictionary<NSString *, NSNumber *> *effects;
+      static dispatch_once_t onceToken;
+      dispatch_once(&onceToken, ^{
+        effects = @{
+          @"none" : @(NSColorSystemEffectNone),
+          @"pressed" : @(NSColorSystemEffectPressed),
+          @"deepPressed" : @(NSColorSystemEffectDeepPressed),
+          @"disabled" : @(NSColorSystemEffectDisabled),
+          @"rollover" : @(NSColorSystemEffectRollover),
+        };
+      });
+      NSNumber *resolved = effects[effect ?: @"none"];
+      if (resolved == nil) {
+        RCTLogConvertError(json, @"a UIColor. Unknown system effect.");
+        return nil;
+      }
+      return [baseColor colorWithSystemEffect:(NSColorSystemEffect)resolved.integerValue];
+#endif // macOS]
     } else {
       RCTLogConvertError(json, @"a UIColor. Expected an iOS semantic color or dynamic appearance aware color.");
       return nil;