fix: exclude StatusBar height from useWindowDimensions if StatusBar is not translucent

[kirillzyusko]

📜 Description

Exclude StatusBar height from useWindowDimensions if StatusBar is not translucent.

💡 Motivation and Context

In #468 I added own implementation of useWindowDimensions

I mentioned this:

And as you can see returned values do not match values returned by useSafeAreaInsets. Turns out they should match each other to make components like KeyboardAvoidingView to work properly.

So in this PR I'm excluding the marginTop to match useSafeAreaInsets behavior.

Closes #833

Reproduction code:

import React from 'react';
import {
  Button,
  StyleSheet,
  TextInput,
  View,
} from 'react-native';
import { KeyboardAvoidingView, KeyboardProvider } from 'react-native-keyboard-controller';
import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';


function Example (): React.JSX.Element {
  return (
    <SafeAreaView
      edges={['bottom', 'left', 'right', 'top']}
      style={styles.safeContainer}>
      <KeyboardAvoidingView
        behavior="height"
        keyboardVerticalOffset={0}
        style={styles.content}>
        <View style={styles.inner}>
          <TextInput placeholder="Name" style={styles.textInput}  />
          <Button title="Submit" />
        </View>
      </KeyboardAvoidingView>
    </SafeAreaView>
  );
}


function App(): React.JSX.Element {
  return (
    <SafeAreaProvider>
      <KeyboardProvider>
        <Example />
      </KeyboardProvider>
    </SafeAreaProvider>
  );
}

const styles = StyleSheet.create({
  safeAreaView: {
    flex: 1,
  },
  safeContainer: {
    flex: 1,
  },
  content: {
    flex:1,
  },
  container: {
    flex: 1,
  },
  inner: {
    flex: 1,
    justifyContent: 'space-between',
  },
  textInput: {
    borderWidth: 1,
    borderColor: 'red',
  },
});

export default App;

📢 Changelog

Android

• exclude marginTop from useWindowDimensions;

🤔 How Has This Been Tested?

Tested on Pixel 7 Pro with Android 15.

📸 Screenshots (if appropriate):

statusBarTranslucent={false}

Before (buggy)	After
telegram-cloud-document-2-5330396151998868945.mp4	telegram-cloud-document-2-5330396151998868977.mp4

statusBarTranslucent={true}

Before	After
telegram-cloud-document-2-5330396151998868968.mp4	telegram-cloud-document-2-5330396151998868974.mp4

📝 Checklist

• CI successfully passed
• I added new mocks and corresponding unit-tests if library API was changed

[github-actions]

📊 Package size report

Current size	Target Size	Difference
169831 bytes	169847 bytes	-16 bytes 📉