react-native-reserved-regions 0.1.0 → 0.2.0

package/README.md

@@ -4,7 +4,7 @@ Provider-scoped display divisions and occlusions for React Native's New Architec
 
 ## Requirements
 
-- React Native New Architecture (Fabric)
+- React Native 0.80 or newer with the New Architecture (Fabric)
 - iOS 27.1 SDK and runtime for UIKit reserved regions; older SDKs compile out observation and older runtimes report an empty list
 - Android 7.0 (API 24) or newer; folding features require a device supported by Jetpack WindowManager
 
@@ -22,20 +22,25 @@ On iOS, install pods in your app's `ios` directory. Android links automatically
 ## Usage
 
 ```tsx
-import { ReservedRegionsProvider, useReservedRegions, useReservedRegionsReady } from 'react-native-reserved-regions';
+import { View } from 'react-native';
+import { ReservedRegionsProvider, useReservedRegions } from 'react-native-reserved-regions';
 
 function Screen() {
-  const regions = useReservedRegions();
-  const isReady = useReservedRegionsReady();
-  if (!isReady) return null;
-  return regions.map((region, index) => {
-    if (region.kind === 'division') {
-      console.log(region.frame, region.occludesContent);
-    } else {
-      console.log(region.frame);
-    }
-    return null;
-  });
+  const fold = useReservedRegions().find(
+    (region) => region.kind === 'division' && region.frame.height > region.frame.width,
+  );
+  if (!fold) return <Detail />;
+  return (
+    <View style={{ flex: 1, flexDirection: 'row' }}>
+      <View style={{ width: fold.frame.x }}>
+        <List />
+      </View>
+      <View style={{ width: fold.frame.width }} />
+      <View style={{ flex: 1 }}>
+        <Detail />
+      </View>
+    </View>
+  );
 }
 
 export default function App() {
@@ -90,27 +95,17 @@ The library reports geometry and does not reposition content. Normal safe area i
 
 ## Measurement timing
 
-Native events request synchronous delivery. Android measures after Fabric mounting
-and also observes pre-draw changes. The iOS example tests same-frame delivery with
-an [upstream React Native event-beat patch](docs/workflow.md#react-native-event-beat-test-patch).
-That example patch is not installed into consuming apps. Readiness indicates a
-completed measurement, not a universal first-frame guarantee.
-
-### Readiness-gated animated content
-
-On the tested RN `0.88.0-rc.1` Android stack, conditionally mounting Reanimated
-`4.7.0` content when `useReservedRegionsReady()` becomes true can throw
-`__requestMapperRunFinalizer` is undefined: Worklets `0.13.0` can run synchronous
-UI work ahead of queued mapper initialization. The combined hinges example uses
-an [example-only Worklets FIFO patch](https://github.com/appandflow/react-native-hinges/blob/main/patches/react-native-worklets%400.13.0.patch).
-Installing either library does not patch a consuming app's Worklets dependency.
-Keeping the animated subtree mounted avoided this failure in the tested case;
-apps that gate its mount need to apply the patch, rebuild the native app, and
-validate it themselves.
+The first measurement requests synchronous delivery; later changes are regular
+events. Android measures after Fabric mounting
+and again on its own relayout, fold changes and window inset changes; scrolling
+or moving an ancestor does not trigger a measurement. On iOS, same-frame delivery requires React Native
+[#58530](https://github.com/react/react-native/pull/58530); see
+[measurement timing](https://appandflow.github.io/react-native-reserved-regions/docs/platforms#measurement-timing).
+Readiness indicates a completed measurement, not a
+universal first-frame guarantee.
 
 The [performance guide](https://appandflow.github.io/react-native-reserved-regions/docs/performance)
-explains provider placement and optional readiness gating. `ReservedRegionsGate`
-is included starting with `0.1.0-alpha.3`.
+explains provider placement and optional readiness gating.
 
 ## Development
 

package/android/src/main/java/com/appandflow/reservedregions/RegionsChangeEvent.kt

@@ -9,10 +9,11 @@ internal class RegionsChangeEvent(
   surfaceId: Int,
   viewTag: Int,
   private val regions: List<ReservedRegion>,
+  private val synchronous: Boolean,
 ) : Event<RegionsChangeEvent>(surfaceId, viewTag) {
   override fun getEventName() = NAME
 
-  override fun experimental_isSynchronous() = true
+  override fun experimental_isSynchronous() = synchronous
 
   override fun getEventData(): WritableMap {
     val payload = Arguments.createMap()

package/android/src/main/java/com/appandflow/reservedregions/ReservedRegionsView.kt

@@ -3,7 +3,7 @@ package com.appandflow.reservedregions
 import android.content.Context
 import android.graphics.Rect
 import android.os.Build
-import android.view.ViewTreeObserver
+import android.view.WindowInsets
 import androidx.core.content.ContextCompat
 import androidx.core.util.Consumer
 import androidx.window.WindowSdkExtensions
@@ -20,21 +20,23 @@ import com.facebook.react.views.view.ReactViewGroup
 import kotlin.math.max
 import kotlin.math.min
 
-internal typealias RegionsChangeHandler = (ReservedRegionsView, List<ReservedRegion>) -> Unit
+internal typealias RegionsChangeHandler = (ReservedRegionsView, List<ReservedRegion>, Boolean) -> Unit
 
 @OptIn(UnstableReactNativeAPI::class)
-class ReservedRegionsView(context: Context) : ReactViewGroup(context), ViewTreeObserver.OnPreDrawListener, UIManagerListener {
+class ReservedRegionsView(context: Context) : ReactViewGroup(context), UIManagerListener {
   private var uiManager: UIManager? = null
   private var tracker: WindowInfoTrackerCallbackAdapter? = null
   private val layoutInfoConsumer = Consumer<WindowLayoutInfo> { info ->
     foldingFeatures = info.displayFeatures.filterIsInstance<FoldingFeature>()
     foldingFeaturesReady = true
-    invalidate()
+    if (hasDispatchedRegions) updateRegionsIfInputsChanged() else updateRegions()
   }
   private var foldingFeatures: List<FoldingFeature> = emptyList()
   private var foldingFeaturesReady = false
   private var lastRegions: List<ReservedRegion>? = null
+  private var measuredInputs: MeasurementInputs? = null
   private var awaitingFirstMount = true
+  private var hasDispatchedRegions = false
   private var onRegionsChange: RegionsChangeHandler? = null
 
   override fun willDispatchViewUpdates(uiManager: UIManager) {}
@@ -51,17 +53,18 @@ class ReservedRegionsView(context: Context) : ReactViewGroup(context), ViewTreeO
 
   override fun onAttachedToWindow() {
     super.onAttachedToWindow()
-    uiManager = UIManagerHelper.getUIManagerForReactTag(UIManagerHelper.getReactContext(this), id)
-    awaitingFirstMount = true
-    // React Native's FabricMountingManager.cpp applies layout before installing a view's event
-    // emitter inside one mount batch, so onLayout cannot dispatch a synchronous event on first
-    // mount; didMountItems is the earliest point after the emitter exists and before the event
-    // beat. It runs for every mount batch in the app, so it is removed after the first delivery.
-    uiManager?.addUIManagerEventListener(this)
-    viewTreeObserver.addOnPreDrawListener(this)
-    foldingFeatures = emptyList()
+    if (!hasDispatchedRegions) {
+      uiManager = UIManagerHelper.getUIManagerForReactTag(UIManagerHelper.getReactContext(this), id)
+      awaitingFirstMount = true
+      // React Native's FabricMountingManager.cpp applies layout before installing a view's event
+      // emitter inside one mount batch, so onLayout cannot dispatch a synchronous event on first
+      // mount; didMountItems is the earliest point after the emitter exists and before the event
+      // beat. It runs for every mount batch in the app, so it is removed after the first delivery.
+      uiManager?.addUIManagerEventListener(this)
+      foldingFeatures = emptyList()
+      lastRegions = null
+    }
     foldingFeaturesReady = false
-    lastRegions = null
     val activity = (context as? ThemedReactContext)?.currentActivity
     if (activity != null) {
       val windowTracker = WindowInfoTracker.getOrCreate(context)
@@ -75,6 +78,7 @@ class ReservedRegionsView(context: Context) : ReactViewGroup(context), ViewTreeO
     } else {
       foldingFeaturesReady = true
     }
+    if (hasDispatchedRegions) updateRegionsIfInputsChanged()
   }
 
   override fun onDetachedFromWindow() {
@@ -82,7 +86,6 @@ class ReservedRegionsView(context: Context) : ReactViewGroup(context), ViewTreeO
     uiManager = null
     tracker?.removeWindowLayoutInfoListener(layoutInfoConsumer)
     tracker = null
-    viewTreeObserver.removeOnPreDrawListener(this)
     super.onDetachedFromWindow()
   }
 
@@ -91,44 +94,43 @@ class ReservedRegionsView(context: Context) : ReactViewGroup(context), ViewTreeO
     if (!awaitingFirstMount) updateRegions()
   }
 
-  override fun onPreDraw(): Boolean {
-    updateRegions()
-    return true
+  override fun onApplyWindowInsets(insets: WindowInsets): WindowInsets {
+    val result = super.onApplyWindowInsets(insets)
+    if (!awaitingFirstMount) updateRegions()
+    return result
   }
 
   internal fun setOnRegionsChangeHandler(handler: RegionsChangeHandler) {
     onRegionsChange = handler
     lastRegions = null
-    invalidate()
   }
 
   private fun updateRegions(): Boolean {
     val handler = onRegionsChange ?: return false
     if (!isAttachedToWindow || !foldingFeaturesReady || width == 0 || height == 0) return false
 
+    val inputs = measurementInputs()
+    measuredInputs = inputs
     val windowLocation = IntArray(2)
     getLocationInWindow(windowLocation)
     val regions = mutableListOf<ReservedRegion>()
 
-    for (feature in foldingFeatures) {
+    for (feature in inputs.foldingFeatures) {
       if (!feature.isSeparating && feature.occlusionType != FoldingFeature.OcclusionType.FULL) continue
-      val frame = clippedFrame(feature.bounds, windowLocation[0], windowLocation[1]) ?: continue
+      val frame = intersectingFrame(feature.bounds, windowLocation[0], windowLocation[1]) ?: continue
       regions.add(ReservedRegion("division", frame, feature.occlusionType == FoldingFeature.OcclusionType.FULL))
     }
 
-    if (Build.VERSION.SDK_INT >= 28) {
-      val screenLocation = IntArray(2)
-      getLocationOnScreen(screenLocation)
-      rootWindowInsets?.displayCutout?.boundingRects?.forEach { bounds ->
-        clippedFrame(bounds, screenLocation[0], screenLocation[1])?.let { frame ->
-          regions.add(ReservedRegion("occlusion", frame))
-        }
+    for (bounds in inputs.cutouts) {
+      intersectingFrame(bounds, windowLocation[0], windowLocation[1])?.let { frame ->
+        regions.add(ReservedRegion("occlusion", frame))
       }
     }
 
     if (regions == lastRegions) return false
     lastRegions = regions
-    handler(this, regions)
+    handler(this, regions, !hasDispatchedRegions)
+    hasDispatchedRegions = true
     if (awaitingFirstMount) {
       awaitingFirstMount = false
       uiManager?.removeUIManagerEventListener(this)
@@ -136,12 +138,29 @@ class ReservedRegionsView(context: Context) : ReactViewGroup(context), ViewTreeO
     return true
   }
 
-  private fun clippedFrame(bounds: Rect, originX: Int, originY: Int): Rect? {
-    val left = max(0, bounds.left - originX)
-    val top = max(0, bounds.top - originY)
-    val right = min(width, bounds.right - originX)
-    val bottom = min(height, bounds.bottom - originY)
+  private fun updateRegionsIfInputsChanged() {
+    if (measurementInputs() != measuredInputs) updateRegions()
+  }
+
+  private fun measurementInputs() = MeasurementInputs(
+    foldingFeatures,
+    if (Build.VERSION.SDK_INT >= 28) rootWindowInsets?.displayCutout?.boundingRects.orEmpty() else emptyList(),
+    Rect(left, top, right, bottom),
+  )
+
+  private fun intersectingFrame(bounds: Rect, originX: Int, originY: Int): Rect? {
+    val frame = Rect(bounds.left - originX, bounds.top - originY, bounds.right - originX, bounds.bottom - originY)
+    val left = max(0, frame.left)
+    val top = max(0, frame.top)
+    val right = min(width, frame.right)
+    val bottom = min(height, frame.bottom)
     if (right < left || bottom < top || (right == left && bottom == top)) return null
-    return Rect(left, top, right, bottom)
+    return frame
   }
 }
+
+private data class MeasurementInputs(
+  val foldingFeatures: List<FoldingFeature>,
+  val cutouts: List<Rect>,
+  val frame: Rect,
+)

package/android/src/main/java/com/appandflow/reservedregions/ReservedRegionsViewManager.kt

@@ -4,17 +4,11 @@ import com.facebook.react.bridge.ReactContext
 import com.facebook.react.module.annotations.ReactModule
 import com.facebook.react.uimanager.ThemedReactContext
 import com.facebook.react.uimanager.UIManagerHelper
-import com.facebook.react.uimanager.ViewGroupManager
-import com.facebook.react.viewmanagers.ReservedRegionsViewManagerInterface
-import com.facebook.react.viewmanagers.ReservedRegionsViewManagerDelegate
+import com.facebook.react.views.view.ReactViewGroup
+import com.facebook.react.views.view.ReactViewManager
 
 @ReactModule(name = ReservedRegionsViewManager.NAME)
-class ReservedRegionsViewManager : ViewGroupManager<ReservedRegionsView>(),
-  ReservedRegionsViewManagerInterface<ReservedRegionsView> {
-  private val delegate = ReservedRegionsViewManagerDelegate(this)
-
-  override fun getDelegate() = delegate
-
+class ReservedRegionsViewManager : ReactViewManager() {
   override fun getName() = NAME
 
   override fun createViewInstance(context: ThemedReactContext) = ReservedRegionsView(context)
@@ -22,12 +16,14 @@ class ReservedRegionsViewManager : ViewGroupManager<ReservedRegionsView>(),
   override fun getExportedCustomDirectEventTypeConstants() =
     mutableMapOf(RegionsChangeEvent.NAME to mutableMapOf("registrationName" to "onRegionsChange"))
 
-  override fun addEventEmitters(reactContext: ThemedReactContext, view: ReservedRegionsView) {
+  override fun addEventEmitters(reactContext: ThemedReactContext, view: ReactViewGroup) {
     super.addEventEmitters(reactContext, view)
-    view.setOnRegionsChangeHandler { source, regions ->
+    (view as ReservedRegionsView).setOnRegionsChangeHandler { source, regions, synchronous ->
       val sourceContext = source.context as ReactContext
       UIManagerHelper.getEventDispatcherForReactTag(sourceContext, source.id)
-        ?.dispatchEvent(RegionsChangeEvent(UIManagerHelper.getSurfaceId(sourceContext), source.id, regions))
+        ?.dispatchEvent(
+          RegionsChangeEvent(UIManagerHelper.getSurfaceId(sourceContext), source.id, regions, synchronous),
+        )
     }
   }
 

package/ios/ReservedRegionsView.h

@@ -1,8 +1,8 @@
 #import <React/RCTViewComponentView.h>
 #import <UIKit/UIKit.h>
 
-#ifndef ReservedRegionsViewNativeComponent_h
-#define ReservedRegionsViewNativeComponent_h
+#ifndef ReservedRegionsView_h
+#define ReservedRegionsView_h
 
 NS_ASSUME_NONNULL_BEGIN
 
@@ -11,4 +11,4 @@ NS_ASSUME_NONNULL_BEGIN
 
 NS_ASSUME_NONNULL_END
 
-#endif /* ReservedRegionsViewNativeComponent_h */
+#endif /* ReservedRegionsView_h */

package/ios/ReservedRegionsView.mm

@@ -10,6 +10,7 @@ using namespace facebook::react;
 
 @implementation ReservedRegionsView {
   NSArray<NSDictionary *> *_currentRegions;
+  BOOL _hasDispatchedRegions;
 }
 
 + (ComponentDescriptorProvider)componentDescriptorProvider
@@ -49,6 +50,17 @@ using namespace facebook::react;
   [self setNeedsLayout];
 }
 
+- (void)updateLayoutMetrics:(LayoutMetrics const &)layoutMetrics
+           oldLayoutMetrics:(LayoutMetrics const &)oldLayoutMetrics
+{
+  [super updateLayoutMetrics:layoutMetrics oldLayoutMetrics:oldLayoutMetrics];
+  // React Native's UIView+ComponentViewProtocol applies layout through center and bounds; an origin-only change
+  // does not trigger layoutSubviews.
+  if (layoutMetrics.frame.origin != oldLayoutMetrics.frame.origin) {
+    [self setNeedsLayout];
+  }
+}
+
 - (void)updateEventEmitter:(EventEmitter::Shared const &)eventEmitter
 {
   [super updateEventEmitter:eventEmitter];
@@ -96,6 +108,14 @@ using namespace facebook::react;
         ("occludesContent", false));
   }
   auto eventEmitter = _eventEmitter;
+  if (_hasDispatchedRegions) {
+    // React Native's EventQueue replaces this view's pending unique event when it is the last one queued.
+    eventEmitter->dispatchUniqueEvent(
+        "regionsChange",
+        folly::dynamic::object("regions", std::move(regionPayloads)));
+    return;
+  }
+  _hasDispatchedRegions = YES;
   eventEmitter->experimental_flushSync([eventEmitter, regions = std::move(regionPayloads)]() mutable {
     eventEmitter->dispatchEvent(
         "regionsChange",
@@ -108,6 +128,7 @@ using namespace facebook::react;
 {
   [super prepareForRecycle];
   _currentRegions = nil;
+  _hasDispatchedRegions = NO;
 }
 
 @end

package/lib/module/index.js

@@ -3,9 +3,11 @@
 import * as React from 'react';
 import { ReservedRegionsView } from './ReservedRegionsView';
 
-/** A rectangle in logical points relative to the nearest ReservedRegionsProvider. */
+/** A rectangle in logical points relative to the nearest ReservedRegionsProvider. Not clipped to the provider. */
 
 /** An active area reserved by the display or system UI. */
+
+/** Props for ReservedRegionsProvider. */
 import { jsx as _jsx } from "react/jsx-runtime";
 const ReservedRegionsContext = /*#__PURE__*/React.createContext(null);
 

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","ReservedRegionsView","jsx","_jsx","ReservedRegionsContext","createContext","ReservedRegionsProvider","children","props","snapshot","setSnapshot","useState","regions","isReady","onRegionsChange","useCallback","event","nativeEvent","flatMap","region","kind","frame","occludesContent","Provider","value","useReservedRegions","useContext","Error","useReservedRegionsReady","ReservedRegionsGate"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,mBAAmB,QAAQ,uBAAuB;;AAG3D;;AAYA;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAsBA,MAAMC,sBAAsB,gBAAGJ,KAAK,CAACK,aAAa,CAAiC,IAAI,CAAC;;AAExF;AACA,OAAO,SAASC,uBAAuBA,CAAC;EAAEC,QAAQ;EAAE,GAAGC;AAAiB,CAAC,EAAqB;EAC5F,MAAM,CAACC,QAAQ,EAAEC,WAAW,CAAC,GAAGV,KAAK,CAACW,QAAQ,CAA0B;IAAEC,OAAO,EAAE,EAAE;IAAEC,OAAO,EAAE;EAAM,CAAC,CAAC;EACxG,MAAMC,eAAe,GAAGd,KAAK,CAACe,WAAW,CAAEC,KAA0C,IAAK;IACxF,MAAMJ,OAAO,GAAGI,KAAK,CAACC,WAAW,CAACL,OAAO,CAACM,OAAO,CAAEC,MAAM,IAAuB;MAC9E,IAAIA,MAAM,CAACC,IAAI,KAAK,UAAU,EAAE;QAC9B,OAAO,CAAC;UAAEA,IAAI,EAAE,UAAU;UAAEC,KAAK,EAAEF,MAAM,CAACE,KAAK;UAAEC,eAAe,EAAEH,MAAM,CAACG;QAAgB,CAAC,CAAC;MAC7F;MACA,IAAIH,MAAM,CAACC,IAAI,KAAK,WAAW,EAAE;QAC/B,OAAO,CAAC;UAAEA,IAAI,EAAE,WAAW;UAAEC,KAAK,EAAEF,MAAM,CAACE;QAAM,CAAC,CAAC;MACrD;MACA,OAAO,EAAE;IACX,CAAC,CAAC;IACFX,WAAW,CAAC;MAAEE,OAAO;MAAEC,OAAO,EAAE;IAAK,CAAC,CAAC;EACzC,CAAC,EAAE,EAAE,CAAC;EAEN,oBACEV,IAAA,CAACC,sBAAsB,CAACmB,QAAQ;IAACC,KAAK,EAAEf,QAAS;IAAAF,QAAA,eAC/CJ,IAAA,CAACF,mBAAmB;MAAA,GAAKO,KAAK;MAAEM,eAAe,EAAEA,eAAgB;MAAAP,QAAA,EAC9DA;IAAQ,CACU;EAAC,CACS,CAAC;AAEtC;;AAEA;AACA,OAAO,SAASkB,kBAAkBA,CAAA,EAA8B;EAC9D,MAAMhB,QAAQ,GAAGT,KAAK,CAAC0B,UAAU,CAACtB,sBAAsB,CAAC;EACzD,IAAIK,QAAQ,KAAK,IAAI,EAAE;IACrB,MAAM,IAAIkB,KAAK,CAAC,gEAAgE,CAAC;EACnF;EACA,OAAOlB,QAAQ,CAACG,OAAO;AACzB;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASgB,uBAAuBA,CAAA,EAAY;EACjD,MAAMnB,QAAQ,GAAGT,KAAK,CAAC0B,UAAU,CAACtB,sBAAsB,CAAC;EACzD,IAAIK,QAAQ,KAAK,IAAI,EAAE;IACrB,MAAM,IAAIkB,KAAK,CAAC,qEAAqE,CAAC;EACxF;EACA,OAAOlB,QAAQ,CAACI,OAAO;AACzB;;AAEA;AACA,OAAO,SAASgB,mBAAmBA,CAAC;EAAEtB;AAAkC,CAAC,EAAmB;EAC1F,OAAOqB,uBAAuB,CAAC,CAAC,GAAGrB,QAAQ,GAAG,IAAI;AACpD","ignoreList":[]}
+{"version":3,"names":["React","ReservedRegionsView","jsx","_jsx","ReservedRegionsContext","createContext","ReservedRegionsProvider","children","props","snapshot","setSnapshot","useState","regions","isReady","onRegionsChange","useCallback","event","nativeEvent","flatMap","region","kind","frame","occludesContent","Provider","value","useReservedRegions","useContext","Error","useReservedRegionsReady","ReservedRegionsGate"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,mBAAmB,QAAQ,uBAAuB;;AAG3D;;AAYA;;AAiBA;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAWA,MAAMC,sBAAsB,gBAAGJ,KAAK,CAACK,aAAa,CAAiC,IAAI,CAAC;;AAExF;AACA,OAAO,SAASC,uBAAuBA,CAAC;EAAEC,QAAQ;EAAE,GAAGC;AAAoC,CAAC,EAAqB;EAC/G,MAAM,CAACC,QAAQ,EAAEC,WAAW,CAAC,GAAGV,KAAK,CAACW,QAAQ,CAA0B;IAAEC,OAAO,EAAE,EAAE;IAAEC,OAAO,EAAE;EAAM,CAAC,CAAC;EACxG,MAAMC,eAAe,GAAGd,KAAK,CAACe,WAAW,CAAEC,KAA0C,IAAK;IACxF,MAAMJ,OAAO,GAAGI,KAAK,CAACC,WAAW,CAACL,OAAO,CAACM,OAAO,CAAEC,MAAM,IAAuB;MAC9E,IAAIA,MAAM,CAACC,IAAI,KAAK,UAAU,EAAE;QAC9B,OAAO,CAAC;UAAEA,IAAI,EAAE,UAAU;UAAEC,KAAK,EAAEF,MAAM,CAACE,KAAK;UAAEC,eAAe,EAAEH,MAAM,CAACG;QAAgB,CAAC,CAAC;MAC7F;MACA,IAAIH,MAAM,CAACC,IAAI,KAAK,WAAW,EAAE;QAC/B,OAAO,CAAC;UAAEA,IAAI,EAAE,WAAW;UAAEC,KAAK,EAAEF,MAAM,CAACE;QAAM,CAAC,CAAC;MACrD;MACA,OAAO,EAAE;IACX,CAAC,CAAC;IACFX,WAAW,CAAC;MAAEE,OAAO;MAAEC,OAAO,EAAE;IAAK,CAAC,CAAC;EACzC,CAAC,EAAE,EAAE,CAAC;EAEN,oBACEV,IAAA,CAACC,sBAAsB,CAACmB,QAAQ;IAACC,KAAK,EAAEf,QAAS;IAAAF,QAAA,eAC/CJ,IAAA,CAACF,mBAAmB;MAAA,GAAKO,KAAK;MAAEM,eAAe,EAAEA,eAAgB;MAAAP,QAAA,EAC9DA;IAAQ,CACU;EAAC,CACS,CAAC;AAEtC;;AAEA;AACA,OAAO,SAASkB,kBAAkBA,CAAA,EAA8B;EAC9D,MAAMhB,QAAQ,GAAGT,KAAK,CAAC0B,UAAU,CAACtB,sBAAsB,CAAC;EACzD,IAAIK,QAAQ,KAAK,IAAI,EAAE;IACrB,MAAM,IAAIkB,KAAK,CAAC,gEAAgE,CAAC;EACnF;EACA,OAAOlB,QAAQ,CAACG,OAAO;AACzB;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASgB,uBAAuBA,CAAA,EAAY;EACjD,MAAMnB,QAAQ,GAAGT,KAAK,CAAC0B,UAAU,CAACtB,sBAAsB,CAAC;EACzD,IAAIK,QAAQ,KAAK,IAAI,EAAE;IACrB,MAAM,IAAIkB,KAAK,CAAC,qEAAqE,CAAC;EACxF;EACA,OAAOlB,QAAQ,CAACI,OAAO;AACzB;;AAEA;AACA,OAAO,SAASgB,mBAAmBA,CAAC;EAAEtB;AAAkC,CAAC,EAAmB;EAC1F,OAAOqB,uBAAuB,CAAC,CAAC,GAAGrB,QAAQ,GAAG,IAAI;AACpD","ignoreList":[]}

package/lib/typescript/src/index.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import type { ViewProps } from 'react-native';
-/** A rectangle in logical points relative to the nearest ReservedRegionsProvider. */
+import type { View, ViewProps } from 'react-native';
+/** A rectangle in logical points relative to the nearest ReservedRegionsProvider. Not clipped to the provider. */
 export type ReservedRegionFrame = Readonly<{
     /** Distance from the provider's left edge. */
     x: number;
@@ -25,8 +25,13 @@ export type ReservedRegion = Readonly<{
     /** The occlusion's bounds in the provider's coordinate space. */
     frame: ReservedRegionFrame;
 }>;
+/** Props for ReservedRegionsProvider. */
+type ReservedRegionsProviderProps = ViewProps & {
+    /** Receives the provider's native view, for example to call `measure`. */
+    ref?: React.Ref<React.ComponentRef<typeof View>>;
+};
 /** Makes active reserved regions available to descendants in provider coordinates. */
-export declare function ReservedRegionsProvider({ children, ...props }: ViewProps): React.JSX.Element;
+export declare function ReservedRegionsProvider({ children, ...props }: ReservedRegionsProviderProps): React.JSX.Element;
 /** Returns active regions reported by the nearest ReservedRegionsProvider. */
 export declare function useReservedRegions(): readonly ReservedRegion[];
 /**
@@ -36,4 +41,5 @@ export declare function useReservedRegions(): readonly ReservedRegion[];
 export declare function useReservedRegionsReady(): boolean;
 /** Renders children after the nearest provider reports its first measurement. */
 export declare function ReservedRegionsGate({ children }: React.PropsWithChildren): React.ReactNode;
+export {};
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9C,qFAAqF;AACrF,MAAM,MAAM,mBAAmB,GAAG,QAAQ,CAAC;IACzC,8CAA8C;IAC9C,CAAC,EAAE,MAAM,CAAC;IACV,6CAA6C;IAC7C,CAAC,EAAE,MAAM,CAAC;IACV,8CAA8C;IAC9C,KAAK,EAAE,MAAM,CAAC;IACd,4CAA4C;IAC5C,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC,CAAC;AAEH,2DAA2D;AAC3D,MAAM,MAAM,cAAc,GACtB,QAAQ,CAAC;IACP,sDAAsD;IACtD,IAAI,EAAE,UAAU,CAAC;IACjB,gEAAgE;IAChE,KAAK,EAAE,mBAAmB,CAAC;IAC3B,yDAAyD;IACzD,eAAe,EAAE,OAAO,CAAC;CAC1B,CAAC,GACF,QAAQ,CAAC;IACP,gEAAgE;IAChE,IAAI,EAAE,WAAW,CAAC;IAClB,iEAAiE;IACjE,KAAK,EAAE,mBAAmB,CAAC;CAC5B,CAAC,CAAC;AASP,sFAAsF;AACtF,wBAAgB,uBAAuB,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAsB5F;AAED,8EAA8E;AAC9E,wBAAgB,kBAAkB,IAAI,SAAS,cAAc,EAAE,CAM9D;AAED;;;GAGG;AACH,wBAAgB,uBAAuB,IAAI,OAAO,CAMjD;AAED,iFAAiF;AACjF,wBAAgB,mBAAmB,CAAC,EAAE,QAAQ,EAAE,EAAE,KAAK,CAAC,iBAAiB,GAAG,KAAK,CAAC,SAAS,CAE1F"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIpD,kHAAkH;AAClH,MAAM,MAAM,mBAAmB,GAAG,QAAQ,CAAC;IACzC,8CAA8C;IAC9C,CAAC,EAAE,MAAM,CAAC;IACV,6CAA6C;IAC7C,CAAC,EAAE,MAAM,CAAC;IACV,8CAA8C;IAC9C,KAAK,EAAE,MAAM,CAAC;IACd,4CAA4C;IAC5C,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC,CAAC;AAEH,2DAA2D;AAC3D,MAAM,MAAM,cAAc,GACtB,QAAQ,CAAC;IACP,sDAAsD;IACtD,IAAI,EAAE,UAAU,CAAC;IACjB,gEAAgE;IAChE,KAAK,EAAE,mBAAmB,CAAC;IAC3B,yDAAyD;IACzD,eAAe,EAAE,OAAO,CAAC;CAC1B,CAAC,GACF,QAAQ,CAAC;IACP,gEAAgE;IAChE,IAAI,EAAE,WAAW,CAAC;IAClB,iEAAiE;IACjE,KAAK,EAAE,mBAAmB,CAAC;CAC5B,CAAC,CAAC;AAEP,yCAAyC;AACzC,KAAK,4BAA4B,GAAG,SAAS,GAAG;IAC9C,0EAA0E;IAC1E,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,YAAY,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC;CAClD,CAAC;AASF,sFAAsF;AACtF,wBAAgB,uBAAuB,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,4BAA4B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAsB/G;AAED,8EAA8E;AAC9E,wBAAgB,kBAAkB,IAAI,SAAS,cAAc,EAAE,CAM9D;AAED;;;GAGG;AACH,wBAAgB,uBAAuB,IAAI,OAAO,CAMjD;AAED,iFAAiF;AACjF,wBAAgB,mBAAmB,CAAC,EAAE,QAAQ,EAAE,EAAE,KAAK,CAAC,iBAAiB,GAAG,KAAK,CAAC,SAAS,CAE1F"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-reserved-regions",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Provider-scoped reserved display regions for React Native",
   "keywords": [
     "android",
@@ -20,9 +20,7 @@
     "lib",
     "android",
     "ios",
-    "cpp",
     "*.podspec",
-    "react-native.config.js",
     "!ios/build",
     "!android/build",
     "!android/gradle",
@@ -50,7 +48,7 @@
   "devDependencies": {
     "@jest/globals": "^29.7.0",
     "@react-native/babel-preset": "0.88.0-rc.1",
-    "@react-native/jest-preset": "0.86.2",
+    "@react-native/jest-preset": "0.88.0-rc.1",
     "@types/react": "^19.2.0",
     "@types/react-test-renderer": "^19.1.0",
     "del-cli": "^7.0.0",
@@ -104,8 +102,8 @@
     "type": "fabric-view",
     "languages": "kotlin-objc",
     "tools": [
-      "eslint",
-      "jest"
+      "jest",
+      "oxlint"
     ],
     "version": "0.63.1"
   },

package/src/index.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import type { ViewProps } from 'react-native';
+import type { View, ViewProps } from 'react-native';
 import { ReservedRegionsView } from './ReservedRegionsView';
 import type { RegionsChangeEvent } from './ReservedRegionsViewNativeComponent';
 
-/** A rectangle in logical points relative to the nearest ReservedRegionsProvider. */
+/** A rectangle in logical points relative to the nearest ReservedRegionsProvider. Not clipped to the provider. */
 export type ReservedRegionFrame = Readonly<{
   /** Distance from the provider's left edge. */
   x: number;
@@ -32,6 +32,12 @@ export type ReservedRegion =
       frame: ReservedRegionFrame;
     }>;
 
+/** Props for ReservedRegionsProvider. */
+type ReservedRegionsProviderProps = ViewProps & {
+  /** Receives the provider's native view, for example to call `measure`. */
+  ref?: React.Ref<React.ComponentRef<typeof View>>;
+};
+
 type ReservedRegionsSnapshot = Readonly<{
   regions: readonly ReservedRegion[];
   isReady: boolean;
@@ -40,7 +46,7 @@ type ReservedRegionsSnapshot = Readonly<{
 const ReservedRegionsContext = React.createContext<ReservedRegionsSnapshot | null>(null);
 
 /** Makes active reserved regions available to descendants in provider coordinates. */
-export function ReservedRegionsProvider({ children, ...props }: ViewProps): React.JSX.Element {
+export function ReservedRegionsProvider({ children, ...props }: ReservedRegionsProviderProps): React.JSX.Element {
   const [snapshot, setSnapshot] = React.useState<ReservedRegionsSnapshot>({ regions: [], isReady: false });
   const onRegionsChange = React.useCallback((event: { nativeEvent: RegionsChangeEvent }) => {
     const regions = event.nativeEvent.regions.flatMap((region): ReservedRegion[] => {