@ohos-ports/react-native-navigation 8.9.0-beta.1 → 8.9.0-beta.11

package/README.md

@@ -1,37 +1,37 @@
-[![SWUbanner](https://raw.githubusercontent.com/vshymanskyy/StandWithUkraine/main/banner2-direct.svg)](https://vshymanskyy.github.io/StandWithUkraine)
+# @ohos-ports/react-native-navigation
 
-<h1 align="center">
-  <img src=".logo.png"/><br/>
-  React Native Navigation
-</h1>
+React Native Navigation — truly native navigation for iOS and Android, ported for HarmonyOS.
 
-<p align="center">
-  <a href="https://www.npmjs.com/package/react-native-navigation"><img src="https://img.shields.io/npm/dw/react-native-navigation.svg?style=flat-square" alt="NPM downloads"></a>
-  <a href="https://www.npmjs.com/package/react-native-navigation"><img src="https://img.shields.io/npm/v/react-native-navigation/latest.svg?style=flat-square" alt="NPM latest version"></a>
-  <a href="https://www.npmjs.com/package/react-native-navigation"><img src="https://img.shields.io/npm/v/react-native-navigation/snapshot.svg?style=flat-square" alt="NPM snapshot version"></a>
-  <a href="https://jenkins-oss.wixpress.com/job/multi-react-native-navigation-master/"><img src="https://img.shields.io/jenkins/s/http/jenkins-oss.wixpress.com:8080/job/multi-react-native-navigation-master.svg?style=flat-square" alt="NPM snapshot version"></a>
+## Installation
 
-</p>
-<p align="center">
-  <a href="https://twitter.com/reactnativenav"><img src="https://img.shields.io/twitter/follow/reactnativenav.svg?style=flat-square&colorA=1da1f2&colorB=&label=Follow%20us%20on%20Twitter" alt="Follow on Twitter"></a>
-  <a href="https://discord.gg/DhkZjq2"><img src="https://img.shields.io/discord/242515947020222464.svg?color=%237289da&label=Chat%20on%20Discrd&style=flat-square" alt="Chat on Discord"></a>
-  <a href="https://stackoverflow.com/questions/tagged/wix-react-native-navigation"><img src="https://img.shields.io/stackexchange/stackoverflow/t/wix-react-native-navigation.svg?style=flat-square" alt="StackExchange"></a>
-</p>
+```bash
+npm install @ohos-ports/react-native-navigation @ohos-ports/react-native react
+```
 
-React Native Navigation provides 100% native platform navigation on both iOS and Android for React Native apps. The JavaScript API is simple and cross-platform - just install it in your app and give your users the native feel they deserve. Ready to get started? Check out the [docs](https://wix.github.io/react-native-navigation/).
+And add this to your project's `package.json`:
 
-# Quick Links
+```json
+{
+  "overrides": {
+    "react-native": "npm:@ohos-ports/react-native@^0.87.1-beta.1"
+  }
+}
+```
 
-- [Documentation](https://wix.github.io/react-native-navigation/)
-- [Changelog](https://github.com/wix/react-native-navigation/blob/master/CHANGELOG.md)
-- [Stack Overflow](http://stackoverflow.com/questions/tagged/wix-react-native-navigation)
-- [Chat with us](https://discord.gg/DhkZjq2)
-- [Contributing](https://wix.github.io/react-native-navigation/docs/meta-contributing)
+The `overrides` field ensures that all `react-native` references (including transitive peer dependencies) resolve to `@ohos-ports/react-native`, preventing the original facebook `react-native` (with Flow syntax) from being installed.
 
-# Requirements
+## Requirements
 
-Apps using React Native Navigation may target iOS 11 and Android 5.0 (API 21). You may use Windows, macOS or Linux as your development operating system.
+- Node.js >= 22
+- `@ohos-ports/react-native` runtime
 
-# Installation
+## What was changed
 
-As `react-native-navigation` is a native navigation library - integrating it into your app will require editing native files. Follow the installation guides in the [documentation](https://wix.github.io/react-native-navigation/).
+- **ESM → CJS transpilation**: Source converted from ESM (`import`/`export`) to CommonJS (`require`/`module.exports`) using esbuild.
+- **Dependency path replacement**: All `require('react-native')` → `require('@ohos-ports/react-native')`.
+- **Dimensions fallback**: `Dimensions.get('window')` returns default values (375×812) when RN bridge is not initialized.
+- **lodash ESM fix**: `.js` extensions added to lodash deep imports.
+
+## License
+
+MIT

package/lib/cjs/Mock/Application.js

@@ -0,0 +1,67 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Application_exports = {};
+__export(Application_exports, {
+  Application: () => Application
+});
+module.exports = __toCommonJS(Application_exports);
+var React = __toESM(require("react"), 1);
+var import_react_native = require("@ohos-ports/react-native");
+var import_connect = require("./connect.js");
+var import_jsx_runtime = require("react/jsx-runtime");
+const Application = (0, import_connect.connect)(class extends React.Component {
+  constructor(props) {
+    super(props);
+    props.entryPoint();
+  }
+  render() {
+    const {
+      LayoutComponent
+    } = require("./Components/LayoutComponent");
+    const {
+      LayoutStore
+    } = require("./Stores/LayoutStore");
+    const {
+      Modals
+    } = require("./Components/Modals");
+    const {
+      Overlays
+    } = require("./Components/Overlays");
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native.View, {
+      testID: "Application",
+      children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(LayoutComponent, {
+        layoutNode: LayoutStore.getLayout()
+      }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Modals, {}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Overlays, {})]
+    });
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Application
+});

package/lib/cjs/Mock/ComponentProps.js

@@ -0,0 +1,16 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var ComponentProps_exports = {};
+module.exports = __toCommonJS(ComponentProps_exports);

package/lib/cjs/Mock/Components/BottomTabs.js

@@ -0,0 +1,50 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var BottomTabs_exports = {};
+__export(BottomTabs_exports, {
+  BottomTabs: () => BottomTabs
+});
+module.exports = __toCommonJS(BottomTabs_exports);
+var import_react = __toESM(require("react"), 1);
+var import_LayoutComponent = require("./LayoutComponent.js");
+var import_connect = require("../connect.js");
+var import_jsx_runtime = require("react/jsx-runtime");
+const BottomTabs = (0, import_connect.connect)(class extends import_react.Component {
+  render() {
+    return this.props.layoutNode.children.map((child) => {
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_LayoutComponent.LayoutComponent, {
+        layoutNode: child
+      }, child.nodeId);
+    });
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BottomTabs
+});

package/lib/cjs/Mock/Components/ComponentScreen.js

@@ -0,0 +1,135 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var ComponentScreen_exports = {};
+__export(ComponentScreen_exports, {
+  ComponentScreen: () => ComponentScreen
+});
+module.exports = __toCommonJS(ComponentScreen_exports);
+var import_react = __toESM(require("react"), 1);
+var import_react_native = require("@ohos-ports/react-native");
+var import_react_native_navigation = require("react-native-navigation");
+var import_constants = require("../constants.js");
+var import_LayoutStore = require("../Stores/LayoutStore.js");
+var import_connect = require("../connect.js");
+var import_TopBar = require("./TopBar.js");
+var import_EventsStore = require("../Stores/EventsStore.js");
+var import_lodash = __toESM(require("lodash"), 1);
+var import_layoutActions = require("../actions/layoutActions.js");
+var import_jsx_runtime = require("react/jsx-runtime");
+function isURISource(src) {
+  return !!src && typeof src === "object" && "uri" in src;
+}
+const ComponentScreen = (0, import_connect.connect)(class extends import_react.Component {
+  constructor(props) {
+    super(props);
+  }
+  componentDidMount() {
+    this.props.layoutNode.componentDidMount();
+  }
+  isVisible() {
+    const isVisible = import_LayoutStore.LayoutStore.isVisibleLayout(this.props.layoutNode);
+    return isVisible;
+  }
+  renderTabBar() {
+    const bottomTabs = this.props.layoutNode.getBottomTabs();
+    if (!bottomTabs) return null;
+    const bottomTabsOptions = bottomTabs.resolveOptions().bottomTabs;
+    if (bottomTabsOptions?.visible === false) return null;
+    const buttons = bottomTabs.children.map((child, i) => {
+      const bottomTabOptions = child.resolveOptions().bottomTab;
+      const icon = bottomTabs.selectedIndex === i ? bottomTabOptions?.selectedIcon : bottomTabOptions?.icon;
+      const iconURI = isURISource(icon) ? icon.uri : void 0;
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.View, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.TouchableOpacity, {
+          style: {
+            padding: 10
+          },
+          testID: bottomTabOptions?.testID,
+          onPress: () => {
+            import_EventsStore.events.invokeBottomTabPressed({
+              tabIndex: i
+            });
+            if (import_lodash.default.defaultTo(bottomTabOptions?.selectTabOnPress, true)) (0, import_layoutActions.switchTabByIndex)(this.props.layoutNode.getBottomTabs(), i);
+          },
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native.View, {
+            style: {
+              justifyContent: "center",
+              alignItems: "center"
+            },
+            children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.Text, {
+              children: bottomTabOptions?.badge
+            }), iconURI && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.Image, {
+              style: {
+                width: 18,
+                height: 18,
+                marginBottom: 5
+              },
+              source: {
+                uri: iconURI
+              }
+            }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.Text, {
+              style: {
+                fontSize: 12
+              },
+              children: bottomTabOptions?.text || ""
+            })]
+          })
+        })
+      }, `tab-${i}`);
+    });
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.View, {
+      testID: bottomTabsOptions?.testID,
+      style: {
+        flexDirection: "row",
+        justifyContent: "center",
+        width: "100%",
+        backgroundColor: "#F0F2F5"
+      },
+      children: buttons
+    });
+  }
+  render() {
+    const Component2 = import_react_native_navigation.Navigation.mock.store.getWrappedComponent(this.props.layoutNode.data.name);
+    if (!Component2) throw new Error(`${this.props.layoutNode.data.name} has not been registered.`);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native.View, {
+      testID: this.isVisible() ? import_constants.VISIBLE_SCREEN_TEST_ID : void 0,
+      children: [this.props.layoutNode.getStack() && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TopBar.TopBar, {
+        layoutNode: this.props.layoutNode,
+        topBarOptions: this.props.layoutNode.resolveOptions().topBar,
+        backButtonOptions: this.props.layoutNode.resolveOptions().topBar?.backButton
+      }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component2, {
+        componentId: this.props.layoutNode.nodeId
+      }), this.renderTabBar()]
+    });
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ComponentScreen
+});

