React-native-maps shadow around callout

I am trying to add a shadow on a callout for a marker. The current way I have implemented has the shadow I want but it does not follow the borderRadius of the View.

I thought creating a separate view for the shadow with a transparent background would do the trick but it didn't. I have included some code below as a well as a snack example here that reproduces my issue exactly. Run as IOS.

<Callout tooltip style={{ padding: 3 }}>
  <View style={styles.bubbleShadow}>
    <View style={styles.bubble}>
      <Text styles={{ fontSize: 16, marginBottom: 5 }}>{marker.name}</Text>
    </View>
  </View>
</Callout>


 bubble: {
    height: scale(100),
    width: scale(200),
    borderRadius: 10,
    backgroundColor: 'white',
    overflow:'hidden'
    
  },
  bubbleShadow:{
    borderRadius: 10,
    backgroundColor: 'transparent',
    shadowColor: '#000',
    shadowOffset: { width: 2, height: 2 },
    shadowOpacity: 1,
  },