Skip to content

docs: housekeeping #273

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
artus9033 merged 5 commits into from
Mar 14, 2026
Merged

docs: housekeeping #273

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
db88c94
docs: update outdated packaging info
artus9033 Mar 14, 2026
a391a59
chore: typo in comment
artus9033 Mar 14, 2026
1c0b49a
fix(docs): update documentation
artus9033 Mar 14, 2026
23a5e89
docs: compatibility between Brownfield 3 and RN 0.83.x
artus9033 Mar 14, 2026
565a94f
chore: fixes after CR
artus9033 Mar 14, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/docs/docs/api-reference/brownfield-navigation.mdx/javascript-usage.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ Rerun codegen if any of these change:
- Method return types

```bash
yarn brownfield:navigation-codegen
npx brownfield navigation:codegen
```

## Common errors
Expand Down
1 change: 0 additions & 1 deletion docs/docs/docs/api-reference/brownie/codegen.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,6 @@ The generated struct:
- Conforms to `BrownieStoreProtocol` with auto-generated `storeName`
- Uses mutable `var` properties


## How It Works

1. CLI recursively finds all `*.brownie.ts` files
Expand Down
7 changes: 5 additions & 2 deletions docs/docs/docs/api-reference/brownie/getting-started.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,21 +73,24 @@ The CLI generates native types and builds everything into XCFrameworks:
npx brownfield package:ios --scheme YourScheme --configuration Release
```

This produces the following in `ios/.brownfield/package/`:
This produces the following in `ios/.brownfield/package/build/`:

- `YourScheme.xcframework` - Your React Native module
- `Brownie.xcframework` - Shared state library
- `ReactBrownfield.xcframework` - Brownfield integration
- `BrownfieldNavigation.xcframework` - Brownfield navigation integration
- `hermesvm.xcframework` - JavaScript engine (or `hermes.xcframework` for RN < 0.82.0)

The `ios/.brownfield/build/` directory contains the build cache.
Comment thread
artus9033 marked this conversation as resolved.

:::info
The `package:ios` command automatically runs `brownfield codegen` to generate Swift types from your `.brownie.ts` files.
:::

## Step 5: Add Frameworks to Native App

1. Open your native Xcode project
2. Drag all XCFrameworks from `ios/.brownfield/package/` into your project
2. Drag all XCFrameworks from `ios/.brownfield/package/build/` into your project
3. In target settings → **General** → **Frameworks, Libraries, and Embedded Content**, set all to **Embed & Sign**

## Step 6: Register Store in Swift
Expand Down
25 changes: 18 additions & 7 deletions docs/docs/docs/api-reference/react-native-brownfield/java.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -158,12 +158,11 @@ ReactNativeBrownfield.getShared()

Creates a React Native view with a given module name. It automatically uses an instance of React Native created in `initialize` method. This is useful when embedding React Native views directly in your native layouts.

| Param | Required | Type | Description |
| ------------- | -------- | ------------------ | ---------------------------------------------------------- |
| context | Yes | `Context` | Android context to create the view |
| activity | No | `FragmentActivity` | Activity hosting the view, used for lifecycle management |
| moduleName | Yes | `String` | Name of React Native component registered to `AppRegistry` |
| launchOptions | No | `Bundle` | Initial properties to be passed to React Native component |
| Param | Required | Type | Description |
| ------------- | -------- | ------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------- |
| activity | No | `FragmentActivity` | Activity hosting the view, used for lifecycle management. Required for proper lifecycle; may be null only when using a custom `ReactDelegateWrapper`. |
| moduleName | Yes | `String` | Name of React Native component registered to `AppRegistry` |
| launchOptions | No | `Bundle` | Initial properties to be passed to React Native component |

Comment thread
artus9033 marked this conversation as resolved.
Outdated
Returns: `FrameLayout` - A view containing the React Native component.

Expand All @@ -172,13 +171,25 @@ Returns: `FrameLayout` - A view containing the React Native component.
```java
// In a Fragment or Activity
FrameLayout reactView = ReactNativeBrownfield.getShared().createView(
context,
activity,
"ReactNative"
);
container.addView(reactView);
```

```java
// With initial properties
Bundle props = new Bundle();
props.putInt("score", 12);
FrameLayout reactView = ReactNativeBrownfield.getShared().createView(
activity,
"ReactNative",
null,
props
);
container.addView(reactView);
```

##### `postMessage`

Send a JSON string to the React Native JS layer. The message is delivered as a `brownfieldMessage` DeviceEventEmitter event and can be received using `ReactNativeBrownfield.onMessage()` on the JS side.
Expand Down
8 changes: 4 additions & 4 deletions docs/docs/docs/api-reference/react-native-brownfield/javascript.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,14 +37,14 @@ ReactNativeBrownfield.setNativeBackGestureAndButtonEnabled(true);
A method to pop to native screen used to push React Native experience.

```ts
ReactNativeBrownfield.popToNative(animated: boolean);
ReactNativeBrownfield.popToNative(animated?: boolean);
```

**Parameters:**

| Param | Type | Description |
| -------- | --------- | -------------------------------------------- |
| animated | `boolean` | Whether to animate the transition (iOS only) |
| Param | Type | Description |
| -------- | --------- | --------------------------------------------------------------------------------------- |
| animated | `boolean` | Optional. Whether to animate the transition (iOS only). Defaults to `false` on Android. |
Comment thread
artus9033 marked this conversation as resolved.
Outdated

**Example:**

Expand Down
27 changes: 18 additions & 9 deletions docs/docs/docs/api-reference/react-native-brownfield/kotlin.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -137,12 +137,11 @@ ReactNativeBrownfield.shared

Creates a React Native view with a given module name. It automatically uses an instance of React Native created in `initialize` method. This is useful when embedding React Native views directly in your native layouts or Jetpack Compose UI.

| Param | Required | Type | Description |
| ------------- | -------- | ------------------ | ---------------------------------------------------------- |
| context | Yes | `Context` | Android context to create the view |
| activity | No | `FragmentActivity` | Activity hosting the view, used for lifecycle management |
| moduleName | Yes | `String` | Name of React Native component registered to `AppRegistry` |
| launchOptions | No | `Bundle` | Initial properties to be passed to React Native component |
| Param | Required | Type | Description |
| ------------- | -------- | ------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------- |
| activity | No | `FragmentActivity` | Activity hosting the view, used for lifecycle management. Required for proper lifecycle; may be null only when using a custom `ReactDelegateWrapper`. |
| moduleName | Yes | `String` | Name of React Native component registered to `AppRegistry` |
| launchOptions | No | `Bundle` | Initial properties to be passed to React Native component |
Comment thread
artus9033 marked this conversation as resolved.
Outdated

Returns: `FrameLayout` - A view containing the React Native component.

Expand All @@ -151,18 +150,28 @@ Returns: `FrameLayout` - A view containing the React Native component.
```kotlin
// In a Fragment or Activity
val reactView = ReactNativeBrownfield.shared.createView(
context,
activity,
"ReactNative"
)
container.addView(reactView)
```

```kotlin
// With initial properties
val props = Bundle().apply { putInt("score", 12) }
val reactView = ReactNativeBrownfield.shared.createView(
activity,
"ReactNative",
launchOptions = props
)
container.addView(reactView)
```

```kotlin
// With Jetpack Compose
AndroidView(
factory = { context ->
ReactNativeBrownfield.shared.createView(context, fragmentActivity, "ReactNative")
factory = {
ReactNativeBrownfield.shared.createView(fragmentActivity, "ReactNative")
},
modifier = Modifier.fillMaxSize()
)
Expand Down
36 changes: 20 additions & 16 deletions docs/docs/docs/api-reference/react-native-brownfield/objective-c.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,12 +28,12 @@ A singleton that keeps an instance of `ReactNativeBrownfield` object.

#### Properties

| Property | Type | Default | Description |
| ------------------ | ---------- | --------------- | --------------------------------------------------------- |
| `entryFile` | `NSString` | `index` | Path to JavaScript root. |
| `fallbackResource` | `NSString` | `nil` | Path to bundle fallback resource. |
| `bundlePath` | `NSString` | `main.jsbundle` | Path to bundle fallback resource. |
| `bundle` | `NSBundle` | `Bundle.main` | Bundle instance to lookup the JavaScript bundle resource. |
| Property | Type | Default | Description |
| ------------------- | ------------------ | --------------- | ------------------------------------------------------------------------------ |
| `entryFile` | `NSString` | `index` | Path to JavaScript root. |
| `bundlePath` | `NSString` | `main.jsbundle` | Path to JavaScript bundle file. |
| `bundle` | `NSBundle` | `Bundle.main` | Bundle instance to lookup the JavaScript bundle resource. |
| `bundleURLOverride` | `NSURL *(^)(void)` | `nil` | Dynamic bundle URL provider. When set, overrides default bundle load behavior. |

---

Expand All @@ -43,10 +43,9 @@ A singleton that keeps an instance of `ReactNativeBrownfield` object.

Starts React Native, produces an instance of React Native. You can use it to initialize React Native in your app.

| Param | Required | Type | Description |
| ---------------- | -------- | --------------- | -------------------------------------------------- |
| `onBundleLoaded` | No | `void(^)(void)` | Callback invoked after JS bundle is fully loaded. |
| `launchOptions` | No | `NSDictionary` | Launch options, typically passed from AppDelegate. |
| Param | Required | Type | Description |
| ---------------- | -------- | --------------- | ------------------------------------------------- |
| `onBundleLoaded` | No | `void(^)(void)` | Callback invoked after JS bundle is fully loaded. |

**Examples:**

Expand All @@ -60,12 +59,6 @@ Starts React Native, produces an instance of React Native. You can use it to ini
}];
```

```objc
[[ReactNativeBrownfield shared] startReactNative:^(void){
NSLog(@"React Native started");
}, launchOptions];
```

##### `view`

Creates a React Native view for the specified module name.
Expand All @@ -82,6 +75,17 @@ Creates a React Native view for the specified module name.
UIView *view = [[ReactNativeBrownfield shared] viewWithModuleName:@"ReactNative" initialProps:@{@"score": @12}];
```