package/lib/cjs/Mock/Components/LayoutComponent.js

@@ -0,0 +1,85 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var LayoutComponent_exports = {};
+__export(LayoutComponent_exports, {
+  LayoutComponent: () => LayoutComponent
+});
+module.exports = __toCommonJS(LayoutComponent_exports);
+var import_react = __toESM(require("react"), 1);
+var import_react_native = require("@ohos-ports/react-native");
+var import_BottomTabs = require("./BottomTabs.js");
+var import_ComponentScreen = require("./ComponentScreen.js");
+var import_Stack = require("./Stack.js");
+var import_SideMenu = require("./SideMenu.js");
+var import_jsx_runtime = require("react/jsx-runtime");
+const LayoutComponent = class extends import_react.Component {
+  render() {
+    switch (this.props.layoutNode.type) {
+      case "BottomTabs":
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_BottomTabs.BottomTabs, {
+          layoutNode: this.props.layoutNode
+        });
+      case "Stack":
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Stack.Stack, {
+          layoutNode: this.props.layoutNode
+        });
+      case "Component":
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ComponentScreen.ComponentScreen, {
+          layoutNode: this.props.layoutNode
+        });
+      case "SideMenuRoot":
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SideMenu.SideMenuRoot, {
+          layoutNode: this.props.layoutNode
+        });
+      case "SideMenuLeft":
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SideMenu.SideMenuLeft, {
+          layoutNode: this.props.layoutNode
+        });
+      case "SideMenuCenter":
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SideMenu.SideMenuCenter, {
+          layoutNode: this.props.layoutNode
+        });
+      case "SideMenuRight":
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SideMenu.SideMenuRight, {
+          layoutNode: this.props.layoutNode
+        });
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.View, {});
+  }
+  componentDidCatch(error, errorInfo) {
+    const err = new Error(`Error while trying to render layout ${this.props.layoutNode.nodeId} of type ${this.props.layoutNode.type}: ${error}
+${errorInfo?.componentStack}`);
+    err.cause = error;
+    throw err;
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  LayoutComponent
+});

