@namiml/expo-sdk 3.4.12-dev.202609290126 → 3.4.12-dev.202609300314

package/dist/index.cjs

@@ -1936,6 +1936,9 @@ const PaywallProvider = ({ paywall, context, campaign, flow, onFirstFocusReady,
         setSafeAreaTop: (top) => {
             providerRef.current?.setSafeAreaTop(top);
         },
+        setSafeAreaBottom: (bottom) => {
+            providerRef.current?.setSafeAreaBottom(bottom);
+        },
         setFullScreenPresentation: (full) => {
             providerRef.current?.setFullScreenPresentation(full);
         },
@@ -3462,17 +3465,21 @@ const PaywallScreen = ({ paywall, onClose, onCommitted, holdInteractionUntilFocu
     const ctx = usePaywallContext();
     const insets = reactNativeSafeAreaContext.useSafeAreaInsets();
     const focusReadyCtx = useFirstFocusReadyContext();
-    // Push the measured top safe-area inset into paywall state so templates can
-    // position chrome via ${state.safeAreaTop} (e.g. header topPadding,
-    // background topMargin). Mirrors the native Android renderer, which measures
-    // the display cutout and calls setSafeAreaTop. The full-bleed root lets the
-    // background extend under the status bar; this offsets the content back into
-    // the safe area. No safeAreaBottom equivalent exists in core/Android state.
-    // Depend only on insets.top (stable per device/orientation) — depending on
-    // ctx would re-run every render and loop through setState.
+    // Push the measured top and bottom safe-area insets into paywall state so
+    // templates can position chrome via ${state.safeAreaTop} (e.g. header
+    // topPadding, background topMargin) and ${state.safeAreaBottom} (e.g. a
+    // footer clear of the home indicator / gesture bar). Mirrors the native
+    // renderers, which measure the insets and set the same state. The full-bleed
+    // root lets the background extend under the system bars and nothing pads the
+    // footer, so the token is the only bottom offset — no double-padding.
+    // Depend only on the inset values (stable per device/orientation) —
+    // depending on ctx would re-run every render and loop through setState.
     require$$0.useEffect(() => {
         ctx.setSafeAreaTop(insets.top);
     }, [insets.top]);
+    require$$0.useEffect(() => {
+        ctx.setSafeAreaBottom(insets.bottom);
+    }, [insets.bottom]);
     const scaleFactor = sdkCore.getDeviceScaleFactor(ctx.state.formFactor);
     const userInteractionEnabled = ctx.state.userInteractionEnabled !== false;
     const currentPageName = ctx.state.selectedPaywall === paywall
@@ -4103,8 +4110,9 @@ const NamiView = ({ placement, url, onClose, onSignIn, onDeepLink, onPurchase, o
     }
     return (
     // Full-bleed root so the paywall background extends under the status bar and
-    // home indicator (edge-to-edge). Safe-area insets are applied only to the
-    // chrome (header/footer) via useSafeAreaInsets, not the whole tree — the
+    // home indicator (edge-to-edge). Safe-area insets reach only the chrome:
+    // PaywallScreen pushes them into ${state.safeArea*} for templates to
+    // offset the header/footer, rather than insetting the whole tree — the
     // previous core SafeAreaView inset every edge and let the #000 root show
     // through as letterbox bands. SafeAreaProvider guarantees an inset context
     // even if the host app didn't mount one (nested providers are supported).