react-native-screens 4.5.0 → 4.6.0-beta.1

package/android/build.gradle

@@ -20,7 +20,7 @@ buildscript {
         mavenCentral()
     }
     dependencies {
-        classpath('com.android.tools.build:gradle:4.2.2')
+        classpath('com.android.tools.build:gradle:8.2.1')
         classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:${safeExtGet('kotlinVersion', rnsDefaultKotlinVersion)}"
         classpath "com.diffplug.spotless:spotless-plugin-gradle:6.25.0"
     }

package/android/src/fabric/java/com/swmansion/rnscreens/FabricEnabledHeaderConfigViewGroup.kt

@@ -14,6 +14,8 @@ abstract class FabricEnabledHeaderConfigViewGroup(
 ) : ViewGroup(context) {
     private var mStateWrapper: StateWrapper? = null
 
+    private var lastWidth = 0f
+    private var lastHeight = 0f
     private var lastPaddingStart = 0f
     private var lastPaddingEnd = 0f
 
@@ -21,36 +23,55 @@ abstract class FabricEnabledHeaderConfigViewGroup(
         mStateWrapper = wrapper
     }
 
-    fun updatePaddingsFabric(
+    fun updatePaddings(
         paddingStart: Int,
         paddingEnd: Int,
     ) {
-        updateState(paddingStart, paddingEnd)
+        // Do nothing on Fabric. This method is used only on Paper.
+    }
+
+    fun updateHeaderConfigState(
+        width: Int,
+        height: Int,
+        paddingStart: Int,
+        paddingEnd: Int,
+    ) {
+        updateState(width, height, paddingStart, paddingEnd)
     }
 
     @UiThread
     fun updateState(
+        width: Int,
+        height: Int,
         paddingStart: Int,
         paddingEnd: Int,
     ) {
-        val paddingStartDip: Float = PixelUtil.toDIPFromPixel(paddingStart.toFloat())
-        val paddingEndDip: Float = PixelUtil.toDIPFromPixel(paddingEnd.toFloat())
+        val realWidth: Float = PixelUtil.toDIPFromPixel(width.toFloat())
+        val realHeight: Float = PixelUtil.toDIPFromPixel(height.toFloat())
+        val realPaddingStart: Float = PixelUtil.toDIPFromPixel(paddingStart.toFloat())
+        val realPaddingEnd: Float = PixelUtil.toDIPFromPixel(paddingEnd.toFloat())
 
         // Check incoming state values. If they're already the correct value, return early to prevent
         // infinite UpdateState/SetState loop.
-        if (abs(lastPaddingStart - paddingStart) < DELTA &&
-            abs(lastPaddingEnd - paddingEnd) < DELTA
+        if (abs(lastWidth - realWidth) < DELTA &&
+            abs(lastHeight - realHeight) < DELTA &&
+            abs(lastPaddingStart - realPaddingStart) < DELTA &&
+            abs(lastPaddingEnd - realPaddingEnd) < DELTA
         ) {
             return
         }
 
-        lastPaddingStart = paddingStartDip
-        lastPaddingEnd = paddingEndDip
+        lastWidth = realWidth
+        lastHeight = realHeight
+        lastPaddingStart = realPaddingStart
+        lastPaddingEnd = realPaddingEnd
 
         val map: WritableMap =
             WritableNativeMap().apply {
-                putDouble("paddingStart", paddingStartDip.toDouble())
-                putDouble("paddingEnd", paddingEndDip.toDouble())
+                putDouble("frameWidth", realWidth.toDouble())
+                putDouble("frameHeight", realHeight.toDouble())
+                putDouble("paddingStart", realPaddingStart.toDouble())
+                putDouble("paddingEnd", realPaddingEnd.toDouble())
             }
         mStateWrapper?.updateState(map)
     }

package/android/src/fabric/java/com/swmansion/rnscreens/FabricEnabledHeaderSubviewViewGroup.kt

@@ -0,0 +1,51 @@
+package com.swmansion.rnscreens
+
+import android.content.Context
+import android.view.ViewGroup
+import androidx.annotation.UiThread
+import com.facebook.react.bridge.WritableMap
+import com.facebook.react.bridge.WritableNativeMap
+import com.facebook.react.uimanager.PixelUtil
+import com.facebook.react.uimanager.StateWrapper
+
+abstract class FabricEnabledHeaderSubviewViewGroup(
+    context: Context?,
+) : ViewGroup(context) {
+    private var mStateWrapper: StateWrapper? = null
+
+    fun setStateWrapper(wrapper: StateWrapper?) {
+        mStateWrapper = wrapper
+    }
+
+    protected fun updateSubviewFrameState(
+        width: Int,
+        height: Int,
+        offsetX: Int,
+        offsetY: Int,
+    ) {
+        updateState(width, height, offsetX, offsetY)
+    }
+
+    @UiThread
+    fun updateState(
+        width: Int,
+        height: Int,
+        offsetX: Int,
+        offsetY: Int,
+    ) {
+        val realWidth: Float = PixelUtil.toDIPFromPixel(width.toFloat())
+        val realHeight: Float = PixelUtil.toDIPFromPixel(height.toFloat())
+        val offsetXDip: Float = PixelUtil.toDIPFromPixel(offsetX.toFloat())
+        val offsetYDip: Float = PixelUtil.toDIPFromPixel(offsetY.toFloat())
+
+        val map: WritableMap =
+            WritableNativeMap().apply {
+                putDouble("frameWidth", realWidth.toDouble())
+                putDouble("frameHeight", realHeight.toDouble())
+                putDouble("contentOffsetX", offsetXDip.toDouble())
+                putDouble("contentOffsetY", offsetYDip.toDouble())
+            }
+
+        mStateWrapper?.updateState(map)
+    }
+}

package/android/src/main/java/com/swmansion/rnscreens/CustomToolbar.kt

@@ -68,8 +68,18 @@ open class CustomToolbar(
     ) {
         super.onLayout(changed, l, t, r, b)
 
-        // our children are already laid out
+        if (!changed) {
+            return
+        }
+
         val contentInsetStart = if (navigationIcon != null) contentInsetStartWithNavigation else contentInsetStart
-        config.updatePaddingsFabric(contentInsetStart, contentInsetEnd)
+        if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
+            val width = r - l
+            val height = b - t
+            config.updateHeaderConfigState(width, height, contentInsetStart, contentInsetEnd)
+        } else {
+            // our children are already laid out
+            config.updatePaddings(contentInsetStart, contentInsetEnd)
+        }
     }
 }

package/android/src/main/java/com/swmansion/rnscreens/Screen.kt

@@ -17,12 +17,9 @@ import androidx.swiperefreshlayout.widget.SwipeRefreshLayout
 import com.facebook.react.bridge.GuardedRunnable
 import com.facebook.react.bridge.ReactContext
 import com.facebook.react.uimanager.PixelUtil
-import com.facebook.react.uimanager.ReactClippingViewGroup
 import com.facebook.react.uimanager.UIManagerHelper
 import com.facebook.react.uimanager.UIManagerModule
 import com.facebook.react.uimanager.events.EventDispatcher
-import com.facebook.react.views.scroll.ReactHorizontalScrollView
-import com.facebook.react.views.scroll.ReactScrollView
 import com.google.android.material.bottomsheet.BottomSheetBehavior
 import com.google.android.material.shape.CornerFamily
 import com.google.android.material.shape.MaterialShapeDrawable
@@ -404,29 +401,6 @@ class Screen(
                 }
 
                 if (child is ViewGroup) {
-                    // The children are miscounted when there's removeClippedSubviews prop
-                    // set to true (which is the default for FlatLists).
-                    // Unless the child is a ScrollView it's safe to assume that it's true
-                    // and add a simple view for each possibly clipped item to make it work as expected.
-                    // See https://github.com/software-mansion/react-native-screens/pull/2495
-
-                    if (child is ReactClippingViewGroup &&
-                        child.removeClippedSubviews &&
-                        child !is ReactScrollView &&
-                        child !is ReactHorizontalScrollView
-                    ) {
-                        // We need to workaround the issue until our changes land in core.
-                        // Some views do not accept any children or have set amount and they throw
-                        // when we want to brute-forcefully manipulate that.
-                        // Is this ugly? Very. Do we have better option before changes land in core?
-                        // I'm not aware of any.
-                        try {
-                            for (j in 0 until child.childCount) {
-                                child.addView(View(context))
-                            }
-                        } catch (_: Exception) {
-                        }
-                    }
                     startTransitionRecursive(child)
                 }
             }

