react-native-windows 0.73.11 → 0.74.0-preview.1

package/Libraries/Image/ImageInjection.js

@@ -4,26 +4,84 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @format strict-local
- * @flow
+ * @format
+ * @flow strict-local
  */
 
-import type {ImageProps as ImagePropsType} from './ImageProps';
+import type {
+  AbstractImageAndroid,
+  AbstractImageIOS,
+  Image as ImageComponent,
+} from './ImageTypes.flow';
 
-import ImageViewNativeComponent from './ImageViewNativeComponent';
-import TextInlineImageNativeComponent from './TextInlineImageNativeComponent';
+import useMergeRefs from '../Utilities/useMergeRefs';
 import * as React from 'react';
+import {useRef} from 'react';
 
-export default {
-  unstable_createImageComponent: (null: ?(
-    Image: React.AbstractComponent<
-      ImagePropsType,
-      | React.ElementRef<typeof TextInlineImageNativeComponent>
-      | React.ElementRef<typeof ImageViewNativeComponent>,
-    >,
-  ) => React.AbstractComponent<
-    ImagePropsType,
-    | React.ElementRef<typeof TextInlineImageNativeComponent>
-    | React.ElementRef<typeof ImageViewNativeComponent>,
-  >),
-};
+type ImageComponentDecorator = (AbstractImageAndroid => AbstractImageAndroid) &
+  (AbstractImageIOS => AbstractImageIOS);
+
+let injectedImageComponentDecorator: ?ImageComponentDecorator;
+
+export function unstable_setImageComponentDecorator(
+  imageComponentDecorator: ?ImageComponentDecorator,
+): void {
+  injectedImageComponentDecorator = imageComponentDecorator;
+}
+
+export function unstable_getImageComponentDecorator(): ?ImageComponentDecorator {
+  return injectedImageComponentDecorator;
+}
+
+type ImageInstance = React.ElementRef<ImageComponent>;
+
+type ImageAttachedCallback = (
+  imageInstance: ImageInstance,
+) => void | (() => void);
+
+const imageAttachedCallbacks = new Set<ImageAttachedCallback>();
+
+export function unstable_registerImageAttachedCallback(
+  callback: ImageAttachedCallback,
+): void {
+  imageAttachedCallbacks.add(callback);
+}
+
+export function unstable_unregisterImageAttachedCallback(
+  callback: ImageAttachedCallback,
+): void {
+  imageAttachedCallbacks.delete(callback);
+}
+
+export function useWrapRefWithImageAttachedCallbacks(
+  forwardedRef: React.RefSetter<ImageInstance>,
+): React.RefSetter<ImageInstance> {
+  const pendingCleanupCallbacks = useRef<Array<() => void>>([]);
+
+  const imageAttachedCallbacksRef =
+    useRef<?(node: ImageInstance | null) => void>(null);
+
+  if (imageAttachedCallbacksRef.current == null) {
+    imageAttachedCallbacksRef.current = (node: ImageInstance | null): void => {
+      if (node == null) {
+        if (pendingCleanupCallbacks.current.length > 0) {
+          pendingCleanupCallbacks.current.forEach(cb => cb());
+          pendingCleanupCallbacks.current = [];
+        }
+      } else {
+        imageAttachedCallbacks.forEach(imageAttachedCallback => {
+          const maybeCleanupCallback = imageAttachedCallback(node);
+          if (maybeCleanupCallback != null) {
+            pendingCleanupCallbacks.current.push(maybeCleanupCallback);
+          }
+        });
+      }
+    };
+  }
+
+  // `useMergeRefs` returns a stable ref if its arguments don't change.
+  return useMergeRefs<ImageInstance>(
+    forwardedRef,
+    imageAttachedCallbacksRef.current,
+  );
+}

package/Libraries/Image/ImageTypes.flow.js

