@react-native-oh/react-native-harmony 0.72.82 → 0.77.18-1

package/package.json

@@ -1,59 +1,80 @@
 {
   "name": "@react-native-oh/react-native-harmony",
-  "version": "0.72.82",
+  "version": "0.77.18-1",
   "description": "",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
+  "license": "MIT",
+  "author": "",
+  "types": "types/index.harmony.d.ts",
+  "files": [
+    "./Libraries/**/*",
+    "./delegates/**/*",
+    "./src/**/*",
+    "./types/**/*",
+    "./*.js",
+    "./*.json",
+    "./LICENSE",
+    "./LICENSE-Meta",
+    "./NOTICE.md",
+    "./metro.config.d.ts",
+    "./react_native_openharmony.har"
+  ],
   "scripts": {
-    "install:local-cli": "cd ../react-native-harmony-cli && npm pack && cd ../react-native-harmony && npm i ../react-native-harmony-cli/rnoh-react-native-harmony-cli-0.0.25.tgz && cd ../react-native-harmony",
-    "prepublishOnly": "npm run verify",
-    "hermes:build": "sh ./scripts/build-hermes.sh",
-    "update_version": "node ./scripts/update-version.js",
-    "gen:changelog": "node ./scripts/generate-changelog.js",
-    "deploy": "node ./scripts/deploy.js",
-    "verify": "react-native verify-package-harmony --package-path . --skip-checks oh_package_name_is_derived_from_npm_package_name",
-    "test": "jest"
+    "build": "node ./scripts/build-har.js",
+    "build:har": "node ./scripts/build-har.js",
+    "build:hermes": "sh ./scripts/build-hermes.sh",
+    "prepack": "cd .. && pnpm _integrate-upstream-code && cd react-native-harmony && pnpm build:har",
+    "test": "jest",
+    "verify": "npm run test"
   },
-  "author": "",
-  "license": "MIT",
-  "peerDependencies": {
-    "react-native": "0.72.5"
+  "dependencies": {
+    "@react-native/assets-registry": "0.77.1",
+    "@react-native/js-polyfills": "0.77.1",
+    "@react-native/normalize-colors": "0.77.1",
+    "@react-native/virtualized-lists": "0.77.1",
+    "abort-controller": "^3.0.0",
+    "anser": "^1.4.9",
+    "ansi-regex": "^5.0.0",
+    "base64-js": "^1.5.1",
+    "colors": "^1.4.0",
+    "event-target-shim": "^5.0.1",
+    "invariant": "^2.2.4",
+    "memoize-one": "^5.0.0",
+    "metro-runtime": "^0.81.0",
+    "nullthrows": "^1.1.1",
+    "pretty-format": "^29.7.0",
+    "promise": "^8.3.0",
+    "react-devtools-core": "^6.0.1",
+    "react-refresh": "^0.14.0",
+    "regenerator-runtime": "^0.13.2",
+    "scheduler": "0.24.0-canary-efb381bbf-20230505",
+    "stacktrace-parser": "^0.1.10",
+    "whatwg-fetch": "^3.0.0"
   },
-  "types": "types",
   "devDependencies": {
-    "@react-native-community/cli": "^11.2.0",
     "@react-native-community/cli-types": "^11.2.0",
-    "@react-native/metro-config": "^0.72.6",
-    "@tsconfig/react-native": "^2.0.3",
-    "@types/fs-extra": "^11.0.1",
-    "@types/jest": "^29.5.12",
-    "@types/node": "^18.16.0",
+    "@react-native/metro-config": "0.77.1",
+    "@react-native/typescript-config": "0.77.1",
+    "@types/invariant": "^2.2.37",
+    "@types/jest": "^29.5.14",
+    "@types/node": "^22.7.5",
     "@types/react": "^18.2.24",
     "@types/tmp": "^0.2.6",
     "jest": "^29.5.0",
-    "json5": "^2.2.3",
-    "rimraf": "^5.0.0",
+    "metro": "^0.81.0",
+    "metro-config": "0.80.12",
     "tmp": "^0.2.1",
     "ts-jest": "^29.1.2",
-    "ts-node": "^10.9.1",
     "typescript": "^5.0.4"
   },
-  "files": [
-    "./Libraries/**/*",
-    "./types/**/*",
-    "./*.js",
-    "./*.json",
-    "./harmony/*",
-    "./*.har"
-  ],
-  "dependencies": {
-    "@react-native-oh/react-native-harmony-cli": "^0.0.30",
-    "colors": "^1.4.0",
-    "fs-extra": "^11.1.1",
-    "metro": "^0.76.3",
-    "metro-config": "^0.76.3"
+  "peerDependencies": {
+    "react-native": "0.77.1"
+  },
+  "engines": {
+    "node": ">=18"
   },
   "harmony": {
     "autolinking": null

package/react-native.config.js

@@ -1,17 +1,65 @@
+const pathUtils = require('node:path');
+
+let commands = [];
+try {
+  const harmony = require('@react-native-oh/react-native-harmony-cli');
+  commands = harmony?.config?.commands;
+} catch (err) {
+  if (typeof err === 'object' && err?.code === 'MODULE_NOT_FOUND') {
+    console.warn(
+      'react-native-harmony is installed but @react-native-oh/react-native-harmony-cli is not. "*-harmony" commands are unavailable. Please install @react-native-oh/react-native-harmony-cli in your project. This change was introduced in React native 0.76.\n'
+    );
+  }
+}
+
 /**
- * Copyright (c) 2024 Huawei Technologies Co., Ltd.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE-MIT file in the root directory of this source tree.
+ * Package name shouldn't be hardcoded because this package can be installed under an alias.
  */
-
-const { config: harmonyConfig } = require('@react-native-oh/react-native-harmony-cli')
+const rnohNpmPackageName =
+  deriveFullNpmPackageNameFromDirname(__dirname) ??
+  '@react-native-oh/react-native-harmony';
 
 /**
  * @type {import("@react-native-community/cli-types").Config}
  */
 const config = {
-  commands: harmonyConfig.commands,
-}
+  commands,
+  platforms: {
+    harmony: {
+      npmPackageName: rnohNpmPackageName,
+      projectConfig: () => ({}),
+      dependencyConfig: () => ({}),
+    },
+  },
+};
 
-module.exports = config
+module.exports = config;
+
+/**
+ * @param {string} dirname
+ * @return {string | null}
+ */
+function deriveFullNpmPackageNameFromDirname(dirname) {
+  const pathSegments = dirname.split(pathUtils.sep);
+  if (pathSegments.includes('node_modules')) {
+    /**
+     * Production environment
+     */
+    const nodeModulesIndex = pathSegments.indexOf('node_modules');
+    const organizationNameMaybeAndPackageName = pathSegments.slice(
+      nodeModulesIndex + 1
+    );
+    if (organizationNameMaybeAndPackageName.length === 1) {
+      return organizationNameMaybeAndPackageName[0]; // packageName
+    }
+    if (organizationNameMaybeAndPackageName.length === 2) {
+      return organizationNameMaybeAndPackageName.join('/');
+    }
+    return null;
+  } else {
+    /**
+     * RNOH development environment
+     */
+    return null;
+  }
+}

package/src/private/animated/NativeAnimatedHelper.js

@@ -0,0 +1,440 @@
+/**
+ * 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 {EventConfig} from '../../../Libraries/Animated/AnimatedEvent';
+import type {
+  AnimationConfig,
+  EndCallback,
+} from '../../../Libraries/Animated/animations/Animation';
+import type {
+  AnimatedNodeConfig,
+  EventMapping,
+} from '../../../Libraries/Animated/NativeAnimatedModule';
+import type {EventSubscription} from '../../../Libraries/vendor/emitter/EventEmitter';
+
+import NativeAnimatedNonTurboModule from '../../../Libraries/Animated/NativeAnimatedModule';
+import NativeAnimatedTurboModule from '../../../Libraries/Animated/NativeAnimatedTurboModule';
+import NativeEventEmitter from '../../../Libraries/EventEmitter/NativeEventEmitter';
+import RCTDeviceEventEmitter from '../../../Libraries/EventEmitter/RCTDeviceEventEmitter';
+import Platform from '../../../Libraries/Utilities/Platform';
+import * as ReactNativeFeatureFlags from '../featureflags/ReactNativeFeatureFlags';
+import invariant from 'invariant';
+import nullthrows from 'nullthrows';
+
+// TODO T69437152 @petetheheat - Delete this fork when Fabric ships to 100%.
+const NativeAnimatedModule: typeof NativeAnimatedTurboModule =
+  NativeAnimatedNonTurboModule ?? NativeAnimatedTurboModule;
+
+let __nativeAnimatedNodeTagCount = 1; /* used for animated nodes */
+let __nativeAnimationIdCount = 1; /* used for started animations */
+
+let nativeEventEmitter;
+
+let waitingForQueuedOperations = new Set<string>();
+let queueOperations = false;
+let queue: Array<() => void> = [];
+let singleOpQueue: Array<mixed> = [];
+
+const isSingleOpBatching =
+  Platform.OS === 'android' &&
+  NativeAnimatedModule?.queueAndExecuteBatchedOperations != null &&
+  ReactNativeFeatureFlags.animatedShouldUseSingleOp();
+let flushQueueImmediate = null;
+
+const eventListenerGetValueCallbacks: {
+  [number]: (value: number) => void,
+} = {};
+const eventListenerAnimationFinishedCallbacks: {
+  [number]: EndCallback,
+} = {};
+let globalEventEmitterGetValueListener: ?EventSubscription = null;
+let globalEventEmitterAnimationFinishedListener: ?EventSubscription = null;
+
+function createNativeOperations(): $NonMaybeType<typeof NativeAnimatedModule> {
+  const methodNames = [
+    'createAnimatedNode', // 1
+    'updateAnimatedNodeConfig', // 2
+    'getValue', // 3
+    'startListeningToAnimatedNodeValue', // 4
+    'stopListeningToAnimatedNodeValue', // 5
+    'connectAnimatedNodes', // 6
+    'disconnectAnimatedNodes', // 7
+    'startAnimatingNode', // 8
+    'stopAnimation', // 9
+    'setAnimatedNodeValue', // 10
+    'setAnimatedNodeOffset', // 11
+    'flattenAnimatedNodeOffset', // 12
+    'extractAnimatedNodeOffset', // 13
+    'connectAnimatedNodeToView', // 14
+    'disconnectAnimatedNodeFromView', // 15
+    'restoreDefaultValues', // 16
+    'dropAnimatedNode', // 17
+    'addAnimatedEventToView', // 18
+    'removeAnimatedEventFromView', // 19
+    'addListener', // 20
+    'removeListener', // 21
+  ];
+  const nativeOperations: {
+    [$Values<typeof methodNames>]: (...$ReadOnlyArray<mixed>) => void,
+  } = {};
+  if (isSingleOpBatching) {
+    for (let ii = 0, length = methodNames.length; ii < length; ii++) {
+      const methodName = methodNames[ii];
+      const operationID = ii + 1;
+      nativeOperations[methodName] = (...args) => {
+        // `singleOpQueue` is a flat array of operation IDs and arguments, which
+        // is possible because # arguments is fixed for each operation. For more
+        // details, see `NativeAnimatedModule.queueAndExecuteBatchedOperations`.
+        singleOpQueue.push(operationID, ...args);
+      };
+    }
+  } else {
+    for (let ii = 0, length = methodNames.length; ii < length; ii++) {
+      const methodName = methodNames[ii];
+      nativeOperations[methodName] = (...args) => {
+        const method = nullthrows(NativeAnimatedModule)[methodName];
+        // If queueing is explicitly on, *or* the queue has not yet
+        // been flushed, use the queue. This is to prevent operations
+        // from being executed out of order.
+        if (queueOperations || queue.length !== 0) {
+          // $FlowExpectedError[incompatible-call] - Dynamism.
+          queue.push(() => method(...args));
+        } else {
+          // $FlowExpectedError[incompatible-call] - Dynamism.
+          method(...args);
+        }
+      };
+    }
+  }
+  // $FlowExpectedError[incompatible-return] - Dynamism.
+  return nativeOperations;
+}
+
+const NativeOperations = createNativeOperations();
+
+/**
+ * Wrappers around NativeAnimatedModule to provide flow and autocomplete support for
+ * the native module methods, and automatic queue management on Android
+ */
+const API = {
+  getValue: (isSingleOpBatching
+    ? (tag, saveValueCallback) => {
+        if (saveValueCallback) {
+          eventListenerGetValueCallbacks[tag] = saveValueCallback;
+        }
+        /* $FlowExpectedError[incompatible-call] - `saveValueCallback` is handled
+            differently when `isSingleOpBatching` is enabled. */
+        NativeOperations.getValue(tag);
+      }
+    : (tag, saveValueCallback) => {
+        NativeOperations.getValue(tag, saveValueCallback);
+      }) as $NonMaybeType<typeof NativeAnimatedModule>['getValue'],
+
+  setWaitingForIdentifier(id: string): void {
+    waitingForQueuedOperations.add(id);
+    queueOperations = true;
+    if (
+      ReactNativeFeatureFlags.animatedShouldDebounceQueueFlush() &&
+      flushQueueImmediate
+    ) {
+      if (ReactNativeFeatureFlags.enableAnimatedClearImmediateFix()) {
+        clearImmediate(flushQueueImmediate);
+      } else {
+        clearTimeout(flushQueueImmediate);
+      }
+    }
+  },
+
+  unsetWaitingForIdentifier(id: string): void {
+    waitingForQueuedOperations.delete(id);
+
+    if (waitingForQueuedOperations.size === 0) {
+      queueOperations = false;
+      API.disableQueue();
+    }
+  },
+
+  disableQueue(): void {
+    invariant(NativeAnimatedModule, 'Native animated module is not available');
+
+    if (ReactNativeFeatureFlags.animatedShouldDebounceQueueFlush()) {
+      const prevImmediate = flushQueueImmediate;
+      clearImmediate(prevImmediate);
+      flushQueueImmediate = setImmediate(API.flushQueue);
+    } else {
+      API.flushQueue();
+    }
+  },
+
+  flushQueue: (isSingleOpBatching
+    ? (): void => {
+        invariant(
+          NativeAnimatedModule,
+          'Native animated module is not available',
+        );
+        flushQueueImmediate = null;
+
+        if (singleOpQueue.length === 0) {
+          return;
+        }
+
+        // Set up event listener for callbacks if it's not set up
+        ensureGlobalEventEmitterListeners();
+
+        // Single op batching doesn't use callback functions, instead we
+        // use RCTDeviceEventEmitter. This reduces overhead of sending lots of
+        // JSI functions across to native code; but also, TM infrastructure currently
+        // does not support packing a function into native arrays.
+        NativeAnimatedModule?.queueAndExecuteBatchedOperations?.(singleOpQueue);
+        singleOpQueue.length = 0;
+      }
+    : (): void => {
+        invariant(
+          NativeAnimatedModule,
+          'Native animated module is not available',
+        );
+        flushQueueImmediate = null;
+
+        if (queue.length === 0) {
+          return;
+        }
+
+        if (Platform.OS === 'android') {
+          NativeAnimatedModule?.startOperationBatch?.();
+        }
+
+        for (let q = 0, l = queue.length; q < l; q++) {
+          queue[q]();
+        }
+        queue.length = 0;
+
+        if (Platform.OS === 'android') {
+          NativeAnimatedModule?.finishOperationBatch?.();
+        }
+      }) as () => void,
+
+  createAnimatedNode(tag: number, config: AnimatedNodeConfig): void {
+    NativeOperations.createAnimatedNode(tag, config);
+  },
+
+  updateAnimatedNodeConfig(tag: number, config: AnimatedNodeConfig): void {
+    NativeOperations.updateAnimatedNodeConfig?.(tag, config);
+  },
+
+  startListeningToAnimatedNodeValue(tag: number): void {
+    NativeOperations.startListeningToAnimatedNodeValue(tag);
+  },
+
+  stopListeningToAnimatedNodeValue(tag: number): void {
+    NativeOperations.stopListeningToAnimatedNodeValue(tag);
+  },
+
+  connectAnimatedNodes(parentTag: number, childTag: number): void {
+    NativeOperations.connectAnimatedNodes(parentTag, childTag);
+  },
+
+  disconnectAnimatedNodes(parentTag: number, childTag: number): void {
+    NativeOperations.disconnectAnimatedNodes(parentTag, childTag);
+  },
+
+  startAnimatingNode: (isSingleOpBatching
+    ? (animationId, nodeTag, config, endCallback) => {
+        if (endCallback) {
+          eventListenerAnimationFinishedCallbacks[animationId] = endCallback;
+        }
+        /* $FlowExpectedError[incompatible-call] - `endCallback` is handled
+            differently when `isSingleOpBatching` is enabled. */
+        NativeOperations.startAnimatingNode(animationId, nodeTag, config);
+      }
+    : (animationId, nodeTag, config, endCallback) => {
+        NativeOperations.startAnimatingNode(
+          animationId,
+          nodeTag,
+          config,
+          endCallback,
+        );
+      }) as $NonMaybeType<typeof NativeAnimatedModule>['startAnimatingNode'],
+
+  stopAnimation(animationId: number) {
+    NativeOperations.stopAnimation(animationId);
+  },
+
+  setAnimatedNodeValue(nodeTag: number, value: number): void {
+    NativeOperations.setAnimatedNodeValue(nodeTag, value);
+  },
+
+  setAnimatedNodeOffset(nodeTag: number, offset: number): void {
+    NativeOperations.setAnimatedNodeOffset(nodeTag, offset);
+  },
+
+  flattenAnimatedNodeOffset(nodeTag: number): void {
+    NativeOperations.flattenAnimatedNodeOffset(nodeTag);
+  },
+
+  extractAnimatedNodeOffset(nodeTag: number): void {
+    NativeOperations.extractAnimatedNodeOffset(nodeTag);
+  },
+
+  connectAnimatedNodeToView(nodeTag: number, viewTag: number): void {
+    NativeOperations.connectAnimatedNodeToView(nodeTag, viewTag);
+  },
+
+  disconnectAnimatedNodeFromView(nodeTag: number, viewTag: number): void {
+    NativeOperations.disconnectAnimatedNodeFromView(nodeTag, viewTag);
+  },
+
+  restoreDefaultValues(nodeTag: number): void {
+    NativeOperations.restoreDefaultValues?.(nodeTag);
+  },
+
+  dropAnimatedNode(tag: number): void {
+    NativeOperations.dropAnimatedNode(tag);
+  },
+
+  addAnimatedEventToView(
+    viewTag: number,
+    eventName: string,
+    eventMapping: EventMapping,
+  ) {
+    NativeOperations.addAnimatedEventToView(viewTag, eventName, eventMapping);
+  },
+
+  removeAnimatedEventFromView(
+    viewTag: number,
+    eventName: string,
+    animatedNodeTag: number,
+  ) {
+    NativeOperations.removeAnimatedEventFromView(
+      viewTag,
+      eventName,
+      animatedNodeTag,
+    );
+  },
+};
+
+function ensureGlobalEventEmitterListeners() {
+  if (
+    globalEventEmitterGetValueListener &&
+    globalEventEmitterAnimationFinishedListener
+  ) {
+    return;
+  }
+  globalEventEmitterGetValueListener = RCTDeviceEventEmitter.addListener(
+    'onNativeAnimatedModuleGetValue',
+    params => {
+      const {tag} = params;
+      const callback = eventListenerGetValueCallbacks[tag];
+      if (!callback) {
+        return;
+      }
+      callback(params.value);
+      delete eventListenerGetValueCallbacks[tag];
+    },
+  );
+  globalEventEmitterAnimationFinishedListener =
+    RCTDeviceEventEmitter.addListener(
+      'onNativeAnimatedModuleAnimationFinished',
+      params => {
+        // TODO: remove Array.isArray once native changes have propagated
+        const animations = Array.isArray(params) ? params : [params];
+        for (const animation of animations) {
+          const {animationId} = animation;
+          const callback = eventListenerAnimationFinishedCallbacks[animationId];
+          if (callback) {
+            callback(animation);
+            delete eventListenerAnimationFinishedCallbacks[animationId];
+          }
+        }
+      },
+    );
+}
+
+function generateNewNodeTag(): number {
+  return __nativeAnimatedNodeTagCount++;
+}
+
+function generateNewAnimationId(): number {
+  return __nativeAnimationIdCount++;
+}
+
+function assertNativeAnimatedModule(): void {
+  invariant(NativeAnimatedModule, 'Native animated module is not available');
+}
+
+let _warnedMissingNativeAnimated = false;
+
+function shouldUseNativeDriver(
+  config: $ReadOnly<{...AnimationConfig, ...}> | EventConfig,
+): boolean {
+  if (config.useNativeDriver == null) {
+    console.warn(
+      'Animated: `useNativeDriver` was not specified. This is a required ' +
+        'option and must be explicitly set to `true` or `false`',
+    );
+  }
+
+  if (config.useNativeDriver === true && !NativeAnimatedModule) {
+    if (process.env.NODE_ENV !== 'test') {
+      if (!_warnedMissingNativeAnimated) {
+        console.warn(
+          'Animated: `useNativeDriver` is not supported because the native ' +
+            'animated module is missing. Falling back to JS-based animation. To ' +
+            'resolve this, add `RCTAnimation` module to this app, or remove ' +
+            '`useNativeDriver`. ' +
+            'Make sure to run `bundle exec pod install` first. Read more about autolinking: https://github.com/react-native-community/cli/blob/master/docs/autolinking.md',
+        );
+        _warnedMissingNativeAnimated = true;
+      }
+    }
+    return false;
+  }
+
+  return config.useNativeDriver || false;
+}
+
+function transformDataType(value: number | string): number | string {
+  // Change the string type to number type so we can reuse the same logic in
+  // iOS and Android platform
+  if (typeof value !== 'string') {
+    return value;
+  }
+
+  // Normalize degrees and radians to a number expressed in radians
+  if (value.endsWith('deg')) {
+    const degrees = parseFloat(value) || 0;
+    return (degrees * Math.PI) / 180.0;
+  } else if (value.endsWith('rad')) {
+    return parseFloat(value) || 0;
+  } else {
+    return value;
+  }
+}
+
+export default {
+  API,
+  generateNewNodeTag,
+  generateNewAnimationId,
+  assertNativeAnimatedModule,
+  shouldUseNativeDriver,
+  transformDataType,
+  // $FlowExpectedError[unsafe-getters-setters] - unsafe getter lint suppression
+  // $FlowExpectedError[missing-type-arg] - unsafe getter lint suppression
+  get nativeEventEmitter(): NativeEventEmitter {
+    if (!nativeEventEmitter) {
+      // $FlowFixMe[underconstrained-implicit-instantiation]
+      nativeEventEmitter = new NativeEventEmitter(
+        // 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 : NativeAnimatedModule,
+      );
+    }
+    return nativeEventEmitter;
+  },
+};