Migrate away from StyleSheet.absoluteFill and StyleSheet.absoluteFillObject

src/Splash.tsx

@@ -2,7 +2,6 @@ import {forwardRef, useCallback, useEffect, useState} from 'react'
 import {
   AccessibilityInfo,
   Image as RNImage,
-  StyleSheet,
   useColorScheme,
   View,
 } from 'react-native'
@@ -20,6 +19,7 @@ import {Image} from 'expo-image'
 import * as SplashScreen from 'expo-splash-screen'
 
 import {Logotype} from '#/view/icons/Logotype'
+import {atoms as a} from '#/alf'
 // @ts-ignore
 import splashImagePointer from '../assets/splash/splash.png'
 // @ts-ignore
@@ -170,12 +170,12 @@ export function Splash(props: React.PropsWithChildren<Props>) {
   return (
     <View style={{flex: 1}} onLayout={onLayout}>
       {!isAnimationComplete && (
-        <View style={StyleSheet.absoluteFillObject}>
+        <View style={[a.absolute, a.inset_0]}>
           <Image
             accessibilityIgnoresInvertColors
             onLoadEnd={onLoadEnd}
             source={{uri: isDarkMode ? darkSplashImageUri : splashImageUri}}
-            style={StyleSheet.absoluteFillObject}
+            style={[a.absolute, a.inset_0]}
           />
 
           <Animated.View
@@ -205,7 +205,8 @@ export function Splash(props: React.PropsWithChildren<Props>) {
           {!isAnimationComplete && (
             <Animated.View
               style={[
-                StyleSheet.absoluteFillObject,
+                a.absolute,
+                a.inset_0,
                 logoAnimation,
                 {
                   flex: 1,

src/features/inviteFriends/InviteScannerScreen.tsx

@@ -1,5 +1,5 @@
 import {useCallback, useState} from 'react'
-import {Pressable, StyleSheet, useWindowDimensions, View} from 'react-native'
+import {Pressable, useWindowDimensions, View} from 'react-native'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
 import Svg, {Path} from 'react-native-svg'
 import {
@@ -125,7 +125,7 @@ export function InviteScannerScreen() {
       noInsetTop
       style={{backgroundColor: t.palette.black}}>
       <CameraView
-        style={StyleSheet.absoluteFill}
+        style={[a.absolute, a.inset_0]}
         facing="back"
         barcodeScannerSettings={{barcodeTypes: ['qr']}}
         onBarcodeScanned={scannerEnabled ? onBarcodeScanned : undefined}
@@ -254,7 +254,7 @@ function ScannerScrim() {
     `V${y + r} A${r} ${r} 0 0 1 ${x + r} ${y} Z`
   return (
     <Svg
-      style={StyleSheet.absoluteFill}
+      style={[a.absolute, a.inset_0]}
       width={width}
       height={height}
       pointerEvents="none">

src/lib/custom-animations/GestureActionView.tsx

@@ -1,5 +1,5 @@
 import {useMemo, useState} from 'react'
-import {type ColorValue, Dimensions, StyleSheet, View} from 'react-native'
+import {type ColorValue, Dimensions, View} from 'react-native'
 import {Gesture, GestureDetector} from 'react-native-gesture-handler'
 import Animated, {
   clamp,
@@ -16,6 +16,7 @@ import Animated, {
 import {scheduleOnRN} from 'react-native-worklets'
 
 import {useHaptics} from '#/lib/haptics'
+import {atoms as a} from '#/alf'
 import {type GestureActions} from './GestureActionView.shared'
 
 const MAX_WIDTH = Dimensions.get('screen').width
@@ -287,8 +288,7 @@ export function GestureActionView({
   return (
     <GestureDetector gesture={composedGesture}>
       <View>
-        <Animated.View
+        <Animated.View style={[a.absolute, a.inset_0, animatedBackgroundStyle]}>
-          style={[StyleSheet.absoluteFill, animatedBackgroundStyle]}>
           <View
             style={{
               flex: 1,