package/lib/cjs/Mock/Components/Modals.js

@@ -0,0 +1,56 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Modals_exports = {};
+__export(Modals_exports, {
+  Modals: () => Modals
+});
+module.exports = __toCommonJS(Modals_exports);
+var import_react = __toESM(require("react"), 1);
+var import_react_native = require("@ohos-ports/react-native");
+var import_LayoutComponent = require("./LayoutComponent.js");
+var import_LayoutStore = require("../Stores/LayoutStore.js");
+var import_connect = require("../connect.js");
+var import_jsx_runtime = require("react/jsx-runtime");
+const Modals = (0, import_connect.connect)(class extends import_react.Component {
+  render() {
+    const children = import_LayoutStore.LayoutStore.getModals();
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.View, {
+      testID: "MODALS",
+      children: children.map((child) => {
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_LayoutComponent.LayoutComponent, {
+          layoutNode: child
+        }, child.nodeId);
+      })
+    });
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Modals
+});

package/lib/cjs/Mock/Components/NavigationButton.js

@@ -0,0 +1,104 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var NavigationButton_exports = {};
+__export(NavigationButton_exports, {
+  NavigationButton: () => NavigationButton
+});
+module.exports = __toCommonJS(NavigationButton_exports);
+var import_react = __toESM(require("react"), 1);
+var import_react_native = require("@ohos-ports/react-native");
+var import_react_native_navigation = require("react-native-navigation");
+var import_EventsStore = require("../Stores/EventsStore.js");
+var import_jsx_runtime = require("react/jsx-runtime");
+const NavigationButton = class extends import_react.Component {
+  ref = void 0;
+  render() {
+    const {
+      button,
+      componentId
+    } = this.props;
+    if (button.component) return this.renderButtonComponent();
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.Button, {
+      testID: button.testID,
+      title: button.text || "",
+      disabled: button.enabled === false,
+      onPress: () => button.enabled !== false && import_EventsStore.events.invokeNavigationButtonPressed({
+        buttonId: button.id,
+        componentId
+      })
+    }, button.id);
+  }
+  renderButtonComponent() {
+    const {
+      button,
+      componentId
+    } = this.props;
+    const buttonComponentId = button.component.componentId;
+    const ComponentClass = import_react_native_navigation.Navigation.mock.store.getComponentClassForName(button.component.name);
+    if (!ComponentClass) {
+      throw new Error(`Cannot find registered component for: ${button.component?.name}`);
+    }
+    const ButtonComponent = ComponentClass();
+    const props = import_react_native_navigation.Navigation.mock.store.getPropsForId(buttonComponentId);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.TouchableOpacity, {
+      onPress: () => {
+        if (this.ref) {
+          this.invokeOnClick(
+            // @ts-ignore
+            (this.ref._reactInternalFiber || this.ref._reactInternals).return.stateNode
+          );
+        }
+        import_EventsStore.events.invokeNavigationButtonPressed({
+          buttonId: button.id,
+          componentId
+        });
+      },
+      testID: button.testID,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonComponent, {
+        ...props,
+        componentId: buttonComponentId,
+        ref: (ref) => this.ref = ref
+      }, buttonComponentId)
+    });
+  }
+  invokeOnClick(stateNode) {
+    if (stateNode.children) {
+      stateNode.children.forEach((instance) => {
+        if (instance.internalInstanceHandle && instance.internalInstanceHandle.stateNode.props.onClick) {
+          instance.internalInstanceHandle.stateNode.props.onClick();
+        }
+        this.invokeOnClick(instance);
+      });
+    }
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  NavigationButton
+});

package/lib/cjs/Mock/Components/Overlays.js

@@ -0,0 +1,57 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Overlays_exports = {};
+__export(Overlays_exports, {
+  Overlays: () => Overlays
+});
+module.exports = __toCommonJS(Overlays_exports);
+var import_react = __toESM(require("react"), 1);
+var import_react_native = require("@ohos-ports/react-native");
+var import_constants = require("../constants.js");
+var import_LayoutComponent = require("./LayoutComponent.js");
+var import_LayoutStore = require("../Stores/LayoutStore.js");
+var import_connect = require("../connect.js");
+var import_jsx_runtime = require("react/jsx-runtime");
+const Overlays = (0, import_connect.connect)(class extends import_react.Component {
+  render() {
+    const children = import_LayoutStore.LayoutStore.getOverlays();
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.View, {
+      testID: import_constants.VISIBLE_OVERLAY_TEST_ID,
+      children: children.map((child) => {
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_LayoutComponent.LayoutComponent, {
+          layoutNode: child
+        }, child.nodeId);
+      })
+    });
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Overlays
+});