@@ -0,0 +1,71 @@
+/**
+ * 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 type {RootTag} from '../Types/RootTagTypes';
+import type {ResolvedAssetSource} from './AssetSourceResolver';
+import type {ImageProps as ImagePropsType} from './ImageProps';
+import type {ImageSource} from './ImageSource';
+import typeof ImageViewNativeComponent from './ImageViewNativeComponent';
+import typeof TextInlineImageNativeComponent from './TextInlineImageNativeComponent';
+
+import * as React from 'react';
+
+type ImageComponentStaticsIOS = $ReadOnly<{
+  getSize: (
+    uri: string,
+    success: (width: number, height: number) => void,
+    failure?: (error: mixed) => void,
+  ) => void,
+
+  getSizeWithHeaders(
+    uri: string,
+    headers: {[string]: string, ...},
+    success: (width: number, height: number) => void,
+    failure?: (error: mixed) => void,
+  ): void,
+
+  prefetch(url: string): Promise<boolean>,
+
+  prefetchWithMetadata(
+    url: string,
+    queryRootName: string,
+    rootTag?: ?RootTag,
+  ): Promise<boolean>,
+
+  queryCache(
+    urls: Array<string>,
+  ): Promise<{[string]: 'memory' | 'disk' | 'disk/memory', ...}>,
+
+  resolveAssetSource(source: ImageSource): ?ResolvedAssetSource,
+}>;
+
+type ImageComponentStaticsAndroid = $ReadOnly<{
+  ...ImageComponentStaticsIOS,
+  abortPrefetch(requestId: number): void,
+}>;
+
+export type AbstractImageAndroid = React.AbstractComponent<
+  ImagePropsType,
+  | React.ElementRef<TextInlineImageNativeComponent>
+  | React.ElementRef<ImageViewNativeComponent>,
+>;
+
+export type ImageAndroid = AbstractImageAndroid & ImageComponentStaticsAndroid;
+
+export type AbstractImageIOS = React.AbstractComponent<
+  ImagePropsType,
+  React.ElementRef<ImageViewNativeComponent>,
+>;
+
+export type ImageIOS = AbstractImageIOS & ImageComponentStaticsIOS;
+
+export type Image = ImageIOS | ImageAndroid;
+
+export type {ImageProps} from './ImageProps';

package/Libraries/Image/ImageUtils.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow
+ * @flow strict
  * @format
  */
 

package/Libraries/Image/ImageViewNativeComponent.js

@@ -20,9 +20,11 @@ import type {
 } from '../StyleSheet/StyleSheet';
 import type {ResolvedAssetSource} from './AssetSourceResolver';
 import type {ImageProps} from './ImageProps';
+import type {ElementRef} from 'react';
 
 import * as NativeComponentRegistry from '../NativeComponent/NativeComponentRegistry';
 import {ConditionallyIgnoredEventHandlers} from '../NativeComponent/ViewConfigIgnore';
