react-native-blur-vibe 0.1.8 → 0.1.10

package/android/src/main/java/com/blurvibe/BlurVibeViewApi31.kt

@@ -3,6 +3,8 @@ package com.blurvibe
 import android.content.Context
 import android.graphics.Bitmap
 import android.graphics.BitmapShader
+import android.graphics.BlendMode
+import android.graphics.BlendModeColorFilter
 import android.graphics.Canvas
 import android.graphics.Color
 import android.graphics.LinearGradient
@@ -11,6 +13,7 @@ import android.graphics.Paint
 import android.graphics.PorterDuff
 import android.graphics.PorterDuffXfermode
 import android.graphics.RadialGradient
+import android.graphics.Rect
 import android.graphics.RectF
 import android.graphics.RenderEffect
 import android.graphics.RenderNode
@@ -25,89 +28,96 @@ import android.view.ViewTreeObserver
 import androidx.annotation.RequiresApi
 import androidx.core.graphics.toColorInt
 import com.facebook.react.views.view.ReactViewGroup
+import kotlin.math.max
 import kotlin.math.min
 import kotlin.random.Random
 
 /**
- * BlurVibeViewApi31 — GPU backdrop blur for Android API 31+
+ * BlurVibeViewApi31 — Backdrop blur for Android API 31+
  *
- * Features:
- *  • Dual-RenderNode blur (backdrop-filter CSS semantics)
- *  • Progressive / gradient blur (vertical, horizontal, radial)
- *  • Noise texture overlay (tactile frosted-glass feel, like Haze)
- *  • Overlay tint with full RGBA support
- *  • Corner radius with hardware clipping
- *  • Choreographer-gated updates (max 1 capture per vsync)
+ * Pipeline (adapted from ModernBlurView's RenderEffectBlur approach):
  *
- * Progressive blur technique (from Haze docs):
- *   Uses a mask approach — a LinearGradient/RadialGradient is drawn as an
- *   alpha mask over the blur output using PorterDuff.DST_IN.
- *   This fades the blur from full-strength to zero across the view.
- *   Per Haze docs: "masks are much faster with negligible performance cost"
- *   vs true per-pixel radius variation which costs ~25% more on API 33+.
+ *   1. rootView.draw(canvas) → internalBitmap   (bitmap capture, main thread)
+ *   2. renderNode.beginRecording()
+ *        canvas.drawBitmap(internalBitmap)       (bitmap → RenderNode — safe on all OEMs)
+ *      renderNode.endRecording()
+ *   3. renderNode.setRenderEffect(
+ *        createChainEffect(tintEffect, blurEffect)  (GPU blur + tint in one pass)
+ *      )
+ *   4. onDraw: canvas.drawRenderNode(renderNode)  (draws GPU result to screen)
+ *      + progressive mask + noise
  *
- * Noise texture:
- *   Haze uses noise at 15% opacity by default for tactility.
- *   We generate a small tileable noise bitmap once and draw it with low alpha.
+ * KEY INSIGHT from ModernBlurView:
+ *   Drawing a flat BITMAP into a RenderNode, then drawRenderNode() is stable
+ *   on all OEM devices (Oppo/OnePlus/Xiaomi/Samsung).
+ *   Drawing a RenderNode INSIDE another RenderNode's recording crashes
+ *   on OEM-patched GPU drivers. We don't do that here.
+ *
+ * Choreographer gate: max 1 capture per vsync.
+ * Bitmap pool + RenderNode reuse: zero GC per frame.
  */
 @RequiresApi(Build.VERSION_CODES.S)
 class BlurVibeViewApi31(context: Context) : ReactViewGroup(context) {
 
   // ── Blur params ────────────────────────────────────────────────────────────
 
-  private var blurRadiusX    = DEFAULT_BLUR_RADIUS
-  private var blurRadiusY    = DEFAULT_BLUR_RADIUS
-  private var overlayColor   = Color.TRANSPARENT
+  private var blurAmount   = 10f
+  private var overlayColor = Color.TRANSPARENT
   private var cornerRadiusPx = 0f
 
-  // ── Progressive blur params ────────────────────────────────────────────────
+  // ── Progressive blur ──────────────────────────────────────────────────────
 
-  private var progressiveDirection = PROGRESSIVE_NONE
-  private var progressiveStartIntensity = 1f   // 0.0–1.0, full blur at start
-  private var progressiveEndIntensity   = 0f   // 0.0–1.0, no blur at end
+  private var progressiveDirection      = PROGRESSIVE_NONE
+  private var progressiveStartIntensity = 1f
+  private var progressiveEndIntensity   = 0f
 
-  // ── Noise params ──────────────────────────────────────────────────────────
+  // ── Noise ─────────────────────────────────────────────────────────────────
 
-  private var noiseFactor = 0.08f   // Haze default is 0.15 — we use 0.08 as default (subtler)
+  private var noiseFactor = 0.08f
   private var noiseBitmap: Bitmap? = null
-  private val noisePaint  = Paint().apply { alpha = (noiseFactor * 255).toInt() }
-
-  // ── RenderNodes ───────────────────────────────────────────────────────────
+  private val noisePaint  = Paint()
 
-  /** Records the root-view content — "what's behind me" */
-  private val contentNode = RenderNode("BlurVibeContent").apply {
-    setUseCompositingLayer(true, null)  // caches as GPU texture — repeated reads are free
-  }
+  // ── Bitmap + RenderNode (ModernBlurView pattern) ───────────────────────────
+  //
+  // internalBitmap: captured root pixels at view resolution
+  // renderNode:     holds bitmap + RenderEffect (GPU blur + tint chain)
+  //
+  // The renderNode is reused every frame — only its content (bitmap) and
+  // effect (radius/tint) are updated, not recreated.
 
-  /** Holds contentNode cropped to this view's position, with RenderEffect blur applied */
-  private val blurNode = RenderNode("BlurVibeBlur")
+  private var internalBitmap: Bitmap? = null
+  private val renderNode = RenderNode("BlurVibeNode")
 
-  // ── Paint objects (reused, no per-frame allocation) ───────────────────────
+  // ── Draw paint ────────────────────────────────────────────────────────────
 
-  private val overlayPaint    = Paint(Paint.ANTI_ALIAS_FLAG)
-  private val maskPaint       = Paint(Paint.ANTI_ALIAS_FLAG).apply {
+  private val bitmapPaint  = Paint(Paint.FILTER_BITMAP_FLAG)
+  private val maskPaint    = Paint(Paint.ANTI_ALIAS_FLAG).apply {
     xfermode = PorterDuffXfermode(PorterDuff.Mode.DST_IN)
   }
-  private val clearPaint      = Paint().apply {
-    xfermode = PorterDuffXfermode(PorterDuff.Mode.CLEAR)
-  }
+  private val overlayPaint = Paint(Paint.ANTI_ALIAS_FLAG)
 
   // ── Root view ─────────────────────────────────────────────────────────────
 
   private var blurRoot: ViewGroup? = null
+  private val rootLocation   = IntArray(2)
+  private val blurViewLocation = IntArray(2)
 
-  // ── Choreographer gate ────────────────────────────────────────────────────
+  // ── State ─────────────────────────────────────────────────────────────────
 
+  private var blurEnabled    = true
+  private var autoUpdate     = true
   private var frameScheduled = false
+  private var initialized    = false
+
+  // ── Choreographer gate ────────────────────────────────────────────────────
+
   private val frameCallback = Choreographer.FrameCallback {
     frameScheduled = false
-    if (isAttachedToWindow) {
-      captureRootIntoNode()
-      invalidate()
-    }
+    if (isAttachedToWindow && blurEnabled) updateBlur()
   }
+
   private val preDrawListener = ViewTreeObserver.OnPreDrawListener {
-    if (!frameScheduled) {
+    if (!frameScheduled && blurEnabled && autoUpdate) {
       frameScheduled = true
       Choreographer.getInstance().postFrameCallback(frameCallback)
     }
@@ -120,8 +130,6 @@ class BlurVibeViewApi31(context: Context) : ReactViewGroup(context) {
     setWillNotDraw(false)
     super.setBackgroundColor(Color.TRANSPARENT)
     clipToOutline = true
-    // Enable hardware layer so onDraw() runs on GPU
-    setLayerType(LAYER_TYPE_HARDWARE, null)
   }
 
   // ── Lifecycle ──────────────────────────────────────────────────────────────
@@ -129,173 +137,204 @@ class BlurVibeViewApi31(context: Context) : ReactViewGroup(context) {
   override fun onAttachedToWindow() {
     super.onAttachedToWindow()
     blurRoot = findBlurRoot()
-    blurRoot?.viewTreeObserver?.addOnPreDrawListener(preDrawListener)
+    safeAddPreDrawListener()
     generateNoiseBitmap()
+    if (measuredWidth > 0 && measuredHeight > 0) initBlur()
   }
 
   override fun onDetachedFromWindow() {
     blurRoot?.viewTreeObserver?.removeOnPreDrawListener(preDrawListener)
     Choreographer.getInstance().removeFrameCallback(frameCallback)
     frameScheduled = false
-    blurRoot = null
-    noiseBitmap?.recycle()
-    noiseBitmap = null
+    initialized    = false
+    blurRoot       = null
+    noiseBitmap?.recycle(); noiseBitmap = null
+    internalBitmap?.recycle(); internalBitmap = null
+    renderNode.discardDisplayList()
     super.onDetachedFromWindow()
   }
 
   override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
     super.onSizeChanged(w, h, oldw, oldh)
-    blurNode.setPosition(0, 0, w, h)
-    applyBlurRenderEffect()
+    if (w > 0 && h > 0) {
+      internalBitmap?.recycle(); internalBitmap = null
+      initBlur()
+    }
   }
 
-  // ── Capture ────────────────────────────────────────────────────────────────
+  // ── Multi-window / split-screen / PiP safety ──────────────────────────────
+  //
+  // Android can "kill" a ViewTreeObserver when the window enters/exits
+  // split-screen, PiP, or freeform mode — creating a new one silently.
+  // If we hold a reference to the old (dead) observer our preDrawListener
+  // stops firing and blur freezes. We fix this by:
+  //   1. Always re-attaching via the CURRENT observer (not a cached one)
+  //   2. Checking isAlive() before adding — safe even if called redundantly
+  //   3. Re-attaching on window focus gain (fires after every mode transition)
+
+  override fun onWindowFocusChanged(hasWindowFocus: Boolean) {
+    super.onWindowFocusChanged(hasWindowFocus)
+    if (hasWindowFocus && blurEnabled && autoUpdate) {
+      // Re-attach listener to the current (possibly new) ViewTreeObserver
+      safeAddPreDrawListener()
+      scheduleFrame()
+    }
+  }
 
-  private fun captureRootIntoNode() {
+  /**
+   * Add preDrawListener to rootView's CURRENT ViewTreeObserver.
+   * Removes from any stale observer first, then attaches to the live one.
+   * Safe to call multiple times — isAlive() prevents double-attachment.
+   */
+  private fun safeAddPreDrawListener() {
     val root = blurRoot ?: return
-    if (root.width <= 0 || root.height <= 0) return
-
-    contentNode.setPosition(0, 0, root.width, root.height)
-
-    val canvas = contentNode.beginRecording()
-    try {
-      canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR)
-      root.draw(canvas)
-    } finally {
-      contentNode.endRecording()
+    val vto  = root.viewTreeObserver
+    // Remove first (no-op if not attached) then re-add to current observer
+    vto.removeOnPreDrawListener(preDrawListener)
+    if (vto.isAlive) {
+      vto.addOnPreDrawListener(preDrawListener)
     }
-
-    rebuildBlurNode()
   }
 
-  private fun rebuildBlurNode() {
-    val root = blurRoot ?: return
-    if (width <= 0 || height <= 0) return
+  // ── Blur init ─────────────────────────────────────────────────────────────
 
-    val myLoc   = IntArray(2); getLocationInWindow(myLoc)
-    val rootLoc = IntArray(2); root.getLocationInWindow(rootLoc)
-    val offsetX = (myLoc[0] - rootLoc[0]).toFloat()
-    val offsetY = (myLoc[1] - rootLoc[1]).toFloat()
+  private fun initBlur() {
+    val w = measuredWidth;  if (w <= 0) return
+    val h = measuredHeight; if (h <= 0) return
 
-    blurNode.setPosition(0, 0, width, height)
-    applyBlurRenderEffect()
+    internalBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888)
+    renderNode.setPosition(0, 0, w, h)
+    initialized = true
+    setWillNotDraw(false)
+    updateBlur()
+  }
 
-    val canvas = blurNode.beginRecording()
+  // ── Core blur update (ModernBlurView pattern) ─────────────────────────────
+
+  private fun updateBlur() {
+    if (!blurEnabled || !initialized) return
+    val root   = blurRoot          ?: return
+    val bitmap = internalBitmap    ?: return
+
+    // ① Capture root into internalBitmap (same as ModernBlurView's approach)
+    //   Translate canvas so we capture exactly the region behind this view
+    // getLocationInWindow — correct for ALL Android versions and ALL window modes
+    // (split-screen, freeform, PiP, DeX).
+    // rootView.draw() uses window-relative coordinates, so we must also use
+    // window-relative positions for the offset — not screen-absolute.
+    // getLocationOnScreen is WRONG in split-screen (Android 7+) because the
+    // app window doesn't start at screen (0,0) in that mode.
+    root.getLocationInWindow(rootLocation)
+    getLocationInWindow(blurViewLocation)
+
+    val scaleW = width.toFloat()  / bitmap.width.toFloat()
+    val scaleH = height.toFloat() / bitmap.height.toFloat()
+    val left   = (blurViewLocation[0] - rootLocation[0])
+    val top    = (blurViewLocation[1] - rootLocation[1])
+
+    val captureCanvas = Canvas(bitmap)
+    captureCanvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR)
+    captureCanvas.translate(-left / scaleW, -top / scaleH)
+    captureCanvas.scale(1f / scaleW, 1f / scaleH)
     try {
-      canvas.translate(-offsetX, -offsetY)
-      canvas.drawRenderNode(contentNode)
-    } finally {
-      blurNode.endRecording()
-    }
-  }
+      root.draw(captureCanvas)
+    } catch (_: Exception) { return }
 
-  private fun applyBlurRenderEffect() {
-    if (blurRadiusX < 0.5f && blurRadiusY < 0.5f) {
-      blurNode.setRenderEffect(null)
-      return
+    // ② Record bitmap into RenderNode (ModernBlurView key insight:
+    //    bitmap → RenderNode is stable; RenderNode → RenderNode is not)
+    if (renderNode.width != bitmap.width || renderNode.height != bitmap.height) {
+      renderNode.setPosition(0, 0, bitmap.width, bitmap.height)
     }
-    blurNode.setRenderEffect(
-      RenderEffect.createBlurEffect(blurRadiusX, blurRadiusY, Shader.TileMode.CLAMP)
-    )
+    val nodeCanvas = renderNode.beginRecording()
+    nodeCanvas.drawBitmap(bitmap, 0f, 0f, null)
+    renderNode.endRecording()
+
+    // ③ Build chained RenderEffect: blur first, then tint on top (one GPU pass)
+    val radius = blurRadiusFromAmount(blurAmount)
+    val blurEffect = RenderEffect.createBlurEffect(radius, radius, Shader.TileMode.MIRROR)
+
+    val finalEffect = if (Color.alpha(overlayColor) > 0) {
+      // Chain: blur → tint in single GPU pass (ModernBlurView's chained approach)
+      val tintEffect = RenderEffect.createColorFilterEffect(
+        BlendModeColorFilter(overlayColor, BlendMode.SRC_ATOP)
+      )
+      RenderEffect.createChainEffect(tintEffect, blurEffect)
+    } else {
+      blurEffect
+    }
+
+    renderNode.setRenderEffect(finalEffect)
+
+    // ④ Trigger redraw — onDraw will drawRenderNode (GPU-rendered result)
+    invalidate()
   }
 
   // ── Draw ───────────────────────────────────────────────────────────────────
 
   override fun onDraw(canvas: Canvas) {
-    val w = width.toFloat()
-    val h = height.toFloat()
-    if (w <= 0f || h <= 0f) return
-
-    if (!blurNode.hasDisplayList()) return
+    if (!blurEnabled || !initialized) return
+    val w = width.toFloat();  if (w <= 0f) return
+    val h = height.toFloat(); if (h <= 0f) return
+    if (!renderNode.hasDisplayList()) return
 
-    // ── Step 1: Save layer so we can apply mask on top of blur ────────────────
-    // saveLayer lets us composite blur + progressive mask as a unit
+    // Step 1: save layer for progressive mask compositing
     val saveCount = if (progressiveDirection != PROGRESSIVE_NONE) {
       canvas.saveLayer(0f, 0f, w, h, null)
-    } else {
-      -1
-    }
-
-    // ── Step 2: Draw blurred backdrop ─────────────────────────────────────────
-    canvas.drawRenderNode(blurNode)
-
-    // ── Step 3: Progressive mask (alpha gradient fades the blur) ──────────────
+    } else -1
+
+    // Step 2: draw GPU-blurred + tinted result
+    // Scale from bitmap resolution back to view resolution
+    val bitmapW = internalBitmap?.width?.toFloat()  ?: w
+    val bitmapH = internalBitmap?.height?.toFloat() ?: h
+    val scaleX = w / bitmapW
+    val scaleY = h / bitmapH
+    canvas.save()
+    canvas.scale(scaleX, scaleY)
+    canvas.drawRenderNode(renderNode)
+    canvas.restore()
+
+    // Step 3: progressive alpha mask fades the blur
     if (progressiveDirection != PROGRESSIVE_NONE && saveCount >= 0) {
-      val shader = buildProgressiveShader(w, h)
-      if (shader != null) {
+      buildProgressiveShader(w, h)?.let { shader ->
         maskPaint.shader = shader
         canvas.drawRect(0f, 0f, w, h, maskPaint)
       }
       canvas.restoreToCount(saveCount)
     }
 
-    // ── Step 4: Overlay tint ──────────────────────────────────────────────────
-    if (Color.alpha(overlayColor) > 0) {
-      overlayPaint.color = overlayColor
-      if (cornerRadiusPx > 0f) {
-        canvas.drawRoundRect(RectF(0f, 0f, w, h), cornerRadiusPx, cornerRadiusPx, overlayPaint)
-      } else {
-        canvas.drawRect(0f, 0f, w, h, overlayPaint)
-      }
-    }
-
-    // ── Step 5: Noise texture (tactile frosted-glass feel) ────────────────────
-    if (noiseFactor > 0f && noiseBitmap != null && !noiseBitmap!!.isRecycled) {
-      noisePaint.alpha = (noiseFactor * 255f).toInt().coerceIn(0, 255)
-      val noiseShader = BitmapShader(noiseBitmap!!, Shader.TileMode.REPEAT, Shader.TileMode.REPEAT)
-      noisePaint.shader = noiseShader
+    // Step 4: noise grain overlay
+    noiseBitmap?.takeIf { !it.isRecycled && noiseFactor > 0f }?.let { noise ->
+      noisePaint.alpha  = (noiseFactor * 255f).toInt().coerceIn(0, 255)
+      noisePaint.shader = BitmapShader(noise, Shader.TileMode.REPEAT, Shader.TileMode.REPEAT)
       canvas.drawRect(0f, 0f, w, h, noisePaint)
     }
   }
 
-  // ── Progressive shader builder ────────────────────────────────────────────
+  // ── Progressive shader ────────────────────────────────────────────────────
 
   private fun buildProgressiveShader(w: Float, h: Float): Shader? {
-    // Map intensity values to alpha: 1.0 = fully opaque (full blur), 0.0 = fully transparent (no blur)
-    val startAlpha = progressiveStartIntensity.coerceIn(0f, 1f)
-    val endAlpha   = progressiveEndIntensity.coerceIn(0f, 1f)
-    val startColor = Color.argb((startAlpha * 255).toInt(), 0, 0, 0)
-    val endColor   = Color.argb((endAlpha   * 255).toInt(), 0, 0, 0)
-
+    val sc = Color.argb((progressiveStartIntensity.coerceIn(0f,1f)*255).toInt(),0,0,0)
+    val ec = Color.argb((progressiveEndIntensity.coerceIn(0f,1f)*255).toInt(),0,0,0)
     return when (progressiveDirection) {
-      PROGRESSIVE_TOP_TO_BOTTOM -> LinearGradient(
-        0f, 0f, 0f, h, startColor, endColor, Shader.TileMode.CLAMP
-      )
-      PROGRESSIVE_BOTTOM_TO_TOP -> LinearGradient(
-        0f, h, 0f, 0f, startColor, endColor, Shader.TileMode.CLAMP
-      )
-      PROGRESSIVE_LEFT_TO_RIGHT -> LinearGradient(
-        0f, 0f, w, 0f, startColor, endColor, Shader.TileMode.CLAMP
-      )
-      PROGRESSIVE_RIGHT_TO_LEFT -> LinearGradient(
-        w, 0f, 0f, 0f, startColor, endColor, Shader.TileMode.CLAMP
-      )
-      PROGRESSIVE_RADIAL -> RadialGradient(
-        w / 2f, h / 2f,
-        min(w, h) / 2f,
-        startColor, endColor,
-        Shader.TileMode.CLAMP
-      )
+      PROGRESSIVE_TOP_TO_BOTTOM -> LinearGradient(0f,0f,0f,h,sc,ec,Shader.TileMode.CLAMP)
+      PROGRESSIVE_BOTTOM_TO_TOP -> LinearGradient(0f,h,0f,0f,sc,ec,Shader.TileMode.CLAMP)
+      PROGRESSIVE_LEFT_TO_RIGHT -> LinearGradient(0f,0f,w,0f,sc,ec,Shader.TileMode.CLAMP)
+      PROGRESSIVE_RIGHT_TO_LEFT -> LinearGradient(w,0f,0f,0f,sc,ec,Shader.TileMode.CLAMP)
+      PROGRESSIVE_RADIAL        -> RadialGradient(w/2f,h/2f,min(w,h)/2f,sc,ec,Shader.TileMode.CLAMP)
       else -> null
     }
   }
 
-  // ── Noise generation ─────────────────────────────────────────────────────
-  //
-  // Generates a small (64×64) tileable noise bitmap once.
-  // Haze uses noise at 15% opacity for tactility — the fine grain
-  // breaks up the uniform blur and makes it look more like real frosted glass.
+  // ── Noise bitmap ──────────────────────────────────────────────────────────
 
   private fun generateNoiseBitmap() {
-    if (noiseBitmap != null && !noiseBitmap!!.isRecycled) return
+    if (noiseBitmap?.isRecycled == false) return
     val size = 64
     val bmp  = Bitmap.createBitmap(size, size, Bitmap.Config.ARGB_8888)
-    val rng  = Random(42)  // fixed seed = deterministic noise, no shimmer on re-render
-    for (x in 0 until size) {
-      for (y in 0 until size) {
-        val v = rng.nextInt(256)
-        bmp.setPixel(x, y, Color.argb(255, v, v, v))
-      }
+    val rng  = Random(42)
+    for (x in 0 until size) for (y in 0 until size) {
+      val v = rng.nextInt(256)
+      bmp.setPixel(x, y, Color.argb(255, v, v, v))
     }
     noiseBitmap = bmp
   }
@@ -303,17 +342,13 @@ class BlurVibeViewApi31(context: Context) : ReactViewGroup(context) {
   // ── Public setters ─────────────────────────────────────────────────────────
 
   fun setBlurAmount(amount: Float) {
-    val t      = amount.coerceIn(0f, 100f) / 100f
-    val radius = t * t * MAX_BLUR_RADIUS  // quadratic — matches CSS backdrop-blur feel
-    blurRadiusX = radius
-    blurRadiusY = radius
-    applyBlurRenderEffect()
+    blurAmount = amount.coerceIn(0f, 100f)
     scheduleFrame()
   }
 
   fun setOverlayColor(colorString: String?) {
     overlayColor = parseHexColor(colorString ?: "transparent") ?: Color.TRANSPARENT
-    invalidate()
+    scheduleFrame()
   }
 
   fun applyBorderRadius(radiusDp: Float) {
@@ -329,77 +364,70 @@ class BlurVibeViewApi31(context: Context) : ReactViewGroup(context) {
     invalidate()
   }
 
-  fun setReducedTransparencyFallbackColor(@Suppress("UNUSED_PARAMETER") color: String?) {
-    // iOS-only — no-op on Android
-  }
-
-  /**
-   * Progressive blur direction.
-   * @param direction one of: "none", "topToBottom", "bottomToTop",
-   *                          "leftToRight", "rightToLeft", "radial"
-   */
-  fun setProgressiveBlurDirection(direction: String?) {
-    progressiveDirection = when (direction) {
-      "topToBottom"  -> PROGRESSIVE_TOP_TO_BOTTOM
-      "bottomToTop"  -> PROGRESSIVE_BOTTOM_TO_TOP
-      "leftToRight"  -> PROGRESSIVE_LEFT_TO_RIGHT
-      "rightToLeft"  -> PROGRESSIVE_RIGHT_TO_LEFT
-      "radial"       -> PROGRESSIVE_RADIAL
-      else           -> PROGRESSIVE_NONE
-    }
-    invalidate()
+  fun setReducedTransparencyFallbackColor(@Suppress("UNUSED_PARAMETER") c: String?) {}
+
+  fun setProgressiveBlurDirection(d: String?) {
+    progressiveDirection = when (d) {
+      "topToBottom" -> PROGRESSIVE_TOP_TO_BOTTOM
+      "bottomToTop" -> PROGRESSIVE_BOTTOM_TO_TOP
+      "leftToRight" -> PROGRESSIVE_LEFT_TO_RIGHT
+      "rightToLeft" -> PROGRESSIVE_RIGHT_TO_LEFT
+      "radial"      -> PROGRESSIVE_RADIAL
+      else          -> PROGRESSIVE_NONE
+    }; invalidate()
   }
 
-  /**
-   * Progressive blur start intensity (0.0 = no blur, 1.0 = full blur).
-   * This is the intensity at the START of the gradient direction.
-   * Default 1.0 — full blur at top/left/center.
-   */
-  fun setProgressiveStartIntensity(intensity: Float) {
-    progressiveStartIntensity = intensity.coerceIn(0f, 1f)
-    invalidate()
-  }
+  fun setProgressiveStartIntensity(v: Float) { progressiveStartIntensity = v.coerceIn(0f,1f); invalidate() }
+  fun setProgressiveEndIntensity(v: Float)   { progressiveEndIntensity   = v.coerceIn(0f,1f); invalidate() }
+  fun setNoiseFactor(v: Float)               { noiseFactor = v.coerceIn(0f,1f); invalidate() }
 
-  /**
-   * Progressive blur end intensity (0.0 = no blur, 1.0 = full blur).
-   * This is the intensity at the END of the gradient direction.
-   * Default 0.0 — fades to no blur at bottom/right/edge.
-   */
-  fun setProgressiveEndIntensity(intensity: Float) {
-    progressiveEndIntensity = intensity.coerceIn(0f, 1f)
-    invalidate()
+  fun applyBlurEnabled(enabled: Boolean) {
+    blurEnabled = enabled
+    if (enabled) {
+      safeAddPreDrawListener()
+      scheduleFrame()
+    } else {
+      blurRoot?.viewTreeObserver?.removeOnPreDrawListener(preDrawListener)
+      Choreographer.getInstance().removeFrameCallback(frameCallback)
+      frameScheduled = false
+      renderNode.discardDisplayList()
+      invalidate()
+    }
   }
 
-  /**
-   * Noise factor — grain overlay strength for frosted-glass tactility.
-   * 0.0 = no noise, 1.0 = full noise. Default 0.08 (8%).
-   * Haze's default is 0.15. Set 0 to disable.
-   */
-  fun setNoiseFactor(factor: Float) {
-    noiseFactor = factor.coerceIn(0f, 1f)
-    invalidate()
+  fun setAutoUpdate(update: Boolean) {
+    autoUpdate = update
+    if (update) safeAddPreDrawListener()
+    else {
+      blurRoot?.viewTreeObserver?.removeOnPreDrawListener(preDrawListener)
+      Choreographer.getInstance().removeFrameCallback(frameCallback)
+      frameScheduled = false
+    }
   }
 
   // ── Helpers ────────────────────────────────────────────────────────────────
 
   private fun scheduleFrame() {
-    if (!frameScheduled) {
+    if (!frameScheduled && blurEnabled) {
       frameScheduled = true
       Choreographer.getInstance().postFrameCallback(frameCallback)
     }
   }
 
+  private fun blurRadiusFromAmount(amount: Float): Float {
+    val t = amount / 100f
+    return (t * t * 25f).coerceIn(1f, 25f)
+  }
+
   private fun findBlurRoot(): ViewGroup? {
     var p = parent
     while (p != null) {
-      if ((p as? View)?.javaClass?.name == "com.swmansion.rnscreens.Screen")
-        return p as? ViewGroup
+      if ((p as? View)?.javaClass?.name == "com.swmansion.rnscreens.Screen") return p as? ViewGroup
       p = (p as? View)?.parent
     }
     p = parent
     while (p != null) {
-      if ((p as? View)?.javaClass?.name == "com.facebook.react.ReactRootView")
-        return p as? ViewGroup
+      if ((p as? View)?.javaClass?.name == "com.facebook.react.ReactRootView") return p as? ViewGroup
       p = (p as? View)?.parent
     }
     return rootView as? ViewGroup
@@ -412,37 +440,29 @@ class BlurVibeViewApi31(context: Context) : ReactViewGroup(context) {
     val hex = t.removePrefix("#")
     return try {
       when (hex.length) {
-        3 -> Color.argb(255,
-          hex[0].toString().repeat(2).toInt(16),
-          hex[1].toString().repeat(2).toInt(16),
-          hex[2].toString().repeat(2).toInt(16))
-        6 -> Color.argb(255,
-          hex.substring(0, 2).toInt(16),
-          hex.substring(2, 4).toInt(16),
-          hex.substring(4, 6).toInt(16))
-        8 -> Color.argb(
-          hex.substring(6, 8).toInt(16),
-          hex.substring(0, 2).toInt(16),
-          hex.substring(2, 4).toInt(16),
-          hex.substring(4, 6).toInt(16))
+        3 -> Color.argb(255,hex[0].toString().repeat(2).toInt(16),
+                            hex[1].toString().repeat(2).toInt(16),
+                            hex[2].toString().repeat(2).toInt(16))
+        6 -> Color.argb(255,hex.substring(0,2).toInt(16),
+                            hex.substring(2,4).toInt(16),
+                            hex.substring(4,6).toInt(16))
+        8 -> Color.argb(hex.substring(6,8).toInt(16),
+                        hex.substring(0,2).toInt(16),
+                        hex.substring(2,4).toInt(16),
+                        hex.substring(4,6).toInt(16))
         else -> null
       }
     } catch (_: NumberFormatException) { null }
   }
 
-  override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int) {
-    // Yoga handles all layout
-  }
+  override fun onLayout(changed: Boolean, l: Int, t: Int, r: Int, b: Int) {}
 
   companion object {
-    private const val MAX_BLUR_RADIUS     = 25f
-    private const val DEFAULT_BLUR_RADIUS = 2.5f
-
-    const val PROGRESSIVE_NONE           = 0
-    const val PROGRESSIVE_TOP_TO_BOTTOM  = 1
-    const val PROGRESSIVE_BOTTOM_TO_TOP  = 2
-    const val PROGRESSIVE_LEFT_TO_RIGHT  = 3
-    const val PROGRESSIVE_RIGHT_TO_LEFT  = 4
-    const val PROGRESSIVE_RADIAL         = 5
+    const val PROGRESSIVE_NONE          = 0
+    const val PROGRESSIVE_TOP_TO_BOTTOM = 1
+    const val PROGRESSIVE_BOTTOM_TO_TOP = 2
+    const val PROGRESSIVE_LEFT_TO_RIGHT = 3
+    const val PROGRESSIVE_RIGHT_TO_LEFT = 4
+    const val PROGRESSIVE_RADIAL        = 5
   }
 }