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

package/android/src/main/java/com/lodev09/truesheet/core/TrueSheetDimView.kt

@@ -0,0 +1,162 @@
+package com.lodev09.truesheet.core
+
+import android.annotation.SuppressLint
+import android.graphics.Color
+import android.graphics.Outline
+import android.view.MotionEvent
+import android.view.View
+import android.view.ViewGroup
+import android.view.ViewOutlineProvider
+import com.facebook.react.uimanager.PointerEvents
+import com.facebook.react.uimanager.ReactPointerEventsView
+import com.facebook.react.uimanager.ThemedReactContext
+import com.lodev09.truesheet.utils.ScreenUtils
+
+/**
+ * Delegate for handling dim view interactions.
+ */
+interface TrueSheetDimViewDelegate {
+  fun dimViewDidTap()
+}
+
+/**
+ * Dim view that sits behind the bottom sheet in the CoordinatorLayout.
+ *
+ * Key behaviors:
+ * - When alpha > 0 (dimmed): blocks touches and calls delegate on tap
+ * - When alpha == 0 (not dimmed): passes touches through to views below
+ *
+ * This implements the "dimmedDetentIndex" equivalent functionality:
+ * the view only becomes interactive when the sheet is at or above the dimmed detent.
+ */
+@SuppressLint("ViewConstructor")
+class TrueSheetDimView(private val reactContext: ThemedReactContext) :
+  View(reactContext),
+  ReactPointerEventsView {
+
+  companion object {
+    private const val MAX_ALPHA = 0.5f
+  }
+
+  var delegate: TrueSheetDimViewDelegate? = null
+
+  private var targetView: ViewGroup? = null
+
+  /**
+   * Whether this view should block gestures (when dimmed).
+   */
+  private val blockGestures: Boolean
+    get() = alpha > 0f
+
+  init {
+    layoutParams = ViewGroup.LayoutParams(
+      ViewGroup.LayoutParams.MATCH_PARENT,
+      ViewGroup.LayoutParams.MATCH_PARENT
+    )
+    setBackgroundColor(Color.BLACK)
+    alpha = 0f
+
+    // Handle taps on the dim view
+    setOnClickListener {
+      delegate?.dimViewDidTap()
+    }
+
+    importantForAccessibility = IMPORTANT_FOR_ACCESSIBILITY_NO
+  }
+
+  // =============================================================================
+  // MARK: - Attachment
+  // =============================================================================
+
+  /**
+   * Attaches this dim view to a target view group.
+   * For CoordinatorLayout usage, pass null to use the default (activity's decor view).
+   * For stacked sheets, pass the parent sheet's bottom sheet view with corner radius.
+   */
+  fun attach(view: ViewGroup? = null, cornerRadius: Float = 0f) {
+    if (parent != null) return
+    targetView = view ?: reactContext.currentActivity?.window?.decorView as? ViewGroup
+
+    if (cornerRadius > 0f) {
+      outlineProvider = object : ViewOutlineProvider() {
+        override fun getOutline(v: View, outline: Outline) {
+          outline.setRoundRect(0, 0, v.width, v.height, cornerRadius)
+        }
+      }
+      clipToOutline = true
+    } else {
+      outlineProvider = null
+      clipToOutline = false
+    }
+
+    targetView?.addView(this)
+  }
+
+  /**
+   * Attaches this dim view to a CoordinatorLayout at index 0 (behind the sheet).
+   */
+  fun attachToCoordinator(coordinator: TrueSheetCoordinatorLayout) {
+    if (parent != null) return
+    targetView = coordinator
+    outlineProvider = null
+    clipToOutline = false
+    coordinator.addView(this, 0)
+  }
+
+  fun detach() {
+    targetView?.removeView(this)
+    targetView = null
+  }
+
+  // =============================================================================
+  // MARK: - Alpha Calculation
+  // =============================================================================
+
+  fun calculateAlpha(sheetTop: Int, dimmedDetentIndex: Int, getSheetTopForDetentIndex: (Int) -> Int): Float {
+    val realHeight = ScreenUtils.getRealScreenHeight(reactContext)
+    val dimmedDetentTop = getSheetTopForDetentIndex(dimmedDetentIndex)
+    val belowDimmedTop = if (dimmedDetentIndex > 0) getSheetTopForDetentIndex(dimmedDetentIndex - 1) else realHeight
+
+    return when {
+      sheetTop <= dimmedDetentTop -> MAX_ALPHA
+
+      sheetTop >= belowDimmedTop -> 0f
+
+      else -> {
+        val progress = 1f - (sheetTop - dimmedDetentTop).toFloat() / (belowDimmedTop - dimmedDetentTop)
+        (progress * MAX_ALPHA).coerceIn(0f, MAX_ALPHA)
+      }
+    }
+  }
+
+  fun interpolateAlpha(sheetTop: Int, dimmedDetentIndex: Int, getSheetTopForDetentIndex: (Int) -> Int) {
+    alpha = calculateAlpha(sheetTop, dimmedDetentIndex, getSheetTopForDetentIndex)
+  }
+
+  // =============================================================================
+  // MARK: - Touch Handling
+  // =============================================================================
+
+  override fun onTouchEvent(event: MotionEvent): Boolean {
+    if (blockGestures) {
+      // When dimmed, consume touch and trigger click on ACTION_UP
+      if (event.action == MotionEvent.ACTION_UP) {
+        performClick()
+      }
+      return true
+    }
+    // When not dimmed, let touches pass through
+    return false
+  }
+
+  // =============================================================================
+  // MARK: - ReactPointerEventsView
+  // =============================================================================
+
+  /**
+   * When dimmed (alpha > 0), intercept touches (AUTO).
+   * When not dimmed (alpha == 0), pass through (NONE).
+   */
+  override val pointerEvents: PointerEvents
+    get() = if (blockGestures) PointerEvents.AUTO else PointerEvents.NONE
+}

