Image overlapping with text

I'm trying to put an Image inside View:
`

`

and import the components:
import { Text, View, Link, Image } from "@react-pdf/renderer";

styles: {
imageWrapper: {
height: 300,
backgroundColor: "black"
},
image: {
marginVertical: 15,
width: 540,
height: 300,
borderRadius: 8
},
}`

I noticed the issue occurs when I try to render it with:
`img: ({ src }) => {
return (



);
}`

As you can see in the attached screenshot, the height for is not working, making the image overlap with the text.