@office-iss/react-native-win32 0.0.0-canary.29 → 0.0.0-canary.290

package/Libraries/Utilities/DevSettings.d.ts

@@ -0,0 +1,32 @@
+/**
+ * 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.
+ *
+ * @format
+ */
+
+import {NativeEventEmitter} from '../EventEmitter/NativeEventEmitter';
+
+/**
+ * The DevSettings module exposes methods for customizing settings for developers in development.
+ */
+export interface DevSettingsStatic extends NativeEventEmitter {
+  /**
+   * Adds a custom menu item to the developer menu.
+   *
+   * @param title - The title of the menu item. Is internally used as id and should therefore be unique.
+   * @param handler - The callback invoked when pressing the menu item.
+   */
+  addMenuItem(title: string, handler: () => any): void;
+
+  /**
+   * Reload the application.
+   *
+   * @param reason
+   */
+  reload(reason?: string): void;
+}
+
+export const DevSettings: DevSettingsStatic;

package/Libraries/Utilities/DevSettings.js

@@ -1,65 +1,86 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * 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
  */
 
-import NativeDevSettings from '../NativeModules/specs/NativeDevSettings';
-import NativeEventEmitter from '../EventEmitter/NativeEventEmitter';
+import type {EventSubscription} from '../vendor/emitter/EventEmitter';
 
