react-native-screens 5.0.0-alpha.2 → 5.0.0-alpha.4

package/android/src/main/java/com/swmansion/rnscreens/tabs/appearance/TabsAppearanceApplicator.kt

@@ -3,6 +3,8 @@ package com.swmansion.rnscreens.tabs.appearance
 import android.annotation.SuppressLint
 import android.content.Context
 import android.content.res.ColorStateList
+import android.graphics.drawable.Drawable
+import android.graphics.drawable.InsetDrawable
 import android.graphics.drawable.StateListDrawable
 import android.util.TypedValue
 import android.view.MenuItem
@@ -14,14 +16,99 @@ import com.facebook.react.common.assets.ReactFontManager
 import com.facebook.react.uimanager.PixelUtil
 import com.google.android.material.R
 import com.google.android.material.bottomnavigation.BottomNavigationView
+import com.google.android.material.navigation.NavigationBarItemView
 import com.google.android.material.navigation.NavigationBarView
 import com.swmansion.rnscreens.tabs.screen.TabsScreen
+import com.swmansion.rnscreens.utils.dpToPx
+import com.swmansion.rnscreens.utils.pxToDp
 import com.swmansion.rnscreens.utils.resolveColorAttr
 
 @SuppressLint("PrivateResource") // We want to use variables from material design for default values
 internal class TabsAppearanceApplicator(
     private val bottomNavigationView: BottomNavigationView,
 ) {
+    // Resolved on each access: tracks the display density of the current configuration.
+    internal val defaultIconSizeDp: Float
+        get() =
+            bottomNavigationView.pxToDp(
+                bottomNavigationView.resources.getDimension(R.dimen.mtrl_navigation_bar_item_default_icon_size),
+            )
+
+    internal fun effectiveIconSizeDp(tabsScreen: TabsScreen): Float =
+        tabsScreen.appearance?.tabBarItemIconSize?.takeIf { it > 0f } ?: defaultIconSizeDp
+
+    // Material allows only one icon size for all items; iconBoxDp is the largest effective per-tab size.
+    fun applyIconBox(iconBoxDp: Float) {
+        val iconBoxPx = bottomNavigationView.dpToPx(iconBoxDp).toInt()
+        if (bottomNavigationView.itemIconSize != iconBoxPx) {
+            bottomNavigationView.itemIconSize = iconBoxPx
+        }
+    }
+
+    // Resolved on each access: tracks the material library version and the display density.
+    private val defaultIndicatorWidthPx: Int
+        get() = bottomNavigationView.resources.getDimensionPixelSize(R.dimen.m3_bottom_nav_item_active_indicator_width)
+
+    private val defaultIndicatorHeightPx: Int
+        get() = bottomNavigationView.resources.getDimensionPixelSize(R.dimen.m3_bottom_nav_item_active_indicator_height)
+
+    // Auto-scale preserves the themed default padding around the icon: default indicator minus default icon size.
+    private val autoIndicatorHorizontalPaddingDp: Float
+        get() = bottomNavigationView.pxToDp(defaultIndicatorWidthPx.toFloat()) - defaultIconSizeDp
+
+    private val autoIndicatorVerticalPaddingDp: Float
+        get() = bottomNavigationView.pxToDp(defaultIndicatorHeightPx.toFloat()) - defaultIconSizeDp
+
+    internal fun effectiveIndicatorWidthDp(tabsScreen: TabsScreen): Float =
+        tabsScreen.appearance?.tabBarItemActiveIndicatorWidth?.takeIf { it > 0f }
+            ?: (effectiveIconSizeDp(tabsScreen) + autoIndicatorHorizontalPaddingDp)
+
+    internal fun effectiveIndicatorHeightDp(tabsScreen: TabsScreen): Float =
+        tabsScreen.appearance?.tabBarItemActiveIndicatorHeight?.takeIf { it > 0f }
+            ?: (effectiveIconSizeDp(tabsScreen) + autoIndicatorVerticalPaddingDp)
+
+    @SuppressLint("RestrictedApi")
+    private fun applyActiveIndicatorSize(
+        menuItem: MenuItem,
+        tabsScreen: TabsScreen,
+    ): Boolean {
+        val widthPx = bottomNavigationView.dpToPx(effectiveIndicatorWidthDp(tabsScreen)).toInt()
+        val heightPx = bottomNavigationView.dpToPx(effectiveIndicatorHeightDp(tabsScreen)).toInt()
+        val isAlreadyApplied =
+            widthPx == (tabsScreen.appliedActiveIndicatorWidthPx ?: defaultIndicatorWidthPx) &&
+                heightPx == (tabsScreen.appliedActiveIndicatorHeightPx ?: defaultIndicatorHeightPx)
+        if (isAlreadyApplied) {
+            return true
+        }
+        val itemView =
+            bottomNavigationView.menuViewGroup.children.firstOrNull { it.id == menuItem.itemId } as? NavigationBarItemView
+                ?: return false
+        // NavigationBarItemView is restricted Material API. Without it, Material only offers one active
+        // indicator size for the whole tab bar (BottomNavigationView.itemActiveIndicatorWidth/Height).
+        itemView.setActiveIndicatorWidth(widthPx)
+        itemView.setActiveIndicatorHeight(heightPx)
+
+        tabsScreen.appliedActiveIndicatorWidthPx = widthPx
+        tabsScreen.appliedActiveIndicatorHeightPx = heightPx
+
+        return true
+    }
+
+    // Inset the icon so it renders at effectiveDp, centered within iconBoxDp.
+    // Intrinsic-relative on purpose: Material FIT_CENTER-scales the drawable to the icon box,
+    // so the intrinsic factor cancels and the glyph lands at effectiveDp/iconBoxDp of the box.
+    private fun sizeIcon(
+        icon: Drawable?,
+        effectiveDp: Float,
+        iconBoxDp: Float,
+    ): Drawable? {
+        if (icon == null || effectiveDp >= iconBoxDp) return icon
+        val larger = maxOf(icon.intrinsicWidth, icon.intrinsicHeight)
+        if (larger <= 0) return icon
+        val insetPx = (larger * (iconBoxDp - effectiveDp) / (2f * effectiveDp)).toInt()
+        return if (insetPx > 0) InsetDrawable(icon, insetPx) else icon
+    }
+
     private val states =
         arrayOf(
             intArrayOf(-android.R.attr.state_enabled), // disabled
@@ -174,23 +261,32 @@ internal class TabsAppearanceApplicator(
     fun updateMenuItemAppearance(
         menuItem: MenuItem,
         tabsScreen: TabsScreen,
+        iconBoxDp: Float,
     ) {
         if (menuItem.title != tabsScreen.tabTitle) {
             menuItem.title = tabsScreen.tabTitle
         }
 
-        val targetIcon =
-            if (tabsScreen.selectedIcon != null && tabsScreen.icon != null) {
-                StateListDrawable().apply {
-                    addState(intArrayOf(android.R.attr.state_checked), tabsScreen.selectedIcon?.mutate())
-                    addState(intArrayOf(), tabsScreen.icon?.mutate())
+        if (tabsScreen.isMenuItemIconInvalidated) {
+            tabsScreen.isMenuItemIconInvalidated = false
+            // Sized per slot: a StateListDrawable's intrinsic size follows its current state, so a
+            // single inset computed from one child would mis-size the other when their resolutions differ.
+            val effectiveDp = effectiveIconSizeDp(tabsScreen)
+            val iconDrawable = sizeIcon(tabsScreen.icon.drawable, effectiveDp, iconBoxDp)
+            val selectedIconDrawable = sizeIcon(tabsScreen.selectedIcon.drawable, effectiveDp, iconBoxDp)
+            menuItem.icon =
+                if (selectedIconDrawable != null && iconDrawable != null) {
+                    StateListDrawable().apply {
+                        addState(intArrayOf(android.R.attr.state_checked), selectedIconDrawable.mutate())
+                        addState(intArrayOf(), iconDrawable.mutate())
+                    }
+                } else {
+                    iconDrawable
                 }
-            } else {
-                tabsScreen.icon
-            }
+        }
 
-        if (menuItem.icon != targetIcon) {
-            menuItem.icon = targetIcon
+        if (tabsScreen.isMenuItemActiveIndicatorInvalidated && applyActiveIndicatorSize(menuItem, tabsScreen)) {
+            tabsScreen.isMenuItemActiveIndicatorInvalidated = false
         }
     }
 

package/android/src/main/java/com/swmansion/rnscreens/tabs/appearance/TabsAppearanceCoordinator.kt

@@ -4,7 +4,6 @@ import android.content.Context
 import android.view.MenuItem
 import com.google.android.material.bottomnavigation.BottomNavigationView
 import com.swmansion.rnscreens.tabs.container.TabsContainer
-import com.swmansion.rnscreens.tabs.container.menuItemIdForFragmentAtIndex
 import com.swmansion.rnscreens.tabs.screen.TabsScreen
 import com.swmansion.rnscreens.tabs.screen.TabsScreenFragment
 
@@ -14,28 +13,67 @@ internal class TabsAppearanceCoordinator(
 ) {
     private val appearanceApplicator = TabsAppearanceApplicator(bottomNavigationView)
 
+    private var appliedIconBoxDp: Float? = null
+
+    // Icon box is bar-wide: the largest effective size across tabs.
+    internal fun resolveIconBoxDp(): Float {
+        if (tabsScreenFragments.isEmpty()) {
+            return appearanceApplicator.defaultIconSizeDp
+        }
+        var largestIconDp = 0f
+        var tallestIndicatorDp = 0f
+        var shortestIndicatorDp = Float.MAX_VALUE
+        tabsScreenFragments.forEach {
+            largestIconDp = maxOf(largestIconDp, appearanceApplicator.effectiveIconSizeDp(it.tabsScreen))
+            val indicatorHeightDp = appearanceApplicator.effectiveIndicatorHeightDp(it.tabsScreen)
+            tallestIndicatorDp = maxOf(tallestIndicatorDp, indicatorHeightDp)
+            shortestIndicatorDp = minOf(shortestIndicatorDp, indicatorHeightDp)
+        }
+        val unevenIndicatorsOutgrowIcons = tallestIndicatorDp > largestIconDp && tallestIndicatorDp != shortestIndicatorDp
+        return if (unevenIndicatorsOutgrowIcons) tallestIndicatorDp else largestIconDp
+    }
+
+    internal fun invalidateMenuItemIcons() {
+        tabsScreenFragments.forEach { it.tabsScreen.isMenuItemIconInvalidated = true }
+    }
+
+    internal fun invalidateRebuiltMenuItems() {
+        invalidateMenuItemIcons()
+        tabsScreenFragments.forEach {
+            it.tabsScreen.isMenuItemActiveIndicatorInvalidated = true
+            it.tabsScreen.appliedActiveIndicatorWidthPx = null
+            it.tabsScreen.appliedActiveIndicatorHeightPx = null
+        }
+    }
+
     fun updateTabAppearance(
         context: Context,
         tabsContainer: TabsContainer,
     ) {
         val selectedTabAppearance = tabsContainer.selectedTab.tabsScreen.appearance
+        val iconBoxDp = resolveIconBoxDp()
+        if (iconBoxDp != appliedIconBoxDp) {
+            appliedIconBoxDp = iconBoxDp
+            invalidateMenuItemIcons()
+        }
+        appearanceApplicator.applyIconBox(iconBoxDp)
         appearanceApplicator.updateSharedAppearance(context, selectedTabAppearance, tabsContainer.tabBarHidden)
-        updateMenuItems(context, selectedTabAppearance)
+        updateMenuItems(context, selectedTabAppearance, iconBoxDp)
         appearanceApplicator.updateFontStyles(context, selectedTabAppearance) // It needs to be updated after updateMenuItems
     }
 
     private fun updateMenuItems(
         context: Context,
         tabsAppearance: TabsAppearance?,
+        iconBoxDp: Float,
     ) {
-        tabsScreenFragments.forEachIndexed { index, fragment ->
-            val menuItemId = menuItemIdForFragmentAtIndex(index)
+        tabsScreenFragments.forEach { fragment ->
+            val menuItemId = fragment.menuItemId
             val menuItem =
                 checkNotNull(bottomNavigationView.menu.findItem(menuItemId)) {
                     "[RNScreens] Missing MenuItem for id: $menuItemId"
                 }
-            check(menuItem.itemId == menuItemId) { "[RNScreens] Illegal state: menu items are shuffled" }
-            updateMenuItemAppearance(context, menuItem, fragment.tabsScreen, tabsAppearance)
+            updateMenuItemAppearance(context, menuItem, fragment.tabsScreen, tabsAppearance, iconBoxDp)
         }
     }
 
@@ -44,8 +82,9 @@ internal class TabsAppearanceCoordinator(
         menuItem: MenuItem,
         tabsScreen: TabsScreen,
         appearance: TabsAppearance?,
+        iconBoxDp: Float,
     ) {
-        appearanceApplicator.updateMenuItemAppearance(menuItem, tabsScreen)
+        appearanceApplicator.updateMenuItemAppearance(menuItem, tabsScreen, iconBoxDp)
         appearanceApplicator.updateBadgeAppearance(context, menuItem, tabsScreen, appearance)
     }
 }

package/android/src/main/java/com/swmansion/rnscreens/tabs/appearance/TabsAppearanceModel.kt

@@ -8,8 +8,11 @@ internal data class TabsAppearance(
     val selected: ItemStateAppearance? = null,
     val focused: ItemStateAppearance? = null,
     val disabled: ItemStateAppearance? = null,
+    val tabBarItemIconSize: Float? = null,
     val tabBarItemActiveIndicatorColor: Int? = null,
     val tabBarItemActiveIndicatorEnabled: Boolean? = null,
+    val tabBarItemActiveIndicatorWidth: Float? = null,
+    val tabBarItemActiveIndicatorHeight: Float? = null,
     val tabBarItemTitleFontFamily: String? = null,
     val tabBarItemTitleSmallLabelFontSize: Float? = null,
     val tabBarItemTitleLargeLabelFontSize: Float? = null,

package/android/src/main/java/com/swmansion/rnscreens/tabs/container/CustomBottomNavigationView.kt

@@ -2,15 +2,35 @@ package com.swmansion.rnscreens.tabs.container
 
 import android.annotation.SuppressLint
 import android.content.Context
+import androidx.core.view.isVisible
+import com.facebook.react.uimanager.PointerEvents
+import com.facebook.react.uimanager.ReactPointerEventsView
 import com.google.android.material.bottomnavigation.BottomNavigationView
 
 @SuppressLint("ViewConstructor") // Should not be restored & should only be constructed by us.
 class CustomBottomNavigationView(
     context: Context,
     val container: TabsContainer,
-) : BottomNavigationView(context) {
+) : BottomNavigationView(context),
+    ReactPointerEventsView {
     private var actionOrigin: TabsActionOrigin? = null
 
+    /**
+     * The tab bar is hidden by setting its visibility to `GONE`. A `GONE` view is skipped by its
+     * parent's layout pass, so it keeps the bounds it was last laid out with, and Android's own
+     * touch dispatch ignores it (`ViewGroup.canViewReceivePointerEvents` requires `VISIBLE`).
+     *
+     * React Native does not go through Android's dispatch to pick a touch target - it runs its own
+     * hit-test over the native view tree in `TouchTargetHelper`, which only checks bounds. The
+     * retained bounds of the hidden bar therefore keep capturing every touch aimed at the content
+     * laid out underneath it. Declaring [PointerEvents.NONE] while hidden is how a native view opts
+     * out of that hit-test, which brings it back in line with Android's dispatch.
+     *
+     * See https://github.com/software-mansion/react-native-screens/issues/4132.
+     */
+    override val pointerEvents: PointerEvents
+        get() = if (isVisible) PointerEvents.AUTO else PointerEvents.NONE
+
     internal fun setSelectedItemIdWithActionOrigin(
         itemId: Int,
         actionOrigin: TabsActionOrigin,

package/android/src/main/java/com/swmansion/rnscreens/tabs/container/MenuHelpers.kt

@@ -2,30 +2,12 @@ package com.swmansion.rnscreens.tabs.container
 
 import android.view.Menu
 import android.view.MenuItem
-import com.swmansion.rnscreens.tabs.screen.TabsScreen
+import com.swmansion.rnscreens.tabs.screen.TabsScreenFragment
 
-// MenuItem ids are offset by one, because 0 has special meaning in the BottomNavigationMenuView API.
-
-/**
- * Compute MenuItem id for a fragment at given index in "tabsModel" of TabsContainer
- */
-internal fun menuItemIdForFragmentAtIndex(fragmentIndex: Int): Int = fragmentIndex + 1
-
-/**
- * Compute fragment index in "tabsModel" of TabsContainer for a MenuItem with given id.
- */
-internal fun fragmentIndexForMenuItemId(menuItemId: Int): Int {
-    check(menuItemId >= 1) { "[RNScreens] MenuItem id must not be less than 1" }
-    return menuItemId - 1
-}
-
-internal fun Menu.getOrCreateMenuItemForFragmentAt(
-    index: Int,
-    tabsScreen: TabsScreen,
-): MenuItem =
-    this.findItem(menuItemIdForFragmentAtIndex(index)) ?: this.add(
+internal fun Menu.getOrCreateMenuItemForFragment(fragment: TabsScreenFragment): MenuItem =
+    this.findItem(fragment.menuItemId) ?: this.add(
         Menu.NONE,
-        menuItemIdForFragmentAtIndex(index),
+        fragment.menuItemId,
         Menu.NONE,
-        tabsScreen.tabTitle,
+        fragment.tabsScreen.tabTitle,
     )

package/android/src/main/java/com/swmansion/rnscreens/tabs/container/TabsContainer.kt

@@ -24,14 +24,13 @@ import com.swmansion.rnscreens.common.colorscheme.ColorSchemeCoordinator
 import com.swmansion.rnscreens.common.colorscheme.ColorSchemeListener
 import com.swmansion.rnscreens.common.colorscheme.ColorSchemeProviding
 import com.swmansion.rnscreens.common.container.Container
+import com.swmansion.rnscreens.common.container.ContainerItem
 import com.swmansion.rnscreens.common.container.ParentContainerItemRegistry
-import com.swmansion.rnscreens.helpers.FragmentManagerHelper
-import com.swmansion.rnscreens.helpers.ViewFinder
+import com.swmansion.rnscreens.ext.createTransactionWithReordering
 import com.swmansion.rnscreens.helpers.ViewIdGenerator
-import com.swmansion.rnscreens.helpers.createTransactionWithReordering
 import com.swmansion.rnscreens.safearea.EdgeInsets
+import com.swmansion.rnscreens.safearea.OnInterfaceInsetsChangeListener
 import com.swmansion.rnscreens.safearea.SafeAreaProvider
-import com.swmansion.rnscreens.safearea.SafeAreaView
 import com.swmansion.rnscreens.tabs.appearance.TabsAppearanceCoordinator
 import com.swmansion.rnscreens.tabs.host.TabsHost
 import com.swmansion.rnscreens.tabs.host.TabsHostA11yCoordinator
@@ -39,6 +38,7 @@ import com.swmansion.rnscreens.tabs.screen.TabsScreen
 import com.swmansion.rnscreens.tabs.screen.TabsScreenDelegate
 import com.swmansion.rnscreens.tabs.screen.TabsScreenFragment
 import com.swmansion.rnscreens.utils.RNSLog
+import java.lang.ref.WeakReference
 import kotlin.properties.Delegates
 
 /**
@@ -52,6 +52,7 @@ import kotlin.properties.Delegates
 @SuppressLint("ViewConstructor") // Created only by us. Should never be restored.
 class TabsContainer internal constructor(
     private val context: Context,
+    private val delegate: WeakReference<TabsContainerDelegate>,
 ) : FrameLayout(context),
     Container,
     ColorSchemeProviding,
@@ -67,8 +68,7 @@ class TabsContainer internal constructor(
             val selectedTabScreen = this@TabsContainer.selectedTab.tabsScreen
 
             if (selectedTabScreen.shouldUseRepeatedTabSelectionPopToRootSpecialEffect) {
-                val screenStack = ViewFinder.findScreenStackInFirstDescendantChain(selectedTabScreen)
-                if (screenStack != null && screenStack.popToRoot()) {
+                if (selectedTabScreen.resolveNestedContainer()?.requestPopToRoot() == true) {
                     return true
                 }
             }
@@ -160,7 +160,7 @@ class TabsContainer internal constructor(
 
     private val a11yCoordinator = TabsHostA11yCoordinator(bottomNavigationView, tabsModel)
 
-    private var interfaceInsetsChangeListener: SafeAreaView? = null
+    private var interfaceInsetsChangeListener: OnInterfaceInsetsChangeListener? = null
 
     internal var tabBarHidden: Boolean by Delegates.observable(false) { _, oldValue, newValue ->
         if (newValue != oldValue) {
@@ -255,9 +255,9 @@ class TabsContainer internal constructor(
 
     internal fun setupFragmentManager() {
         fragmentManager =
-            checkNotNull(FragmentManagerHelper.findFragmentManagerForView(this)) {
-                "[RNScreens] Nullish fragment manager - can't run container operations"
-            }
+            checkNotNull(delegate.get()) {
+                "[RNScreens] TabsContainer has no delegate to resolve the fragment manager from"
+            }.resolveFragmentManager()
     }
 
     internal fun teardownFragmentManager() {
@@ -372,14 +372,14 @@ class TabsContainer internal constructor(
         }
     }
 
-    override fun setOnInterfaceInsetsChangeListener(listener: SafeAreaView) {
+    override fun setOnInterfaceInsetsChangeListener(listener: OnInterfaceInsetsChangeListener) {
         if (interfaceInsetsChangeListener == null) {
             bottomNavigationView.addOnLayoutChangeListener(this)
         }
         interfaceInsetsChangeListener = listener
     }
 
-    override fun removeOnInterfaceInsetsChangeListener(listener: SafeAreaView) {
+    override fun removeOnInterfaceInsetsChangeListener(listener: OnInterfaceInsetsChangeListener) {
         if (interfaceInsetsChangeListener == listener) {
             interfaceInsetsChangeListener = null
             bottomNavigationView.removeOnLayoutChangeListener(this)
@@ -415,11 +415,23 @@ class TabsContainer internal constructor(
                 menuItem,
                 tabsScreen,
                 appearance,
+                appearanceCoordinator.resolveIconBoxDp(),
             )
             a11yCoordinator.setA11yPropertiesToTabItem(menuItem, tabsScreen)
         }
     }
 
+    override fun onItemSizeChange(tabsScreen: TabsScreen) {
+        // Icon box is bar-wide, so this must run even when the changed tab is not selected.
+        // Skip when detached; reattachment reapplies the full appearance anyway.
+        if (isAttachedToWindow) {
+            invalidationFlags.isNavigationMenuAppearanceInvalidated = true
+            post {
+                this.flushPendingUpdates()
+            }
+        }
+    }
+
     override fun getFragmentForTabsScreen(tabsScreen: TabsScreen): TabsScreenFragment? =
         tabsModel.find {
             it.tabsScreen ===
@@ -492,7 +504,10 @@ class TabsContainer internal constructor(
 
     private fun performSelectedTabUpdate() {
         if (pendingStateUpdateRequest == null) {
-            RNSLog.w(TAG, "TabsContainer::performSelectedTabUpdate called w/o pending operation; skipping update")
+            RNSLog.w(
+                TAG,
+                "TabsContainer::performSelectedTabUpdate called w/o pending operation; skipping update",
+            )
             return
         }
 
@@ -516,7 +531,10 @@ class TabsContainer internal constructor(
         if (bottomNavigationView.selectedItemId != nextSelectedMenuItemId || navState.isEmpty()) {
             isInExternalOperationContext = true
             // This triggers on OnMenuItemClicked callback, where we perform actual update from
-            bottomNavigationView.setSelectedItemIdWithActionOrigin(nextSelectedMenuItemId, stateUpdateRequest.actionOrigin)
+            bottomNavigationView.setSelectedItemIdWithActionOrigin(
+                nextSelectedMenuItemId,
+                stateUpdateRequest.actionOrigin,
+            )
             isInExternalOperationContext = false
         } else {
             observerRegistry.emitOnNavigationStateUpdateRejected(
@@ -530,18 +548,21 @@ class TabsContainer internal constructor(
     }
 
     private fun updateNavigationMenuStructure() {
-        if (bottomNavigationView.menu.size != tabsModel.size) {
-            // Most likely first render or some tab has been removed. Let's nuke the menu (easiest option).
-            bottomNavigationView.menu.clear()
-        }
-        tabsModel.forEachIndexed { index, fragment ->
-            val menuItem =
-                bottomNavigationView.menu.getOrCreateMenuItemForFragmentAt(
-                    index,
-                    fragment.tabsScreen,
-                )
-            check(fragmentIndexForMenuItemId(menuItem.itemId) == index) { "[RNScreens] Illegal state: menu items are shuffled" }
+        val menu = bottomNavigationView.menu
+        val isMenuInSync =
+            menu.size == tabsModel.size &&
+                tabsModel.withIndex().all { (index, fragment) ->
+                    menu.getItem(index).itemId == fragment.menuItemId
+                }
+
+        if (isMenuInSync) {
+            return
+        }
+        menu.clear()
+        tabsModel.forEach { fragment ->
+            menu.getOrCreateMenuItemForFragment(fragment)
         }
+        appearanceCoordinator.invalidateRebuiltMenuItems()
     }
 
     private fun updateBottomNavigationViewAppearance() {
@@ -573,7 +594,10 @@ class TabsContainer internal constructor(
         }
 
         progressNavigationState(nextSelectedFragment.requireScreenKey, actionOrigin)
-        applyNextSelectedFragmentToFragmentManagerSync(currentSelectedFragment, nextSelectedFragment)
+        applyNextSelectedFragmentToFragmentManagerSync(
+            currentSelectedFragment,
+            nextSelectedFragment,
+        )
         return true
     }
 
@@ -643,7 +667,8 @@ class TabsContainer internal constructor(
             return false
         }
 
-        val stateChanged = updateNavigationStateAndSelectedFragment(nextSelectedFragment, actionOrigin)
+        val stateChanged =
+            updateNavigationStateAndSelectedFragment(nextSelectedFragment, actionOrigin)
 
         val hasTriggeredSpecialEffect =
             if (isRepeated) specialEffectsHandler.handleRepeatedTabSelection() else false
@@ -688,7 +713,8 @@ class TabsContainer internal constructor(
 
         // We expect at most a single fragment added (detached fragments are not returned from
         // FragmentManager.getFragments call) and it being the currently selected tab.
-        val isInUpToDateState = currentFragments.size == 1 && currentFragments.first() === selectedTab
+        val isInUpToDateState =
+            currentFragments.size == 1 && currentFragments.first() === selectedTab
         if (isInUpToDateState) {
             return
         } else if (currentFragments.isEmpty()) {
@@ -717,12 +743,10 @@ class TabsContainer internal constructor(
         appearanceCoordinator.updateTabAppearance(themedContext, this)
     }
 
-    private fun getFragmentForMenuItemId(itemId: Int): TabsScreenFragment? = tabsModel.getOrNull(fragmentIndexForMenuItemId(itemId))
+    private fun getFragmentForMenuItemId(itemId: Int): TabsScreenFragment? = tabsModel.find { it.menuItemId == itemId }
 
     private fun getMenuItemIdForFragment(tabsScreenFragment: TabsScreenFragment): Int? =
-        tabsModel.indexOfFirst { it === tabsScreenFragment }.takeIf { it != -1 }?.let {
-            menuItemIdForFragmentAtIndex(it)
-        }
+        tabsScreenFragment.menuItemId.takeIf { tabsModel.any { it === tabsScreenFragment } }
 
     private fun getSelectedTabsScreenFragmentId(): Int? =
         tabsModel
@@ -731,10 +755,9 @@ class TabsContainer internal constructor(
 
     private fun getMenuItemForTabsScreen(tabsScreen: TabsScreen): MenuItem? =
         tabsModel
-            .indexOfFirst { it.tabsScreen === tabsScreen }
-            .takeIf { it != -1 }
-            ?.let { index ->
-                bottomNavigationView.menu.findItem(menuItemIdForFragmentAtIndex(index))
+            .find { it.tabsScreen === tabsScreen }
+            ?.let { fragment ->
+                bottomNavigationView.menu.findItem(fragment.menuItemId)
             }
 
     private fun getFragmentForScreenKey(screenKey: String): TabsScreenFragment? = tabsModel.find { it.requireScreenKey == screenKey }
@@ -780,6 +803,19 @@ class TabsContainer internal constructor(
         return selectedTab.tabsScreen.findContentScrollView()
     }
 
+    // Only the active item is consulted - a preventing screen inside an inactive tab
+    // does not veto the dismissal.
+    override fun wantsToPreventStackNativeDismiss(): ContainerItem? =
+        if (navState.isNotEmpty()) {
+            selectedTab.tabsScreen.wantsToPreventStackNativeDismiss()
+        } else {
+            null
+        }
+
+    // Tabs have no stack of their own - the request goes to the selected tab's nested container.
+    override fun requestPopToRoot(): Boolean =
+        navState.isNotEmpty() && selectedTab.tabsScreen.resolveNestedContainer()?.requestPopToRoot() == true
+
     // endregion
 
     companion object {

package/android/src/main/java/com/swmansion/rnscreens/tabs/container/TabsContainerDelegate.kt

@@ -0,0 +1,11 @@
+package com.swmansion.rnscreens.tabs.container
+
+import androidx.fragment.app.FragmentManager
+
+internal interface TabsContainerDelegate {
+    /**
+     * Resolves the fragment manager the container should run its operations on. Called every time the container
+     * is attached to a window, as the result may differ between attachments.
+     */
+    fun resolveFragmentManager(): FragmentManager
+}

package/android/src/main/java/com/swmansion/rnscreens/tabs/host/TabsHost.kt

@@ -4,21 +4,25 @@ import android.annotation.SuppressLint
 import android.view.ViewTreeObserver
 import android.widget.FrameLayout
 import androidx.core.graphics.drawable.toDrawable
+import androidx.fragment.app.FragmentManager
 import com.facebook.react.bridge.UIManager
 import com.facebook.react.bridge.UIManagerListener
 import com.facebook.react.common.annotations.UnstableReactNativeAPI
 import com.facebook.react.uimanager.ThemedReactContext
 import com.facebook.react.uimanager.UIManagerHelper
 import com.swmansion.rnscreens.common.colorscheme.ColorScheme
+import com.swmansion.rnscreens.helpers.FragmentManagerHelper
 import com.swmansion.rnscreens.helpers.getFabricUIManagerNotNull
 import com.swmansion.rnscreens.tabs.container.TabsActionOrigin
 import com.swmansion.rnscreens.tabs.container.TabsContainer
+import com.swmansion.rnscreens.tabs.container.TabsContainerDelegate
 import com.swmansion.rnscreens.tabs.container.TabsNavigationState
 import com.swmansion.rnscreens.tabs.container.TabsNavigationStateObserver
 import com.swmansion.rnscreens.tabs.container.TabsNavigationStateRejectionReason
 import com.swmansion.rnscreens.tabs.container.TabsNavigationStateUpdateRequest
 import com.swmansion.rnscreens.tabs.screen.TabsScreen
 import com.swmansion.rnscreens.utils.RNSLog
+import java.lang.ref.WeakReference
 import kotlin.properties.Delegates
 
 @SuppressLint("ViewConstructor") // Only created by us. Should never be restored
@@ -28,7 +32,8 @@ class TabsHost(
 ) : FrameLayout(reactContext),
     TabsNavigationStateObserver,
     ViewTreeObserver.OnPreDrawListener,
-    UIManagerListener {
+    UIManagerListener,
+    TabsContainerDelegate {
     private val renderedScreens: ArrayList<TabsScreen> = arrayListOf()
     private var jsNavStateRequest: TabsNavigationStateUpdateRequest? = null
     private val layoutCoordinator: TabsHostLayoutCoordinator =
@@ -37,7 +42,7 @@ class TabsHost(
     private var hasFirstLayoutWithInsets: Boolean = false
 
     private val container: TabsContainer =
-        TabsContainer(reactContext).apply {
+        TabsContainer(reactContext, WeakReference(this)).apply {
             layoutParams =
                 LayoutParams(
                     LayoutParams.MATCH_PARENT,
@@ -82,6 +87,11 @@ class TabsHost(
         super.onDetachedFromWindow()
     }
 
+    override fun resolveFragmentManager(): FragmentManager =
+        checkNotNull(FragmentManagerHelper.findFragmentManagerForView(this)) {
+            "[RNScreens] Nullish fragment manager - can't run container operations"
+        }
+
     internal fun mountReactSubviewAt(
         tabsScreen: TabsScreen,
         index: Int,
@@ -161,6 +171,16 @@ class TabsHost(
         refreshLayout()
     }
 
+    // On window configuration changes ViewRootImpl calls forceLayout() recursively on every view
+    // in the hierarchy, bypassing requestLayout(). React views never lay out their children during
+    // framework traversals, so nothing would clear the force-layout flags in our subtree — and once
+    // they are set, any subsequent requestLayout() from a descendant short-circuits before reaching
+    // the override above, permanently disabling the manual pass. Schedule it from here as well.
+    override fun forceLayout() {
+        super.forceLayout()
+        refreshLayout()
+    }
+
     private fun forceSubtreeMeasureAndLayoutPass() {
         measure(
             MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY),