Bottom sheet route

[Andrei Mukamolau]

I'm trying to implement bottom sheet destination similar to Accompanist with Precompose, but it seems that I cannot extend Navigator, and floating destination doesn't work properly. Is it possible to implement bottom sheet route on the app side, or do I need to create a PR for the library?

Before switching to multiplatform, I used separate NavHost inside ModalBottomSheet. But now it seems that that there can be only one NavHost

[Tlaster]

Is it possible to implement bottom sheet route on the app side

Theoretically, yes. You can have an empty floating route and wrap your NavHost with ModalBottomSheetLayout, when Navigator.currentEntry is your bottom sheet route you can show the bottom sheet.
A built in should be better. I'm considering making Navigator extendable, and not only being used in Compose(maybe SwiftUI?)

[FunkyMuse]

Is there any update regarding this?

[Andrei Mukamolau]

Turns out that Compose Multiplatform didn't have ModalBottomSheet then, so I did a workaround with BottomSheetScaffold and toggling its bottom sheet state instead of navigating to destination

[FunkyMuse]

Turns out that Compose Multiplatform doesn't have ModalBottomSheet for now, so I did a workaround with BottomSheetScaffold and toggling its bottom sheet state instead of navigating to destination

It does have Modal bottom sheet

[Andrei Mukamolau]

Oh, maybe it's there now, but I couldn't find it when I opened the issue

[Artem Bazhanov]

My current solution just is:

    fun RouteBuilder.bottomSheet(
        navigator: Navigator,
        route: String,
        content: @Composable (BackStackEntry) -> Unit,
    ) = dialog(route) { backStackEntry ->
        val sheetState = rememberModalBottomSheetState(skipPartiallyExpanded = true)
        val scope = rememberCoroutineScope()
        ModalBottomSheet(
            sheetState = sheetState,
            onDismissRequest = { scope.launch { navigator.popBackStack() } },
            dragHandle = null,
            content = { content(backStackEntry) },
        )
    }

It can be used in navigation graph like:

bottomSheet(navigator, routeToSheet()) { backStackEntry ->
            SomeSheet(...)
}