@lodev09/react-native-true-sheet 4.0.0-beta.0 → 4.0.0-beta.10

package/android/src/main/java/com/lodev09/truesheet/TrueSheetFooterViewManager.kt

@@ -1,8 +1,12 @@
 package com.lodev09.truesheet
 
 import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.PointerEvents
+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.annotations.ReactProp
 
 /**
  * ViewManager for TrueSheetFooterView
@@ -15,6 +19,16 @@ class TrueSheetFooterViewManager : ViewGroupManager<TrueSheetFooterView>() {
 
   override fun createViewInstance(reactContext: ThemedReactContext): TrueSheetFooterView = TrueSheetFooterView(reactContext)
 
+  override fun updateState(view: TrueSheetFooterView, props: ReactStylesDiffMap?, stateWrapper: StateWrapper?): Any? {
+    view.stateWrapper = stateWrapper
+    return null
+  }
+
+  @ReactProp(name = "pointerEvents")
+  fun setPointerEvents(view: TrueSheetFooterView, pointerEventsStr: String?) {
+    view.pointerEvents = PointerEvents.parsePointerEvents(pointerEventsStr)
+  }
+
   companion object {
     const val REACT_CLASS = "TrueSheetFooterView"
   }

package/android/src/main/java/com/lodev09/truesheet/TrueSheetHeaderView.kt

@@ -0,0 +1,38 @@
+package com.lodev09.truesheet
+
+import android.annotation.SuppressLint
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.views.view.ReactViewGroup
+
+/**
+ * Delegate interface for header view size changes
+ */
+interface TrueSheetHeaderViewDelegate {
+  fun headerViewDidChangeSize(width: Int, height: Int)
+}
+
+/**
+ * Header view that holds the header content
+ * Positioned at the top of the sheet content area
+ */
+@SuppressLint("ViewConstructor")
+class TrueSheetHeaderView(context: ThemedReactContext) : ReactViewGroup(context) {
+  var delegate: TrueSheetHeaderViewDelegate? = null
+
+  private var lastWidth = 0
+  private var lastHeight = 0
+
+  override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
+    super.onSizeChanged(w, h, oldw, oldh)
+
+    if (w != lastWidth || h != lastHeight) {
+      lastWidth = w
+      lastHeight = h
+      delegate?.headerViewDidChangeSize(w, h)
+    }
+  }
+
+  companion object {
+    const val TAG_NAME = "TrueSheet"
+  }
+}

package/android/src/main/java/com/lodev09/truesheet/TrueSheetHeaderViewManager.kt

@@ -0,0 +1,28 @@
+package com.lodev09.truesheet
+
+import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.PointerEvents
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.ViewGroupManager
+import com.facebook.react.uimanager.annotations.ReactProp
+
+/**
+ * ViewManager for TrueSheetHeaderView
+ * Manages the header area of the sheet
+ */
+@ReactModule(name = TrueSheetHeaderViewManager.REACT_CLASS)
+class TrueSheetHeaderViewManager : ViewGroupManager<TrueSheetHeaderView>() {
+
+  override fun getName(): String = REACT_CLASS
+
+  override fun createViewInstance(reactContext: ThemedReactContext): TrueSheetHeaderView = TrueSheetHeaderView(reactContext)
+
+  @ReactProp(name = "pointerEvents")
+  fun setPointerEvents(view: TrueSheetHeaderView, pointerEventsStr: String?) {
+    view.pointerEvents = PointerEvents.parsePointerEvents(pointerEventsStr)
+  }
+
+  companion object {
+    const val REACT_CLASS = "TrueSheetHeaderView"
+  }
+}

package/android/src/main/java/com/lodev09/truesheet/TrueSheetModule.kt

@@ -8,6 +8,7 @@ import com.facebook.react.bridge.ReactMethod
 import com.facebook.react.module.annotations.ReactModule
 import com.facebook.react.turbomodule.core.interfaces.TurboModule
 import com.facebook.react.uimanager.UIManagerHelper