-class DevSettings extends NativeEventEmitter {
-  _menuItems: Map<string, () => mixed>;
+import NativeEventEmitter from '../EventEmitter/NativeEventEmitter';
+import NativeDevSettings from '../NativeModules/specs/NativeDevSettings';
+import Platform from '../Utilities/Platform';
 
-  constructor() {
-    super(NativeDevSettings);
+/**
+ * The DevSettings module exposes methods for customizing settings for developers in development.
+ */
+let DevSettings: {
+  /**
+   * Adds a custom menu item to the developer menu.
+   *
+   * @param title - The title of the menu item. Is internally used as id and should therefore be unique.
+   * @param handler - The callback invoked when pressing the menu item.
+   */
+  addMenuItem(title: string, handler: () => mixed): void,
+  /**
+   * Reload the application.
+   *
+   * @param reason
+   */
+  reload(reason?: string): void,
+  onFastRefresh(): void,
+} = {
+  addMenuItem(title: string, handler: () => mixed): void {},
+  reload(reason?: string): void {},
+  onFastRefresh(): void {},
+};
 
-    this._menuItems = new Map();
-  }
+type DevSettingsEventDefinitions = {
+  didPressMenuItem: [{title: string}],
+};
 
-  addMenuItem(title: string, handler: () => mixed) {
-    // Make sure items are not added multiple times. This can
-    // happen when hot reloading the module that registers the
-    // menu items. The title is used as the id which means we
-    // don't support multiple items with the same name.
-    const oldHandler = this._menuItems.get(title);
-    if (oldHandler != null) {
-      this.removeListener('didPressMenuItem', oldHandler);
-    } else {
-      NativeDevSettings.addMenuItem(title);
-    }
+if (__DEV__) {
+  const emitter = new NativeEventEmitter<DevSettingsEventDefinitions>(
+    // T88715063: NativeEventEmitter only used this parameter on iOS. Now it uses it on all platforms, so this code was modified automatically to preserve its behavior
+    // If you want to use the native module on other platforms, please remove this condition and test its behavior
+    Platform.OS !== 'ios' ? null : NativeDevSettings,
+  );
+  const subscriptions = new Map<string, EventSubscription>();
 
-    this._menuItems.set(title, handler);
-    this.addListener('didPressMenuItem', event => {
-      if (event.title === title) {
-        handler();
+  DevSettings = {
+    addMenuItem(title: string, handler: () => mixed): void {
+      // Make sure items are not added multiple times. This can
+      // happen when hot reloading the module that registers the
+      // menu items. The title is used as the id which means we
+      // don't support multiple items with the same name.
+      let subscription = subscriptions.get(title);
+      if (subscription != null) {
+        subscription.remove();
+      } else {
+        NativeDevSettings.addMenuItem(title);
       }
-    });
-  }
 
-  reload(reason: string) {
-    if (typeof NativeDevSettings.reloadWithReason === 'function') {
-      NativeDevSettings.reloadWithReason(reason || 'Uncategorized from JS');
-    } else {
-      NativeDevSettings.reload();
-    }
-  }
-
-  onFastRefresh() {
-    if (typeof NativeDevSettings.onFastRefresh === 'function') {
-      NativeDevSettings.onFastRefresh();
-    }
-  }
-
-  // TODO: Add other dev setting methods exposed by the native module.
-}
-
-// Avoid including the full `NativeDevSettings` class in prod.
-class NoopDevSettings {
-  addMenuItem(title: string, handler: () => mixed) {}
-  reload() {}
+      subscription = emitter.addListener('didPressMenuItem', event => {
+        if (event.title === title) {
+          handler();
+        }
+      });
+      subscriptions.set(title, subscription);
+    },
+    reload(reason?: string): void {
+      if (NativeDevSettings.reloadWithReason != null) {
+        NativeDevSettings.reloadWithReason(reason ?? 'Uncategorized from JS');
+      } else {
+        NativeDevSettings.reload();
+      }
+    },
+    onFastRefresh(): void {
+      NativeDevSettings.onFastRefresh?.();
+    },
+  };
 }
 
-module.exports = __DEV__ ? new DevSettings() : new NoopDevSettings();
+export default DevSettings;

package/Libraries/Utilities/DeviceInfo.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * 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.
@@ -8,8 +8,8 @@
  * @flow strict-local
  */
 
-'use strict';
+export type {DeviceInfoConstants} from './NativeDeviceInfo';
 
 import NativeDeviceInfo from './NativeDeviceInfo';
 
-module.exports = NativeDeviceInfo;
+export default NativeDeviceInfo;

package/Libraries/Utilities/Dimensions.d.ts

@@ -0,0 +1,79 @@
+/**
+ * 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.
+ *
+ * @format
+ */
+
+import {EmitterSubscription} from '../vendor/emitter/EventEmitter';
+
+// Used by Dimensions below
+export interface ScaledSize {
+  width: number;
+  height: number;
+  scale: number;
+  fontScale: number;
+}
+
+/**
+ * Initial dimensions are set before `runApplication` is called so they should
+ * be available before any other require's are run, but may be updated later.
+ *
+ * Note: Although dimensions are available immediately, they may change (e.g
+ * due to device rotation) so any rendering logic or styles that depend on
+ * these constants should try to call this function on every render, rather
+ * than caching the value (for example, using inline styles rather than
+ * setting a value in a `StyleSheet`).
+ *
+ * Example: `const {height, width} = Dimensions.get('window');`
+ *
+ * @param dim Name of dimension as defined when calling `set`.
+ * @returns Value for the dimension.
+ * @see https://reactnative.dev/docs/dimensions#content
+ */
+export interface Dimensions {
+  /**
+       * Initial dimensions are set before runApplication is called so they
+       * should be available before any other require's are run, but may be
+       * updated later.
+       * Note: Although dimensions are available immediately, they may
+       * change (e.g due to device rotation) so any rendering logic or
+       * styles that depend on these constants should try to call this
+       * function on every render, rather than caching the value (for
+       * example, using inline styles rather than setting a value in a
+       * StyleSheet).
+       * Example: const {height, width} = Dimensions.get('window');
+       @param dim Name of dimension as defined when calling set.
+       @returns Value for the dimension.
+       */
+  get(dim: 'window' | 'screen'): ScaledSize;
+
+  /**
+   * This should only be called from native code by sending the didUpdateDimensions event.
+   * @param dims Simple string-keyed object of dimensions to set
+   */
+  set(dims: {[key: string]: any}): void;
+
+  /**
+   * Add an event listener for dimension changes
+   *
+   * @param type the type of event to listen to
+   * @param handler the event handler
+   */
+  addEventListener(
+    type: 'change',
+    handler: ({
+      window,
+      screen,
+    }: {
+      window: ScaledSize;
+      screen: ScaledSize;
+    }) => void,
+  ): EmitterSubscription;
+}
+
+export function useWindowDimensions(): ScaledSize;
+
+export const Dimensions: Dimensions;

package/Libraries/Utilities/Dimensions.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * 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.
@@ -8,29 +8,31 @@
  * @flow
  */
 
-'use strict';
-
-import EventEmitter from '../vendor/emitter/EventEmitter';
 import RCTDeviceEventEmitter from '../EventEmitter/RCTDeviceEventEmitter';
+import EventEmitter, {
+  type EventSubscription,
+} from '../vendor/emitter/EventEmitter';
 import NativeDeviceInfo, {
-  type DisplayMetrics,
   type DimensionsPayload,
+  type DisplayMetrics,
+  type DisplayMetricsAndroid,
 } from './NativeDeviceInfo';
 import invariant from 'invariant';
 
-type DimensionsValue = {
-  window?: DisplayMetrics,
-  screen?: DisplayMetrics,
-  ...
-};
+export type {DimensionsPayload, DisplayMetrics, DisplayMetricsAndroid};
+
+/** @deprecated Use DisplayMetrics */
+export type ScaledSize = DisplayMetrics;
 
-const eventEmitter = new EventEmitter();
+const eventEmitter = new EventEmitter<{
+  change: [DimensionsPayload],
+}>();
 let dimensionsInitialized = false;
-let dimensions: DimensionsValue;
+let dimensions: DimensionsPayload;
 
 class Dimensions {
   /**
-   * NOTE: `useWindowDimensions` is the preffered API for React components.
+   * NOTE: `useWindowDimensions` is the preferred API for React components.
    *
    * Initial dimensions are set before `runApplication` is called so they should
    * be available before any other require's are run, but may be updated later.
@@ -44,9 +46,10 @@ class Dimensions {
    * Example: `const {height, width} = Dimensions.get('window');`
    *
    * @param {string} dim Name of dimension as defined when calling `set`.
-   * @returns {Object?} Value for the dimension.
+   * @returns {DisplayMetrics? | DisplayMetricsAndroid?} Value for the dimension.
    */
-  static get(dim: string): Object {
+  static get(dim: string): DisplayMetrics | DisplayMetricsAndroid {
+    // $FlowFixMe[invalid-computed-prop]
     invariant(dimensions[dim], 'No dimension set for key ' + dim);
     return dimensions[dim];
   }
@@ -55,9 +58,9 @@ class Dimensions {
    * This should only be called from native code by sending the
    * didUpdateDimensions event.
    *
-   * @param {object} dims Simple string-keyed object of dimensions to set
+   * @param {DimensionsPayload} dims Simple string-keyed object of dimensions to set
    */
-  static set(dims: $ReadOnly<{[key: string]: any, ...}>): void {
+  static set(dims: $ReadOnly<DimensionsPayload>): void {
     // We calculate the window dimensions in JS so that we don't encounter loss of
     // precision in transferring the dimensions (which could be non-integers) over
     // the bridge.
@@ -100,43 +103,26 @@ class Dimensions {
    *   are the same as the return values of `Dimensions.get('window')` and
    *   `Dimensions.get('screen')`, respectively.
    */
-  static addEventListener(type: 'change', handler: Function) {
+  static addEventListener(
+    type: 'change',
+    handler: Function,
+  ): EventSubscription {
     invariant(
       type === 'change',
       'Trying to subscribe to unknown event: "%s"',
       type,
     );
-    eventEmitter.addListener(type, handler);
-  }
-
-  /**
-   * Remove an event handler.
-   */
-  static removeEventListener(type: 'change', handler: Function) {
-    invariant(
-      type === 'change',
-      'Trying to remove listener for unknown event: "%s"',
-      type,
-    );
-    eventEmitter.removeListener(type, handler);
+    return eventEmitter.addListener(type, handler);
   }
 }
 
-let initialDims: ?$ReadOnly<{[key: string]: any, ...}> =
-  global.nativeExtensions &&
-  global.nativeExtensions.DeviceInfo &&
-  global.nativeExtensions.DeviceInfo.Dimensions;
-if (!initialDims) {
-  // Subscribe before calling getConstants to make sure we don't miss any updates in between.
-  RCTDeviceEventEmitter.addListener(
-    'didUpdateDimensions',
-    (update: DimensionsPayload) => {
-      Dimensions.set(update);
-    },
-  );
-  initialDims = NativeDeviceInfo.getConstants().Dimensions;
-}
-
-Dimensions.set(initialDims);
+// Subscribe before calling getConstants to make sure we don't miss any updates in between.
+RCTDeviceEventEmitter.addListener(
+  'didUpdateDimensions',
+  (update: DimensionsPayload) => {
+    Dimensions.set(update);
+  },
+);
+Dimensions.set(NativeDeviceInfo.getConstants().Dimensions);
 
-module.exports = Dimensions;
+export default Dimensions;

package/Libraries/Utilities/Dimensions.win32.js

@@ -5,32 +5,125 @@
  * @format
  * @flow
  */
-'use strict';
 
+import RCTDeviceEventEmitter from '../EventEmitter/RCTDeviceEventEmitter';
+import EventEmitter, {
+  type EventSubscription,
+} from '../vendor/emitter/EventEmitter';
+import NativeDeviceInfo, {
+  type DimensionsPayload,
+  type DisplayMetrics,
+  type DisplayMetricsAndroid,
+} from './NativeDeviceInfo';
+import invariant from 'invariant';
+
+export type {DimensionsPayload, DisplayMetrics, DisplayMetricsAndroid};
+
+/** @deprecated Use DisplayMetrics */
+export type ScaledSize = DisplayMetrics;
+
+const eventEmitter = new EventEmitter<{
+  change: [DimensionsPayload],
+}>();
+let dimensionsInitialized = false;
+let dimensions: DimensionsPayload;
+
+/**
+ * While a global Dimensions object for window and screen dimensions is too simple for Win32,
+ * attached to this object is also fontScale which is a system global value.  We expose this value
+ * for large text scaling support while leaving other window dimension information undefined. These undefined
+ * values will cause rendering issues if used but should avoid runtime failures in JS.
+ */
 class Dimensions {
-  static get(dim: string): Object {
-    throw new Error(
-      'Having a global Dimensions object is too simplistic for Win32, so this API does not work',
-    );
+  /**
+   * NOTE: `useWindowDimensions` is the preferred API for React components.
+   *
+   * Initial dimensions are set before `runApplication` is called so they should
+   * be available before any other require's are run, but may be updated later.
+   *
+   * Note: Although dimensions are available immediately, they may change (e.g
+   * due to device rotation) so any rendering logic or styles that depend on
+   * these constants should try to call this function on every render, rather
+   * than caching the value (for example, using inline styles rather than
+   * setting a value in a `StyleSheet`).
+   *
+   * Example: `const {height, width} = Dimensions.get('window');`
+   *
+   * @param {string} dim Name of dimension as defined when calling `set`.
+   * @returns {DisplayMetrics? | DisplayMetricsAndroid?} Value for the dimension.
+   */
+  static get(dim: string): DisplayMetrics | DisplayMetricsAndroid {
+    // $FlowFixMe[invalid-computed-prop]
+    invariant(dimensions[dim], 'No dimension set for key ' + dim);
+    return dimensions[dim];
   }
 
-  static set(dims: $ReadOnly<{[key: string]: any, ...}>): void {
-    throw new Error(
-      'Having a global Dimensions object is too simplistic for Win32, so this API does not work',
-    );
-  }
+  /**
+   * This should only be called from native code by sending the
+   * didUpdateDimensions event.
+   *
+   * @param {DimensionsPayload} dims Simple string-keyed object of dimensions to set
+   */
+  static set(dims: $ReadOnly<DimensionsPayload>): void {
+    let {screen, window} = dims;
+    const {windowPhysicalPixels} = dims;
+    if (windowPhysicalPixels) {
+      window = {
+        width: windowPhysicalPixels.width,
+        height: windowPhysicalPixels.height,
+        scale: windowPhysicalPixels.scale,
+        fontScale: windowPhysicalPixels.fontScale,
+      };
+    }
+    const {screenPhysicalPixels} = dims;
+    if (screenPhysicalPixels) {
+      screen = {
+        width: screenPhysicalPixels.width,
+        height: screenPhysicalPixels.height,
+        scale: screenPhysicalPixels.scale,
+        fontScale: screenPhysicalPixels.fontScale,
+      };
+    } else if (screen == null) {
+      screen = window;
+    }
 
-  static addEventListener(type: 'change', handler: Function) {
-    throw new Error(
-      'Having a global Dimensions object is too simplistic for Win32, so this API does not work',
-    );
+    dimensions = {window, screen};
+    if (dimensionsInitialized) {
+      // Don't fire 'change' the first time the dimensions are set.
+      eventEmitter.emit('change', dimensions);
+    } else {
+      dimensionsInitialized = true;
+    }
   }
 
-  static removeEventListener(type: 'change', handler: Function) {
-    throw new Error(
-      'Having a global Dimensions object is too simplistic for Win32, so this API does not work',
+  /**
+   * Add an event handler. Supported events:
+   *
+   * - `change`: Fires when a property within the `Dimensions` object changes. The argument
+   *   to the event handler is an object with `window` and `screen` properties whose values
+   *   are the same as the return values of `Dimensions.get('window')` and
+   *   `Dimensions.get('screen')`, respectively.
+   */
+  static addEventListener(
+    type: 'change',
+    handler: Function,
+  ): EventSubscription {
+    invariant(
+      type === 'change',
+      'Trying to subscribe to unknown event: "%s"',
+      type,
     );
+    return eventEmitter.addListener(type, handler);
   }
 }
 
-module.exports = Dimensions;
+// Subscribe before calling getConstants to make sure we don't miss any updates in between.
+RCTDeviceEventEmitter.addListener(
+  'didUpdateDimensions',
+  (update: DimensionsPayload) => {
+    Dimensions.set(update);
+  },
+);
+Dimensions.set(NativeDeviceInfo.getConstants().Dimensions);
+
+export default Dimensions;

package/Libraries/Utilities/FeatureDetection.js

@@ -0,0 +1,29 @@
+/**
+ * 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
+ * @format
+ */
+
+/**
+ * @return whether or not a @param {function} f is provided natively by calling
+ * `toString` and check if the result includes `[native code]` in it.
+ *
+ * Note that a polyfill can technically fake this behavior but few does it.
+ * Therefore, this is usually good enough for our purpose.
+ */
+export function isNativeFunction(f: Function): boolean {
+  return typeof f === 'function' && f.toString().indexOf('[native code]') > -1;
+}
+
+/**
+ * @return whether or not the constructor of @param {object} o is an native
+ * function named with @param {string} expectedName.
+ */
+export function hasNativeConstructor(o: Object, expectedName: string): boolean {
+  const con = Object.getPrototypeOf(o).constructor;
+  return con.name === expectedName && isNativeFunction(con);
+}

package/Libraries/Utilities/FocusManager.win32.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) Microsoft Corporation.
+ * Licensed under the MIT License.
+ *
+ * @format
+ */
+
+import React from 'react';
+
+export declare class FocusManager {
+  static focus(ref: React.Ref<any>, setWindowFocus: boolean): void;
+}

package/Libraries/Utilities/FocusManager.win32.js

@@ -0,0 +1,42 @@
+/**
+ * Copyright (c) Microsoft Corporation.
+ * Licensed under the MIT License.
+ *
+ * @flow
+ * @format
+ */
+
+'use strict';
+
+import * as React from 'react';
+import {findNodeHandle, UIManager} from 'react-native';
+
+/*
+ ** This is a helper class intended to allow usage of Polite/Aggressive Focus for win32.
+ */
+class FocusManager {
+  // This function takes in a ref to a React Component and a bool value. If setWindowFocus = true, call aggressive focus.
+  // Else, call polite focus
+
+  static focus(ref: React.RefObject<any>, setWindowFocus: boolean) {
+    if (ref) {
+      if (setWindowFocus) {
+        UIManager.dispatchViewManagerCommand(
+          // $FlowIgnoreMe[incompatible-call]
+          findNodeHandle(ref),
+          UIManager.getViewManagerConfig('RCTView').Commands.aggressivefocus,
+          [],
+        );
+      } else {
+        UIManager.dispatchViewManagerCommand(
+          // $FlowIgnoreMe[incompatible-call]
+          findNodeHandle(ref),
+          UIManager.getViewManagerConfig('RCTView').Commands.politefocus,
+          [],
+        );
+      }
+    }
+  }
+}
+
+export default FocusManager;

package/Libraries/Utilities/GlobalPerformanceLogger.js

@@ -1,18 +1,17 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * 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
+ * @flow strict
  * @format
  */
 
-'use strict';
-const createPerformanceLogger = require('./createPerformanceLogger');
-
 import type {IPerformanceLogger} from './createPerformanceLogger';
 
+import createPerformanceLogger from './createPerformanceLogger';
+
 /**
  * This is a global shared instance of IPerformanceLogger that is created with
  * createPerformanceLogger().
@@ -22,4 +21,4 @@ import type {IPerformanceLogger} from './createPerformanceLogger';
  */
 const GlobalPerformanceLogger: IPerformanceLogger = createPerformanceLogger();
 
-module.exports = GlobalPerformanceLogger;
+export default GlobalPerformanceLogger;