Add macOS support

Demo-iOS/Gutenberg.xcodeproj/project.pbxproj

@@ -318,6 +318,9 @@
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
 				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "Gutenberg Development";
+				REGISTER_APP_GROUPS = NO;
+				SUPPORTED_PLATFORMS = "iphoneos iphonesimulator macosx";
+				SUPPORTS_MACCATALYST = NO;
 				SWIFT_EMIT_LOC_STRINGS = YES;
 				SWIFT_VERSION = 5.0;
 				TARGETED_DEVICE_FAMILY = "1,2";
@@ -348,6 +351,9 @@
 				PRODUCT_BUNDLE_IDENTIFIER = org.wordpress.gutenbergkit;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
+				REGISTER_APP_GROUPS = NO;
+				SUPPORTED_PLATFORMS = "iphoneos iphonesimulator macosx";
+				SUPPORTS_MACCATALYST = NO;
 				SWIFT_EMIT_LOC_STRINGS = YES;
 				SWIFT_VERSION = 5.0;
 				TARGETED_DEVICE_FAMILY = "1,2";

Demo-iOS/Sources/ContentView.swift

@@ -3,9 +3,13 @@ import GutenbergKit
 
 struct ContentView: View {
     var body: some View {
+        #if os(macOS)
+        EditorView()
+        #else
         NavigationView {
-            EditorView(editorURL: URL(string: "http://localhost:5173/")!)
+            EditorView()
         }
+        #endif
     }
 }
 

Demo-iOS/Sources/EditorView.swift

@@ -1,12 +1,28 @@
 import SwiftUI
 import GutenbergKit
