@react-native-oh/react-native-harmony 0.77.22 → 0.77.33

package/Libraries/Alert/Alert.js

@@ -128,7 +128,7 @@ class Alert {
     keyboardType?: string,
     options?: Options,
   ): void {
-    ALERT_DELEGATE.prompt(title, message, callbackOrButtons, type, defaultValue, keyboardValue, options);
+    ALERT_DELEGATE.prompt(title, message, callbackOrButtons, type, defaultValue, keyboardType, options);
     // if (Platform.OS === 'ios') {
     //   let callbacks: Array<?any> = [];
     //   const buttons = [];

package/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js

@@ -26,6 +26,7 @@ import AndroidDrawerLayoutNativeComponent, {
 } from './AndroidDrawerLayoutNativeComponent';
 import nullthrows from 'nullthrows';
 import * as React from 'react';
+import DrawerLayoutAndroidDelegate from './delegates/DrawerLayoutAndroidDelegate'; // RNC_patch
 
 const DRAWER_STATES = ['Idle', 'Dragging', 'Settling'];
 
@@ -154,6 +155,13 @@ type State = {|
  * ```
  */
 class DrawerLayoutAndroid extends React.Component<Props, State> {
+  _delegate: DrawerLayoutAndroidDelegate; // RNC_patch
+
+  constructor(props: Props) {
+    super(props);
+    this._delegate = new DrawerLayoutAndroidDelegate({ getProps: () => this.props }); // RNC_patch
+  }
+
   static get positions(): mixed {
     console.warn(
       'Setting DrawerLayoutAndroid drawerPosition using `DrawerLayoutAndroid.positions` is deprecated. Instead pass the string value "left" or "right"',
@@ -173,66 +181,76 @@ class DrawerLayoutAndroid extends React.Component<Props, State> {
   };
 
   render(): React.Node {
-    const {
-      drawerBackgroundColor = 'white',
-      onDrawerStateChanged,
-      renderNavigationView,
-      onDrawerOpen,
-      onDrawerClose,
-      ...props
-    } = this.props;
-    const drawStatusBar = this.props.statusBarBackgroundColor != null;
-    const drawerViewWrapper = (
-      <View
-        style={[
-          styles.drawerSubview,
-          {
-            width: this.props.drawerWidth,
-            backgroundColor: drawerBackgroundColor,
-          },
-        ]}
-        pointerEvents={this.state.drawerOpened ? 'auto' : 'none'}
-        collapsable={false}>
-        {renderNavigationView()}
-        {drawStatusBar && <View style={styles.drawerStatusBar} />}
-      </View>
-    );
-    const childrenWrapper = (
-      <View style={styles.mainSubview} collapsable={false}>
-        {drawStatusBar && (
-          <StatusBar
-            translucent
-            backgroundColor={this.props.statusBarBackgroundColor}
-          />
-        )}
-        {drawStatusBar && (
-          <View
-            style={[
-              styles.statusBar,
-              {backgroundColor: this.props.statusBarBackgroundColor},
-            ]}
-          />
-        )}
-        {this.props.children}
-      </View>
-    );
-    return (
-      <AndroidDrawerLayoutNativeComponent
-        {...props}
-        ref={this._nativeRef}
-        drawerBackgroundColor={drawerBackgroundColor}
-        drawerWidth={this.props.drawerWidth}
-        drawerPosition={this.props.drawerPosition}
-        drawerLockMode={this.props.drawerLockMode}
-        style={[styles.base, this.props.style]}
-        onDrawerSlide={this._onDrawerSlide}
-        onDrawerOpen={this._onDrawerOpen}
-        onDrawerClose={this._onDrawerClose}
-        onDrawerStateChanged={this._onDrawerStateChanged}>
-        {childrenWrapper}
-        {drawerViewWrapper}
-      </AndroidDrawerLayoutNativeComponent>
-    );
+    // RNC_patch
+
+    //  const {
+    //       drawerBackgroundColor = 'white',
+    //       onDrawerStateChanged,
+    //       renderNavigationView,
+    //       onDrawerOpen,
+    //       onDrawerClose,
+    //       ...props
+    //     } = this.props;
+    //     const drawStatusBar = this.props.statusBarBackgroundColor != null;
+    //     const drawerViewWrapper = (
+    //       <View
+    //         style={[
+    //           styles.drawerSubview,
+    //           {
+    //             width: this.props.drawerWidth,
+    //             backgroundColor: drawerBackgroundColor,
+    //           },
+    //         ]}
+    //         pointerEvents={this.state.drawerOpened ? 'auto' : 'none'}
+    //         collapsable={false}>
+    //         {renderNavigationView()}
+    //         {drawStatusBar && <View style={styles.drawerStatusBar} />}
+    //       </View>
+    //     );
+    //     const childrenWrapper = (
+    //       <View style={styles.mainSubview} collapsable={false}>
+    //         {drawStatusBar && (
+    //           <StatusBar
+    //             translucent
+    //             backgroundColor={this.props.statusBarBackgroundColor}
+    //           />
+    //         )}
+    //         {drawStatusBar && (
+    //           <View
+    //             style={[
+    //               styles.statusBar,
+    //               {backgroundColor: this.props.statusBarBackgroundColor},
+    //             ]}
+    //           />
+    //         )}
+    //         {this.props.children}
+    //       </View>
+    //     );
+    //     return (
+    //       <AndroidDrawerLayoutNativeComponent
+    //         {...props}
+    //         ref={this._nativeRef}
+    //         drawerBackgroundColor={drawerBackgroundColor}
+    //         drawerWidth={this.props.drawerWidth}
+    //         drawerPosition={this.props.drawerPosition}
+    //         drawerLockMode={this.props.drawerLockMode}
+    //         style={[styles.base, this.props.style]}
+    //         onDrawerSlide={this._onDrawerSlide}
+    //         onDrawerOpen={this._onDrawerOpen}
+    //         onDrawerClose={this._onDrawerClose}
+    //         onDrawerStateChanged={this._onDrawerStateChanged}>
+    //         {childrenWrapper}
+    //         {drawerViewWrapper}
+    //       </AndroidDrawerLayoutNativeComponent>
+    //     );
+    return this._delegate.render({
+      drawerOpened: this.state.drawerOpened,
+      nativeRef: this._nativeRef,
+      onDrawerOpen: this._onDrawerOpen,
+      onDrawerClose: this._onDrawerClose,
+      onDrawerSlide: this._onDrawerSlide,
+      onDrawerStateChanged: this._onDrawerStateChanged,
+    }); // RNC_patch
   }
 
   /* $FlowFixMe[missing-local-annot] The type annotation(s) required by Flow's

package/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.harmony.js

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) 2025 Huawei Technologies Co., Ltd.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+//RNOH patch: We want to use the android patch of RNC. This could be done differently but that would result in a bigger patch and/or metro problems.
+module.exports = require('./DrawerLayoutAndroid.android.js');

package/Libraries/Components/DrawerAndroid/delegates/BaseDrawerLayoutAndroidDelegate.ts

@@ -0,0 +1,28 @@
+/**
+ * @format
+ */
+import type { DrawerLayoutAndroidProps } from '../DrawerLayoutAndroid';
+import AndroidDrawerLayoutNativeComponent from '../AndroidDrawerLayoutNativeComponent';
+
+export type BaseDrawerLayoutAndroidDelegateContext = {
+    getProps: () => DrawerLayoutAndroidProps
+};
+
+export type DrawerLayoutAndroidDelegateInternalProps<
+    TNativeComponent extends { new(props: any): React.Component<any> },
+> = {
+    drawerOpened: boolean,
+    nativeRef: React.ElementRef<typeof AndroidDrawerLayoutNativeComponent>,
+    onDrawerOpen: () => void,
+    onDrawerClose: () => void,
+    onDrawerSlide: (event: { nativeEvent: { offset: number } }) => void,
+    onDrawerStateChanged: (newState: 'Idle' | 'Dragging' | 'Settling') => void,
+};
+
+
+export abstract class BaseDrawerLayoutAndroidDelegate {
+    constructor(protected ctx: BaseDrawerLayoutAndroidDelegateContext) { }
+    abstract render(
+        internalProps: DrawerLayoutAndroidDelegateInternalProps<any>,
+    ): React.ReactNode;
+}

package/Libraries/Components/DrawerAndroid/delegates/DrawerLayoutAndroidDelegate.harmony.tsx

@@ -0,0 +1,130 @@
+/**
+ * Copyright (c) 2025 Huawei Technologies Co., Ltd.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { View } from "react-native";
+import {
+  BaseDrawerLayoutAndroidDelegate,
+  DrawerLayoutAndroidDelegateInternalProps,
+} from "./BaseDrawerLayoutAndroidDelegate";
+import AndroidDrawerLayoutNativeComponent from "../AndroidDrawerLayoutNativeComponent";
+import StyleSheet from "../../../StyleSheet/StyleSheet";
+import StatusBar from "../../StatusBar/StatusBar";
+import React from "react";
+import requireNativeComponent from "../../../ReactNative/requireNativeComponent";
+import type { ViewProps } from "../../View/ViewPropTypes";
+
+const DrawerLayoutChildWrapperView = requireNativeComponent<
+  ViewProps & {
+    postTouches: boolean;
+  }
+>("DrawerLayoutChildWrapperView");
+
+export default class DrawerLayoutAndroidDelegate extends BaseDrawerLayoutAndroidDelegate {
+  override render(
+    internalProps: DrawerLayoutAndroidDelegateInternalProps<any>
+  ): React.ReactNode {
+    const propsFromCtx = this.ctx.getProps();
+    const {
+      drawerBackgroundColor = "white",
+      onDrawerStateChanged,
+      renderNavigationView,
+      onDrawerOpen,
+      onDrawerClose,
+      ...props
+    } = propsFromCtx;
+
+    const drawStatusBar = propsFromCtx.statusBarBackgroundColor != null;
+    const drawerViewWrapper = (
+      <DrawerLayoutChildWrapperView
+        style={[
+          styles.drawerSubview,
+          {
+            width: propsFromCtx.drawerWidth,
+            backgroundColor: drawerBackgroundColor,
+          },
+        ]}
+        pointerEvents={internalProps.drawerOpened ? "auto" : "none"}
+        postTouches={true}
+        collapsable={false}
+      >
+        {renderNavigationView()}
+        {drawStatusBar && <View style={styles.drawerStatusBar} />}
+      </DrawerLayoutChildWrapperView>
+    );
+    const childrenWrapper = (
+      <DrawerLayoutChildWrapperView
+        style={styles.mainSubview}
+        collapsable={false}
+      >
+        {drawStatusBar && (
+          <StatusBar
+            translucent
+            backgroundColor={propsFromCtx.statusBarBackgroundColor}
+          />
+        )}
+        {drawStatusBar && (
+          <View
+            style={[
+              styles.statusBar,
+              { backgroundColor: propsFromCtx.statusBarBackgroundColor },
+            ]}
+          />
+        )}
+        {propsFromCtx.children}
+      </DrawerLayoutChildWrapperView>
+    );
+    //RNOH patch: reorder the drawer and children wrappers to conform to ArkUI's sidebarcontainer
+    return (
+      <AndroidDrawerLayoutNativeComponent
+        {...props}
+        ref={internalProps.nativeRef}
+        drawerBackgroundColor={drawerBackgroundColor}
+        drawerWidth={propsFromCtx.drawerWidth}
+        drawerPosition={propsFromCtx.drawerPosition}
+        drawerLockMode={propsFromCtx.drawerLockMode}
+        style={[styles.base, propsFromCtx.style]}
+        onDrawerSlide={internalProps.onDrawerSlide}
+        onDrawerOpen={internalProps.onDrawerOpen}
+        onDrawerClose={internalProps.onDrawerClose}
+        onDrawerStateChanged={internalProps.onDrawerStateChanged}
+      >
+        {drawerViewWrapper}
+        {childrenWrapper}
+      </AndroidDrawerLayoutNativeComponent>
+    );
+  }
+}
+
+const styles = StyleSheet.create({
+  base: {
+    flex: 1,
+    elevation: 16,
+  },
+  mainSubview: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+  },
+  drawerSubview: {
+    position: "absolute",
+    top: 0,
+    bottom: 0,
+  },
+  statusBar: {
+    height: StatusBar.currentHeight,
+  },
+  drawerStatusBar: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    height: StatusBar.currentHeight,
+    backgroundColor: "rgba(0, 0, 0, 0.251)",
+  },
+});

package/Libraries/Components/DrawerAndroid/delegates/DrawerLayoutAndroidDelegate.ts

@@ -0,0 +1,8 @@
+import { UnsupportedByPlatformError } from "../../../../delegates/DelegateError";
+import { BaseDrawerLayoutAndroidDelegate, DrawerLayoutAndroidDelegateInternalProps } from "./BaseDrawerLayoutAndroidDelegate";
+
+export default class DrawerLayoutAndroidDelegate extends BaseDrawerLayoutAndroidDelegate {
+    render(internalProps: DrawerLayoutAndroidDelegateInternalProps<any>): React.ReactNode {
+        throw new UnsupportedByPlatformError();
+    }
+}

package/Libraries/Components/Touchable/TouchableOpacity.js

@@ -337,3 +337,4 @@ const Touchable: component(
 Touchable.displayName = 'TouchableOpacity';
 
 module.exports = Touchable;
+module.exports.TouchableOpacity = TouchableOpacity;

package/Libraries/Modal/Modal.js

@@ -260,7 +260,7 @@ class Modal extends React.Component<Props, State> {
 
   // Helper function to encapsulate platform specific logic to show or not the Modal.
   _shouldShowModal(): boolean {
-    if (Platform.OS === 'ios') {
+    if (Platform.OS === 'ios' || Platform.OS === 'harmony') {
       return this.props.visible === true || this.state.isRendered === true;
     }
 
@@ -296,8 +296,8 @@ class Modal extends React.Component<Props, State> {
     );
 
     const onDismiss = () => {
-      // OnDismiss is implemented on iOS only.
-      if (Platform.OS === 'ios') {
+      // OnDismiss is implemented on iOS and Harmony.
+      if (Platform.OS === 'ios' || Platform.OS === 'harmony') {
         this.setState({isRendered: false}, () => {
           if (this.props.onDismiss) {
             this.props.onDismiss();

package/index.js

@@ -1,8 +1,27 @@
+if (global.window === undefined) {
+  /**
+   * Some RN framework uses RNOH 72 as a dependency and users of that framework don't install RNOH directly.
+   * RN upstream code integration approach changed in RNOH 77, and RNOH must be installed directly.
+   *
+   * That RN framework SHOULD NOT use RNOH as a dependency (RNOH should be peerDependency). React Native expects
+   * Out of Tree platforms to be directly installed in application projects. There's no guarantee that preserving
+   * this behavior will be possible in future RN versions.
+   *
+   * If RN doesn't recognize RNOH as an OOT platform, serializer::getModulesRunBeforeMainModule won't be used.
+   * Part of the RN OOT recognition logic depends on dependencies listed in application's package.json
+   * (https://github.com/react-native-community/cli/blob/main/packages/cli-config/src/findDependencies.ts).
+   */
+  require('./Libraries/Core/InitializeCore');
+}
+
 module.exports = {
   get AccessibilityInfo() {
     return require('./Libraries/Components/AccessibilityInfo/AccessibilityInfo')
       .default;
   },
+  get ActionSheetIOS() {
+    return require('./Libraries/ActionSheetIOS/ActionSheetIOS');
+  },
   get ActivityIndicator() {
     return require('./Libraries/Components/ActivityIndicator/ActivityIndicator')
       .default;
@@ -55,6 +74,10 @@ module.exports = {
   get ImageBackground() {
     return require('./Libraries/Image/ImageBackground');
   },
+  get InputAccessoryView() {
+    return require('./Libraries/Components/TextInput/InputAccessoryView')
+      .default;
+  },
   get I18nManager() {
     return require('./Libraries/ReactNative/I18nManager');
   },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-oh/react-native-harmony",
-  "version": "0.77.22",
+  "version": "0.77.33",
   "description": "",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
@@ -20,7 +20,9 @@
     "./LICENSE-Meta",
     "./NOTICE.md",
     "./metro.config.d.ts",
-    "./react_native_openharmony.har"
+    "./react_native_openharmony.har",
+    "./react_native_openharmony_release.har",
+    "./react_native_openharmony_release2.har"
   ],
   "scripts": {
     "build": "node ./scripts/build-har.js",
@@ -78,10 +80,5 @@
   },
   "harmony": {
     "autolinking": null
-  },
-  "homepage": "https://gitcode.com/openharmony-sig/ohos_react_native",
-  "repository": {
-    "type": "gitcode",
-    "url": "https://gitcode.com/openharmony-sig/ohos_react_native"
   }
 }

package/types/index.harmony.d.ts

@@ -21,7 +21,7 @@ export * from '../Libraries/Components/ScrollView/ScrollView';
 // export * from '../Libraries/Components/Slider/Slider';
 export * from '../Libraries/Components/StatusBar/StatusBar';
 export * from '../Libraries/Components/Switch/Switch';
-// export * from '../Libraries/Components/TextInput/InputAccessoryView';
+export * from '../Libraries/Components/TextInput/InputAccessoryView';
 export * from '../Libraries/Components/TextInput/TextInput';
 export * from '../Libraries/Components/ToastAndroid/ToastAndroid';
 export * from '../Libraries/Components/Touchable/Touchable';