+import com.lodev09.truesheet.core.TrueSheetStackManager
 import java.util.concurrent.ConcurrentHashMap
 
 /**
@@ -21,16 +22,13 @@ class TrueSheetModule(reactContext: ReactApplicationContext) :
 
   override fun getName(): String = NAME
 
-  override fun initialize() {
-    super.initialize()
-  }
-
   override fun invalidate() {
     super.invalidate()
-    // Clear all registered views on module invalidation
+    // Clear all registered views and observer on module invalidation
     synchronized(viewRegistry) {
       viewRegistry.clear()
     }
+    TrueSheetStackManager.clear()
   }
 
   /**
@@ -44,19 +42,19 @@ class TrueSheetModule(reactContext: ReactApplicationContext) :
    * @throws OPERATION_FAILED if the operation fails for any other reason
    */
   @ReactMethod
-  fun presentByRef(viewTag: Double, index: Double, promise: Promise) {
+  fun presentByRef(viewTag: Double, index: Double, animated: Boolean, promise: Promise) {
     val tag = viewTag.toInt()
     val detentIndex = index.toInt()
 
     withTrueSheetView(tag, promise) { view ->
-      view.present(detentIndex) {
+      view.present(detentIndex, animated) {
         promise.resolve(null)
       }
     }
   }
 
   /**
-   * Dismiss a sheet by reference
+   * Dismiss a sheet and all sheets presented on top of it
    *
    * @param viewTag Native view tag of the sheet component
    * @param promise Promise that resolves when sheet is fully dismissed
@@ -65,11 +63,31 @@ class TrueSheetModule(reactContext: ReactApplicationContext) :
    * @throws OPERATION_FAILED if the operation fails for any other reason
    */
   @ReactMethod
-  fun dismissByRef(viewTag: Double, promise: Promise) {
+  fun dismissByRef(viewTag: Double, animated: Boolean, promise: Promise) {
     val tag = viewTag.toInt()
 
     withTrueSheetView(tag, promise) { view ->
-      view.dismiss {
+      view.dismiss(animated) {
+        promise.resolve(null)
+      }
+    }
+  }
+
+  /**
+   * Dismiss only the sheets presented on top of this sheet, keeping this sheet presented
+   *
+   * @param viewTag Native view tag of the sheet component
+   * @param promise Promise that resolves when all child sheets are fully dismissed
+   * @throws VIEW_NOT_FOUND if the view with the given tag is not found
+   * @throws INVALID_VIEW_TYPE if the view is not a TrueSheetView
+   * @throws OPERATION_FAILED if the operation fails for any other reason
+   */
+  @ReactMethod
+  fun dismissStackByRef(viewTag: Double, animated: Boolean, promise: Promise) {
+    val tag = viewTag.toInt()
+
+    withTrueSheetView(tag, promise) { view ->
+      view.dismissStack(animated) {
         promise.resolve(null)
       }
     }
@@ -87,8 +105,49 @@ class TrueSheetModule(reactContext: ReactApplicationContext) :
    */
   @ReactMethod
   fun resizeByRef(viewTag: Double, index: Double, promise: Promise) {
-    // Resize is just an alias for present
-    presentByRef(viewTag, index, promise)
+    val tag = viewTag.toInt()
+    val detentIndex = index.toInt()
+
+    withTrueSheetView(tag, promise) { view ->
+      view.resize(detentIndex) {
+        promise.resolve(null)
+      }
+    }
+  }
+
+  /**
+   * Dismiss all presented sheets by dismissing from the bottom of the stack
+   *
+   * @param animated Whether to animate the dismissals
+   * @param promise Promise that resolves when all sheets are dismissed
+   */
+  @ReactMethod
+  fun dismissAll(animated: Boolean, promise: Promise) {
+    Handler(Looper.getMainLooper()).post {
+      try {
+        val rootSheet = TrueSheetStackManager.getRootSheet()
+        if (rootSheet == null) {
+          promise.resolve(null)
+          return@post
+        }
+
+        rootSheet.dismiss(animated) {
+          promise.resolve(null)
+        }
+      } catch (e: Exception) {
+        promise.reject("OPERATION_FAILED", "Failed to dismiss all sheets: ${e.message}", e)
+      }
+    }
+  }
+
+  @ReactMethod
+  fun handleBackPress(viewTag: Double, promise: Promise) {
+    val tag = viewTag.toInt()
+
+    withTrueSheetView(tag, promise) { view ->
+      view.handleBackPress()
+      promise.resolve(null)
+    }
   }
 
   /**
@@ -98,29 +157,30 @@ class TrueSheetModule(reactContext: ReactApplicationContext) :
     Handler(Looper.getMainLooper()).post {
       try {
         // First try to get from registry (faster)
-        val view = getSheetByTag(tag)
+        var view = getSheetByTag(tag)
 
-        if (view != null) {
-          closure(view)
-        } else {
-          // Fallback to UIManager resolution
+        // Fallback to UIManager resolution
+        if (view == null) {
           val manager = UIManagerHelper.getUIManagerForReactTag(reactApplicationContext, tag)
           val resolvedView = manager?.resolveView(tag)
 
-          if (resolvedView == null) {
-            promise.reject("VIEW_NOT_FOUND", "TrueSheetView with tag $tag not found")
-            return@post
-          }
-
           if (resolvedView is TrueSheetView) {
-            closure(resolvedView)
-          } else {
+            view = resolvedView
+          } else if (resolvedView != null) {
             promise.reject(
               "INVALID_VIEW_TYPE",
               "View with tag $tag is not a TrueSheetView (got ${resolvedView::class.simpleName})"
             )
+            return@post
           }
         }
+
+        if (view == null) {
+          promise.reject("VIEW_NOT_FOUND", "TrueSheetView with tag $tag not found")
+          return@post
+        }
+
+        closure(view)
       } catch (e: Exception) {
         promise.reject("OPERATION_FAILED", "Failed to execute operation: ${e.message}", e)
       }

package/android/src/main/java/com/lodev09/truesheet/TrueSheetOverlayView.kt

@@ -0,0 +1,106 @@
+package com.lodev09.truesheet
+
+import android.annotation.SuppressLint
+import android.view.View
+import android.view.ViewGroup
+import android.view.accessibility.AccessibilityEvent
+import com.facebook.react.uimanager.StateWrapper
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.events.EventDispatcher
+import com.facebook.react.views.view.ReactViewGroup
+import com.lodev09.truesheet.core.TrueSheetOverlayRootView
+import com.lodev09.truesheet.core.TrueSheetOverlayRootViewDelegate
+import com.lodev09.truesheet.utils.findRootContainerView
+
+/**
+ * Hidden host that renders its children in a root view attached to the
+ * activity's content view, above every presented sheet.
+ */
+@SuppressLint("ViewConstructor")
+class TrueSheetOverlayView(private val reactContext: ThemedReactContext) :
+  ReactViewGroup(reactContext),
+  TrueSheetOverlayRootViewDelegate {
+
+  private val rootView = TrueSheetOverlayRootView(reactContext).apply {
+    delegate = this@TrueSheetOverlayView
+  }
+
+  private var rootContainerView: ViewGroup? = null
+
+  override var eventDispatcher: EventDispatcher? = null
+
+  private var lastWidth = 0
+  private var lastHeight = 0
+
+  var stateWrapper: StateWrapper? = null
+    set(value) {
+      field = value
+      pushState()
+    }
+
+  init {
+    // The host stays in the React tree for layout only — children render in the root view
+    visibility = GONE
+  }
+
+  // ==================== View Hierarchy Management ====================
+
+  override fun onAttachedToWindow() {
+    super.onAttachedToWindow()
+    attachRootView()
+  }
+
+  override fun onDetachedFromWindow() {
+    detachRootView()
+    super.onDetachedFromWindow()
+  }
+
+  private fun attachRootView() {
+    if (rootView.parent != null) return
+
+    val container = findRootContainerView(reactContext) ?: return
+    container.addView(rootView)
+    rootContainerView = container
+  }
+
+  private fun detachRootView() {
+    rootContainerView?.removeView(rootView)
+    rootContainerView = null
+  }
+
+  fun onDropInstance() {
+    detachRootView()
+    rootView.delegate = null
+  }
+
+  override fun addView(child: View?, index: Int) {
+    rootView.addView(child, index)
+  }
+
+  override fun getChildCount(): Int = rootView.childCount
+
+  override fun getChildAt(index: Int): View? = rootView.getChildAt(index)
+
+  override fun removeViewAt(index: Int) {
+    rootView.removeViewAt(index)
+  }
+
+  // Accessibility: children live in the root view since this view is hidden
+  override fun addChildrenForAccessibility(outChildren: ArrayList<View>) {}
+  override fun dispatchPopulateAccessibilityEvent(event: AccessibilityEvent): Boolean = false
+
+  // ==================== State ====================
+
+  override fun overlayRootViewDidChangeSize(width: Int, height: Int) {
+    if (width == lastWidth && height == lastHeight) return
+
+    lastWidth = width
+    lastHeight = height
+    pushState()
+  }
+
+  private fun pushState() {
+    if (lastWidth == 0 && lastHeight == 0) return
+    stateWrapper?.let { TrueSheetStateUpdater.updateContainerSize(it, lastWidth, lastHeight) }
+  }
+}

package/android/src/main/java/com/lodev09/truesheet/TrueSheetOverlayViewManager.kt

@@ -0,0 +1,45 @@
+package com.lodev09.truesheet
+
+import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.PointerEvents
+import com.facebook.react.uimanager.ReactStylesDiffMap
+import com.facebook.react.uimanager.StateWrapper
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.UIManagerHelper
+import com.facebook.react.uimanager.ViewGroupManager
+import com.facebook.react.uimanager.annotations.ReactProp
+
+/**
+ * ViewManager for TrueSheetOverlayView
+ * Renders content above every presented sheet
+ */
+@ReactModule(name = TrueSheetOverlayViewManager.REACT_CLASS)
+class TrueSheetOverlayViewManager : ViewGroupManager<TrueSheetOverlayView>() {
+
+  override fun getName(): String = REACT_CLASS
+
+  override fun createViewInstance(reactContext: ThemedReactContext): TrueSheetOverlayView = TrueSheetOverlayView(reactContext)
+
+  override fun onDropViewInstance(view: TrueSheetOverlayView) {
+    super.onDropViewInstance(view)
+    view.onDropInstance()
+  }
+
+  override fun addEventEmitters(reactContext: ThemedReactContext, view: TrueSheetOverlayView) {
+    view.eventDispatcher = UIManagerHelper.getEventDispatcherForReactTag(reactContext, view.id)
+  }
+
+  override fun updateState(view: TrueSheetOverlayView, props: ReactStylesDiffMap?, stateWrapper: StateWrapper?): Any? {
+    view.stateWrapper = stateWrapper
+    return null
+  }
+
+  @ReactProp(name = "pointerEvents")
+  fun setPointerEvents(view: TrueSheetOverlayView, pointerEventsStr: String?) {
+    view.pointerEvents = PointerEvents.parsePointerEvents(pointerEventsStr)
+  }
+
+  companion object {
+    const val REACT_CLASS = "TrueSheetOverlayView"
+  }
+}

package/android/src/main/java/com/lodev09/truesheet/TrueSheetPackage.kt

@@ -1,6 +1,6 @@
 package com.lodev09.truesheet
 
-import com.facebook.react.TurboReactPackage
+import com.facebook.react.BaseReactPackage
 import com.facebook.react.bridge.NativeModule
 import com.facebook.react.bridge.ReactApplicationContext
 import com.facebook.react.module.model.ReactModuleInfo
@@ -11,7 +11,7 @@ import com.facebook.react.uimanager.ViewManager
  * TrueSheet package for Fabric architecture
  * Registers all view managers and the TurboModule
  */
-class TrueSheetPackage : TurboReactPackage() {
+class TrueSheetPackage : BaseReactPackage() {
 
   override fun getModule(name: String, reactContext: ReactApplicationContext): NativeModule? =
     when (name) {
@@ -27,7 +27,6 @@ class TrueSheetPackage : TurboReactPackage() {
           TrueSheetModule::class.java.name,
           false, // canOverrideExistingModule
           false, // needsEagerInit
-          true, // hasConstants
           false, // isCxxModule
           true // isTurboModule
         )
@@ -39,6 +38,9 @@ class TrueSheetPackage : TurboReactPackage() {
       TrueSheetViewManager(),
       TrueSheetContainerViewManager(),
       TrueSheetContentViewManager(),
-      TrueSheetFooterViewManager()
+      TrueSheetHeaderViewManager(),
+      TrueSheetFooterViewManager(),
+      TrueSheetPeekViewManager(),
+      TrueSheetOverlayViewManager()
     )
 }

package/android/src/main/java/com/lodev09/truesheet/TrueSheetPeekView.kt

@@ -0,0 +1,72 @@
+package com.lodev09.truesheet
+
+import android.annotation.SuppressLint
+import android.view.ViewParent
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.views.view.ReactViewGroup
+
+/**
+ * Delegate interface for peek view size changes
+ */
+interface TrueSheetPeekViewDelegate {
+  fun peekViewDidChangeSize(width: Int, height: Int)
+}
+
+/**
+ * Peek view that marks part of the content as the sheet's peek content.
+ * The peek detent covers the content through this view's bottom edge.
+ */
+@SuppressLint("ViewConstructor")
+class TrueSheetPeekView(context: ThemedReactContext) : ReactViewGroup(context) {
+  var delegate: TrueSheetPeekViewDelegate? = null
+
+  override fun onLayout(
+    changed: Boolean,
+    left: Int,
+    top: Int,
+    right: Int,
+    bottom: Int
+  ) {
+    super.onLayout(changed, left, top, right, bottom)
+
+    attachToContainerView()
+
+    // Position changes matter too — the peek's offset within the content
+    // affects the peek detent.
+    if (changed) {
+      delegate?.peekViewDidChangeSize(width, height)
+    }
+  }
+
+  override fun onAttachedToWindow() {
+    super.onAttachedToWindow()
+    attachToContainerView()
+  }
+
+  /**
+   * Peek can be nested anywhere within the content, so it attaches itself to the
+   * nearest container instead of being mounted by it. The container also searches
+   * for it when the content is added to cover the initial (bottom-up) mount order.
+   */
+  private fun attachToContainerView() {
+    if (delegate != null) return
+
+    var parent: ViewParent? = parent
+    while (parent != null && parent !is TrueSheetContainerView) {
+      parent = parent.parent
+    }
+
+    (parent as? TrueSheetContainerView)?.attachPeekView(this)
+  }
+
+  /**
+   * Called by the ViewManager when the view is dropped (Fabric unmount)
+   */
+  fun detachFromContainerView() {
+    (delegate as? TrueSheetContainerView)?.detachPeekView(this)
+  }
+
+  companion object {
+    const val TAG_NAME = "TrueSheet"
+  }
+}

package/android/src/main/java/com/lodev09/truesheet/TrueSheetPeekViewManager.kt

@@ -0,0 +1,33 @@
+package com.lodev09.truesheet
+
+import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.PointerEvents
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.ViewGroupManager
+import com.facebook.react.uimanager.annotations.ReactProp
+
+/**
+ * ViewManager for TrueSheetPeekView
+ * Marks part of the content as the sheet's peek content
+ */
+@ReactModule(name = TrueSheetPeekViewManager.REACT_CLASS)
+class TrueSheetPeekViewManager : ViewGroupManager<TrueSheetPeekView>() {
+
+  override fun getName(): String = REACT_CLASS
+
+  override fun createViewInstance(reactContext: ThemedReactContext): TrueSheetPeekView = TrueSheetPeekView(reactContext)
+
+  override fun onDropViewInstance(view: TrueSheetPeekView) {
+    super.onDropViewInstance(view)
+    view.detachFromContainerView()
+  }
+
+  @ReactProp(name = "pointerEvents")
+  fun setPointerEvents(view: TrueSheetPeekView, pointerEventsStr: String?) {
+    view.pointerEvents = PointerEvents.parsePointerEvents(pointerEventsStr)
+  }
+
+  companion object {
+    const val REACT_CLASS = "TrueSheetPeekView"
+  }
+}

package/android/src/main/java/com/lodev09/truesheet/TrueSheetStateUpdater.kt

@@ -0,0 +1,63 @@
+package com.lodev09.truesheet
+
+import com.facebook.react.bridge.WritableNativeMap
+import com.facebook.react.uimanager.PixelUtil.pxToDp
+import com.facebook.react.uimanager.StateWrapper
+
+/**
+ * Synchronous Fabric state updates via JNI (see TrueSheetStateUpdater.cpp).
+ *
+ * StateWrapper.updateState commits asynchronously, so the container's Yoga
+ * layout lags the sheet by a frame or two during drags. The native bridge
+ * commits with `unstable_Immediate`, which mounts synchronously when called
+ * from the UI thread — same-frame layout, like iOS.
+ */
+object TrueSheetStateUpdater {
+  private val isAvailable: Boolean = try {
+    System.loadLibrary("react_codegen_TrueSheetSpec")
+    true
+  } catch (e: UnsatisfiedLinkError) {
+    false
+  }
+
+  /** Returns false when unavailable — caller should fall back to async updateState. */
+  fun updateState(stateWrapper: StateWrapper, widthDp: Float, heightDp: Float): Boolean =
+    isAvailable && nativeUpdateState(stateWrapper, widthDp, heightDp)
+
+  /**
+   * Pushes the container size (px) into the Fabric state — synchronously when
+   * the bridge is available, async otherwise.
+   */
+  fun updateContainerSize(stateWrapper: StateWrapper, widthPx: Int, heightPx: Int) {
+    val widthDp = widthPx.toFloat().pxToDp()
+    val heightDp = heightPx.toFloat().pxToDp()
+
+    if (updateState(stateWrapper, widthDp, heightDp)) return
+
+    val newStateData = WritableNativeMap()
+    newStateData.putDouble("containerWidth", widthDp.toDouble())
+    newStateData.putDouble("containerHeight", heightDp.toDouble())
+    stateWrapper.updateState(newStateData)
+  }
+
+  /** Returns false when unavailable — caller should fall back to async updateState. */
+  fun updateFooterState(stateWrapper: StateWrapper, bottomInsetDp: Float): Boolean =
+    isAvailable && nativeUpdateFooterState(stateWrapper, bottomInsetDp)
+
+  /**
+   * Publishes the precalculated bottom safe-area inset so a late-mounted
+   * footer's first layout is already padded (see TrueSheetFooterViewShadowNode).
+   */
+  fun setBottomSafeArea(insetDp: Float) {
+    if (isAvailable) nativeSetBottomSafeArea(insetDp)
+  }
+
+  @JvmStatic
+  private external fun nativeUpdateState(stateWrapper: Any, width: Float, height: Float): Boolean
+
+  @JvmStatic
+  private external fun nativeUpdateFooterState(stateWrapper: Any, bottomInset: Float): Boolean
+
+  @JvmStatic
+  private external fun nativeSetBottomSafeArea(insetDp: Float)
+}