fix(android): issue with safearea insets top

Author: EQuimper

package-lock.json

@@ -71,6 +71,7 @@
     "react-native": "0.73.6",
     "react-native-builder-bob": "^0.23.2",
     "react-native-reanimated": "^3.11.0",
+    "react-native-safe-area-context": "^4.10.5",
     "release-it": "^15.0.0",
     "typescript": "^5.2.2"
   },
@@ -80,7 +81,8 @@
   "peerDependencies": {
     "react": "*",
     "react-native": "*",
-    "react-native-reanimated": ">=2.0.0"
+    "react-native-reanimated": ">=2.0.0",
+    "react-native-safe-area-context": "*"
   },
   "workspaces": [
     "example"

package.json

@@ -37,6 +37,7 @@ import {
   wrapperViewRefAtom,
 } from './state';
 import { useKeyboard } from './useKeyboard';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
 const isAndroid = Platform.OS === 'android';
 
@@ -120,6 +121,7 @@ export function useFormSmartScroll({
 }: {
   padding?: number;
 } = {}) {
+  const insets = useSafeAreaInsets();
   const wrapperOffset = useAtomValue(wrapperOffsetAtom);
   const scrollY = useSharedValue(0);
   const scrollRef = useAnimatedRef<Animated.ScrollView>();
@@ -141,14 +143,15 @@ export function useFormSmartScroll({
           _keyboard.coordinates.end.screenY - currentFocus.height * 2
         ) {
           if (wrapperOffset) {
-            const diff = Math.abs(
-              _keyboard.coordinates.end.screenY -
-                currentFocus.position -
-                currentFocus.height -
-                padding +
-                scrollY.value -
-                wrapperOffset
-            );
+            const diff =
+              Math.abs(
+                _keyboard.coordinates.end.screenY -
+                  currentFocus.position -
+                  currentFocus.height -
+                  padding +
+                  scrollY.value -
+                  wrapperOffset
+              ) + insets.top;
             return -diff;
           }