##### `application:didFinishLaunchingWithOptions:`

Mirrors the host runtime app delegate API. Call this from your `AppDelegate` if you need to forward launch options to the brownfield runtime (e.g. when using Expo).

| Param | Required | Type | Description |
| --------------- | -------- | ----------------- | -------------------------- |
| `application` | Yes | `UIApplication *` | The application instance. |
| `launchOptions` | No | `NSDictionary *` | Launch options dictionary. |

Returns: `BOOL` – return value is passed through from the runtime.

##### `postMessage`

Send a JSON string to the React Native JS layer. The message is delivered as a `brownfieldMessage` DeviceEventEmitter event.
Expand Down
39 changes: 27 additions & 12 deletions docs/docs/docs/api-reference/react-native-brownfield/swift.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,7 @@ ReactNativeBrownfield.shared
| Property | Type | Default | Description |
| ------------------- | --------------- | --------------- | ---------------------------------------------------------------------------------------------- |
| `entryFile` | `String` | `index` | Path to JavaScript root. |
| `fallbackResource` | `String?` | `nil` | Path to bundle fallback resource. |
| `bundlePath` | `String` | `main.jsbundle` | Path to bundle fallback resource. |
| `bundlePath` | `String` | `main.jsbundle` | Path to JavaScript bundle file. |
| `bundle` | `Bundle` | `Bundle.main` | Bundle instance to lookup the JavaScript bundle resource. |
| `bundleURLOverride` | `(() -> URL?)?` | `nil` | Dynamic bundle URL provider called on every bundle load. When set, overrides default behavior. |