package/android/src/main/java/com/swmansion/rnscreens/ScreenModalFragment.kt

@@ -72,7 +72,10 @@ class ScreenModalFragment :
     override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
         configureDialogAndBehaviour()
 
-        val reactEventDispatcher = checkNotNull(screen.reactEventDispatcher) { "[RNScreens] No ReactEventDispatcher attached to screen while creating modal fragment" }
+        val reactEventDispatcher =
+            checkNotNull(
+                screen.reactEventDispatcher,
+            ) { "[RNScreens] No ReactEventDispatcher attached to screen while creating modal fragment" }
         val rootView = BottomSheetDialogRootView(screen.reactContext, reactEventDispatcher)
 
         rootView.addView(screen.recycle())

package/android/src/main/java/com/swmansion/rnscreens/ScreenStack.kt

@@ -248,7 +248,7 @@ class ScreenStack(
 
             if (shouldUseOpenAnimation &&
                 newTop != null &&
-                needsDrawReordering(newTop) &&
+                needsDrawReordering(newTop, stackAnimation) &&
                 visibleBottom == null
             ) {
                 // When using an open animation in which two screens overlap (eg. fade_from_bottom or
@@ -258,6 +258,7 @@ class ScreenStack(
                 // appears on top of the previous one. You can read more about in the comment
                 // for the code we use to change that behavior:
                 // https://github.com/airbnb/native-navigation/blob/9cf50bf9b751b40778f473f3b19fcfe2c4d40599/lib/android/src/main/java/com/airbnb/android/react/navigation/ScreenCoordinatorLayout.java#L18
+                // Note: This should not be set in case there is only a single screen in stack or animation `none` is used. Atm needsDrawReordering implementation guards that assuming that first screen on stack uses `NONE` animation.
                 isDetachingCurrentScreen = true
             }
 
@@ -426,14 +427,22 @@ class ScreenStack(
     companion object {
         const val TAG = "ScreenStack"
 
-        private fun needsDrawReordering(fragmentWrapper: ScreenFragmentWrapper): Boolean =
+        private fun needsDrawReordering(
+            fragmentWrapper: ScreenFragmentWrapper,
+            resolvedStackAnimation: StackAnimation?,
+        ): Boolean {
+            val stackAnimation = if (resolvedStackAnimation != null) resolvedStackAnimation else fragmentWrapper.screen.stackAnimation
             // On Android sdk 33 and above the animation is different and requires draw reordering.
             // For React Native 0.70 and lower versions, `Build.VERSION_CODES.TIRAMISU` is not defined yet.
             // Hence, we're comparing numerical version here.
-            Build.VERSION.SDK_INT >= 33 ||
-                fragmentWrapper.screen.stackAnimation === StackAnimation.SLIDE_FROM_BOTTOM ||
-                fragmentWrapper.screen.stackAnimation === StackAnimation.FADE_FROM_BOTTOM ||
-                fragmentWrapper.screen.stackAnimation === StackAnimation.IOS_FROM_RIGHT ||
-                fragmentWrapper.screen.stackAnimation === StackAnimation.IOS_FROM_LEFT
+            return (
+                Build.VERSION.SDK_INT >= 33 ||
+                    stackAnimation === StackAnimation.SLIDE_FROM_BOTTOM ||
+                    stackAnimation === StackAnimation.FADE_FROM_BOTTOM ||
+                    stackAnimation === StackAnimation.IOS_FROM_RIGHT ||
+                    stackAnimation === StackAnimation.IOS_FROM_LEFT
+            ) &&
+                stackAnimation !== StackAnimation.NONE
+        }
     }
 }

package/android/src/main/java/com/swmansion/rnscreens/ScreenStackFragment.kt

@@ -478,6 +478,11 @@ class ScreenStackFragment :
         screen.background = shape
     }
 
+    override fun onStart() {
+        lastFocusedChild?.requestFocus()
+        super.onStart()
+    }
+
     override fun onStop() {
         if (DeviceUtils.isPlatformAndroidTV(context)) {
             lastFocusedChild = findLastFocusedChild()

package/android/src/main/java/com/swmansion/rnscreens/ScreenStackHeaderConfigViewManager.kt

@@ -157,6 +157,7 @@ class ScreenStackHeaderConfigViewManager :
         config.setHideBackButton(hideBackButton)
     }
 
+    @Deprecated("For apps targeting SDK 35 or above edge-to-edge is enabled by default.")
     @ReactProp(name = "topInsetEnabled")
     override fun setTopInsetEnabled(
         config: ScreenStackHeaderConfig,

package/android/src/main/java/com/swmansion/rnscreens/ScreenStackHeaderSubview.kt

@@ -3,12 +3,11 @@ package com.swmansion.rnscreens
 import android.annotation.SuppressLint
 import android.view.View
 import com.facebook.react.bridge.ReactContext
-import com.facebook.react.views.view.ReactViewGroup
 
 @SuppressLint("ViewConstructor")
 class ScreenStackHeaderSubview(
     context: ReactContext?,
-) : ReactViewGroup(context) {
+) : FabricEnabledHeaderSubviewViewGroup(context) {
     private var reactWidth = 0
     private var reactHeight = 0
     var type = Type.RIGHT
@@ -37,11 +36,17 @@ class ScreenStackHeaderSubview(
 
     override fun onLayout(
         changed: Boolean,
-        left: Int,
-        top: Int,
-        right: Int,
-        bottom: Int,
-    ) = Unit
+        l: Int,
+        t: Int,
+        r: Int,
+        b: Int,
+    ) {
+        if (changed && BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
+            val width = r - l
+            val height = b - t
+            updateSubviewFrameState(width, height, l, t)
+        }
+    }
 
     enum class Type {
         LEFT,

package/android/src/main/java/com/swmansion/rnscreens/ScreenStackHeaderSubviewManager.kt

@@ -2,6 +2,8 @@ package com.swmansion.rnscreens
 
 import com.facebook.react.bridge.JSApplicationIllegalArgumentException
 import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.ReactStylesDiffMap
+import com.facebook.react.uimanager.StateWrapper
 import com.facebook.react.uimanager.ThemedReactContext
 import com.facebook.react.uimanager.ViewGroupManager
 import com.facebook.react.uimanager.ViewManagerDelegate
@@ -39,6 +41,17 @@ class ScreenStackHeaderSubviewManager :
             }
     }
 
+    override fun updateState(
+        view: ScreenStackHeaderSubview,
+        props: ReactStylesDiffMap?,
+        stateWrapper: StateWrapper?,
+    ): Any? {
+        if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
+            view.setStateWrapper(stateWrapper)
+        }
+        return super.updateState(view, props, stateWrapper)
+    }
+
     protected override fun getDelegate(): ViewManagerDelegate<ScreenStackHeaderSubview> = delegate
 
     companion object {

package/android/src/main/java/com/swmansion/rnscreens/ScreenViewManager.kt

@@ -192,6 +192,10 @@ open class ScreenViewManager :
         view.isStatusBarAnimated = animated
     }
 
+    @Deprecated(
+        "For apps targeting SDK 35 or above this prop has no effect. " +
+            "Since the edge-to-edge is enabled by default the color is always translucent.",
+    )
     @ReactProp(name = "statusBarColor", customType = "Color")
     override fun setStatusBarColor(
         view: Screen,
@@ -208,6 +212,7 @@ open class ScreenViewManager :
         view.statusBarStyle = statusBarStyle
     }
 
+    @Deprecated("For apps targeting SDK 35 or above edge-to-edge is enabled by default and will be enforced in the future.")
     @ReactProp(name = "statusBarTranslucent")
     override fun setStatusBarTranslucent(
         view: Screen,
@@ -224,6 +229,7 @@ open class ScreenViewManager :
         view.isStatusBarHidden = statusBarHidden
     }
 
+    @Deprecated("For apps targeting SDK 35 or above this prop has no effect")
     @ReactProp(name = "navigationBarColor", customType = "Color")
     override fun setNavigationBarColor(
         view: Screen,
@@ -232,6 +238,7 @@ open class ScreenViewManager :
         view.navigationBarColor = navigationBarColor
     }
 
+    @Deprecated("For apps targeting SDK 35 or above edge-to-edge is enabled by default")
     @ReactProp(name = "navigationBarTranslucent")
     override fun setNavigationBarTranslucent(
         view: Screen,

package/android/src/main/java/com/swmansion/rnscreens/bottomsheet/BottomSheetBehaviorExt.kt

@@ -3,7 +3,10 @@ package com.swmansion.rnscreens.bottomsheet
 import android.view.View
 import com.google.android.material.bottomsheet.BottomSheetBehavior
 
-internal fun <T : View> BottomSheetBehavior<T>.useSingleDetent(height: Int? = null, forceExpandedState: Boolean = true): BottomSheetBehavior<T> {
+internal fun <T : View> BottomSheetBehavior<T>.useSingleDetent(
+    height: Int? = null,
+    forceExpandedState: Boolean = true,
+): BottomSheetBehavior<T> {
     this.skipCollapsed = true
     this.isFitToContents = true
     if (forceExpandedState) {
@@ -16,7 +19,7 @@ internal fun <T : View> BottomSheetBehavior<T>.useSingleDetent(height: Int? = nu
 internal fun <T : View> BottomSheetBehavior<T>.useTwoDetents(
     @BottomSheetBehavior.StableState state: Int? = null,
     firstHeight: Int? = null,
-    secondHeight: Int? = null
+    secondHeight: Int? = null,
 ): BottomSheetBehavior<T> {
     skipCollapsed = false
     isFitToContents = true
@@ -30,7 +33,7 @@ internal fun <T : View> BottomSheetBehavior<T>.useThreeDetents(
     @BottomSheetBehavior.StableState state: Int? = null,
     firstHeight: Int? = null,
     halfExpandedRatio: Float? = null,
-    expandedOffsetFromTop: Int? = null
+    expandedOffsetFromTop: Int? = null,
 ): BottomSheetBehavior<T> {
     skipCollapsed = false
     isFitToContents = false

package/android/src/main/java/com/swmansion/rnscreens/bottomsheet/BottomSheetDialogRootView.kt

@@ -37,7 +37,7 @@ class BottomSheetDialogRootView(
         if (changed) {
             // This view is used right now only in ScreenModalFragment, where it is injected
             // to view hierarchy as a parent of a Screen.
-            assert(childCount == 1) { "[RNScreens] Expected only a single child view under ${TAG}, received: ${childCount}"}
+            assert(childCount == 1) { "[RNScreens] Expected only a single child view under $TAG, received: $childCount" }
             getChildAt(0).layout(l, t, r, b)
         }
     }

package/android/src/main/java/com/swmansion/rnscreens/bottomsheet/DimmingView.kt

@@ -57,8 +57,7 @@ class DimmingView(
         y: Float,
     ) = blockGestures
 
-    override fun getPointerEvents(): PointerEvents =
-        if (blockGestures) PointerEvents.AUTO else PointerEvents.NONE
+    override fun getPointerEvents(): PointerEvents = if (blockGestures) PointerEvents.AUTO else PointerEvents.NONE
 
     companion object {
         const val TAG = "DimmingView"

package/android/src/main/java/com/swmansion/rnscreens/bottomsheet/GestureTransparentViewGroup.kt

@@ -15,7 +15,6 @@ class GestureTransparentViewGroup(
     context: Context,
 ) : FrameLayout(context),
     ReactPointerEventsView {
-
     override fun getPointerEvents(): PointerEvents = PointerEvents.BOX_NONE
 
     companion object {

package/android/src/main/java/com/swmansion/rnscreens/bottomsheet/SheetUtils.kt

@@ -129,7 +129,7 @@ object SheetUtils {
 
 fun Screen.isSheetFitToContents(): Boolean =
     stackPresentation === Screen.StackPresentation.FORM_SHEET &&
-            sheetDetents.count() == 1 &&
-            sheetDetents.first() == Screen.SHEET_FIT_TO_CONTENTS
+        sheetDetents.count() == 1 &&
+        sheetDetents.first() == Screen.SHEET_FIT_TO_CONTENTS
 
 fun Screen.usesFormSheetPresentation(): Boolean = stackPresentation === Screen.StackPresentation.FORM_SHEET

package/android/src/main/java/com/swmansion/rnscreens/utils/ScreenDummyLayoutHelper.kt

@@ -82,7 +82,9 @@ internal class ScreenDummyLayoutHelper(
         // We need to use activity here, as react context does not have theme attributes required by
         // AppBarLayout attached leading to crash.
         val contextWithTheme =
-            requireNotNull(reactContext.currentActivity) { "[RNScreens] Attempt to use context detached from activity. This could happen only due to race-condition." }
+            requireNotNull(reactContext.currentActivity) {
+                "[RNScreens] Attempt to use context detached from activity. This could happen only due to race-condition."
+            }
 
         synchronized(this) {
             // The layout could have been initialised when this thread waited for access to critical section.
@@ -166,7 +168,7 @@ internal class ScreenDummyLayoutHelper(
                 // is still null at this execution point. We don't wanna crash in such case, thus returning zeroed height.
                 Log.e(
                     TAG,
-                    "[RNScreens] Failed to late-init layout while computing header height. This is most likely a race-condition-bug in react-native-screens, please file an issue at https://github.com/software-mansion/react-native-screens/issues"
+                    "[RNScreens] Failed to late-init layout while computing header height. This is most likely a race-condition-bug in react-native-screens, please file an issue at https://github.com/software-mansion/react-native-screens/issues",
                 )
                 return 0.0f
             }
@@ -214,7 +216,8 @@ internal class ScreenDummyLayoutHelper(
     private fun requireReactContext(lazyMessage: (() -> Any)? = null): ReactApplicationContext =
         requireNotNull(
             reactContextRef.get(),
-            lazyMessage ?: { "[RNScreens] Attempt to require missing react context" })
+            lazyMessage ?: { "[RNScreens] Attempt to require missing react context" },
+        )
 
     private fun requireActivity(): Activity =
         requireNotNull(requireReactContext().currentActivity) {

package/android/src/main/jni/rnscreens.h

@@ -20,6 +20,7 @@
 #include <react/renderer/components/rnscreens/RNSModalScreenComponentDescriptor.h>
 #include <react/renderer/components/rnscreens/RNSScreenStackHeaderSubviewComponentDescriptor.h>
 #include <react/renderer/components/rnscreens/RNSScreenStackHeaderConfigComponentDescriptor.h>
+#include <react/renderer/components/rnscreens/RNSFullWindowOverlayComponentDescriptor.h>
 
 namespace facebook {
 namespace react {

package/android/src/paper/java/com/swmansion/rnscreens/FabricEnabledHeaderConfigViewGroup.kt

@@ -16,7 +16,15 @@ abstract class FabricEnabledHeaderConfigViewGroup(
 
     fun setStateWrapper(wrapper: StateWrapper?) = Unit
 
-    fun updatePaddingsFabric(
+    // Do nothing on Paper. This method is used only on Fabric.
+    fun updateHeaderConfigState(
+        width: Int,
+        height: Int,
+        paddingStart: Int,
+        paddingEnd: Int,
+    ) = Unit
+
+    fun updatePaddings(
         paddingStart: Int,
         paddingEnd: Int,
     ) {

package/android/src/paper/java/com/swmansion/rnscreens/FabricEnabledHeaderSubviewViewGroup.kt

@@ -0,0 +1,19 @@
+package com.swmansion.rnscreens
+
+import android.content.Context
+import android.view.ViewGroup
+import com.facebook.react.uimanager.StateWrapper
+
+abstract class FabricEnabledHeaderSubviewViewGroup(
+    context: Context?,
+) : ViewGroup(context) {
+    fun setStateWrapper(wrapper: StateWrapper?) = Unit
+
+    // Fabric only
+    protected fun updateSubviewFrameState(
+        width: Int,
+        height: Int,
+        offsetX: Int,
+        offsetY: Int,
+    ) = Unit
+}

package/common/cpp/react/renderer/components/rnscreens/RNSFullWindowOverlayComponentDescriptor.h

@@ -0,0 +1,17 @@
+#pragma once
+
+#ifdef ANDROID
+#include <fbjni/fbjni.h>
+#endif // ANDROID
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+#include "RNSFullWindowOverlayShadowNode.h"
+
+namespace facebook::react {
+
+class RNSFullWindowOverlayComponentDescriptor final
+    : public ConcreteComponentDescriptor<RNSFullWindowOverlayShadowNode> {
+ public:
+  using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
+};
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/rnscreens/RNSFullWindowOverlayShadowNode.cpp

@@ -0,0 +1,7 @@
+#include "RNSFullWindowOverlayShadowNode.h"
+
+namespace facebook::react {
+
+extern const char RNSFullWindowOverlayComponentName[] = "RNSFullWindowOverlay";
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/rnscreens/RNSFullWindowOverlayShadowNode.h

@@ -0,0 +1,35 @@
+#pragma once
+
+#include <jsi/jsi.h>
+#include <react/renderer/components/rnscreens/EventEmitters.h>
+#include <react/renderer/components/rnscreens/Props.h>
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+#include <react/renderer/core/LayoutContext.h>
+#include "RNSFullWindowOverlayState.h"
+
+namespace facebook::react {
+
+JSI_EXPORT extern const char RNSFullWindowOverlayComponentName[];
+
+using ConcreteViewShadowNodeSuperType = ConcreteViewShadowNode<
+    RNSFullWindowOverlayComponentName,
+    RNSFullWindowOverlayProps,
+    RNSFullWindowOverlayEventEmitter,
+    RNSFullWindowOverlayState>;
+
+class JSI_EXPORT RNSFullWindowOverlayShadowNode final
+    : public ConcreteViewShadowNodeSuperType {
+ public:
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+  using StateData = ConcreteViewShadowNode::ConcreteStateData;
+
+#if !defined(ANDROID)
+  static ShadowNodeTraits BaseTraits() {
+    auto traits = ConcreteViewShadowNodeSuperType::BaseTraits();
+    traits.set(ShadowNodeTraits::Trait::RootNodeKind);
+    return traits;
+  }
+#endif
+};
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/rnscreens/RNSFullWindowOverlayState.h

@@ -0,0 +1,30 @@
+#pragma once
+
+#if defined(ANDROID)
+#include <folly/dynamic.h>
+#include <react/renderer/mapbuffer/MapBuffer.h>
+#include <react/renderer/mapbuffer/MapBufferBuilder.h>
+#endif // ANDROID
+
+#include <react/renderer/core/graphicsConversions.h>
+#include <react/renderer/graphics/Float.h>
+
+namespace facebook::react {
+
+class JSI_EXPORT RNSFullWindowOverlayState final {
+ public:
+  using Shared = std::shared_ptr<const RNSFullWindowOverlayState>;
+
+  RNSFullWindowOverlayState() = default;
+
+#if defined(ANDROID)
+  RNSFullWindowOverlayState(
+      const RNSFullWindowOverlayState &previousState,
+      folly::dynamic data) {}
+  folly::dynamic getDynamic() const {
+    return {};
+  }
+#endif
+};
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/rnscreens/RNSScreenStackHeaderConfigComponentDescriptor.h

@@ -34,8 +34,18 @@ class RNSScreenStackHeaderConfigComponentDescriptor final
         shadowNode.getState());
     auto stateData = state->getData();
 
-    layoutableShadowNode.setPadding(
-        {stateData.getPaddingStart(), 0, stateData.getPaddingEnd(), 0});
+    if (stateData.frameSize.width != 0 && stateData.frameSize.height != 0) {
+      layoutableShadowNode.setSize(
+          {stateData.frameSize.width, stateData.frameSize.height});
+#ifdef ANDROID
+      layoutableShadowNode.setPadding({
+          stateData.paddingStart,
+          0,
+          stateData.paddingEnd,
+          0,
+      });
+#endif // ANDROID
+    }
 
     ConcreteComponentDescriptor::adopt(shadowNode);
 #if !defined(ANDROID) && !defined(NDEBUG)