Adding a <PortalProvider> to the root of my app seemed to interfere with the <BottomSheetModalProvider> that was already there (which already uses PortalProvider under the hood). Only every other bottom sheet I opened would become visible.

I got mine working simply by wrapping my react-navigation modal screen’s contents in a <BottomSheetModalProvider>:

function AppStack() {
    return (
        <NativeStack.Navigator>
            {/* ... */}
            <NativeStack.Group screenOptions={{ presentation: 'modal' }}>
                <NativeStack.Screen 
                    name="MyScreenThatNeedsToBeAbleToOpenABottomSheetModal" 
                    component={MyScreenThatNeedsToBeAbleToOpenABottomSheetModal} 
                />
            </NativeStack.Group>
        </NativeStack.Navigator>
    )
}

function MyScreenThatNeedsToBeAbleToOpenABottomSheetModal() {
    return (
        <BottomSheetModalProvider>
            {/* Screen content here, and one of these children can now open a BottomSheetModal */}
        </BottomSheetModalProvider>
    )
}

I don’t want to drop the benefits of using the native stack for this purpose. Thanks though.