@lodev09/react-native-true-sheet 4.0.0-beta.24 → 4.0.0-beta.26

package/README.md

@@ -34,6 +34,8 @@ The true native bottom sheet experience for your React Native Apps. 💩
 * 🧭 **Expo Router** - First-class support via the `Sheet` layout from `/navigation/expo-router`
 * 🍞 **`TrueSheetOverlay`** - Render toasts, dialogs, and other [overlays above your sheets](https://sheet.lodev09.com/guides/overlays) — no more `FullWindowOverlay`/`Modal` workarounds
 * 🔍 **Element inspector** - React Native's dev menu inspector now works inside a presented sheet
+* 🎨 **Dim color and opacity** - [Customize the dim](https://sheet.lodev09.com/guides/dimming#dim-color-and-opacity) behind the sheet with `dimColor` and `dimOpacity`
+* 📱 **Foldables** - [Rest the sheet on the hinge](https://sheet.lodev09.com/guides/foldables) of a half-folded iPhone with `foldOptions` (iOS 27.1+)
 
 ```sh
 npx expo install @lodev09/react-native-true-sheet@beta

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

@@ -125,6 +125,9 @@ class TrueSheetModule(reactContext: ReactApplicationContext) :
   fun dismissAll(animated: Boolean, promise: Promise) {
     Handler(Looper.getMainLooper()).post {
       try {
+        // Drop presents still waiting on the keyboard
+        viewRegistry.values.forEach { it.cancelPendingPresent() }
+
         val rootSheet = TrueSheetStackManager.getRootSheet()
         if (rootSheet == null) {
           promise.resolve(null)
@@ -221,5 +224,15 @@ class TrueSheetModule(reactContext: ReactApplicationContext) :
      */
     @JvmStatic
     fun getSheetByTag(tag: Int): TrueSheetView? = viewRegistry[tag]
+
+    /**
+     * Drop presents still waiting on the keyboard that would stack on [parent]
+     */
+    @JvmStatic
+    fun cancelPendingPresents(parent: TrueSheetView, restoreFocus: Boolean = true) {
+      viewRegistry.values.forEach {
+        if (it.pendingPresentParent === parent) it.cancelPendingPresent(restoreFocus)
+      }
+    }
   }
 }

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

@@ -3,6 +3,7 @@ package com.lodev09.truesheet
 import android.annotation.SuppressLint
 import android.view.View
 import android.view.ViewGroup
+import android.view.ViewTreeObserver
 import android.view.accessibility.AccessibilityEvent
 import com.facebook.react.uimanager.StateWrapper
 import com.facebook.react.uimanager.ThemedReactContext
@@ -50,13 +51,23 @@ class TrueSheetOverlayView(private val reactContext: ThemedReactContext) :
 
   // ==================== View Hierarchy Management ====================
 
+  // When the whole window goes away (e.g. activity destroyed), the container is mid-way through
+  // detaching its children by then, so removing the root view in onDetachedFromWindow crashes.
+  // This fires before that pass begins.
+  private val windowAttachListener = object : ViewTreeObserver.OnWindowAttachListener {
+    override fun onWindowAttached() {}
+    override fun onWindowDetached() = detachRootView()
+  }
+
   override fun onAttachedToWindow() {
     super.onAttachedToWindow()
+    viewTreeObserver.addOnWindowAttachListener(windowAttachListener)
     attachRootView()
   }
 
   override fun onDetachedFromWindow() {
-    detachRootView()
+    viewTreeObserver.removeOnWindowAttachListener(windowAttachListener)
+    rootContainerView?.post { if (!isAttachedToWindow) detachRootView() }
     super.onDetachedFromWindow()
   }
 

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

@@ -1,6 +1,7 @@
 package com.lodev09.truesheet
 
 import android.annotation.SuppressLint
+import android.graphics.Color
 import android.view.View
 import android.view.ViewGroup
 import android.view.accessibility.AccessibilityEvent
@@ -49,27 +50,45 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
 
   private var lastContainerWidth: Int = 0
   private var lastContainerHeight: Int = 0
+  private var hasCommittedContainerSize: Boolean = false
 
   var stateWrapper: StateWrapper? = null
     set(value) {
       field = value
+      if (value == null || hasCommittedContainerSize) return
 
-      // On first state wrapper assignment, immediately update state with screen dimensions.
-      // This ensures Yoga has initial width/height for content layout before presenting.
-      if (value != null && lastContainerWidth == 0 && lastContainerHeight == 0) {
-        updateState(viewController.screenWidth, viewController.screenHeight)
+      // A preallocated view gets its initial state before the node is committed, so the size
+      // update is dropped. Resend until a committed state has it, or Yoga sizes the sheet to its parent.
+      if ((value.stateData?.getDouble("containerHeight") ?: 0.0) > 0.0) {
+        hasCommittedContainerSize = true
+        return
       }
+
+      lastContainerWidth = 0
+      lastContainerHeight = 0
+      updateState(viewController.screenWidth, viewController.screenHeight)
     }
 
   // Debounce flag to coalesce rapid layout changes into a single sheet update
   private var isSheetUpdatePending: Boolean = false
 
+  // didFocus waiting for the slide-back after a child dismissed
+  private var isDidFocusPending: Boolean = false
+
   // Root container for the coordinator layout (activity or Modal dialog content view)
   internal var rootContainerView: ViewGroup? = null
 
   // Screen event observer for react-native-screens integration
   internal var screensEventObserver: RNScreensEventObserver? = null
 
+  // Present deferred until the keyboard hides; a dismiss before then cancels it
+  private var pendingPresentCallback: (() -> Unit)? = null
+  private var pendingPresentGeneration = 0
+
+  // Sheet the deferred present will stack on — dismissing it drops the present, like iOS
+  internal var pendingPresentParent: TrueSheetView? = null
+    private set
+
   // ==================== Initialization ====================
 
   init {
@@ -189,6 +208,7 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
 
     cleanupScreenEventObserver()
     didInitiallyPresent = false
+    cancelPendingPresent()
 
     viewController.dismissPromise = { viewController.delegate = null }
 
@@ -247,6 +267,24 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
     }
   }
 
+  fun setDimColor(color: Int?) {
+    val resolved = color ?: Color.BLACK
+    if (viewController.dimColor == resolved) return
+    viewController.dimColor = resolved
+    if (viewController.isPresented) {
+      viewController.updateDimAmount()
+    }
+  }
+
+  fun setDimOpacity(opacity: Float) {
+    val resolved = if (opacity < 0f) TrueSheetViewController.DEFAULT_DIM_OPACITY else opacity.coerceIn(0f, 1f)
+    if (viewController.dimOpacity == resolved) return
+    viewController.dimOpacity = resolved
+    if (viewController.isPresented) {
+      viewController.updateDimAmount()
+    }
+  }
+
   fun setDimmedDetentIndex(index: Int) {
     if (viewController.dimmedDetentIndex == index) return
     viewController.dimmedDetentIndex = index
@@ -364,10 +402,12 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
 
       // For stacked sheets on the same screen, inherit parent's presenter screen tag.
       // If parent was hidden by screen navigation, this sheet is on a different screen.
-      val parentScreenTag = viewController.parentSheetView?.screensEventObserver?.presenterScreenTag ?: 0
+      val parentObserver = viewController.parentSheetView?.screensEventObserver
+      val parentScreenTag = parentObserver?.presenterScreenTag ?: 0
       val parentHiddenByScreen = viewController.parentSheetView?.viewController?.wasHiddenByScreen == true
       if (parentScreenTag != 0 && !parentHiddenByScreen) {
         presenterScreenTag = parentScreenTag
+        ancestorScreenTags = parentObserver?.ancestorScreenTags ?: emptySet()
       } else {
         capturePresenterScreenFromView(this@TrueSheetView)
       }
@@ -399,7 +439,7 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
 
   @UiThread
   fun present(detentIndex: Int, animated: Boolean = true, promiseCallback: () -> Unit) {
-    if (viewController.isPresented) {
+    if (viewController.isPresented || pendingPresentCallback != null) {
       RNLog.w(reactContext, "TrueSheet: sheet is already presented. Use resize() to change detent.")
       promiseCallback()
       return
@@ -414,8 +454,18 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
     val shouldDismissKeyboard = isFocusedViewWithinSheet || viewController.isDimmedAtDetentIndex(detentIndex)
     if (shouldDismissKeyboard && KeyboardUtils.isKeyboardVisible(reactContext)) {
       viewController.saveFocusedView()
+      pendingPresentCallback = promiseCallback
+      pendingPresentParent = parentSheet
+      // A cancelled request's callback can still land (a timer below API 30) — only the latest may present
+      val generation = ++pendingPresentGeneration
       KeyboardUtils.dismiss(this) {
-        post { presentSheet(detentIndex, animated, promiseCallback) }
+        post {
+          if (generation != pendingPresentGeneration) return@post
+          val callback = pendingPresentCallback ?: return@post
+          pendingPresentCallback = null
+          pendingPresentParent = null
+          presentSheet(detentIndex, animated, callback)
+        }
       }
       // Blur like iOS so JS focus state stays in sync until restoreFocusedView() refocuses it
       rootView.findFocus()?.clearFocus()
@@ -447,8 +497,31 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
     viewController.handleBackPress()
   }
 
+  /**
+   * Drops a present still waiting on the keyboard and resolves its caller. Returns whether one was pending.
+   * Skip [restoreFocus] when the focused view is going away with its dismissing sheet.
+   */
+  fun cancelPendingPresent(restoreFocus: Boolean = true): Boolean {
+    val callback = pendingPresentCallback ?: return false
+    pendingPresentCallback = null
+    pendingPresentParent = null
+    if (restoreFocus) {
+      viewController.restoreFocusedView()
+    } else {
+      viewController.clearFocusedView()
+    }
+    callback()
+    return true
+  }
+
   @UiThread
   fun dismiss(animated: Boolean = true, promiseCallback: () -> Unit) {
+    // Dismissing before a deferred present starts cancels it — nothing was presented
+    if (cancelPendingPresent()) {
+      promiseCallback()
+      return
+    }
+
     if (viewController.isBeingDismissed || !viewController.isPresented) {
       RNLog.w(reactContext, "TrueSheet: sheet is already dismissed. No need to dismiss it again.")
       promiseCallback()
@@ -471,6 +544,9 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
       return
     }
 
+    // A present waiting on the keyboard would stack above this sheet — drop it with the rest
+    TrueSheetModule.cancelPendingPresents(parent = this)
+
     val sheetsAbove = TrueSheetStackManager.getSheetsAbove(this)
     // Create snapshot only for topmost sheet (first in reversed list)
     sheetsAbove.firstOrNull()?.viewController?.createSheetSnapshot()
@@ -537,7 +613,7 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
 
     // Propagate any additional translation up the stack
     if (additionalTranslation > 0) {
-      TrueSheetStackManager.getParentSheet(this)?.addTranslation(additionalTranslation)
+      viewController.parentSheetView?.addTranslation(additionalTranslation)
     }
   }
 
@@ -569,7 +645,7 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
 
     val additionalTranslation = newTranslation - currentTranslation
     if (additionalTranslation > 0) {
-      TrueSheetStackManager.getParentSheet(this)?.addTranslation(additionalTranslation, animated = false)
+      viewController.parentSheetView?.addTranslation(additionalTranslation, animated = false)
     }
   }
 
@@ -580,7 +656,7 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
     if (viewController.isExpanded) return
 
     viewController.translateSheet(viewController.currentTranslationY + amount, animated)
-    TrueSheetStackManager.getParentSheet(this)?.addTranslation(amount, animated)
+    viewController.parentSheetView?.addTranslation(amount, animated)
   }
 
   /**
@@ -593,12 +669,33 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
 
     // Parent should recalculate its translation based on this sheet's position
     val mySheetTop = viewController.detentCalculator.getSheetTopForDetentIndex(viewController.currentDetentIndex)
-    TrueSheetStackManager.getParentSheet(this)?.updateTranslationForChild(mySheetTop)
+    viewController.parentSheetView?.updateTranslationForChild(mySheetTop)
+  }
+
+  /**
+   * Resets translation after a child dismissed and emits didFocus once the sheet settles.
+   * A sheet presented on top before then cancels the slide-back, so the next blur flushes it.
+   */
+  private fun focusAfterResetTranslation() {
+    isDidFocusPending = true
+    resetTranslation { emitPendingDidFocus() }
+  }
+
+  private fun emitPendingDidFocus() {
+    if (!isDidFocusPending) return
+    isDidFocusPending = false
+
+    if (viewController.isPresented && !viewController.isBeingDismissed) {
+      viewControllerDidFocus()
+    }
   }
 
   // ==================== TrueSheetViewControllerDelegate ====================
 
   override fun viewControllerWillPresent(index: Int, position: Float, detent: Float) {
+    // Observe from the start so navigating away mid-present still hides the sheet
+    setupScreenEventObserver()
+
     // Update parent sheet translation now that content is measured
     TrueSheetStackManager.updateParentTranslation(this)
 
@@ -607,13 +704,14 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
   }
 
   override fun viewControllerDidPresent(index: Int, position: Float, detent: Float) {
-    setupScreenEventObserver()
-
     val surfaceId = UIManagerHelper.getSurfaceId(this)
     eventDispatcher?.dispatchEvent(DidPresentEvent(surfaceId, id, index, position, detent))
   }
 
   override fun viewControllerWillDismiss() {
+    // Covers every dismiss path (swipe, back press, stack); the focused view leaves with this sheet
+    TrueSheetModule.cancelPendingPresents(parent = this, restoreFocus = false)
+
     val surfaceId = UIManagerHelper.getSurfaceId(this)
     eventDispatcher?.dispatchEvent(WillDismissEvent(surfaceId, id))
   }
@@ -624,6 +722,9 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
   }
 
   override fun viewControllerDidDismiss(parent: TrueSheetView?) {
+    // A slide-back cut short by this sheet's own dismissal never emits; don't carry it over
+    isDidFocusPending = false
+
     // Detach coordinator from the root container view
     viewController.coordinatorLayout?.let { rootContainerView?.removeView(it) }
     rootContainerView = null
@@ -635,12 +736,10 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
 
     TrueSheetStackManager.unregisterSheet(this)
 
-    parent?.resetTranslation {
-      val parentController = parent.viewController
-      if (parentController.isPresented && !parentController.isBeingDismissed) {
-        parent.viewControllerDidFocus()
-      }
-    }
+    // The sheets below stop blending this sheet's dim
+    parent?.viewController?.takeIf { it.isPresented }?.updateDimAmount()
+
+    parent?.focusAfterResetTranslation()
   }
 
   override fun viewControllerDidChangeDetent(index: Int, position: Float, detent: Float) {
@@ -683,6 +782,8 @@ class TrueSheetView(private val reactContext: ThemedReactContext) :
   }
 
   override fun viewControllerWillBlur() {
+    emitPendingDidFocus()
+
     val surfaceId = UIManagerHelper.getSurfaceId(this)
     eventDispatcher?.dispatchEvent(WillBlurEvent(surfaceId, id))
   }

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

@@ -3,6 +3,7 @@ package com.lodev09.truesheet
 import android.animation.ValueAnimator
 import android.annotation.SuppressLint
 import android.graphics.Canvas
+import android.graphics.Color
 import android.os.Build
 import android.view.MotionEvent
 import android.view.View
@@ -11,6 +12,7 @@ import android.view.accessibility.AccessibilityEvent
 import android.view.accessibility.AccessibilityNodeInfo
 import android.widget.ImageView
 import androidx.coordinatorlayout.widget.CoordinatorLayout
+import androidx.core.graphics.ColorUtils
 import androidx.core.graphics.createBitmap
 import androidx.core.view.isNotEmpty
 import com.facebook.react.R
@@ -43,6 +45,7 @@ import com.lodev09.truesheet.utils.Insets
 import com.lodev09.truesheet.utils.KeyboardUtils
 import com.lodev09.truesheet.utils.ScreenUtils
 import com.lodev09.truesheet.utils.TouchEventDeduper
+import kotlin.math.roundToInt
 
 // =============================================================================
 // MARK: - Data Types & Delegate Protocol
@@ -122,6 +125,7 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
   TrueSheetBottomSheetViewDelegate {
 
   companion object {
+    const val DEFAULT_DIM_OPACITY = 0.5f
     private const val DEFAULT_MAX_WIDTH = 640 // dp
     private const val DEFAULT_CORNER_RADIUS = 16 // dp
     private const val DEFAULT_PLACEMENT_OFFSET = 16 // dp
@@ -171,6 +175,9 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
   // animation doesn't snap the sheet back to the stale currentDetentIndex.
   private var pendingDetentIndex: Int = -1
 
+  private val isSettlingInPlace: Boolean
+    get() = !isBeingDismissed && pendingDetentIndex >= 0 && pendingDetentIndex == currentDetentIndex
+
   private var interactionState: InteractionState = InteractionState.Idle
 
   // A content/header/footer size change arrived mid-drag — reconfiguring then
@@ -190,6 +197,12 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
   private var detentIndexBeforeKeyboard: Int = -1
   private var isKeyboardDismissProgrammatic = false
 
+  // The keyboard hid under a touch (e.g. keyboardDismissMode="on-drag") — the
+  // keyboard stops stay until it lifts. Settling or moving the stops under a
+  // scrolling finger makes the behavior's nested pre-scroll snap the sheet and
+  // jump the content.
+  private var isKeyboardSettleDeferred = false
+
   // Sheet top when a keyboard-floor drag was released; -1 once the settle target is known
   private var keyboardSettleStartTop = -1
   private var focusedViewBeforeBlur: View? = null
@@ -226,6 +239,9 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
   // Appearance Configuration
   var dimmed = true
   var dimmedDetentIndex = 0
+  var dimColor: Int = Color.BLACK
+  var dimOpacity: Float = DEFAULT_DIM_OPACITY
+  private var dimProgress = 0f
   override var grabber: Boolean = true
   override var grabberOptions: GrabberOptions? = null
   override var accessibilityOptions: AccessibilityOptions? = null
@@ -473,6 +489,7 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
     detentIndexBeforeKeyboard = -1
     pendingDetentIndex = -1
     isKeyboardDismissProgrammatic = false
+    isKeyboardSettleDeferred = false
     focusedViewBeforeBlur = null
     shouldAnimatePresent = true
   }
@@ -552,6 +569,12 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
     delegate?.viewControllerDidAttemptDismiss()
   }
 
+  override fun coordinatorLayoutDidEndTouch() {
+    if (!isKeyboardSettleDeferred) return
+    isKeyboardSettleDeferred = false
+    setupSheetDetentsForSizeChange()
+  }
+
   // =============================================================================
   // MARK: - TrueSheetDimViewDelegate
   // =============================================================================
@@ -640,7 +663,8 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
       return
     }
 
-    if (!isPresented) return
+    // The slide-out owns the sheet now — a present settle landing mid-dismiss must not finish the present
+    if (!isPresented || isBeingDismissed) return
 
     when (newState) {
       BottomSheetBehavior.STATE_DRAGGING -> handleDragBegin(sheetView)
@@ -862,6 +886,8 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
     setupSheetDetents()
     setupDimmedBackground()
     setupKeyboardObserver()
+    // Before the slide, so an input focused in onWillPresent insets the scrollable
+    containerView?.setupKeyboardHandler()
 
     displayedBackgroundIndex = detentIndex
     setupBackground(animated = false)
@@ -968,6 +994,9 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
       return
     }
 
+    // Bring the parent back alongside the slide-out (like iOS) instead of after it
+    parentSheetView?.resetTranslation()
+
     sheet.animate()
       .y(realScreenHeight.toFloat())
       .setDuration(DISMISS_DURATION)
@@ -981,11 +1010,9 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
     // Restore isHideable to actual value after present animation
     behavior?.isHideable = dismissible
 
-    containerView?.setupKeyboardHandler()
-
     val (index, position, detent) = getDetentInfoWithValue(currentDetentIndex)
-    delegate?.viewControllerDidPresent(index, position, detent)
     parentSheetView?.viewControllerDidBlur()
+    delegate?.viewControllerDidPresent(index, position, detent)
     delegate?.viewControllerDidFocus()
     sheetView?.updateGrabberAccessibilityValue(index, detents.size)
 
@@ -1101,8 +1128,9 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
 
   fun setupSheetDetentsForSizeChange() {
     // Reconfiguring while the container tracks the sheet can interrupt its
-    // motion. Apply content size changes once the drag or resize settles.
-    if (interactionState is InteractionState.Dragging || isSettling) {
+    // motion. Apply content size changes once the drag or resize settles, or
+    // the touch holding a deferred keyboard settle lifts.
+    if (interactionState is InteractionState.Dragging || isSettling || isKeyboardSettleDeferred) {
       hasPendingSizeChange = true
       return
     }
@@ -1156,6 +1184,7 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
       if (dimView == null) {
         dimView = TrueSheetDimView(reactContext).apply {
           delegate = this@TrueSheetViewController
+          setDimColor(dimColor)
         }
       }
       if (!parentDimVisible) {
@@ -1169,6 +1198,7 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
         if (parentDimView == null) {
           parentDimView = TrueSheetDimView(reactContext).apply {
             delegate = this@TrueSheetViewController
+            setDimColor(dimColor)
           }
         }
         parentDimView?.attach(parentBottomSheet, parentController.sheetCornerRadius)
@@ -1182,25 +1212,57 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
   }
 
   fun updateDimAmount(sheetTop: Int? = null, animated: Boolean = false) {
-    if (!dimmed) return
-
-    // While keyboard is active or transitioning, use the target detent position for dim
-    val top = if (isKeyboardActive) {
-      detentCalculator.getSheetTopForDetentIndex(currentDetentIndex)
-    } else {
-      val keyboardOffset = if (isBeingDismissed) 0 else currentKeyboardInset
-      (sheetTop ?: sheetView?.top ?: return) + keyboardOffset
-    }
+    if (dimmed) {
+      // While keyboard is active or transitioning, or settling in place after a content
+      // resize (the detent top moves before the sheet does), use the target detent position
+      val top = if (isKeyboardActive || isSettlingInPlace) {
+        detentCalculator.getSheetTopForDetentIndex(currentDetentIndex)
+      } else {
+        val keyboardOffset = if (isBeingDismissed) 0 else currentKeyboardInset
+        (sheetTop ?: sheetView?.top ?: return) + keyboardOffset
+      }
 
-    if (animated) {
-      val targetAlpha = dimView?.calculateAlpha(
+      dimProgress = dimView?.calculateProgress(
         top,
         dimmedDetentIndex,
         detentCalculator::getSheetTopForDetentIndex
       ) ?: 0f
-      dimViews.forEach { it.animate().alpha(targetAlpha).setDuration(200).start() }
-    } else {
-      dimViews.forEach { it.interpolateAlpha(top, dimmedDetentIndex, detentCalculator::getSheetTopForDetentIndex) }
+      applyDimAmount(animated)
+    }
+
+    // The sheets below blend this sheet's dim into theirs
+    var parent = parentSheetView?.viewController
+    while (parent != null) {
+      parent.applyDimAmount(animated)
+      parent = parent.parentSheetView?.viewController
+    }
+  }
+
+  /**
+   * Dims by this sheet's progress, blending in the dim of the sheets presented on top by theirs,
+   * so everything below the topmost sheet dims with its color and opacity.
+   */
+  private fun applyDimAmount(animated: Boolean) {
+    if (!dimmed) return
+
+    var color = dimColor
+    var opacity = dimOpacity
+    (delegate as? TrueSheetView)?.let { hostView ->
+      TrueSheetStackManager.getSheetsAbove(hostView).asReversed().forEach {
+        val child = it.viewController
+        if (!child.dimmed) return@forEach
+        val below = (1f - child.dimProgress) * opacity
+        val above = child.dimProgress * child.dimOpacity
+        if (below + above > 0f) color = ColorUtils.blendARGB(color, child.dimColor, above / (below + above))
+        opacity = below + above
+      }
+    }
+
+    // Keep opacity in the color so a transparent dim still receives touches.
+    color = ColorUtils.setAlphaComponent(color, (Color.alpha(color) * opacity).roundToInt())
+    dimViews.forEach {
+      it.setDimColor(color)
+      if (animated) it.animate().alpha(dimProgress).setDuration(200).start() else it.alpha = dimProgress
     }
   }
 
@@ -1272,6 +1334,10 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
       ?: reactContext.currentActivity?.currentFocus
   }
 
+  fun clearFocusedView() {
+    focusedViewBeforeBlur = null
+  }
+
   fun restoreFocusedView() {
     val viewToFocus = focusedViewBeforeBlur ?: return
     focusedViewBeforeBlur = null
@@ -1314,13 +1380,16 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
             return
           }
           val restoring = !isBeingDismissed && detentIndexBeforeKeyboard >= 0
+          if (restoring) {
+            currentDetentIndex = detentIndexBeforeKeyboard
+          }
 
-          // Skip reconfigure during interactive keyboard dismiss (e.g. keyboardDismissMode="on-drag")
-          // to prevent the sheet from jumping. keyboardDidHide will reconfigure after.
-          if (restoring || isKeyboardDismissProgrammatic) {
-            if (restoring) {
-              currentDetentIndex = detentIndexBeforeKeyboard
-            }
+          // A scroll-committed keyboard detent still holds the keyboard-shifted
+          // top too — reconfigure so the sheet settles with the keyboard, once
+          // any touch on the sheet lifts
+          if (!isBeingDismissed && coordinatorLayout?.isTouchingSheet == true) {
+            isKeyboardSettleDeferred = true
+          } else if (!isBeingDismissed || isKeyboardDismissProgrammatic) {
             setupSheetDetents()
           }
 
@@ -1343,7 +1412,9 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
             return
           }
           detentIndexBeforeKeyboard = -1
-          setupSheetDetents(applyState = false)
+          if (!isKeyboardSettleDeferred) {
+            setupSheetDetents(applyState = false)
+          }
           positionFooter()
           updateDimAmount(
             sheetTop = detentCalculator.getSheetTopForDetentIndex(currentDetentIndex),
@@ -1458,6 +1529,11 @@ class TrueSheetViewController(private val reactContext: ThemedReactContext) :
     delegate?.viewControllerWillBlur()
     delegate?.viewControllerWillDismiss()
     parentSheetView?.viewControllerWillFocus()
+
+    // Dismissed mid-present: finishPresent() won't run. Settle the pending present well
+    // before didDismiss so JS clears isPresenting and unmounts the lazy native view
+    presentPromise?.invoke()
+    presentPromise = null
   }
 
   private fun emitDidDismissEvents() {