+import codegenNativeCommands from '../Utilities/codegenNativeCommands';
 import Platform from '../Utilities/Platform';
 
 type Props = $ReadOnly<{
@@ -44,6 +46,17 @@ type Props = $ReadOnly<{
   loadingIndicatorSrc?: ?string,
 }>;
 
+interface NativeCommands {
+  +setIsVisible_EXPERIMENTAL: (
+    viewRef: ElementRef<HostComponent<mixed>>,
+    isVisible: boolean,
+  ) => void;
+}
+
+export const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({
+  supportedCommands: ['setIsVisible_EXPERIMENTAL'],
+});
+
 export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
   Platform.OS === 'android'
     ? {
@@ -77,6 +90,11 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
           borderTopLeftRadius: true,
           resizeMethod: true,
           src: true,
+          // NOTE: New Architecture expects this to be called `source`,
+          // regardless of the platform, therefore propagate it as well.
+          // For the backwards compatibility reasons, we keep both `src`
+          // and `source`, which will be identical at this stage.
+          source: true,
           borderRadius: true,
           headers: true,
           shouldNotifyLoadEvents: true,

package/Libraries/Image/NativeImageEditor.js

@@ -8,45 +8,6 @@
  * @format
  */
 
-import type {TurboModule} from '../TurboModule/RCTExport';
-
-import * as TurboModuleRegistry from '../TurboModule/TurboModuleRegistry';
-
-type Options = {|
-  +offset: {|
-    +x: number,
-    +y: number,
-  |},
-  +size: {|
-    +width: number,
-    +height: number,
-  |},
-  +displaySize?: ?{|
-    +width: number,
-    +height: number,
-  |},
-  /**
-   * Enum with potential values:
-   *  - cover
-   *  - contain
-   *  - stretch
-   *  - center
-   *  - repeat
-   */
-  +resizeMode?: ?string,
-  +allowExternalStorage?: boolean,
-|};
-
-export interface Spec extends TurboModule {
-  +getConstants: () => {||};
-  +cropImage: (
-    uri: string,
-    cropData: Options,
-    successCallback: (uri: string) => void,
-    errorCallback: (error: string) => void,
-  ) => void;
-}
-
-export default (TurboModuleRegistry.getEnforcing<Spec>(
-  'ImageEditingManager',
-): Spec);
+export * from '../../src/private/specs/modules/NativeImageEditor';
+import NativeImageEditor from '../../src/private/specs/modules/NativeImageEditor';
+export default NativeImageEditor;

package/Libraries/Image/NativeImageLoaderAndroid.js

@@ -4,34 +4,10 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow
+ * @flow strict-local
  * @format
  */
 
-import type {TurboModule} from '../TurboModule/RCTExport';
-
-import * as TurboModuleRegistry from '../TurboModule/TurboModuleRegistry';
-
-export interface Spec extends TurboModule {
-  +abortRequest: (requestId: number) => void;
-  +getConstants: () => {||};
-  +getSize: (uri: string) => Promise<
-    $ReadOnly<{
-      width: number,
-      height: number,
-      ...
-    }>,
-  >;
-  +getSizeWithHeaders: (
-    uri: string,
-    headers: Object,
-  ) => Promise<{
-    width: number,
-    height: number,
-    ...
-  }>;
-  +prefetchImage: (uri: string, requestId: number) => Promise<boolean>;
-  +queryCache: (uris: Array<string>) => Promise<Object>;
-}
-
-export default (TurboModuleRegistry.getEnforcing<Spec>('ImageLoader'): Spec);
+export * from '../../src/private/specs/modules/NativeImageLoaderAndroid';
+import NativeImageLoaderAndroid from '../../src/private/specs/modules/NativeImageLoaderAndroid';
+export default NativeImageLoaderAndroid;

package/Libraries/Image/NativeImageLoaderIOS.js

@@ -4,34 +4,10 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow
+ * @flow strict-local
  * @format
  */
 
-import type {RootTag} from '../TurboModule/RCTExport';
-import type {TurboModule} from '../TurboModule/RCTExport';
-
-import * as TurboModuleRegistry from '../TurboModule/TurboModuleRegistry';
-
-export interface Spec extends TurboModule {
-  +getConstants: () => {||};
-  // Return [width, height] of image uri
-  +getSize: (uri: string) => Promise<$ReadOnlyArray<number>>;
-  +getSizeWithHeaders: (
-    uri: string,
-    headers: Object,
-  ) => Promise<{
-    width: number,
-    height: number,
-    ...
-  }>;
-  +prefetchImage: (uri: string) => Promise<boolean>;
-  +prefetchImageWithMetadata?: (
-    uri: string,
-    queryRootName: string,
-    rootTag: RootTag,
-  ) => Promise<boolean>;
-  +queryCache: (uris: Array<string>) => Promise<Object>;
-}
-
-export default (TurboModuleRegistry.getEnforcing<Spec>('ImageLoader'): Spec);
+export * from '../../src/private/specs/modules/NativeImageLoaderIOS';
+import NativeImageLoaderIOS from '../../src/private/specs/modules/NativeImageLoaderIOS';
+export default NativeImageLoaderIOS;

package/Libraries/Image/NativeImageStoreAndroid.js

@@ -8,19 +8,6 @@
  * @format
  */
 
-import type {TurboModule} from '../TurboModule/RCTExport';
-
-import * as TurboModuleRegistry from '../TurboModule/TurboModuleRegistry';
-
-export interface Spec extends TurboModule {
-  +getConstants: () => {||};
-  +getBase64ForTag: (
-    uri: string,
-    successCallback: (base64ImageData: string) => void,
-    errorCallback: (error: string) => void,
-  ) => void;
-}
-
-export default (TurboModuleRegistry.getEnforcing<Spec>(
-  'ImageStoreManager',
-): Spec);
+export * from '../../src/private/specs/modules/NativeImageStoreAndroid';
+import NativeImageStoreAndroid from '../../src/private/specs/modules/NativeImageStoreAndroid';
+export default NativeImageStoreAndroid;

package/Libraries/Image/NativeImageStoreIOS.js

@@ -8,26 +8,6 @@
  * @format
  */
 
-import type {TurboModule} from '../TurboModule/RCTExport';
-
-import * as TurboModuleRegistry from '../TurboModule/TurboModuleRegistry';
-
-export interface Spec extends TurboModule {
-  +getConstants: () => {||};
-  +getBase64ForTag: (
-    uri: string,
-    successCallback: (base64ImageData: string) => void,
-    errorCallback: (error: {|message: string|}) => void,
-  ) => void;
-  +hasImageForTag: (uri: string, callback: (hasImage: boolean) => void) => void;
-  +removeImageForTag: (uri: string) => void;
-  +addImageFromBase64: (
-    base64ImageData: string,
-    successCallback: (uri: string) => void,
-    errorCallback: (error: {|message: string|}) => void,
-  ) => void;
-}
-
-export default (TurboModuleRegistry.getEnforcing<Spec>(
-  'ImageStoreManager',
-): Spec);
+export * from '../../src/private/specs/modules/NativeImageStoreIOS';
+import NativeImageStoreIOS from '../../src/private/specs/modules/NativeImageStoreIOS';
+export default NativeImageStoreIOS;

package/Libraries/Image/resolveAssetSource.js

@@ -5,41 +5,42 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @format
- * @flow
+ * @flow strict-local
  */
 
-// Resolves an asset into a `source` for `Image`.
-
-'use strict';
+// Utilities for resolving an asset into a `source` for e.g. `Image`
 
 import type {ResolvedAssetSource} from './AssetSourceResolver';
+import type {ImageSource} from './ImageSource';
+
+import SourceCode from '../NativeModules/specs/NativeSourceCode';
 
 const AssetSourceResolver = require('./AssetSourceResolver');
 const {pickScale} = require('./AssetUtils');
 const AssetRegistry = require('@react-native/assets-registry/registry');
 
-let _customSourceTransformer, _serverURL, _scriptURL;
+type CustomSourceTransformer = (
+  resolver: AssetSourceResolver,
+) => ?ResolvedAssetSource;
 
+let _customSourceTransformers: Array<CustomSourceTransformer> = [];
+let _serverURL: ?string;
+let _scriptURL: ?string;
 let _sourceCodeScriptURL: ?string;
+
 function getSourceCodeScriptURL(): ?string {
-  if (_sourceCodeScriptURL) {
+  if (_sourceCodeScriptURL != null) {
     return _sourceCodeScriptURL;
   }
 
-  let sourceCode =
-    global.nativeExtensions && global.nativeExtensions.SourceCode;
-  if (!sourceCode) {
-    sourceCode = require('../NativeModules/specs/NativeSourceCode').default;
-  }
-  _sourceCodeScriptURL = sourceCode.getConstants().scriptURL;
+  _sourceCodeScriptURL = SourceCode.getConstants().scriptURL;
   return _sourceCodeScriptURL;
 }
 
 function getDevServerURL(): ?string {
   if (_serverURL === undefined) {
     const sourceCodeScriptURL = getSourceCodeScriptURL();
-    const match =
-      sourceCodeScriptURL && sourceCodeScriptURL.match(/^https?:\/\/.*?\//);
+    const match = sourceCodeScriptURL?.match(/^https?:\/\/.*?\//);
     if (match) {
       // jsBundle was loaded from network
       _serverURL = match[0];
@@ -52,19 +53,25 @@ function getDevServerURL(): ?string {
 }
 
 function _coerceLocalScriptURL(scriptURL: ?string): ?string {
-  if (scriptURL) {
-    if (scriptURL.startsWith('assets://')) {
+  let normalizedScriptURL = scriptURL;
+
+  if (normalizedScriptURL != null) {
+    if (normalizedScriptURL.startsWith('assets://')) {
       // android: running from within assets, no offline path to use
       return null;
     }
-    scriptURL = scriptURL.substring(0, scriptURL.lastIndexOf('/') + 1);
-    if (!scriptURL.includes('://')) {
+    normalizedScriptURL = normalizedScriptURL.substring(
+      0,
+      normalizedScriptURL.lastIndexOf('/') + 1,
+    );
+    if (!normalizedScriptURL.includes('://')) {
       // Add file protocol in case we have an absolute file path and not a URL.
       // This shouldn't really be necessary. scriptURL should be a URL.
-      scriptURL = 'file://' + scriptURL;
+      normalizedScriptURL = 'file://' + normalizedScriptURL;
     }
   }
-  return scriptURL;
+
+  return normalizedScriptURL;
 }
 
 function getScriptURL(): ?string {
@@ -74,18 +81,35 @@ function getScriptURL(): ?string {
   return _scriptURL;
 }
 
+/**
+ * `transformer` can optionally be used to apply a custom transformation when
+ * resolving an asset source. This methods overrides all other custom transformers
+ * that may have been previously registered.
+ */
 function setCustomSourceTransformer(
-  transformer: (resolver: AssetSourceResolver) => ResolvedAssetSource,
+  transformer: CustomSourceTransformer,
 ): void {
-  _customSourceTransformer = transformer;
+  _customSourceTransformers = [transformer];
+}
+
+/**
+ * Adds a `transformer` into the chain of custom source transformers, which will
+ * be applied in the order registered, until one returns a non-null value.
+ */
+function addCustomSourceTransformer(
+  transformer: CustomSourceTransformer,
+): void {
+  _customSourceTransformers.push(transformer);
 }
 
 /**
  * `source` is either a number (opaque type returned by require('./foo.png'))
  * or an `ImageSource` like { uri: '<http location || file path>' }
  */
-function resolveAssetSource(source: any): ?ResolvedAssetSource {
-  if (typeof source === 'object') {
+function resolveAssetSource(source: ?ImageSource): ?ResolvedAssetSource {
+  if (source == null || typeof source === 'object') {
+    // $FlowFixMe[incompatible-exact] `source` doesn't exactly match `ResolvedAssetSource`
+    // $FlowFixMe[incompatible-return] `source` doesn't exactly match `ResolvedAssetSource`
     return source;
   }
 
@@ -99,12 +123,21 @@ function resolveAssetSource(source: any): ?ResolvedAssetSource {
     getScriptURL(),
     asset,
   );
-  if (_customSourceTransformer) {
-    return _customSourceTransformer(resolver);
+
+  // Apply (chained) custom source transformers, if any
+  if (_customSourceTransformers) {
+    for (const customSourceTransformer of _customSourceTransformers) {
+      const transformedSource = customSourceTransformer(resolver);
+      if (transformedSource != null) {
+        return transformedSource;
+      }
+    }
   }
+
   return resolver.defaultAsset();
 }
 
 resolveAssetSource.pickScale = pickScale;
 resolveAssetSource.setCustomSourceTransformer = setCustomSourceTransformer;
+resolveAssetSource.addCustomSourceTransformer = addCustomSourceTransformer;
 module.exports = resolveAssetSource;