Unable to select components when picker is placed inside a TouchableWithoutFeedback component

[sankomil]

Hi, I am attempting to place a picker inside a styled View component that looks like so:

However when I try to press on an option, nothing happens and no selection is made. In fact, the click interacts with the parent component, which is TouchableWithoutFeedback component. I have created a simplified version of the parent component, which is as such:

 <TouchableWithoutFeedback >
      <View style={styles.container}>
        <View>
          <Text style={styles.title}>Test</Text>
        </View>
            <DropDownPicker
              open={open}
              value={value}
              items={items}
              setOpen={setOpen}
              setValue={setValue}
              setItems={setItems}
              containerStyle={{borderWidth:2}}
              />
      </View>
    </TouchableWithoutFeedback>

I have created a Snack project as well, which can be found here. However I found that there is some error when I select an item. Nevertheless, you can find all the styles and the themes there. Thanks!

Edit: I think it might have something to do with my TouchableWithoutFeedback having elevation maybe?