Tahoe sidebar - icon sizing is wrong

Hi there. I am trying to figure out how to make a macOS Tahoe app in SwiftUI with a sidebar. The problem I’m having is that the icons are the wrong size.

If you visually compare the resulting sidebar with any built-in macOS app (Finder, Notes, Mail, Music, etc.) the built-in apps all have larger icons and the spacing is different from my SwiftUI app, which has too small icons and (I think) wrong spacing.

I am trying to figure out what SwiftUI code I need to write to get a sidebar that looks the same as the other built-in macOS Tahoe apps.

It’s also important to note that Tahoe sidebars have larger icons at the top level, and in cases where the items have a disclosure triangle with additional items nested within, the nested icons have smaller icons. I have not figured out how to properly replicate this effect either.

I have spent quite a lot of time on trial-and-error with various combinations of .frame() and .font() modifiers. However, none of the results look quite right to me, and besides that, I think it is fundamentally the wrong approach; the UI or OS should be handling the sizing and spacing automatically, I shouldn’t have to specify it manually, as this is likely to break in past and future OS versions (and it never really looks exactly right in the first place).

I am hoping there is some missing modifier that I am unaware of, which would solve this; or perhaps, some fundamental aspect of making lists in sidebars that I have missed. I would very much appreciate any advice.

If you drop my code below into a new Xcode project, and compare it to a Finder window, you should be able to easily see the problem.

import SwiftUI

struct ContentView: View {
    var body: some View {
        splitView
    }
    
    @ViewBuilder
    var splitView: some View {
        NavigationSplitView {
            sidebar
        } detail: {
            helloWorld
        }

    }
    
    @ViewBuilder
    var sidebar: some View {
        List {
            NavigationLink {
                helloWorld
            } label: {
                Label("Test", systemImage: "book")
            }
            NavigationLink {
                helloWorld
            } label: {
                Label("Test 2", systemImage: "folder")
            }
            NavigationLink {
                helloWorld
            } label: {
                Label("Test 3", systemImage: "house")
            }
            
            DisclosureGroup(
                content: {
                    NavigationLink {
                        helloWorld
                    } label: {
                        Label("Test", systemImage: "book")
                    }
                    NavigationLink {
                        helloWorld
                    } label: {
                        Label("Test 2", systemImage: "folder")
                    }
                    NavigationLink {
                        helloWorld
                    } label: {
                        Label("Test 3", systemImage: "house")
                    }
                },
                label: {
                    Label("Test 4", systemImage: "document")
                }
            )
        }
    }
    
    @ViewBuilder
    var helloWorld: some View {
        VStack {
            Image(systemName: "globe")
                .imageScale(.large)
                .foregroundStyle(.tint)
            Text("Hello, world!")
        }
        .padding()
    }
}

#Preview {
    ContentView()
}