package/android/src/main/java/com/lodev09/truesheet/core/TrueSheetGrabberView.kt

@@ -0,0 +1,180 @@
+package com.lodev09.truesheet.core
+
+import android.annotation.SuppressLint
+import android.content.Context
+import android.content.res.Configuration
+import android.graphics.Color
+import android.graphics.drawable.GradientDrawable
+import android.os.Bundle
+import android.view.Gravity
+import android.view.View
+import android.view.accessibility.AccessibilityNodeInfo
+import android.widget.FrameLayout
+import androidx.core.graphics.ColorUtils
+import androidx.core.view.ViewCompat
+import com.facebook.react.uimanager.PixelUtil.dpToPx
+
+/**
+ * Options for customizing the grabber appearance.
+ */
+data class GrabberOptions(
+  val width: Float? = null,
+  val height: Float? = null,
+  val topMargin: Float? = null,
+  val cornerRadius: Float? = null,
+  val color: Int? = null,
+  val adaptive: Boolean = true
+)
+
+/**
+ * Options for customizing (e.g. localizing) accessibility strings.
+ */
+data class AccessibilityOptions(
+  val grabberLabel: String? = null,
+  val expandedValue: String? = null,
+  val collapsedValue: String? = null,
+  val detentValue: String? = null,
+  val expandActionLabel: String? = null,
+  val collapseActionLabel: String? = null,
+  val paneTitle: String? = null
+)
+
+/**
+ * Native grabber (drag handle) view for the bottom sheet.
+ * Displays a small pill-shaped indicator at the top of the sheet with a tappable hitbox.
+ */
+@SuppressLint("ViewConstructor")
+class TrueSheetGrabberView(
+  context: Context,
+  private val options: GrabberOptions? = null,
+  private val accessibilityOptions: AccessibilityOptions? = null
+) : FrameLayout(context) {
+
+  companion object {
+    private const val DEFAULT_WIDTH = 32f // dp
+    private const val DEFAULT_HEIGHT = 4f // dp
+    private const val DEFAULT_TOP_MARGIN = 16f // dp
+    private const val DEFAULT_ALPHA = 0.4f
+    private const val HITBOX_PADDING_HORIZONTAL = 16f // dp
+    private const val HITBOX_PADDING_VERTICAL = 16f // dp
+    private val DEFAULT_COLOR = Color.argb((DEFAULT_ALPHA * 255).toInt(), 73, 69, 79) // #49454F @ 40%
+  }
+
+  private val grabberWidth: Float
+    get() = options?.width ?: DEFAULT_WIDTH
+
+  private val grabberHeight: Float
+    get() = options?.height ?: DEFAULT_HEIGHT
+
+  private val grabberTopMargin: Float
+    get() = options?.topMargin ?: DEFAULT_TOP_MARGIN
+
+  private val grabberCornerRadius: Float
+    get() = options?.cornerRadius ?: (grabberHeight / 2)
+
+  private val isAdaptive: Boolean
+    get() = options?.adaptive ?: true
+
+  private val grabberColor: Int
+    get() = if (isAdaptive) getAdaptiveColor(options?.color) else options?.color ?: DEFAULT_COLOR
+
+  var onAccessibilityIncrement: (() -> Unit)? = null
+  var onAccessibilityDecrement: (() -> Unit)? = null
+
+  init {
+    val hitboxWidth = grabberWidth + (HITBOX_PADDING_HORIZONTAL * 2)
+    val hitboxHeight = grabberHeight + (HITBOX_PADDING_VERTICAL * 2)
+
+    layoutParams = LayoutParams(
+      hitboxWidth.dpToPx().toInt(),
+      hitboxHeight.dpToPx().toInt()
+    ).apply {
+      gravity = Gravity.CENTER_HORIZONTAL or Gravity.TOP
+      topMargin = (grabberTopMargin - HITBOX_PADDING_VERTICAL).dpToPx().toInt()
+    }
+
+    // The visible pill centered inside the hitbox
+    val pillView = View(context).apply {
+      layoutParams = LayoutParams(
+        grabberWidth.dpToPx().toInt(),
+        grabberHeight.dpToPx().toInt()
+      ).apply {
+        gravity = Gravity.CENTER
+      }
+      background = GradientDrawable().apply {
+        shape = GradientDrawable.RECTANGLE
+        cornerRadius = grabberCornerRadius.dpToPx()
+        setColor(grabberColor)
+      }
+    }
+
+    addView(pillView)
+
+    isFocusable = true
+    contentDescription = accessibilityOptions?.grabberLabel ?: "Drag handle"
+
+    accessibilityDelegate = object : View.AccessibilityDelegate() {
+      override fun onInitializeAccessibilityNodeInfo(host: View, info: AccessibilityNodeInfo) {
+        super.onInitializeAccessibilityNodeInfo(host, info)
+        info.addAction(
+          AccessibilityNodeInfo.AccessibilityAction(
+            AccessibilityNodeInfo.ACTION_SCROLL_FORWARD,
+            accessibilityOptions?.expandActionLabel ?: "Expand"
+          )
+        )
+        info.addAction(
+          AccessibilityNodeInfo.AccessibilityAction(
+            AccessibilityNodeInfo.ACTION_SCROLL_BACKWARD,
+            accessibilityOptions?.collapseActionLabel ?: "Collapse"
+          )
+        )
+        info.className = "android.widget.SeekBar"
+      }
+
+      override fun performAccessibilityAction(host: View, action: Int, args: Bundle?): Boolean =
+        when (action) {
+          AccessibilityNodeInfo.ACTION_SCROLL_FORWARD -> {
+            onAccessibilityIncrement?.invoke()
+            true
+          }
+
+          AccessibilityNodeInfo.ACTION_SCROLL_BACKWARD -> {
+            onAccessibilityDecrement?.invoke()
+            true
+          }
+
+          else -> super.performAccessibilityAction(host, action, args)
+        }
+    }
+  }
+
+  fun updateAccessibilityValue(index: Int, detentCount: Int) {
+    val description: CharSequence? = when {
+      index < 0 || detentCount <= 0 -> null
+
+      index >= detentCount - 1 -> accessibilityOptions?.expandedValue ?: "Expanded"
+
+      index == 0 -> accessibilityOptions?.collapsedValue ?: "Collapsed"
+
+      else ->
+        (accessibilityOptions?.detentValue ?: "Detent {index} of {count}")
+          .replace("{index}", "${index + 1}")
+          .replace("{count}", "$detentCount")
+    }
+    ViewCompat.setStateDescription(this, description)
+  }
+
+  private fun getAdaptiveColor(baseColor: Int? = null): Int {
+    val nightMode = context.resources.configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK
+    val isDarkMode = nightMode == Configuration.UI_MODE_NIGHT_YES
+    val modeColor = if (isDarkMode) Color.WHITE else Color.BLACK
+
+    return if (baseColor != null) {
+      // Blend user color with mode color for adaptive effect
+      val blendedColor = ColorUtils.blendARGB(baseColor, modeColor, 0.3f)
+      ColorUtils.setAlphaComponent(blendedColor, (DEFAULT_ALPHA * 255).toInt())
+    } else {
+      ColorUtils.setAlphaComponent(modeColor, (DEFAULT_ALPHA * 255).toInt())
+    }
+  }
+}