+import WebKit
+
+#if os(iOS) || os(visionOS)
+typealias ViewControllerRepresentable = UIViewControllerRepresentable
+#elseif os(macOS)
+typealias ViewControllerRepresentable = NSViewControllerRepresentable
+#endif
 
 struct EditorView: View {
-    var editorURL: URL?
+    let viewModel = EditorViewModel(
+        initialTitle: "",
+        initialContent: "",
+        siteURL: "",
+        siteApiRoot: "",
+        siteApiNamespace: "",
+        authHeader: "",
+        type: ""
+    )
 
     var body: some View {
-        _EditorView(editorURL: editorURL)
+        EditorViewWrapper(viewModel: viewModel)
             .toolbar {
+                #if canImport(UIKit)
                 ToolbarItemGroup(placement: .topBarLeading) {
                     Button(action: {}, label: {
                         Image(systemName: "xmark")
@@ -28,6 +44,7 @@ struct EditorView: View {
 
                     moreMenu
                 }
+                #endif
             }
     }
 
@@ -68,21 +85,39 @@ struct EditorView: View {
     }
 }
 
-private struct _EditorView: UIViewControllerRepresentable {
-    var editorURL: URL?
+private struct EditorViewWrapper: ViewControllerRepresentable {
+    let viewModel: EditorViewModel
+
+    private func makeViewController() -> EditorViewController {
+        let viewController = EditorViewController(
+            viewModel: viewModel,
+            service: .init(client: Client())
+        )
+//        viewController.developmentEnvironmentUrl = URL(string:  "http://localhost:5173/")!
+        viewController.isDebuggingEnabled = true
 
-    func makeUIViewController(context: Context) -> EditorViewController {
-        let viewController = EditorViewController(service: .init(client: Client()))
-        viewController.editorURL = editorURL
-        if #available(iOS 16.4, *) {
-            viewController.webView.isInspectable = true
-        }
         return viewController
     }
 
+    #if canImport(UIKit)
+    func makeUIViewController(context: Context) -> EditorViewController {
+        makeViewController()
+    }
+
     func updateUIViewController(_ uiViewController: EditorViewController, context: Context) {
         // Do nothing
     }
+    #endif
+
+    #if canImport(AppKit)
+    func makeNSViewController(context: Context) -> EditorViewController {
+        makeViewController()
+    }
+
+    func updateNSViewController(_ nsViewController: EditorViewController, context: Context) {
+        // Do nothing
+    }
+    #endif
 }
 
 struct Client: EditorNetworkingClient {

Sources/GutenbergKit/Sources/EditorBlockPicker.swift

@@ -10,7 +10,6 @@ struct EditorBlockPicker: View {
 
     @Environment(\.dismiss) private var dismiss
 
-
     var body: some View {
         List {
             ForEach(viewModel.displayedSections) { section in
@@ -22,9 +21,15 @@ struct EditorBlockPicker: View {
             }
         }
         .toolbar(content: {
+            #if(os(macOS))
+            ToolbarItemGroup {
+                _leadingToolbarItems
+            }
+            #elseif(os(iOS))
             ToolbarItemGroup(placement: .topBarLeading) {
-                Button("Close", action: { dismiss() })
+                _leadingToolbarItems
             }
+
             ToolbarItemGroup(placement: .topBarTrailing) {
                 Menu(content: {
                     Button("Blocks", action: {})
@@ -39,8 +44,11 @@ struct EditorBlockPicker: View {
                     }
                 })
             }
+            #endif
         })
+        #if(os(iOS))
         .navigationBarTitleDisplayMode(.inline)
+        #endif
 
 //        TabView(selection: $group,
 //                content:  {
@@ -64,6 +72,11 @@ struct EditorBlockPicker: View {
 //        .tint(Color.primary)
     }
 
+    @ViewBuilder
+    var _leadingToolbarItems: some View {
+        Button("Close", action: { dismiss() })
+    }
+
     @ViewBuilder
     var _bodyBlocks: some View {
         VStack(spacing: 0) {
@@ -76,8 +89,11 @@ struct EditorBlockPicker: View {
 //                    .padding(.bottom, 8)
 
             }
+        #if canImport(UIKit)
             .background(Color(uiColor: .secondarySystemBackground))
-
+        #elseif canImport(AppKit)
+            .background(Color(nsColor: .secondarySystemFill))
+        #endif
 
             List {
                 Section("Text") {
@@ -94,7 +110,9 @@ struct EditorBlockPicker: View {
                     _Label("Audio", systemImage: "waveform")
                 }
             }
+            #if canImport(UIKit)
             .listStyle(.insetGrouped)
+            #endif
         }
 //        .safeAreaInset(edge: .bottom) {
 //            HStack(spacing: 30) {
@@ -114,6 +132,7 @@ struct EditorBlockPicker: View {
 //        }
 //        .searchable(text: $searchText)//, placement: .navigationBarDrawer(displayMode: .always))
         .toolbar(content: {
+            #if canImport(UIKit)
             ToolbarItemGroup(placement: .topBarLeading) {
                 Button("Close", action: { dismiss() })
             }
@@ -131,8 +150,11 @@ struct EditorBlockPicker: View {
                     }
                 })
             }
+            #endif
         })
+        #if canImport(UIKit)
         .navigationBarTitleDisplayMode(.inline)
+        #endif
 //        .toolbar(.hidden, for: .navigationBar)
 
         .tint(Color.primary)
@@ -190,7 +212,7 @@ private struct MenuItem: View {
                 .foregroundStyle(isSelected ? Color.primary : Color.secondary)
             Rectangle()
                 .frame(height: 2)
-                .foregroundStyle(isSelected ? Color.black : Color(uiColor: .separator))
+                .foregroundStyle(isSelected ? Color.black : Color.separator)
                 .opacity(isSelected ? 1 : 0)
         }
     }

Sources/GutenbergKit/Sources/EditorJSMessage.swift

@@ -1,7 +1,7 @@
 import WebKit
 
 /// A type that represents JavaScript messages send from and to the web view.
-struct EditorJSMessage {
+public struct EditorJSMessage {
     let type: MessageType
     let body: Any?
 
@@ -27,8 +27,6 @@ struct EditorJSMessage {
         case onEditorLoaded
         /// The editor content changed.
         case onEditorContentChanged
-        /// The user tapped the inserter button.
-        case showBlockPicker
     }
 
     struct DidUpdateBlocksBody: Decodable {