Unable to use my custom style - Black Screen

[ABertaud]

Environment

• Dev OS: [e.g. iOS 18]
• @rnmapbox/maps version: [eg. 10.1.33]
• React Native version: [eg. 0.74.5]
• Expo version: [eg. 51.0.39]

Steps to reproduce

Create custom style on mapbox studio. Make it standard, and publish it as public. Here's the preview.

From share button retrieve the styleURL and use it directly into your component.

import React from 'react';
import { StyleSheet, View } from 'react-native';
import Mapbox from '@rnmapbox/maps';

Mapbox.setAccessToken('<YOUR_ACCESSTOKEN>');

const App = () => {
  return (
    <View style={styles.page}>
      <View style={styles.container}>
        <Mapbox.MapView style={styles.map} styleURL="<STYLE_URL>" />
      </View>
    </View>
  );
}

export default App;

const styles = StyleSheet.create({
  page: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  container: {
    height: 300,
    width: 300,
  },
  map: {
    flex: 1
  }
});

Now i'm encountering a black screen. Note two things:

• If i replace my styleURL by StyleURL.Light, this do not display black screen anymore.
• My secret token literally has all permissions to make sure i wasn't missing one.

Really looking forward some help!

[ABertaud]

Solved by using mapbox v11 instead of default v10.