@apexnative/navigation 1.0.0-alpha.6 → 1.0.0-alpha.8

package/ApexNavigation.podspec

@@ -2,7 +2,8 @@
 # ApexNavigation): the Objective-C++ core and modules under ios/, with the public headers of ios/Public/ApexNavigation
 # (<ApexNavigation/ApexNavigation.h>, <ApexNavigation/ANNAppDelegate.h>, <ApexNavigation/ANNSceneDelegate.h>). Other
 # headers stay private to the pod and are imported by bare name. The C++ of the Fabric components ANNSlot and
-# ANNSafeAreaView is header-only, under ios/cpp, next to the code React Native's codegen makes from src/.
+# ANNSafeAreaView is under ios/cpp, next to the code React Native's codegen makes from src/: headers, and one source
+# file with the store of the slots' measured heights.
 require "json"
 
 package = JSON.parse(File.read(File.join(__dir__, "package.json")))

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # Changelog
 
+## [1.0.0-alpha.8](https://github.com/apexnative/navigation/compare/v1.0.0-alpha.7...v1.0.0-alpha.8) (2026-10-29)
+
+
+### Bug Fixes
+
+* group options reach the screens that show, and the android bar hides as it shows ([#63](https://github.com/apexnative/navigation/issues/63)) ([474ca8a](https://github.com/apexnative/navigation/commit/474ca8aae53e5284d64a5d90dd852fdbdcbabcac))
+* **ios:** overlays and preloaded tabs take the scheme the app set with Appearance.setColorScheme ([#61](https://github.com/apexnative/navigation/issues/61)) ([232d7e0](https://github.com/apexnative/navigation/commit/232d7e038b53cd9656e59c7cfa5cbf0f52f9b587))
+
+## [1.0.0-alpha.7](https://github.com/apexnative/navigation/compare/v1.0.0-alpha.6...v1.0.0-alpha.7) (2026-10-29)
+
+
+### Features
+
+* own android sheet and bar row, ios transitions in core animation, fast refresh of screens ([#56](https://github.com/apexnative/navigation/issues/56)) ([3113b42](https://github.com/apexnative/navigation/commit/3113b42a466f59490faaca181178a7840dab2826))
+
 ## [1.0.0-alpha.6](https://github.com/apexnative/navigation/compare/v1.0.0-alpha.5...v1.0.0-alpha.6) (2026-10-25)
 
 

package/android/CLAUDE.md

@@ -22,8 +22,9 @@ top-level folder. Main thread only, unless a line says otherwise.
   `Variant`, `ThemeColour`); `parsers/` reads them tolerantly from React Native data.
 - `react/`: the way in and out: `NavigationTurboModule`, `CommandRunner`, `CommandAnswer`, `ErrorTexts`,
   `OptionsCommands`, `PendingCalls` (a task behind the calls JavaScript made), `ReloadCoordinator`, `ReactGateway`,
-  `ReactView` (a React root), the stores (`ScreenEnvironment`: a screen's insets, padding, regions and pair state;
-  `Hinge`, `StartInfo`), `ScreenRegions` (measures a screen's regions), `LaunchLink`, `ScrollEvents`.
+  `ReactView` (a React root), `ContentHeights` (content measured without a height limit, through JNI), the stores
+  (`ScreenEnvironment`: a screen's insets, padding, regions and pair state; `Hinge`, `StartInfo`), `ScreenRegions`
+  (measures a screen's regions), `LaunchLink`, `ScrollEvents`.
 - `react/events/`: `AppearanceDispatcher`, `ScreenAppearance`, `EventEmitter`, `EventContract` (made by
   `scripts/contract.mjs`), `NavigationState`, `ComponentType`.
 - `viewcontrollers/viewcontroller/`: `ViewController` (the base of every node), `Presenter`, `IReactView` (what a
@@ -58,7 +59,8 @@ top-level folder. Main thread only, unless a line says otherwise.
   `DevelopmentLog`).
 - `android/src/main/jni/`: `CMakeLists.txt` builds the codegen target with the C++ of `ios/cpp` (the slot's and the
   safe area view's shadow nodes); `ApexNavigationSpec.h` replaces the generated header so autolinking sees their
-  descriptors.
+  descriptors; `ANNContentHeights.cpp` measures React content without a height limit for `react/ContentHeights.kt`
+  (a sheet's `'content'` detent).
 - `android/src/main/res/`: theme `Theme.ApexNavigation` (and `values-night`), `attrs.xml` (splash attributes),
   `ids.xml`, `dimens*.xml`, text colors, icons.
 - `android/src/test/java/…`: unit tests, one package per main package; fakes beside them (`Fakes.kt`,
@@ -80,10 +82,14 @@ top-level folder. Main thread only, unless a line says otherwise.
   preview of a pop during the back gesture (Android 14+): `StackController.BackGesture`, `BackPreview.kt`,
   `stackPoppedByBack` of the layouts; of a sheet's dismissal: `viewcontrollers/modal/SheetBack.kt`,
   `ModalCoordinator.backTargetSheet`, `ModalSheet.BackPreview`.
-- Stack FAB: `viewcontrollers/stack/fab/FabPresenter.kt`, `FabPlan.kt`, `FabPlacement.kt`; `views/stack/fab/`.
+- Stack FAB: `viewcontrollers/stack/fab/FabPresenter.kt`, `FabPlan.kt`, `FabPlacement.kt`, `FabMotion.kt` (how it goes
+  with a transition); `views/stack/fab/` (`FabCopy`: the picture of a FAB that leaves).
 - Top bar (title, buttons, menus, large title): `viewcontrollers/stack/topbar/TopBarPresenter.kt`, `TopBarRoom.kt`,
   `TopBarVisibility.kt`, `BarComponents.kt`, `ButtonPlaces.kt`, `LargeTitleCollapse.kt`, `BarRowTransition.kt`;
-  `views/stack/topbar/TopBar.kt`, `TitleBar.kt`, `titlebar/ButtonBar.kt`, `titlebar/ButtonMenus.kt`.
+  `views/stack/topbar/TopBar.kt`, `TitleBar.kt`, `titlebar/ButtonRow.kt` (the views of a side: back, buttons,
+  magnifier, "⋮"), `titlebar/ButtonBar.kt` (the buttons from the options, "⋮"'s popup), `titlebar/BarButtonView.kt`,
+  `titlebar/BarMenu.kt` (the bar's menus: a `ListPopupWindow` with the theme's popup style and the options' colors),
+  `titlebar/ButtonMenus.kt` (menu options to its items).
 - Search: `viewcontrollers/stack/search/StackSearchPresenter.kt`, `ScreenSearch.kt`, `SearchPanel.kt`;
   `views/stack/topbar/search/`.
 - Tabs: `viewcontrollers/bottomtabs/BottomTabsController.kt`, `BottomTabsPresenter.kt`, `TabSelection.kt`,
@@ -158,9 +164,9 @@ top-level folder. Main thread only, unless a line says otherwise.
 - Native code never touches React Native's views (their children, their layout): Fabric owns and recycles them. Move
   content through `SlotContainers` and `SlotView`, and find views by `nativeID` only through React Native's own search
   or its tag (`ReactR.id.view_tag_native_id`); a transition's elements in one walk per screen (`TransitionViews`).
-- Each step of a transition's element (its move into the layer, its animator, a flight's start and frames in
-  `MoveAnimator`) runs in `elementStep`: an exception skips that element only. A new step of an element goes there
-  too, or one bad element takes the whole transition down.
+- Each step of a transition's element (its start, its animator, a flight's start and frames in `MoveAnimator`) runs
+  in `elementStep`, and the layer draws each copy on its own: an exception skips that element only. A new step of an
+  element goes there too, or one bad element takes the whole transition down.
 - Every change of a stack's children goes through its `StackQueue`; a direct change of `shown` or of the container
   skips the table that decides interrupts and answers.
 - Every event of an appearance goes through `AppearanceDispatcher`. A container with its own loop of
@@ -200,8 +206,11 @@ top-level folder. Main thread only, unless a line says otherwise.
 - The bar measures to its children: a picture laid into it for a transition that is taller than the bar the incoming
   screen gives holds the bar at that height to the end (the row's picture of a pop from a large title). What doesn't
   stay in the bar rides with the leaving screen (`TopBarPresenter.pictureUnderRow`).
-- A `Toolbar` centers its navigation button and its menu in `min(minimumHeight, height)` (`buttonGravity` is top):
-  the row's toolbars take the row's height as their minimum (`TitleBar`); 0 pins the buttons to the row's top.
+- The bar's buttons are plain views of the row (`ButtonRow`), not a toolbar's menu: a button keeps its view while its id
+  stays, and its `testID` is set when it is bound. They copy a Material 3 toolbar's look through the theme's
+  attributes (`actionButtonStyle`, `actionMenuTextAppearance`, `actionOverflowButtonStyle`,
+  `toolbarNavigationButtonStyle`) and its `maxButtonHeight` of 56 dp; the count of places is AppCompat's
+  (`ButtonPlaces.maxActionButtons`).
 - A screen's overlay is clipped to the screen, and a screen without a large title is laid out under the bar (its `top`
   is the bar's height): a picture of the bar in its overlay doesn't show. The bar's picture in a transition of the
   stack's own is drawn by the stack's view with the screen's transform (`StackLayout.barTravels`).

package/android/CORE.md

@@ -207,8 +207,9 @@ Modules are the feature classes that plug into the core through its contract (th
   custom row (`BottomTabsCustomRowOptions`).
 - **Views and helpers:** tabs bar (`BottomTabs`, `BottomTabItem`, `BottomTabsCollapseBehavior`, `scrollToTop`), slots
   (`SlotHost`, `SlotView`, `SlotContainers`), safe area (`SafeAreaView`), native screens (`nativescreen/`), splash
-  (`splash/`), animations (`FadeThrough`, `SystemTransition`, `TransitionTargets`, three element animators), utils
-  (`MaterialTheme`, `NavigationLog`, `awaitBarComponents`, `whenDrawn`).
+  (`splash/`), animations (`FadeThrough`, `SystemTransition`, `TransitionTargets`, the copies of shared elements:
+  `TextMorph`, `ViewMorph`, `ImageMorph`), utils (`MaterialTheme`, `NavigationLog`, `awaitBarComponents`,
+  `whenDrawn`).
 - **Stores and singletons:** a screen's environment (`ScreenEnvironment`: its insets and padding, its regions as
   `ScreenRegions` measures them, its pair state), the window (`Hinge`, `WindowFolds`), links (`LaunchLink`,
   `StartInfo`), events (`NavigationState`), commands (`BackCallbackState`), stack (`PreparedFrame`).

package/android/consumer-rules.pro

@@ -1,2 +1,8 @@
 # The native screens `npx apex-navigation codegen` lists in the app: the navigation finds the list by its name.
 -keep class dev.apexnative.navigation.generated.ApexNavigationGeneratedScreens { *; }
+
+# The library's C++ measures a React root's content through the surface's handler, which it reads by this getter's
+# name (`android/src/main/jni/ANNContentHeights.cpp`).
+-keepclassmembers class com.facebook.react.runtime.ReactSurfaceImpl {
+    com.facebook.react.fabric.SurfaceHandlerBinding getSurfaceHandler();
+}

package/android/src/main/java/dev/apexnative/navigation/options/BottomTabOptions.kt

@@ -105,7 +105,7 @@ class BottomTabOptions {
     @JvmField var textColor: ThemeColour = NullThemeColour()
     @JvmField var selectedIconColor: ThemeColour = NullThemeColour()
     @JvmField var selectedTextColor: ThemeColour = NullThemeColour()
-    @JvmField var font = FontOptions()
+    @ReadFromParent @JvmField var font = FontOptions()
     @JvmField var fontSize: Fraction = NullFraction()
     @JvmField var selectedFontSize: Fraction = NullFraction()
     @JvmField var iconInsets = IconInsetsOptions()

package/android/src/main/java/dev/apexnative/navigation/options/ButtonOptions.kt

@@ -31,7 +31,7 @@ class ButtonOptions(@JvmField var id: Text = NullText()) {
     @JvmField var systemItem: Text = NullText()
     @JvmField var text: Text = NullText()
     @JvmField var accessibilityLabel: Text = NullText()
-    @JvmField var font = FontOptions()
+    @ReadFromParent @JvmField var font = FontOptions()
     @JvmField var fontSize: Fraction = NullFraction()
     @JvmField var enabled: Bool = NullBool()
     @JvmField var disableIconTint: Bool = NullBool()

package/android/src/main/java/dev/apexnative/navigation/options/LargeTitleOptions.kt

@@ -22,7 +22,7 @@ class LargeTitleOptions {
     @JvmField var collapseOnScroll: Bool = NullBool()
     @JvmField var fontSize: Fraction = NullFraction()
     @JvmField var color: ThemeColour = NullThemeColour()
-    @JvmField var font = FontOptions()
+    @ReadFromParent @JvmField var font = FontOptions()
 
     /**
      * When the large title shows: [ALWAYS], [NEVER] or [AUTOMATIC], as on the screen below. `displayMode` over

package/android/src/main/java/dev/apexnative/navigation/options/LayoutAnimation.kt

@@ -9,7 +9,7 @@ import com.facebook.react.bridge.ReadableMap
  * first).
  */
 open class LayoutAnimation(
-    @JvmField var sharedElements: SharedElements = SharedElements(),
+    @OptionKey("sharedElementTransitions") @JvmField var sharedElements: SharedElements = SharedElements(),
     @JvmField var elementTransitions: ElementTransitions = ElementTransitions(),
 ) {
     open fun hasValue(): Boolean = sharedElements.hasValue() || elementTransitions.hasValue()

package/android/src/main/java/dev/apexnative/navigation/options/OptionKey.kt

@@ -0,0 +1,18 @@
+package dev.apexnative.navigation.options
+
+/**
+ * The JSON key of an option field whose name is not that key (`topBar.backButton` is `TopBarButtons.back`), for the
+ * paths of [OptionPaths]; also the flag that tells a value is given, which goes with it. A field without it answers to
+ * its own name.
+ */
+@Target(AnnotationTarget.FIELD)
+@Retention(AnnotationRetention.RUNTIME)
+annotation class OptionKey(val name: String)
+
+/**
+ * A group the reader takes from the object of the group that holds it, not from a key of its own (the font of a text,
+ * the top bar's buttons): for the paths of [OptionPaths] its fields answer to the keys of that object.
+ */
+@Target(AnnotationTarget.FIELD)
+@Retention(AnnotationRetention.RUNTIME)
+annotation class ReadFromParent

package/android/src/main/java/dev/apexnative/navigation/options/OptionPaths.kt

@@ -0,0 +1,91 @@
+package dev.apexnative.navigation.options
+
+import dev.apexnative.navigation.options.params.Param
+import dev.apexnative.navigation.options.params.ThemeColour
+import java.lang.reflect.Field
+import java.lang.reflect.Modifier
+import java.util.concurrent.ConcurrentHashMap
+
+/**
+ * The options at a JSON key path, the keys of the options joined with dots (`topBar.subtitle`, `bottomTab.badge`), as
+ * the readers parse them: `clearOptions` takes them out of a node's own options. Generic over the whole tree, by
+ * reflection on the fields of the groups: a field answers to the key of its name, or of its [OptionKey]; a group the
+ * reader takes from the object of its parent ([ReadFromParent]: the font of a text, the top bar's buttons) answers with
+ * its fields to the keys of that object. A group is a class with a `mergeWith` of its own class; anything else (a
+ * value, a color, a list, a button menu) ends a path.
+ */
+internal object OptionPaths {
+    /**
+     * What a path names: the fields of [group] that answer to its last key, [members] (one, or a value and the flag
+     * that tells it is given, as `modal.sheet.largestUndimmedDetent`).
+     */
+    class Place(val group: Any, val members: List<Field>) {
+        /** The value at the path, of the first field. */
+        val value: Any? get() = members.first().get(group)
+    }
+
+    // The fields of each class walked, its superclasses' first.
+    private val fieldsOfType = ConcurrentHashMap<Class<*>, List<Field>>()
+
+    /**
+     * Takes the value at [path] out of [options], which it changes in place: the field gets the value a freshly made
+     * group has for it (unset; a group, an empty one). Whether the path names a field; an empty or unknown path, or
+     * one that goes on inside a value (a side of a color), changes nothing.
+     */
+    fun clear(options: Options, path: String): Boolean {
+        val place = find(options, path) ?: return false
+        val fresh = newGroup(place.group.javaClass) ?: return false
+        place.members.forEach { it.set(place.group, it.get(fresh)) }
+        return true
+    }
+
+    /** The fields [path] names in [options]; none for an empty or unknown path or one inside a value. */
+    fun find(options: Options, path: String): Place? {
+        val keys = path.split('.')
+        if (keys.any(String::isEmpty)) return null
+        var group: Any = options
+        for (key in keys.dropLast(1)) {
+            group = fieldOf(group, key)?.value?.takeIf(::isGroup) ?: return null
+        }
+        return fieldOf(group, keys.last())?.takeIf { newGroup(it.group.javaClass) != null }
+    }
+
+    // The fields of [group] that answer to [key]: its own, else those of a group read from the same object.
+    private fun fieldOf(group: Any, key: String): Place? {
+        val fields = fieldsOf(group.javaClass)
+        fields.filter { !it.isAnnotationPresent(ReadFromParent::class.java) && keyOf(it) == key }
+            .takeIf { it.isNotEmpty() }
+            ?.let { return Place(group, it) }
+        for (field in fields) {
+            if (!field.isAnnotationPresent(ReadFromParent::class.java)) continue
+            val inner = field.get(group)?.takeIf(::isGroup) ?: continue
+            fieldOf(inner, key)?.let { return it }
+        }
+        return null
+    }
+
+    private fun keyOf(field: Field): String = field.getAnnotation(OptionKey::class.java)?.name ?: field.name
+
+    private fun fieldsOf(type: Class<*>): List<Field> = fieldsOfType.getOrPut(type) {
+        generateSequence(type) { it.superclass }
+            .takeWhile { it != Any::class.java }
+            .toList()
+            .asReversed()
+            .flatMap { it.declaredFields.asList() }
+            .filter { !Modifier.isStatic(it.modifiers) && !it.isSynthetic }
+            .onEach { it.isAccessible = true }
+    }
+
+    private fun isGroup(value: Any): Boolean {
+        if (value is Param<*> || value is ThemeColour) return false
+        val type = value.javaClass
+        return type.declaredMethods.any { it.name == "mergeWith" && it.parameterTypes.contentEquals(arrayOf(type)) }
+    }
+
+    // A group as its class makes it, every field unset; none for a class without a constructor of no arguments.
+    private fun newGroup(type: Class<*>): Any? = try {
+        type.getDeclaredConstructor().newInstance()
+    } catch (_: ReflectiveOperationException) {
+        null
+    }
+}

package/android/src/main/java/dev/apexnative/navigation/options/SheetOptions.kt

@@ -12,25 +12,28 @@ import dev.apexnative.navigation.options.parsers.FractionParser
 import dev.apexnative.navigation.options.parsers.TextParser
 
 /**
- * A height a sheet stops at: about half the screen, the full height, or a height in dp. `content` stops at half the
- * screen on Android: the Material sheet has no height of its content.
+ * A height a sheet stops at: about half the screen, the full height, the height of the screen's content, or a height in
+ * dp.
  */
 sealed class SheetDetent {
     object Medium : SheetDetent()
     object Large : SheetDetent()
+    object Content : SheetDetent()
     data class Height(val dp: Double) : SheetDetent()
 
     /** The detent as the app names it, in `sheetDetentChanged`. */
     fun toValue(): Any = when (this) {
         Medium -> "medium"
         Large -> "large"
+        Content -> "content"
         is Height -> dp
     }
 
     companion object {
         fun parse(value: Any?): SheetDetent? = when (value) {
-            "medium", "content" -> Medium
+            "medium" -> Medium
             "large" -> Large
+            "content" -> Content
             // A number is a height only when it is finite and positive.
             is Number -> value.toDouble().takeIf { it.isFinite() && it > 0 }?.let { Height(it) }
             else -> null
@@ -47,7 +50,7 @@ class SheetOptions {
     @JvmField var selectedDetent: SheetDetent? = null
     @JvmField var largestUndimmedDetent: SheetDetent? = null
     /** The options give `largestUndimmedDetent`, `null` included. */
-    @JvmField var hasLargestUndimmedDetent = false
+    @OptionKey("largestUndimmedDetent") @JvmField var hasLargestUndimmedDetent = false
     @JvmField var grabber: Bool = NullBool()
     @JvmField var expandsOnScroll: Bool = NullBool()
     @JvmField var cornerRadius: Fraction = NullFraction()

package/android/src/main/java/dev/apexnative/navigation/options/TitleOptions.kt

@@ -22,7 +22,7 @@ class TitleOptions {
     @JvmField var text: Text = NullText()
     @JvmField var fontSize: Fraction = NullFraction()
     @JvmField var color: ThemeColour = NullThemeColour()
-    @JvmField var font = FontOptions()
+    @ReadFromParent @JvmField var font = FontOptions()
     @JvmField var component = TitleComponentOptions()
     /** Shared between copies, as its module wants. */
     @JvmField var menu: ButtonMenuOptions? = null
@@ -98,7 +98,7 @@ class SubtitleOptions {
     @JvmField var text: Text = NullText()
     @JvmField var fontSize: Fraction = NullFraction()
     @JvmField var color: ThemeColour = NullThemeColour()
-    @JvmField var font = FontOptions()
+    @ReadFromParent @JvmField var font = FontOptions()
     @JvmField var alignment: Text = NullText()
 
     fun hasValue(): Boolean =

package/android/src/main/java/dev/apexnative/navigation/options/TopBarAppearanceOptions.kt

@@ -109,7 +109,7 @@ class TopBarBackgroundOptions {
  */
 class ScrollEdgeAppearanceTitleOptions {
     @JvmField var color: ThemeColour = NullThemeColour()
-    @JvmField var font = FontOptions()
+    @ReadFromParent @JvmField var font = FontOptions()
     @JvmField var fontSize: Fraction = NullFraction()
 
     fun hasValue(): Boolean = color.hasValue() || font.hasValue() || fontSize.hasValue()

package/android/src/main/java/dev/apexnative/navigation/options/TopBarOptions.kt

@@ -34,12 +34,14 @@ class TopBarOptions {
     @JvmField var rightButtonDisabledColor: ThemeColour = NullThemeColour()
     @JvmField var centerButtonColor: ThemeColour = NullThemeColour()
     @JvmField var centerButtonDisabledColor: ThemeColour = NullThemeColour()
+    @JvmField var menuBackgroundColor: ThemeColour = NullThemeColour()
+    @JvmField var menuTextColor: ThemeColour = NullThemeColour()
     @JvmField var drawBehind: Bool = NullBool()
     @JvmField var testID: Text = NullText()
     @JvmField var title = TitleOptions()
     @JvmField var subtitle = SubtitleOptions()
     /** `backButton`, `leftButtons`, `rightButtons`, `centerButtons`. */
-    @JvmField var buttons = TopBarButtons()
+    @ReadFromParent @JvmField var buttons = TopBarButtons()
     @JvmField var customizationId: Text = NullText()
     /** Shared between copies, as its module wants. */
     @JvmField var overflowMenu: ButtonMenuOptions? = null
@@ -63,7 +65,8 @@ class TopBarOptions {
         hideOnTap.hasValue() || hideOnKeyboard.hasValue() || leftButtonColor.hasValue() ||
         rightButtonColor.hasValue() || leftButtonBackgroundColor.hasValue() || rightButtonBackgroundColor.hasValue() ||
         leftButtonDisabledColor.hasValue() || rightButtonDisabledColor.hasValue() || centerButtonColor.hasValue() ||
-        centerButtonDisabledColor.hasValue() || drawBehind.hasValue() || testID.hasValue() || title.hasValue() ||
+        centerButtonDisabledColor.hasValue() || menuBackgroundColor.hasValue() || menuTextColor.hasValue() ||
+        drawBehind.hasValue() || testID.hasValue() || title.hasValue() ||
         subtitle.hasValue() || buttons.hasValue() || customizationId.hasValue() || overflowMenu != null ||
         verticalBarKeeps.hasValue() || background.hasValue() || scrollEdgeAppearance.hasValue() ||
         barStyle.hasValue() || style.hasValue() || noBorder.hasValue() || searchBar.hasAnyValue() ||
@@ -85,6 +88,8 @@ class TopBarOptions {
         rightButtonDisabledColor = rightButtonDisabledColor.mergeWith(other.rightButtonDisabledColor)
         centerButtonColor = centerButtonColor.mergeWith(other.centerButtonColor)
         centerButtonDisabledColor = centerButtonDisabledColor.mergeWith(other.centerButtonDisabledColor)
+        menuBackgroundColor = menuBackgroundColor.mergeWith(other.menuBackgroundColor)
+        menuTextColor = menuTextColor.mergeWith(other.menuTextColor)
         if (other.drawBehind.hasValue()) drawBehind = other.drawBehind
         if (other.testID.hasValue()) testID = other.testID
         title.mergeWith(other.title)
@@ -127,6 +132,8 @@ class TopBarOptions {
         rightButtonDisabledColor = rightButtonDisabledColor.withDefault(defaults.rightButtonDisabledColor)
         centerButtonColor = centerButtonColor.withDefault(defaults.centerButtonColor)
         centerButtonDisabledColor = centerButtonDisabledColor.withDefault(defaults.centerButtonDisabledColor)
+        menuBackgroundColor = menuBackgroundColor.withDefault(defaults.menuBackgroundColor)
+        menuTextColor = menuTextColor.withDefault(defaults.menuTextColor)
         if (!drawBehind.hasValue()) drawBehind = defaults.drawBehind
         if (!testID.hasValue()) testID = defaults.testID
         title.mergeWithDefault(defaults.title)
@@ -178,6 +185,8 @@ class TopBarOptions {
             options.rightButtonDisabledColor = ThemeColour.parse(context, map, "rightButtonDisabledColor")
             options.centerButtonColor = ThemeColour.parse(context, map, "centerButtonColor")
             options.centerButtonDisabledColor = ThemeColour.parse(context, map, "centerButtonDisabledColor")
+            options.menuBackgroundColor = ThemeColour.parse(context, map, "menuBackgroundColor")
+            options.menuTextColor = ThemeColour.parse(context, map, "menuTextColor")
             options.drawBehind = BoolParser.parse(map, "drawBehind")
             options.testID = TextParser.parse(map, "testID")
             options.title = map.group("title") { TitleOptions.parse(context, it) }
@@ -212,13 +221,13 @@ class TopBarOptions {
  * don't give it; `[]` takes the buttons of the layers below away.
  */
 class TopBarButtons {
-    @JvmField var back = BackButtonOptions()
+    @OptionKey("backButton") @JvmField var back = BackButtonOptions()
     /** `topBar.leftButtons`; null when the options don't give them. */
-    @JvmField var left: List<ButtonOptions>? = null
+    @OptionKey("leftButtons") @JvmField var left: List<ButtonOptions>? = null
     /** `topBar.rightButtons`; null when the options don't give them. */
-    @JvmField var right: List<ButtonOptions>? = null
+    @OptionKey("rightButtons") @JvmField var right: List<ButtonOptions>? = null
     /** `topBar.centerButtons`; null when the options don't give them. */
-    @JvmField var center: List<ButtonOptions>? = null
+    @OptionKey("centerButtons") @JvmField var center: List<ButtonOptions>? = null
 
     fun hasValue(): Boolean = back.hasValue() || left != null || right != null || center != null
 
@@ -263,7 +272,7 @@ class BackButtonOptions {
     @JvmField var showTitle: Bool = NullBool()
     @JvmField var color: ThemeColour = NullThemeColour()
     @JvmField var fontSize: Fraction = NullFraction()
-    @JvmField var font = FontOptions()
+    @ReadFromParent @JvmField var font = FontOptions()
     @JvmField var iconBackground = IconBackgroundOptions()
     @JvmField var testID: Text = NullText()
     @JvmField var enableMenu: Bool = NullBool()

package/android/src/main/java/dev/apexnative/navigation/react/ContentHeights.kt

@@ -0,0 +1,95 @@
+package dev.apexnative.navigation.react
+
+import android.content.Context
+import android.util.Log
+import com.facebook.react.interfaces.fabric.ReactSurface
+import com.facebook.react.internal.featureflags.ReactNativeFeatureFlags
+import com.facebook.react.modules.i18nmanager.I18nUtil
+import com.facebook.react.runtime.ReactSurfaceImpl
+import com.facebook.soloader.SoLoader
+import dev.apexnative.navigation.utils.NavigationLog
+
+/**
+ * The height of React content laid out at a width without a height limit, as iOS measures a sheet's `'content'`
+ * detent: Fabric lays out a copy of the tree, so the shown layout stays as it is. A React root's surface measures
+ * through `SurfaceHandler::measure`; a slot's content in the slot's own layout, once asked for ([requestSlot]), which
+ * keeps the height for [slotHeight] (`ANNSlotContentHeights`, the C++ iOS shares). The native half is the library's
+ * own C++ (`android/src/main/jni`), in the codegen library of its components; when that library doesn't load, nothing
+ * is measured. Main thread.
+ */
+internal object ContentHeights {
+    private const val LIBRARY = "react_codegen_ApexNavigationSpec"
+
+    private val loaded: Boolean by lazy {
+        try {
+            SoLoader.loadLibrary(LIBRARY)
+            true
+        } catch (e: Throwable) {
+            Log.w(NavigationLog.TAG, "[ApexNavigation] $LIBRARY doesn't load: no content is measured", e)
+            false
+        }
+    }
+
+    /**
+     * The height of [surface]'s content at [width] pixels, in pixels, with the layout context the surface lays out
+     * with (`ReactSurfaceImpl.updateLayoutSpecs`); null before the surface runs or renders, or when it can't measure.
+     */
+    fun surfaceHeight(context: Context, surface: ReactSurface, width: Int): Int? {
+        if (width <= 0 || surface !is ReactSurfaceImpl || !loaded) return null
+        val density = context.resources.displayMetrics.density
+        val scalesFont = ReactNativeFeatureFlags.enableFontScaleChangesUpdatingLayout()
+        val fontScale = if (scalesFont) context.resources.configuration.fontScale else 1f
+        val height = try {
+            nativeSurfaceHeight(
+                surface,
+                width / density,
+                density,
+                fontScale,
+                I18nUtil.instance.isRTL(context),
+                I18nUtil.instance.doLeftAndRightSwapInRTL(context),
+            )
+        } catch (e: Throwable) {
+            Log.w(NavigationLog.TAG, "[ApexNavigation] the content of a surface can't be measured", e)
+            return null
+        }
+        return if (height > 0f) Math.round(height * density) else null
+    }
+
+    /** The content of the slot [slotId] is measured from its next layout on. */
+    fun requestSlot(slotId: String) {
+        if (loaded) nativeRequestSlot(slotId)
+    }
+
+    /** The content of the slot [slotId] is measured. */
+    fun isSlotRequested(slotId: String): Boolean = loaded && nativeIsSlotRequested(slotId)
+
+    /** The height of the content of the slot [slotId] at its last layout, in dp; null before it. */
+    fun slotHeight(slotId: String): Float? = if (loaded) nativeSlotHeight(slotId).takeIf { it >= 0f } else null
+
+    /** The screen of the slot [slotId] went: nothing more is measured for it. */
+    fun forgetSlot(slotId: String) {
+        if (loaded) nativeForgetSlot(slotId)
+    }
+
+    @JvmStatic
+    private external fun nativeRequestSlot(slotId: String)
+
+    @JvmStatic
+    private external fun nativeIsSlotRequested(slotId: String): Boolean
+
+    @JvmStatic
+    private external fun nativeSlotHeight(slotId: String): Float
+
+    @JvmStatic
+    private external fun nativeForgetSlot(slotId: String)
+
+    @JvmStatic
+    private external fun nativeSurfaceHeight(
+        surface: ReactSurfaceImpl,
+        width: Float,
+        pointScale: Float,
+        fontScale: Float,
+        rtl: Boolean,
+        swapLeftAndRight: Boolean,
+    ): Float
+}

package/android/src/main/java/dev/apexnative/navigation/react/ContentMounts.kt

@@ -0,0 +1,66 @@
+package dev.apexnative.navigation.react
+
+import com.facebook.react.bridge.UIManager
+import com.facebook.react.bridge.UIManagerListener
+import com.facebook.react.common.annotations.UnstableReactNativeAPI
+import com.facebook.react.uimanager.UIManagerHelper
+import com.facebook.react.uimanager.common.UIManagerType
+import dev.apexnative.navigation.NavigationApplication
+
+/**
+ * The handlers of a screen's content that hear each mount of Fabric (`IReactView.setOnContentMounted`), by key, while
+ * [hears] holds (the content is in a window and not destroyed). Fabric tells every mount of the app, on the main
+ * thread, not those of one surface: the handlers measure and compare, so a mount elsewhere costs only that. It listens
+ * only while a handler waits. Main thread only.
+ */
+internal class ContentMounts(private val hears: () -> Boolean) {
+    private val handlers = LinkedHashMap<String, Runnable>()
+    // The UI manager that tells the mounts; none while no handler waits.
+    private var uiManager: UIManager? = null
+
+    // React Native marks the listener unstable; it is the one place that tells a mount.
+    @OptIn(UnstableReactNativeAPI::class)
+    private val listener = object : UIManagerListener {
+        override fun willDispatchViewUpdates(uiManager: UIManager) = Unit
+
+        override fun willMountItems(uiManager: UIManager) = Unit
+
+        override fun didMountItems(uiManager: UIManager) {
+            if (hears()) run()
+        }
+
+        override fun didDispatchMountItems(uiManager: UIManager) = Unit
+
+        override fun didScheduleMountItems(uiManager: UIManager) = Unit
+    }
+
+    /** [handler] runs after each mount under [key]; null removes the handler of [key]. */
+    fun set(key: String, handler: Runnable?) {
+        if (handler == null) handlers.remove(key) else handlers[key] = handler
+        if (handlers.isEmpty()) stop() else start()
+    }
+
+    /** Runs the handlers now: a mount the content tells itself. */
+    fun run() = handlers.values.toList().forEach(Runnable::run)
+
+    /** The content goes: no handler runs again. */
+    fun clear() {
+        handlers.clear()
+        stop()
+    }
+
+    @OptIn(UnstableReactNativeAPI::class)
+    private fun start() {
+        if (uiManager != null) return
+        val reactContext = NavigationApplication.instanceOrNull?.reactGatewayOrNull?.currentReactContext ?: return
+        uiManager = UIManagerHelper.getUIManager(reactContext, UIManagerType.FABRIC)?.also {
+            it.addUIManagerEventListener(listener)
+        }
+    }
+
+    @OptIn(UnstableReactNativeAPI::class)
+    private fun stop() {
+        uiManager?.removeUIManagerEventListener(listener)
+        uiManager = null
+    }
+}

package/android/src/main/java/dev/apexnative/navigation/react/NavigationTurboModule.kt

@@ -55,6 +55,10 @@ class NavigationTurboModule(reactContext: ReactApplicationContext) : NativeANNTu
     override fun mergeOptions(componentId: String, options: ReadableMap) =
         optionsCommands.mergeOptions(componentId, options)
 
+    // Development (Fast Refresh): the options an edit took out of a screen that shows; as mergeOptions without one.
+    override fun clearOptions(componentId: String, paths: ReadableArray) =
+        optionsCommands.clearOptions(componentId, paths)
+
     override fun push(commandId: String, componentId: String, layout: ReadableMap, promise: Promise) {
         val what = "push the screen '${LayoutReader.idOf(layout)}'"
         runner.run(