react-native-screens 4.0.0-beta.0 → 4.0.0-beta.10

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

@@ -3,8 +3,12 @@ package com.swmansion.rnscreens
 import android.util.Log
 import android.view.View
 import com.facebook.react.bridge.JSApplicationCausedNativeException
+import com.facebook.react.bridge.ReactApplicationContext
 import com.facebook.react.common.MapBuilder
 import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.LayoutShadowNode
+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
@@ -29,6 +33,9 @@ class ScreenStackHeaderConfigViewManager :
 
     override fun createViewInstance(reactContext: ThemedReactContext) = ScreenStackHeaderConfig(reactContext)
 
+    // This works only on Paper. On Fabric the shadow node is implemented in C++ layer.
+    override fun createShadowNodeInstance(context: ReactApplicationContext): LayoutShadowNode = ScreenStackHeaderConfigShadowNode(context)
+
     override fun addView(
         parent: ScreenStackHeaderConfig,
         child: View,
@@ -42,6 +49,17 @@ class ScreenStackHeaderConfigViewManager :
         parent.addConfigSubview(child, index)
     }
 
+    override fun updateState(
+        view: ScreenStackHeaderConfig,
+        props: ReactStylesDiffMap?,
+        stateWrapper: StateWrapper?,
+    ): Any? {
+        if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
+            view.setStateWrapper(stateWrapper)
+        }
+        return super.updateState(view, props, stateWrapper)
+    }
+
     override fun onDropViewInstance(
         @Nonnull view: ScreenStackHeaderConfig,
     ) {

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

@@ -87,12 +87,17 @@ open class ScreenViewManager :
         stateWrapper: StateWrapper?,
     ): Any? {
         if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
-            // fabricViewStateManager should never be null in Fabric. The null check is only for Paper's empty impl.
             view.setStateWrapper(stateWrapper)
         }
         return super.updateState(view, props, stateWrapper)
     }
 
+    // Called after all props are updated for given view
+    override fun onAfterUpdateTransaction(view: Screen) {
+        super.onAfterUpdateTransaction(view)
+        view.onFinalizePropsUpdate()
+    }
+
     @ReactProp(name = "activityState")
     fun setActivityState(
         view: Screen,
@@ -143,7 +148,8 @@ open class ScreenViewManager :
                 "slide_from_left" -> Screen.StackAnimation.SLIDE_FROM_LEFT
                 "slide_from_bottom" -> Screen.StackAnimation.SLIDE_FROM_BOTTOM
                 "fade_from_bottom" -> Screen.StackAnimation.FADE_FROM_BOTTOM
-                "ios" -> Screen.StackAnimation.IOS
+                "ios_from_right" -> Screen.StackAnimation.IOS_FROM_RIGHT
+                "ios_from_left" -> Screen.StackAnimation.IOS_FROM_LEFT
                 else -> throw JSApplicationIllegalArgumentException("Unknown animation type $animation")
             }
     }

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

@@ -163,6 +163,7 @@ object ScreenWindowTraits {
                         InsetsObserverProxy.registerOnView(decorView)
                         InsetsObserverProxy.addOnApplyWindowInsetsListener(windowInsetsListener)
                     } else {
+                        InsetsObserverProxy.unregisterOnView(decorView)
                         InsetsObserverProxy.removeOnApplyWindowInsetsListener(windowInsetsListener)
                     }
                     ViewCompat.requestApplyInsets(decorView)
