Draggable doesn't work with multiple items in a list

Problem:

On macOS, unable to drag multiple car items from FolderDetail List Single items from a list are draggable but multiple items are not draggable.

Feedback FB10128110

I am really saddened that this is not fixed for over a year. Please look into this.

Platform

macOS 14 (beta 3), macOS 13

Steps to reproduce

1. Run the code provided below
2. Tap the sidebar button to show the sidebar
3. Select "Folder 0" from the sidebar
4. Drag "car a" into "Folder 1" (Go to Folder 2 to notice this happened successfully, you will be able to see "car a" in Folder 1)
5. Select "Folder 0" from the sidebar
6. Select "car a" and "car b" and try to drag them to "Folder 2"

Expected Behaviour

• "car a" and "car b" must be both draggable (multiple items should be draggable).
• The entire cell needs to be draggable not just the Text.

Actual Behaviour

• Though “car a” and “car b” are selected, when dragged only one of the 2 items is dragged
• You also can drag them only when dragging the Text unlike in iOS where you can drag the cell.

Note:

Same code works on iOS

Code:

UTType

extension UTType {
    static var car = UTType(exportedAs: "com.example.DragAndDropListDemo.car")
}

Car

import Foundation
import CoreTransferable

struct Car: Identifiable {
    var id: Int
    var name: String
}

//extension Car: Codable {}

extension Car: Codable, Transferable {
    static var transferRepresentation: some TransferRepresentation {
        CodableRepresentation(contentType: .car)
    }
}

Folder

struct Folder: Identifiable, Hashable {
    var id: Int
    var name: String
}

DataStore

class DataStore: ObservableObject {
    var folders = (0..<100).map { Folder(id: $0, name: "folder \($0)")}
    var cars = [0: [Car(id: 0, name:"car a"), Car(id: 1, name:"car b")],
                1: [Car(id: 2, name:"car c"), Car(id: 3, name:"car d")]]
}

Views

ContentView

struct ContentView: View {
    
    @StateObject private var dataStore = DataStore()
    @State private var selectedFolder: Folder?

    var body: some View {
        NavigationSplitView {
            FolderList(selectedFolder: $selectedFolder,
                       dataStore: dataStore)
        } detail: {
            FolderDetail(folder: selectedFolder,
                         dataStore: dataStore)
        }
    }
}

FolderList

struct FolderList: View {
    
    @Binding var selectedFolder: Folder?
    @ObservedObject var dataStore: DataStore
    
    var body: some View {
        List(dataStore.folders, selection: $selectedFolder) { folder in
            NavigationLink(value: folder) {
                Text(folder.name)
                    .dropDestination(for: Car.self) { cars, location in
                        
                        print("cars = \(cars) location = \(location)")
                        
                        if let existingCars = dataStore.cars[folder.id] {
                            dataStore.cars[folder.id] = existingCars + cars
                        } else {
                            dataStore.cars[folder.id] = cars
                        }
                        return true
                    }
            }
        }
    }
}

FolderDetail

struct FolderDetail: View {
    let folder: Folder?
    @ObservedObject var dataStore: DataStore

    @State private var selectedCarIDs = Set<Int>()

    var body: some View {
        if let folder {
            List(dataStore.cars[folder.id] ?? [], selection: $selectedCarIDs) { car in
                Text(car.name)
                    .draggable(car)
            }

        } else {
            Text("no folder selected")
        }
    }
}