Edge to edge support

📄 Description

When using the spotlight tour on Android with edge to edge enabled (which will be the standard since now on), the overlay does not cover the full screen on android devices. Maybe because of the new navbar API changes.

📸 Demo

Three-button navbar	Modern gesture navbar

Dependencies:

    "@react-navigation/elements": "^2.4.1",
    "@react-navigation/native": "^7.1.6",
    "expo": "53.0.11",
    "expo-blur": "~14.1.5",
    "expo-constants": "~17.1.5",
    "expo-font": "~13.3.1",
    "expo-haptics": "~14.1.4",
    "expo-image": "~2.3.0",
    "expo-linking": "~7.1.4",
    "expo-localization": "~16.1.5",
    "expo-navigation-bar": "~4.2.5",
    "expo-router": "~5.1.0",
    "expo-splash-screen": "~0.30.9",
    "expo-sqlite": "~15.2.12",
    "expo-status-bar": "~2.2.3",
    "expo-symbols": "~0.4.5",
    "expo-system-ui": "~5.0.8",
    "expo-web-browser": "~14.1.6",
    "nativewind": "^4.1.23",
    "react": "19.0.0",
    "react-dom": "19.0.0",
    "react-hook-form": "^7.56.2",
    "react-native": "0.79.3",
    "react-native-gesture-handler": "~2.24.0",
    "react-native-keyboard-controller": "^1.17.1",
    "react-native-reanimated": "~3.17.4",
    "react-native-safe-area-context": "5.4.0",
    "react-native-screens": "~4.11.1",
    "react-native-spotlight-tour": "^3.0.1",
    "react-native-svg": "15.11.2",
    "react-native-toast-message": "^2.3.0",

❓ How to reproduce

I'm using the provider with the following props:

      <SpotlightTourProvider
        steps={getTourSteps()}
        overlayColor="gray"
        overlayOpacity={0.36}
        nativeDriver={true}
        motion="fade"
        shape="rectangle"
      >

Start at the SpotlightTourProvider entry point and reproduce the supplied configuration on an Android device with edge-to-edge enabled, comparing three-button and gesture navigation. Trace how the overlay bounds are calculated; done means the spotlight overlay covers the full screen in both navigation modes.