CSVEditor

Shows how to make a macOS app that opens and edits CSV files. It is a SwiftUI project using TableView, fileExporter, fileImporter, and ReferenceFileDocument.

16
0
Swift

CSVEditor

Shows how to make a macOS app that opens and edits CSV files. It is a SwiftUI project using TableView, fileExporter, fileImporter, and ReferenceFileDocument.

SwiftUI TableView with CSV data

SwiftUI Table

MacOS 15 introduces dynamic table columns. This allows to show the imported csv data:

   Table(of: CSVRow.self,
         selection: $selection,
         columnCustomization: $viewModel.tableCustomization) {
            TableColumnForEach(viewModel.headers) { header in
                TableColumn(header.name) { row in
                    TextField("Cell",
                              text: viewModel.cellBinding(for: row, header: header))
                }
                .customizationID(header.id.uuidString)
            }
        } rows: {
            ForEach(viewModel.rows) { row in
                TableRow(row)
                    .contextMenu {
                        Button("Delete") {
                            withAnimation(.bouncy(duration: 2)) {
                                viewModel.delete(row: row,
                                                 selection: selection)
                            }
                        }
                    }
            }
        }

The table rows are selectable and have a context menu to delete the selected rows:

Edit Data in SwiftUI TableView

Import CSV Files with SwiftUI

You can define what file types you want to allow. The following uses “commaSeparatedText” which corresponds to CSV files:

        .fileImporter(isPresented: $isPresented,
                      allowedContentTypes: [UTType.commaSeparatedText]) { result in
            viewModel.handleFileImport(for: result)
        }
SwiftUI File importer with CSV files

Document-Based app

The project is defined to use a document type for CSV files. This allows to open the app from Finder:

Finder app open with dialog

You can get more functionality with DocumentGroup:

@main
struct CSVEditorApp: App {
    var body: some Scene {
        DocumentGroup(viewing: CSVViewModel.self) { configuration in
            ContentView(viewModel: configuration.document)
        }
    }
}

This includes “File” commands like save, open and move:

SwiftUI TableView with CSV data