fvilarino

@Composable
fun MorphingFab(modifier: Modifier = Modifier) {
    val users = remember { mutableStateListOf<User>() }
    // 1
    var showDialog by remember { mutableStateOf(false) }
    // 2
    SharedTransitionLayout(
        modifier = Modifier
            .fillMaxSize(),
    ) {

fvilarino

// 1
@Composable
fun InputBox(
    onAddUser: (User) -> Unit,
    onCancel: () -> Unit,
    modifier: Modifier = Modifier,
) {
    // 2
    Card(
        modifier = modifier,

fvilarino

data class User(
    val name: String,
    val email: String,
)

@OptIn(ExperimentalSharedTransitionApi::class)
@Composable
fun MorphingFab(modifier: Modifier = Modifier) {
    val users = remember { mutableStateListOf<User>() }
    var showDialog by remember { mutableStateOf(false) }

fvilarino

@Composable
fun MorphingFab(modifier: Modifier = Modifier) {
    val users = remember { mutableStateListOf<User>() }

    Box(modifier = modifier) {
        UserList(
            users = users,
            modifier = Modifier.fillMaxSize(),
        )
        InputBox(

fvilarino

FloatingActionButton(
    modifier = Modifier
        .align(Alignment.BottomEnd)
        .padding(all = 16.dp),
    onClick = {
        // TODO
    }
) {
    Icon(
        imageVector = Icons.Default.Add,

fvilarino

// 1
data class User(
    val name: String,
    val email: String,
)

// 2
@Composable
fun UserList(
    users: List<User>,

fvilarino

        NavHost(
            navController = navController,
            startDestination = "list",
            modifier = Modifier.fillMaxSize(),
            enterTransition = { slideInHorizontally { it } + fadeIn() },
            exitTransition = { slideOutHorizontally { -it } + fadeOut() },
            popEnterTransition = { slideInHorizontally { -it } + fadeIn() },
            popExitTransition = { slideOutHorizontally { it } + fadeOut() },
        ) {
          // omitted

fvilarino

                LoremIpsum(
                    modifier = Modifier
                        .fillMaxWidth()
                        .sharedBounds(
                            rememberSharedContentState(
                                key = "text-$url"
                            ),
                            animatedVisibilityScope,
                        ),
                    maxLines = 3,

fvilarino

                LoremIpsum(
                    modifier = Modifier
                        .fillMaxWidth()
                        .sharedElement(
                            rememberSharedContentState(
                                key = "text-$url"
                            ),
                            animatedVisibilityScope,
                        )
                        .skipToLookaheadSize(),

fvilarino

@Composable
fun SharedTransitionScope.DetailsScreen(
    url: String,
    animatedVisibilityScope: AnimatedVisibilityScope,
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
) {
    Column(
        modifier = modifier
            .clickable(