package/android/src/main/java/com/lodev09/truesheet/core/TrueSheetKeyboardObserver.kt

@@ -0,0 +1,207 @@
+package com.lodev09.truesheet.core
+
+import android.graphics.Rect
+import android.os.Build
+import android.view.View
+import android.view.ViewTreeObserver
+import androidx.core.view.ViewCompat
+import androidx.core.view.WindowInsetsAnimationCompat
+import androidx.core.view.WindowInsetsCompat
+import com.facebook.react.uimanager.ThemedReactContext
+import com.lodev09.truesheet.utils.KeyboardUtils
+import com.lodev09.truesheet.utils.isDescendantOf
+
+interface TrueSheetKeyboardObserverDelegate {
+  fun keyboardWillShow(height: Int) {}
+  fun keyboardDidShow(height: Int) {}
+  fun keyboardWillHide() {}
+  fun keyboardDidHide() {}
+  fun keyboardDidChangeHeight(height: Int) {}
+  fun focusDidChange(newFocus: View) {}
+}
+
+/**
+ * Tracks keyboard height and notifies delegate on changes.
+ * Uses WindowInsetsAnimationCompat on API 30+, ViewTreeObserver fallback on older versions.
+ */
+class TrueSheetKeyboardObserver(private val targetView: View, private val reactContext: ThemedReactContext) {
+
+  var delegate: TrueSheetKeyboardObserverDelegate? = null
+
+  var currentHeight: Int = 0
+    private set
+
+  var targetHeight: Int = 0
+    private set
+
+  var isTransitioning: Boolean = false
+    private set
+
+  fun isFocusedViewWithinSheet(sheetView: View): Boolean {
+    val focusedView = targetView.rootView?.findFocus() ?: return false
+    var current: View? = focusedView
+    while (current != null && current !== targetView) {
+      if (current === sheetView) return true
+      val parent = current.parent
+      current = if (parent is View) parent else null
+    }
+    return false
+  }
+
+  var isHiding: Boolean = false
+    private set
+  private var globalLayoutListener: ViewTreeObserver.OnGlobalLayoutListener? = null
+  private var focusChangeListener: ViewTreeObserver.OnGlobalFocusChangeListener? = null
+  private var activityRootView: View? = null
+
+  fun start() {
+    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
+      setupAnimationCallback()
+    } else {
+      setupLegacyListener()
+    }
+    setupFocusChangeListener()
+  }
+
+  fun stop() {
+    try {
+      globalLayoutListener?.let { listener ->
+        activityRootView?.viewTreeObserver?.let { observer ->
+          if (observer.isAlive) observer.removeOnGlobalLayoutListener(listener)
+        }
+        globalLayoutListener = null
+      }
+      focusChangeListener?.let { listener ->
+        activityRootView?.viewTreeObserver?.let { observer ->
+          if (observer.isAlive) observer.removeOnGlobalFocusChangeListener(listener)
+        }
+        focusChangeListener = null
+      }
+    } finally {
+      activityRootView = null
+      ViewCompat.setWindowInsetsAnimationCallback(targetView, null)
+    }
+  }
+
+  private fun updateHeight(from: Int, to: Int, fraction: Float) {
+    val newHeight = (from + (to - from) * fraction).toInt()
+    if (currentHeight != newHeight) {
+      currentHeight = newHeight
+      delegate?.keyboardDidChangeHeight(newHeight)
+    }
+  }
+
+  private fun getKeyboardHeight(): Int = KeyboardUtils.getKeyboardHeight(targetView)
+
+  private fun setupAnimationCallback() {
+    ViewCompat.setWindowInsetsAnimationCallback(
+      targetView,
+      object : WindowInsetsAnimationCompat.Callback(DISPATCH_MODE_CONTINUE_ON_SUBTREE) {
+        private var startHeight = 0
+        private var endHeight = 0
+
+        override fun onPrepare(animation: WindowInsetsAnimationCompat) {
+          startHeight = getKeyboardHeight()
+        }
+
+        override fun onStart(
+          animation: WindowInsetsAnimationCompat,
+          bounds: WindowInsetsAnimationCompat.BoundsCompat
+        ): WindowInsetsAnimationCompat.BoundsCompat {
+          endHeight = getKeyboardHeight()
+          targetHeight = endHeight
+          isHiding = endHeight < startHeight
+          isTransitioning = true
+          if (endHeight > startHeight) {
+            delegate?.keyboardWillShow(endHeight)
+          } else if (isHiding) {
+            delegate?.keyboardWillHide()
+          }
+          return bounds
+        }
+
+        override fun onProgress(insets: WindowInsetsCompat, runningAnimations: List<WindowInsetsAnimationCompat>): WindowInsetsCompat {
+          val imeAnimation = runningAnimations.find {
+            it.typeMask and WindowInsetsCompat.Type.ime() != 0
+          } ?: return insets
+
+          val fraction = imeAnimation.interpolatedFraction
+          updateHeight(startHeight, endHeight, fraction)
+
+          return insets
+        }
+
+        override fun onEnd(animation: WindowInsetsAnimationCompat) {
+          val finalHeight = getKeyboardHeight()
+          updateHeight(startHeight, finalHeight, 1f)
+          isTransitioning = false
+          if (isHiding) {
+            delegate?.keyboardDidHide()
+            isHiding = false
+          } else if (finalHeight > 0) {
+            delegate?.keyboardDidShow(finalHeight)
+          }
+        }
+      }
+    )
+  }
+
+  private fun setupLegacyListener() {
+    // Ensure we don't add duplicate listeners
+    if (globalLayoutListener != null) return
+
+    val rootView = targetView.rootView ?: return
+    activityRootView = rootView
+
+    globalLayoutListener = ViewTreeObserver.OnGlobalLayoutListener {
+      val rect = Rect()
+      rootView.getWindowVisibleDisplayFrame(rect)
+
+      val screenHeight = rootView.height
+      val keyboardHeight = screenHeight - rect.bottom
+
+      val newHeight = if (keyboardHeight > screenHeight * 0.15) keyboardHeight else 0
+
+      // Skip if already at this height
+      if (targetHeight == newHeight) return@OnGlobalLayoutListener
+
+      val previousHeight = currentHeight
+      targetHeight = newHeight
+      isHiding = newHeight < previousHeight
+
+      isTransitioning = true
+      if (newHeight > previousHeight) {
+        delegate?.keyboardWillShow(newHeight)
+      } else if (isHiding) {
+        delegate?.keyboardWillHide()
+      }
+
+      // On legacy API, keyboard has already animated - just update immediately
+      updateHeight(previousHeight, newHeight, 1f)
+      isTransitioning = false
+
+      if (isHiding && newHeight == 0) {
+        delegate?.keyboardDidHide()
+        isHiding = false
+      } else if (newHeight > 0) {
+        delegate?.keyboardDidShow(newHeight)
+      }
+    }
+
+    rootView.viewTreeObserver.addOnGlobalLayoutListener(globalLayoutListener)
+  }
+
+  private fun setupFocusChangeListener() {
+    if (focusChangeListener != null) return
+
+    val rootView = targetView.rootView ?: return
+    activityRootView = rootView
+
+    focusChangeListener = ViewTreeObserver.OnGlobalFocusChangeListener { _, newFocus ->
+      if (currentHeight > 0 && newFocus != null && newFocus.isDescendantOf(targetView)) {
+        delegate?.focusDidChange(newFocus)
+      }
+    }
+    rootView.viewTreeObserver.addOnGlobalFocusChangeListener(focusChangeListener)
+  }
+}