Expand All @@ -44,10 +43,9 @@ ReactNativeBrownfield.shared

Starts React Native. You can use it to initialize React Native in your app.

| Param | Required | Type | Description |
| ---------------- | -------- | --------------------- | -------------------------------------------------- |
| `onBundleLoaded` | No | `(() -> Void)?` | Callback invoked after JS bundle is fully loaded. |
| `launchOptions` | No | `[AnyHashable: Any]?` | Launch options, typically passed from AppDelegate. |
| Param | Required | Type | Description |
| ---------------- | -------- | --------------- | ------------------------------------------------- |
| `onBundleLoaded` | No | `(() -> Void)?` | Callback invoked after JS bundle is fully loaded. |

**Examples:**

Expand All @@ -61,12 +59,6 @@ ReactNativeBrownfield.shared.startReactNative(onBundleLoaded: {
})
```

```swift
ReactNativeBrownfield.shared.startReactNative(onBundleLoaded: {
print("React Native started")
}, launchOptions: launchOptions)
```

##### `view`

Creates a React Native view for the specified module name.
Expand Down Expand Up @@ -105,6 +97,29 @@ let json = try! JSONSerialization.data(withJSONObject: payload)
ReactNativeBrownfield.shared.postMessage(String(data: json, encoding: .utf8)!)
```

##### `application(_:didFinishLaunchingWithOptions:)`