@@ -225,7 +226,7 @@ object ScreenWindowTraits {
         val window = activity.window
 
         val screenForNavBarTranslucent = findScreenForTrait(screen, WindowTraits.NAVIGATION_BAR_TRANSLUCENT)
-        val translucent = screenForNavBarTranslucent?.isNavigationBarTranslucent ?: false
+        val translucent = screenForNavBarTranslucent?.isNavigationBarTranslucent ?: return
 
         // Following method controls whether to display edge-to-edge content that draws behind the navigation bar
         WindowCompat.setDecorFitsSystemWindows(window, !translucent)

package/android/src/main/java/com/swmansion/rnscreens/events/HeaderHeightChangeEvent.kt

@@ -7,16 +7,16 @@ import com.facebook.react.uimanager.events.Event
 class HeaderHeightChangeEvent(
     surfaceId: Int,
     viewId: Int,
-    private val headerHeight: Double,
+    private val headerHeight: Int,
 ) : Event<HeaderHeightChangeEvent>(surfaceId, viewId) {
     override fun getEventName() = EVENT_NAME
 
     // As the same header height could appear twice, use header height as a coalescing key.
-    override fun getCoalescingKey(): Short = headerHeight.toInt().toShort()
+    override fun getCoalescingKey(): Short = headerHeight.toShort()
 
     override fun getEventData(): WritableMap? =
         Arguments.createMap().apply {
-            putDouble("headerHeight", headerHeight)
+            putDouble("headerHeight", headerHeight.toDouble())
         }
 
     companion object {

package/android/src/main/java/com/swmansion/rnscreens/ext/ViewExt.kt

@@ -3,6 +3,9 @@ package com.swmansion.rnscreens.ext
 import android.graphics.drawable.ColorDrawable
 import android.view.View
 import android.view.ViewGroup
+import com.facebook.react.views.scroll.ReactHorizontalScrollView
+import com.facebook.react.views.scroll.ReactScrollView
+import com.swmansion.rnscreens.ScreenStack
 
 internal fun View.parentAsView() = this.parent as? View
 
@@ -30,3 +33,17 @@ internal fun View.maybeBgColor(): Int? {
     }
     return null
 }
+
+internal fun View.isInsideScrollViewWithRemoveClippedSubviews(): Boolean {
+    if (this is ReactHorizontalScrollView || this is ReactScrollView) {
+        return false
+    }
+    var parentView = this.parent
+    while (parentView is ViewGroup && parentView !is ScreenStack) {
+        if (parentView is ReactScrollView) {
+            return parentView.removeClippedSubviews
+        }
+        parentView = parentView.parent
+    }
+    return false
+}

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

@@ -0,0 +1,8 @@
+package com.swmansion.rnscreens.utils
+
+// Used only on Paper together with `setLocalData` mechanism to pass
+// the information on header paddings to shadow node.
+data class PaddingBundle(
+    val paddingStart: Float,
+    val paddingEnd: Float,
+)

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

@@ -18,6 +18,8 @@
  */
 #include <react/renderer/components/rnscreens/RNSScreenComponentDescriptor.h>
 #include <react/renderer/components/rnscreens/RNSModalScreenComponentDescriptor.h>
+#include <react/renderer/components/rnscreens/RNSScreenStackHeaderSubviewComponentDescriptor.h>
+#include <react/renderer/components/rnscreens/RNSScreenStackHeaderConfigComponentDescriptor.h>
 
 namespace facebook {
 namespace react {

package/android/src/main/res/base/anim/rns_ios_from_left_background_close.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<translate xmlns:android="http://schemas.android.com/apk/res/android"
+    android:duration="@android:integer/config_shortAnimTime"
+    android:fromXDelta="30%"
+    android:toXDelta="0%" />

package/android/src/main/res/base/anim/{rns_slide_out_to_left_ios.xml → rns_ios_from_left_background_open.xml}

@@ -2,4 +2,4 @@
 <translate xmlns:android="http://schemas.android.com/apk/res/android"
     android:duration="@android:integer/config_shortAnimTime"
     android:fromXDelta="0%"
-    android:toXDelta="-30%"/>
+    android:toXDelta="30%" />

package/android/src/main/res/base/anim/rns_ios_from_left_foreground_close.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<translate xmlns:android="http://schemas.android.com/apk/res/android"
+    android:duration="@android:integer/config_shortAnimTime"
+    android:interpolator="@android:interpolator/accelerate_decelerate"
+    android:fromXDelta="0%"
+    android:toXDelta="-100%" />

package/android/src/main/res/base/anim/rns_ios_from_left_foreground_open.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<translate xmlns:android="http://schemas.android.com/apk/res/android"
+    android:duration="@android:integer/config_shortAnimTime"
+    android:interpolator="@android:interpolator/accelerate_decelerate"
+    android:fromXDelta="-100%"
+    android:toXDelta="0%" />

package/android/src/main/res/base/anim/rns_ios_from_right_background_open.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<translate xmlns:android="http://schemas.android.com/apk/res/android"
+    android:duration="@android:integer/config_shortAnimTime"
+    android:fromXDelta="0%"
+    android:toXDelta="-30%" />

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

@@ -0,0 +1,39 @@
+package com.swmansion.rnscreens
+
+import android.content.Context
+import android.view.ViewGroup
+import com.facebook.react.bridge.ReactContext
+import com.facebook.react.uimanager.StateWrapper
+import com.facebook.react.uimanager.UIManagerModule
+import com.swmansion.rnscreens.utils.PaddingBundle
+import kotlin.math.abs
+
+abstract class FabricEnabledHeaderConfigViewGroup(
+    context: Context,
+) : ViewGroup(context) {
+    private var lastPaddingStart = 0
+    private var lastPaddingEnd = 0
+
+    fun setStateWrapper(wrapper: StateWrapper?) = Unit
+
+    fun updatePaddingsFabric(
+        paddingStart: Int,
+        paddingEnd: Int,
+    ) {
+        // Note that on Paper we do not convert these props from px to dip. This is done internally by RN.
+        if (abs(lastPaddingStart - paddingStart) < DELTA && abs(lastPaddingEnd - paddingEnd) < DELTA) {
+            return
+        }
+
+        lastPaddingStart = paddingStart
+        lastPaddingEnd = paddingEnd
+
+        val reactContext = context as? ReactContext
+        val uiManagerModule = reactContext?.getNativeModule(UIManagerModule::class.java)
+        uiManagerModule?.setViewLocalData(this.id, PaddingBundle(paddingStart.toFloat(), paddingEnd.toFloat()))
+    }
+
+    companion object {
+        private const val DELTA = 0.9
+    }
+}

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

@@ -12,7 +12,7 @@ abstract class FabricEnabledViewGroup(
     protected fun updateScreenSizeFabric(
         width: Int,
         height: Int,
-        headerHeight: Double,
+        headerHeight: Int,
     ) {
         // do nothing
     }

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

@@ -5,9 +5,9 @@
 #endif
 #include <react/debug/react_native_assert.h>
 #include <react/renderer/components/rnscreens/Props.h>
+#include <react/renderer/components/rnscreens/utils/RectUtil.h>
 #include <react/renderer/core/ConcreteComponentDescriptor.h>
 #include "RNSScreenShadowNode.h"
-#include "utils/RectUtil.h"
 
 namespace facebook {
 namespace react {
@@ -19,9 +19,6 @@ class RNSScreenComponentDescriptor final
  public:
   using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
 
-  static constexpr const char *kScreenDummyLayoutHelperClass =
-      "com/swmansion/rnscreens/utils/ScreenDummyLayoutHelper";
-
   void adopt(ShadowNode &shadowNode) const override {
     react_native_assert(dynamic_cast<RNSScreenShadowNode *>(&shadowNode));
     auto &screenShadowNode = static_cast<RNSScreenShadowNode &>(shadowNode);
@@ -39,8 +36,8 @@ class RNSScreenComponentDescriptor final
 #ifdef ANDROID
     if (stateData.frameSize.width != 0 && stateData.frameSize.height != 0) {
       // When we receive dimensions from JVM side we can remove padding used for
-      // correction, and we can stop applying height correction for the frame.
-      // We want to leave top offset correction though intact.
+      // correction, and we can stop applying height and offset corrections for
+      // the frame.
       // TODO: In future, when we have dynamic header height we might want to
       // update Y offset correction here.
 
@@ -67,36 +64,11 @@ class RNSScreenComponentDescriptor final
       screenShadowNode.setPadding({0, 0, 0, 0});
       screenShadowNode.getFrameCorrectionModes().unset(
           FrameCorrectionModes::Mode::FrameHeightCorrection);
+      screenShadowNode.getFrameCorrectionModes().unset(
+          FrameCorrectionModes::Mode::FrameOriginCorrection);
 
       layoutableShadowNode.setSize(
           Size{stateData.frameSize.width, stateData.frameSize.height});
-    } else {
-      // This code path should be executed only on the very first (few)
-      // layout(s), when we haven't received state update from JVM side yet.
-
-      auto headerConfigChildOpt = findHeaderConfigChild(layoutableShadowNode);
-
-      // During creation of the shadow node children are not attached yet.
-      // We also do not want to set any padding in case.
-      if (headerConfigChildOpt) {
-        const auto &headerConfigChild = headerConfigChildOpt->get();
-        const auto &headerProps =
-            *std::static_pointer_cast<const RNSScreenStackHeaderConfigProps>(
-                headerConfigChild->getProps());
-
-        const auto headerHeight = headerProps.hidden
-            ? 0.f
-            : findHeaderHeight(
-                  headerProps.titleFontSize, headerProps.title.empty())
-                  .value_or(0.f);
-
-        screenShadowNode.setPadding({0, 0, 0, headerHeight});
-        screenShadowNode.setHeaderHeight(headerHeight);
-        screenShadowNode.getFrameCorrectionModes().set(
-            FrameCorrectionModes::Mode(
-                FrameCorrectionModes::Mode::FrameHeightCorrection |
-                FrameCorrectionModes::Mode::FrameOriginCorrection));
-      }
     }
 #else
     if (stateData.frameSize.width != 0 && stateData.frameSize.height != 0) {
@@ -106,72 +78,6 @@ class RNSScreenComponentDescriptor final
 #endif // ANDROID
     ConcreteComponentDescriptor::adopt(shadowNode);
   }
-
-  std::optional<std::reference_wrapper<const ShadowNode::Shared>>
-  findHeaderConfigChild(
-      const YogaLayoutableShadowNode &screenShadowNode) const {
-    for (const ShadowNode::Shared &child : screenShadowNode.getChildren()) {
-      if (std::strcmp(
-              child->getComponentName(), "RNSScreenStackHeaderConfig") == 0) {
-        return {std::cref(child)};
-      }
-    }
-    return {};
-  }
-
-#ifdef ANDROID
-  std::optional<float> findHeaderHeight(
-      const int fontSize,
-      const bool isTitleEmpty) const {
-    JNIEnv *env = facebook::jni::Environment::current();
-
-    if (env == nullptr) {
-      LOG(ERROR) << "[RNScreens] Failed to retrieve env\n";
-      return {};
-    }
-
-    jclass layoutHelperClass = env->FindClass(kScreenDummyLayoutHelperClass);
-
-    if (layoutHelperClass == nullptr) {
-      LOG(ERROR) << "[RNScreens] Failed to find class with id "
-                 << kScreenDummyLayoutHelperClass;
-      return {};
-    }
-
-    jmethodID computeDummyLayoutID =
-        env->GetMethodID(layoutHelperClass, "computeDummyLayout", "(IZ)F");
-
-    if (computeDummyLayoutID == nullptr) {
-      LOG(ERROR)
-          << "[RNScreens] Failed to retrieve computeDummyLayout method ID";
-      return {};
-    }
-
-    jmethodID getInstanceMethodID = env->GetStaticMethodID(
-        layoutHelperClass,
-        "getInstance",
-        "()Lcom/swmansion/rnscreens/utils/ScreenDummyLayoutHelper;");
-
-    if (getInstanceMethodID == nullptr) {
-      LOG(ERROR) << "[RNScreens] Failed to retrieve getInstanceMethodID";
-      return {};
-    }
-
-    jobject packageInstance =
-        env->CallStaticObjectMethod(layoutHelperClass, getInstanceMethodID);
-
-    if (packageInstance == nullptr) {
-      LOG(ERROR)
-          << "[RNScreens] Failed to retrieve packageInstance or the package instance was null on JVM side";
-      return {};
-    }
-
-    jfloat headerHeight = env->CallFloatMethod(
-        packageInstance, computeDummyLayoutID, fontSize, isTitleEmpty);
-
-    return {headerHeight};
-  }
-#endif // ANDROID
 };
 
 } // namespace react

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

@@ -15,6 +15,107 @@ Point RNSScreenShadowNode::getContentOriginOffset(
   return {contentOffset.x, contentOffset.y};
 }
 
+std::optional<std::reference_wrapper<const ShadowNode::Shared>>
+findHeaderConfigChild(const YogaLayoutableShadowNode &screenShadowNode) {
+  for (const ShadowNode::Shared &child : screenShadowNode.getChildren()) {
+    if (std::strcmp(child->getComponentName(), "RNSScreenStackHeaderConfig") ==
+        0) {
+      return {std::cref(child)};
+    }
+  }
+  return {};
+}
+
+static constexpr const char *kScreenDummyLayoutHelperClass =
+    "com/swmansion/rnscreens/utils/ScreenDummyLayoutHelper";
+
+#ifdef ANDROID
+std::optional<float> findHeaderHeight(
+    const int fontSize,
+    const bool isTitleEmpty) {
+  JNIEnv *env = facebook::jni::Environment::current();
+
+  if (env == nullptr) {
+    LOG(ERROR) << "[RNScreens] Failed to retrieve env\n";
+    return {};
+  }
+
+  jclass layoutHelperClass = env->FindClass(kScreenDummyLayoutHelperClass);
+
+  if (layoutHelperClass == nullptr) {
+    LOG(ERROR) << "[RNScreens] Failed to find class with id "
+               << kScreenDummyLayoutHelperClass;
+    return {};
+  }
+
+  jmethodID computeDummyLayoutID =
+      env->GetMethodID(layoutHelperClass, "computeDummyLayout", "(IZ)F");
+
+  if (computeDummyLayoutID == nullptr) {
+    LOG(ERROR) << "[RNScreens] Failed to retrieve computeDummyLayout method ID";
+    return {};
+  }
+
+  jmethodID getInstanceMethodID = env->GetStaticMethodID(
+      layoutHelperClass,
+      "getInstance",
+      "()Lcom/swmansion/rnscreens/utils/ScreenDummyLayoutHelper;");
+
+  if (getInstanceMethodID == nullptr) {
+    LOG(ERROR) << "[RNScreens] Failed to retrieve getInstanceMethodID";
+    return {};
+  }
+
+  jobject packageInstance =
+      env->CallStaticObjectMethod(layoutHelperClass, getInstanceMethodID);
+
+  if (packageInstance == nullptr) {
+    LOG(ERROR)
+        << "[RNScreens] Failed to retrieve packageInstance or the package instance was null on JVM side";
+    return {};
+  }
+
+  jfloat headerHeight = env->CallFloatMethod(
+      packageInstance, computeDummyLayoutID, fontSize, isTitleEmpty);
+
+  return {headerHeight};
+}
+#endif // ANDROID
+
+void RNSScreenShadowNode::appendChild(const ShadowNode::Shared &child) {
+  YogaLayoutableShadowNode::appendChild(child);
+#ifdef ANDROID
+  const auto &stateData = getStateData();
+  if (stateData.frameSize.width == 0 || stateData.frameSize.height == 0) {
+    // This code path should be executed only on the very first (few)
+    // layout(s), when we haven't received state update from JVM side yet.
+    auto headerConfigChildOpt = findHeaderConfigChild(*this);
+    auto &screenShadowNode = static_cast<RNSScreenShadowNode &>(*this);
+
+    // During creation of the shadow node children are not attached yet.
+    // We also do not want to set any padding in case.
+    if (headerConfigChildOpt) {
+      const auto &headerConfigChild = headerConfigChildOpt->get();
+      const auto &headerProps =
+          *std::static_pointer_cast<const RNSScreenStackHeaderConfigProps>(
+              headerConfigChild->getProps());
+
+      const auto headerHeight = headerProps.hidden
+          ? 0.f
+          : findHeaderHeight(
+                headerProps.titleFontSize, headerProps.title.empty())
+                .value_or(0.f);
+
+      screenShadowNode.setPadding({0, 0, 0, headerHeight});
+      screenShadowNode.setHeaderHeight(headerHeight);
+      screenShadowNode.getFrameCorrectionModes().set(FrameCorrectionModes::Mode(
+          FrameCorrectionModes::Mode::FrameHeightCorrection |
+          FrameCorrectionModes::Mode::FrameOriginCorrection));
+    }
+  }
+#endif // ANDROID
+}
+
 void RNSScreenShadowNode::layout(facebook::react::LayoutContext layoutContext) {
   YogaLayoutableShadowNode::layout(layoutContext);
 

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

@@ -28,6 +28,8 @@ class JSI_EXPORT RNSScreenShadowNode final : public ConcreteViewShadowNode<
 
   Point getContentOriginOffset(bool includeTransform) const override;
 
+  void appendChild(const ShadowNode::Shared &child) override;
+
   void layout(LayoutContext layoutContext) override;
 
 #pragma mark - Custom interface

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

@@ -0,0 +1,44 @@
+#pragma once
+
+#ifdef ANDROID
+#include <fbjni/fbjni.h>
+#endif
+#include <react/debug/react_native_assert.h>
+#include <react/renderer/components/rnscreens/Props.h>
+#include <react/renderer/components/rnscreens/utils/RectUtil.h>
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+#include "RNSScreenStackHeaderConfigShadowNode.h"
+
+namespace facebook::react {
+
+using namespace rnscreens;
+
+class RNSScreenStackHeaderConfigComponentDescriptor final
+    : public ConcreteComponentDescriptor<RNSScreenStackHeaderConfigShadowNode> {
+ public:
+  using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
+
+  void adopt(ShadowNode &shadowNode) const override {
+    react_native_assert(
+        dynamic_cast<RNSScreenStackHeaderConfigShadowNode *>(&shadowNode));
+    auto &configShadowNode =
+        static_cast<RNSScreenStackHeaderConfigShadowNode &>(shadowNode);
+
+    react_native_assert(
+        dynamic_cast<YogaLayoutableShadowNode *>(&configShadowNode));
+    auto &layoutableShadowNode =
+        dynamic_cast<YogaLayoutableShadowNode &>(configShadowNode);
+
+    auto state = std::static_pointer_cast<
+        const RNSScreenStackHeaderConfigShadowNode::ConcreteState>(
+        shadowNode.getState());
+    auto stateData = state->getData();
+
+    layoutableShadowNode.setPadding(
+        {stateData.getPaddingStart(), 0, stateData.getPaddingEnd(), 0});
+
+    ConcreteComponentDescriptor::adopt(shadowNode);
+  }
+};
+
+} // namespace facebook::react

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

@@ -0,0 +1,8 @@
+#include "RNSScreenStackHeaderConfigShadowNode.h"
+
+namespace facebook::react {
+
+extern const char RNSScreenStackHeaderConfigComponentName[] =
+    "RNSScreenStackHeaderConfig";
+
+}

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

@@ -0,0 +1,32 @@
+#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 "FrameCorrectionModes.h"
+#include "RNSScreenStackHeaderConfigState.h"
+
+namespace facebook::react {
+
+using namespace rnscreens;
+
+JSI_EXPORT extern const char RNSScreenStackHeaderConfigComponentName[];
+
+class JSI_EXPORT RNSScreenStackHeaderConfigShadowNode final
+    : public ConcreteViewShadowNode<
+          RNSScreenStackHeaderConfigComponentName,
+          RNSScreenStackHeaderConfigProps,
+          RNSScreenStackHeaderConfigEventEmitter,
+          RNSScreenStackHeaderConfigState> {
+ public:
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+  using StateData = ConcreteViewShadowNode::ConcreteStateData;
+
+#pragma mark - ShadowNode overrides
+
+#pragma mark - Custom interface
+};
+
+} // namespace facebook::react

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

@@ -0,0 +1,23 @@
+#include "RNSScreenStackHeaderConfigState.h"
+
+namespace facebook {
+namespace react {
+
+#ifdef ANDROID
+folly::dynamic RNSScreenStackHeaderConfigState::getDynamic() const {
+  return folly::dynamic::object("paddingStart", paddingStart_)(
+      "paddingEnd_", paddingEnd_);
+}
+
+#endif
+
+Float RNSScreenStackHeaderConfigState::getPaddingStart() const noexcept {
+  return paddingStart_;
+}
+
+Float RNSScreenStackHeaderConfigState::getPaddingEnd() const noexcept {
+  return paddingEnd_;
+}
+
+} // namespace react
+} // namespace facebook

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

@@ -0,0 +1,50 @@
+#pragma once
+
+#include <react/renderer/core/graphicsConversions.h>
+#include <react/renderer/graphics/Float.h>
+
+#ifdef ANDROID
+#include <folly/dynamic.h>
+#include <react/renderer/mapbuffer/MapBuffer.h>
+#include <react/renderer/mapbuffer/MapBufferBuilder.h>
+#endif
+
+namespace facebook::react {
+
+class JSI_EXPORT RNSScreenStackHeaderConfigState final {
+ public:
+  using Shared = std::shared_ptr<const RNSScreenStackHeaderConfigState>;
+
+  RNSScreenStackHeaderConfigState() = default;
+
+  RNSScreenStackHeaderConfigState(Float paddingStart, Float paddingEnd)
+      : paddingStart_{paddingStart}, paddingEnd_{paddingEnd} {}
+
+#ifdef ANDROID
+  RNSScreenStackHeaderConfigState(
+      RNSScreenStackHeaderConfigState const &previousState,
+      folly::dynamic data)
+      : paddingStart_{static_cast<Float>(data["paddingStart"].getDouble())},
+        paddingEnd_{static_cast<Float>(data["paddingEnd"].getDouble())} {}
+#endif
+
+#ifdef ANDROID
+  folly::dynamic getDynamic() const;
+  MapBuffer getMapBuffer() const {
+    return MapBufferBuilder::EMPTY();
+  };
+
+#endif
+
+#pragma mark - Getters
+
+  [[nodiscard]] Float getPaddingStart() const noexcept;
+
+  [[nodiscard]] Float getPaddingEnd() const noexcept;
+
+ private:
+  Float paddingStart_{0.f};
+  Float paddingEnd_{0.f};
+};
+
+} // namespace facebook::react