SwiftUI, Navigation view and animated transitions in destination. VStack works but List does not

Question

The RoundedRectangle "animates out" but "snaps in" if I use List. Is it a SwiftUI bug or me?

Also, If the third navigation link is commented out then the button in the rectangles view pops the app back to the Navigation view. Next time I go to the rectangles it has changed the color. This happens only with VStack, List is unaffected. This makes no sense at all.

import SwiftUI

struct ContentView: View {
    @State var fff: Bool = false
    var body: some View {
        NavigationView {
            VStack { // <---- This works if I have three navigation links, but not if I have only two.
//          List { // <------ This does not work.
                NavigationLink(
                    destination:
                        ZStack {
                            if fff {
                                RoundedRectangle(cornerRadius: 100) .foregroundColor(.blue)
                                    .transition(.asymmetric(insertion: .move(edge: .bottom), removal: .move(edge: .top)))
                                    .animation(.easeIn)
                            }
                            else {
                                RoundedRectangle(cornerRadius: 100) .foregroundColor(.purple)
                                    .transition(.asymmetric(insertion: .move(edge: .bottom), removal: .move(edge: .top)))
                                    .animation(.easeIn)
                            }
                            Button(action: {
                                fff.toggle()
                            }, label: {
                                Text("Button")
                            })
                        }
                    ,
                    label: {
                        Text("To rectangles")
                    }
                )
                NavigationLink(
                    destination: Text("Settings"),
                    label: {
                        HStack {
                            Image(systemName: "wrench")
                            Text("Settings")
                        }
                    }
                )
//              NavigationLink( <--- If this link is commented out then the button in the rectangles view pops the app back to the Navigation view (only when using VStack).
//                  destination: Text("Store"),
//                  label: {
//                      HStack {
//                          Image(systemName: "cart")
//                          Text("Store")
//                      }
//                  }
//              )
            }
        }
    }
}

Answer 1

Moving the destination to a different struct fixes the issue.

struct RectView: View {
    @State var fff: Bool = false
    var body: some View {
        ZStack {
            if fff {
                RoundedRectangle(cornerRadius: 100) .foregroundColor(.blue)
                    .transition(.asymmetric(insertion: .move(edge: .bottom), removal: .move(edge: .top)))
                    .animation(.easeIn)
            } else {
                RoundedRectangle(cornerRadius: 100) .foregroundColor(.purple)
                    .transition(.asymmetric(insertion: .move(edge: .bottom), removal: .move(edge: .top)))
                    .animation(.easeIn)
            }
            Button(action: {
                fff.toggle()
            }, label: {
                Text("Button")
            })
        }
    }
}