Screens not visible when using Material Top Tab Navigator inside of FlatList.

Current behavior

The tab screens are not visible - despite setting flex: 1.

export default function TabsScreen() {
  return (
    <View style={{ flex: 1 }}>
      <Tab.Navigator>
        <Tab.Screen name="ScreenOne" component={ScreenOne} />
        <Tab.Screen name="ScreenTwo" component={ScreenTwo} />
      </Tab.Navigator>
    </View>
  );
}

It is not until I set a fixed height that the screen content appears:

<View style={{ flex: 1, height: 100 }}>

Expected behavior

I expect the tab screens to be visible when using flex: 1. It is not acceptable to use a fixed height as I would like to include variable-height content in the tab screens - such as a FlatList. I also want to keep the parent-level FlatList - as I would like to utilize sticky headers. I've also tried using SectionList as the parent-level VirtualizedList, and I experience the same issue.

Here is the minimum structure:

|Stack Navigator
|- Screen
|-- FlatList
|--- item 1 - component
|--- item 2 - component
|---- Material Top Tab Navigator
|----- n-number of screens

Reproduction

https://snack.expo.dev/CCbZk7c0u

Platform

• Android
• iOS
• Web
• Windows
• MacOS

Packages

• @react-navigation/bottom-tabs
• @react-navigation/drawer
• @react-navigation/material-bottom-tabs
• @react-navigation/material-top-tabs
• @react-navigation/stack
• @react-navigation/native-stack

Environment

• [] I've removed the packages that I don't use

Start with the linked Expo Snack reproduction and the parent FlatList/SectionList structure using Material Top Tab Navigator. Compare the listed package versions while investigating why flex: 1 does not show variable-height tab content. Done means the tab screens render inside the parent list without requiring a fixed height; no repository file or test is named.