Mirrors the host runtime app delegate API. Call this from your `AppDelegate` if you need to forward `application(_:didFinishLaunchingWithOptions:)` to the brownfield runtime (e.g. when using Expo).

| Param | Required | Type | Description |
| --------------- | -------- | ---------------------------------------- | -------------------------- |
| `application` | Yes | `UIApplication` | The application instance. |
| `launchOptions` | No | `[UIApplication.LaunchOptionsKey: Any]?` | Launch options dictionary. |

Returns: `Bool` – return value is passed through from the runtime.

**Example:**

```swift
func application(
_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
) -> Bool {
ReactNativeBrownfield.shared.application(application, didFinishLaunchingWithOptions: launchOptions)
return true
Comment thread
artus9033 marked this conversation as resolved.
Outdated
}
```

##### `onMessage`

Subscribe to messages sent from JavaScript via `ReactNativeBrownfield.postMessage()`. Returns an observer token that can be used to unsubscribe.
Expand Down
13 changes: 7 additions & 6 deletions docs/docs/docs/cli/brownfield.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,21 +29,22 @@ Available arguments:
| --extra-params | Custom params that will be passed to xcodebuild command |
| --export-extra-params | Custom params that will be passed to xcodebuild export archive command. Example: `--export-extra-params "-allowProvisioningUpdates"` |
| --export-options-plist | Name of the export options file for archiving. Defaults to: `ExportOptions.plist` |
| --build-folder | Location for iOS build artifacts. Corresponds to Xcode's "-derivedDataPath". By default, the '\<iOS project folder>/build' path will be used. |
| --build-folder | Location for iOS build artifacts. Corresponds to Xcode's "-derivedDataPath". By default, the '\<iOS project folder>/.brownfield/build' path will be used. |
| --destination | Define destination(s) for the build. You can pass multiple destinations as separate values or repeated use of the flag. Values: "simulator", "device", or xcodebuild destinations |
| --archive | Create an Xcode archive (IPA) of the build, required for uploading to App Store Connect or distributing to TestFlight |
| --no-install-pods | Skip automatic CocoaPods installation |
| --no-new-arch | Run React Native in legacy async architecture |
| --local | Force local build with xcodebuild |
| --verbose | Enable verbose logging |

The build directory will be placed in the `<iOS project folder>/.brownfield/build` folder by default and the build outputs (XCFrameworks) will be created in the `<iOS project folder>/.brownfield/package` folder:
The build directory will be placed in the `<iOS project folder>/.brownfield/build` folder by default and the build outputs (XCFrameworks) will be created in the `<iOS project folder>/.brownfield/package/build` folder:

- `package/<scheme name>.xcframework`, e.g. in the `apps/RNApp` demo project, the output will be at `apps/RNApp/ios/.brownfield/package/BrownfieldLib.xcframework`.
- `package/hermesvm.xcframework` for RN >= 0.82.0 or `package/hermes.xcframework` otherwise
- `ReactBrownfield.xcframework`
- `package/build/<scheme name>.xcframework`, e.g. in the `apps/RNApp` demo project, the output will be at `apps/RNApp/ios/.brownfield/package/build/BrownfieldLib.xcframework`.
- `package/build/hermesvm.xcframework` for RN >= 0.82.0 or `package/build/hermes.xcframework` otherwise
- `package/build/ReactBrownfield.xcframework`
- `package/build/BrownfieldNavigation.xcframework`

The consumer project needs to embed all 3 frameworks.
When using Brownie or brownfield-navigation, you will also get `Brownie.xcframework` and/or `BrownfieldNavigation.xcframework` in the same folder. The consumer project needs to embed all required frameworks (at least 3: scheme, Hermes, ReactBrownfield).
Comment thread
artus9033 marked this conversation as resolved.
Outdated

## Android

Expand Down
1 change: 0 additions & 1 deletion docs/docs/docs/contributing.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
# Contributing

Checkout project's [CONTRIBUTING.md](https://github.com/callstack/react-native-brownfield/blob/main/CONTRIBUTING.md) for more information.

1 change: 1 addition & 0 deletions docs/docs/docs/getting-started/introduction.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ React Native Brownfield is a library that simplifies integrating React Native in

| Tested React Native Version | React Native Brownfield Version |
| --------------------------- | ------------------------------- |
| 0.83.x | 3.x |
| 0.81.x, 0.82.x | 2.x, 3.x |
| 0.78.x | ^1.2.0 |

Expand Down
Loading
Loading