ζ-1: WebShellView + Universal-Link-Routing

- WebShellView (UIViewRepresentable + NSViewRepresentable) wrapt
  WKWebView, KVO-Observation für Loading/Progress/canGoBack/URL,
  Pull-to-Refresh via UIRefreshControl
- WebShellCoordinator (MainActor) hält WKNavigationDelegate +
  WKUIDelegate, externe Links via openURL aus dem Environment in
  System-Browser, Host-Whitelist auf zitare.com + .mana.how
- RootView refactored: Lesen-Tab lädt webBaseURL/, Erkunden-Tab
  /explore. Universal-Links zitare.com/q|a|c/<slug>, /search,
  /region/*, /thema/* etc. routen in den passenden Tab,
  reloadToken zwingt Re-Navigation auch bei selber URL
- AppConfig.webBaseURL = appBaseURL (zitare.mana.how) bis
  Cloudflare-Zone für zitare.com live ist; publicWebURL als
  Konstante schon eingetragen
- CookieBridge-Skeleton für mana.access auf .mana.how —
  scharfgeschaltet erst in ζ-3 nach Live-Auth-Smoke
- iPhone 16e Simulator: zitare.mana.how lädt, Carl-Spitteler-Quote
  rendert, Healthz weiter 200
- 16 Files swiftlint-grün, alle Tests grün

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Sources/App/RootView.swift

@@ -3,31 +3,28 @@ import SwiftUI
 
 /// Top-Level-View: TabView mit drei Tabs.
 ///
-/// **Phase ζ-0 — Setup.** Tabs zeigen aktuell nur Placeholder-Views.
+/// **Phase ζ-1:** Lesen + Erkunden laden `zitare.com` via `WebShellView`.
-/// Ab Phase ζ-1 wird der Lesen-Tab durch `WebShellView` ersetzt,
+/// Universal-Links auf `zitare.com/q/<slug>` / `/a/<slug>` etc. öffnen
-/// der `zitare.com` im `WKWebView` rendert.
+/// die App und routen in den passenden Tab.
 struct RootView: View {
     @Environment(AuthClient.self) private var auth
     @State private var selectedTab: AppTab = .read
+    @State private var readTarget = WebTarget(url: AppConfig.webBaseURL)
+    @State private var exploreTarget = WebTarget(
+        url: AppConfig.webBaseURL.appendingPathComponent("explore")
+    )
+    @State private var reloadCounter: Int = 0
     @State private var healthStatus: HealthStatus = .unknown
 
     var body: some View {
         TabView(selection: $selectedTab) {
-            placeholderView(
+            WebShellView(target: readTarget)
-                title: "Lesen",
+                .tabItem { Label("Lesen", systemImage: "book") }
-                subtitle: "ζ-1: WebShellView gegen zitare.com",
+                .tag(AppTab.read)
-                systemImage: "book"
-            )
-            .tabItem { Label("Lesen", systemImage: "book") }
-            .tag(AppTab.read)
 
-            placeholderView(
+            WebShellView(target: exploreTarget)
-                title: "Erkunden",
+                .tabItem { Label("Erkunden", systemImage: "sparkle.magnifyingglass") }
-                subtitle: "ζ-1: WebShell auf zitare.com/explore",
+                .tag(AppTab.explore)
-                systemImage: "sparkle.magnifyingglass"
-            )
-            .tabItem { Label("Erkunden", systemImage: "sparkle.magnifyingglass") }
-            .tag(AppTab.explore)
 
             AccountView(healthStatus: healthStatus)
                 .tabItem { Label("Konto", systemImage: "person.circle") }
@@ -44,9 +41,6 @@ struct RootView: View {
         }
     }
 
-    /// Phase ζ-0 Probe: ein Aufruf gegen `/healthz` bei App-Start.
-    /// Ab Phase ζ-1 wandert das in einen Service, der den Status global
-    /// trackt und im AccountView anzeigt.
     private func probeHealth() async {
         let api = ZitareAPI(auth: auth)
         do {
@@ -61,34 +55,61 @@ struct RootView: View {
         }
     }
 
-    /// Deep-Link-Routing. Phase ζ-0: nur loggen. Phase ζ-1: in den
+    /// Universal-Link- und Custom-URL-Routing. Wird sowohl von
-    /// passenden Tab + Pfad routen.
+    /// `onOpenURL` (Custom-Scheme `zitare://...`) als auch von
+    /// `onContinueUserActivity` (Universal-Links auf `zitare.com/...`)
+    /// aufgerufen.
+    ///
+    /// Routing-Regeln (gespiegelt zu `app-manifest.json#link_patterns`):
+    /// - `/q/<slug>`, `/a/<slug>`, `/c/<slug>` → Lesen-Tab
+    /// - `/heute`, `/random`, `/feed.rss` → Lesen-Tab
+    /// - `/explore`, `/region/...`, `/thema/...`, `/rolle/...`,
+    ///   `/epoche/...`, `/sprache/...`, `/search`, `/t/...` → Erkunden-Tab
+    /// - alles andere unter `zitare.com` → Lesen-Tab, Root-Pfad
+    ///
+    /// Custom-Scheme `zitare://quote/<slug>` wird auf
+    /// `https://zitare.com/q/<slug>` umgemappt.
     private func handle(url: URL) {
         Log.app.info("Deep-Link empfangen: \(url.absoluteString, privacy: .public)")
-        // ζ-1 TODO: parse zitare.com/q/<slug>, /a/<slug>, /c/<slug>
+
-        // und in WebShellView mit entsprechender URL laden.
+        let resolved = resolveToWebURL(url)
+        let path = resolved.path
+        reloadCounter += 1
+
+        if isExplorePath(path) {
+            exploreTarget = WebTarget(url: resolved, reloadToken: reloadCounter)
+            selectedTab = .explore
+        } else {
+            readTarget = WebTarget(url: resolved, reloadToken: reloadCounter)
+            selectedTab = .read
+        }
     }
 
-    private func placeholderView(
+    /// `zitare://quote/spitteler-...` → `https://zitare.com/q/spitteler-...`.
-        title: String,
+    /// `zitare://author/x` → `https://zitare.com/a/x`.
-        subtitle: String,
+    /// `zitare://collection/x` → `https://zitare.com/c/x`.
-        systemImage: String
+    /// `https://zitare.com/<anything>` bleibt wie es ist.
-    ) -> some View {
+    private func resolveToWebURL(_ url: URL) -> URL {
-        VStack(spacing: 16) {
+        if url.scheme == "zitare" {
-            Image(systemName: systemImage)
+            let host = url.host ?? ""
-                .font(.system(size: 48))
+            let path = url.path
-                .foregroundStyle(ZitareTheme.primary)
+            switch host {
-            Text(title)
+            case "quote":
-                .font(.title2)
+                return AppConfig.webBaseURL.appendingPathComponent("q\(path)")
-                .fontWeight(.semibold)
+            case "author":
-            Text(subtitle)
+                return AppConfig.webBaseURL.appendingPathComponent("a\(path)")
-                .font(.callout)
+            case "collection":
-                .foregroundStyle(ZitareTheme.mutedForeground)
+                return AppConfig.webBaseURL.appendingPathComponent("c\(path)")
-                .multilineTextAlignment(.center)
+            default:
-                .padding(.horizontal, 32)
+                return AppConfig.webBaseURL
+            }
         }
-        .frame(maxWidth: .infinity, maxHeight: .infinity)
+        return url
-        .background(ZitareTheme.background)
+    }
+
+    private func isExplorePath(_ path: String) -> Bool {
+        let prefixes = ["/explore", "/region", "/thema", "/rolle", "/epoche", "/sprache", "/search", "/t/"]
+        return prefixes.contains { path == $0 || path.hasPrefix($0 + "/") }
     }
 }
 

Sources/Core/Auth/AppConfig.swift

@@ -16,15 +16,22 @@ enum AppConfig {
     /// `zitare-api.mana.how` — API-Backend (Hono+Bun).
     static let apiBaseURL = URL(string: "https://zitare-api.mana.how")!
 
-    /// `zitare.com` — öffentliches statisches Frontend. Universal-Link-
+    /// `zitare.com` — geplante öffentliche Domain (CC-BY-SA-Korpus,
-    /// Domain. WKWebView-Default für Lesen-Surfaces.
+    /// statisch). Universal-Link-Domain für AASA. **Heute DNS noch
-    static let webBaseURL = URL(string: "https://zitare.com")!
+    /// nicht live** (Cloudflare-Zone-Onboarding offen, siehe
+    /// `zitare/STATUS.md`); bis dahin nutzt der WebView `appBaseURL`
+    /// (`zitare.mana.how`) — der Container liefert beide Surfaces.
+    static let publicWebURL = URL(string: "https://zitare.com")!
 
-    /// `zitare.mana.how` — SPA-Surface für eingeloggte Pfade (Submit,
+    /// `zitare.mana.how` — SPA-Surface, eingeloggte Pfade. Heute auch
-    /// Edit, Moderation). Bekommt den `mana.access`-Cookie injiziert
+    /// der Default für Lese-Surfaces, bis `zitare.com` live ist.
-    /// für Cookie-SSO.
     static let appBaseURL = URL(string: "https://zitare.mana.how")!
 
+    /// Effektive Default-URL für den WebView. Zeigt vorerst auf
+    /// `appBaseURL` (`zitare.mana.how`); nach Cloudflare-Zone-Cut
+    /// kommt das zurück auf `publicWebURL`.
+    static let webBaseURL = appBaseURL
+
     /// App-Group für Daten-Sharing zwischen App ↔ Widget ↔ ShareExt.
     static let appGroup = "group.ev.mana.zitare"
 }

Sources/Features/WebShell/CookieBridge.swift

@@ -0,0 +1,75 @@
+import Foundation
+import ManaCore
+import WebKit
+
+/// Reicht den mana-auth-JWT als Cookie an den `WKWebView` weiter, sodass
+/// eingeloggte `(app)`-Routen auf `zitare.mana.how` ohne zweiten Login
+/// erreichbar sind.
+///
+/// **Phase ζ-1: Skeleton.** Methoden existieren, werden aber heute
+/// nicht aufgerufen — bevor sie scharfgeschaltet werden, muss der
+/// Cookie-SSO-Pfad auf der Web-Seite (`zitare/apps/api/src/auth/`
+/// und `apps/zitare/src/lib/auth/token-helper.ts`) gegen einen
+/// *echten* mana-auth-Token End-to-End getestet sein (Verifikations-
+/// Lücke in `zitare/STATUS.md`).
+///
+/// **Phase ζ-3:** wird in `SubmitQuoteView` benutzt — vor dem POST
+/// gegen `zitare-api.mana.how` und vor dem Öffnen von
+/// `zitare.mana.how/me` im WebView.
+///
+/// **Cookie-Schema** (gespiegelt zu mana-auth, siehe
+/// `mana/services/mana-auth/src/auth/cookies.ts`):
+/// - Name: `mana.access` (JWT) und optional `mana.refresh` (Opaque)
+/// - Domain: `.mana.how` (App-Surface; **nicht** `.com`)
+/// - Path: `/`
+/// - Secure: true, HTTPOnly: false (WebView muss lesen können),
+///   SameSite: Lax
+enum CookieBridge {
+    /// Setzt den `mana.access`-Cookie im geteilten `WKHTTPCookieStore`,
+    /// wenn der `AuthClient` einen gültigen JWT hält. No-op sonst.
+    @MainActor
+    static func installManaAccess(from auth: AuthClient) async {
+        guard case .signedIn = auth.status, let token = currentAccessToken(from: auth) else {
+            Log.web.debug("CookieBridge: kein signedIn-Token, no-op")
+            return
+        }
+        guard let cookie = makeAccessCookie(token: token) else {
+            Log.web.warning("CookieBridge: konnte Cookie-Properties nicht bauen")
+            return
+        }
+        let store = WKWebsiteDataStore.default().httpCookieStore
+        await store.setCookie(cookie)
+        Log.web.info("CookieBridge: mana.access für .mana.how gesetzt")
+    }
+
+    /// Entfernt den `mana.access`-Cookie wieder — etwa nach Logout.
+    @MainActor
+    static func removeManaAccess() async {
+        let store = WKWebsiteDataStore.default().httpCookieStore
+        let cookies = await store.allCookies()
+        for cookie in cookies where cookie.name == "mana.access" {
+            await store.deleteCookie(cookie)
+        }
+        Log.web.info("CookieBridge: mana.access entfernt")
+    }
+
+    private static func currentAccessToken(from auth: AuthClient) -> String? {
+        // ManaCore hält den JWT im Keychain. In ζ-3 ersetzt durch die
+        // tatsächliche `auth.currentAccessToken()`-API; heute nur
+        // Skelett-Hook, damit Cookie-Setup und API in Reichweite sind.
+        // Linter beruhigen ohne unused warning:
+        _ = auth
+        return nil
+    }
+
+    private static func makeAccessCookie(token: String) -> HTTPCookie? {
+        HTTPCookie(properties: [
+            .name: "mana.access",
+            .value: token,
+            .domain: ".mana.how",
+            .path: "/",
+            .secure: true,
+            .sameSitePolicy: HTTPCookieStringPolicy.sameSiteLax
+        ])
+    }
+}

Sources/Features/WebShell/WebShellCoordinator.swift

@@ -0,0 +1,155 @@
+import Foundation
+import SwiftUI
+import WebKit
+
+#if canImport(UIKit)
+    import UIKit
+#endif
+
+/// `WKNavigationDelegate` + `WKUIDelegate` für `WebShellView`. Hält den
+/// reactive `WebNavState` aktuell, lenkt externe Links in den System-
+/// Browser und treibt Pull-to-Refresh an.
+///
+/// Nicht `Sendable`: Lebt auf `MainActor` (Closures von WKWebView
+/// liefern auf Main). KVO-Observations werden bei `deinit` entfernt.
+@MainActor
+final class WebShellCoordinator: NSObject, WKNavigationDelegate, WKUIDelegate {
+    let navState: WebNavState
+    let openURL: OpenURLAction
+    var lastTarget: WebTarget?
+
+    private var progressObservation: NSKeyValueObservation?
+    private var loadingObservation: NSKeyValueObservation?
+    private var canGoBackObservation: NSKeyValueObservation?
+    private var urlObservation: NSKeyValueObservation?
+    #if canImport(UIKit)
+        private weak var refreshControl: UIRefreshControl?
+    #endif
+
+    init(navState: WebNavState, openURL: OpenURLAction) {
+        self.navState = navState
+        self.openURL = openURL
+        super.init()
+    }
+
+    deinit {
+        progressObservation?.invalidate()
+        loadingObservation?.invalidate()
+        canGoBackObservation?.invalidate()
+        urlObservation?.invalidate()
+    }
+
+    func observe(webView: WKWebView) {
+        progressObservation = webView.observe(\.estimatedProgress, options: [.new]) { [weak self] _, change in
+            guard let value = change.newValue else { return }
+            Task { @MainActor in
+                self?.navState.estimatedProgress = value
+            }
+        }
+        loadingObservation = webView.observe(\.isLoading, options: [.new]) { [weak self] _, change in
+            guard let value = change.newValue else { return }
+            Task { @MainActor in
+                self?.navState.isLoading = value
+            }
+        }
+        canGoBackObservation = webView.observe(\.canGoBack, options: [.new]) { [weak self] _, change in
+            guard let value = change.newValue else { return }
+            Task { @MainActor in
+                self?.navState.canGoBack = value
+            }
+        }
+        urlObservation = webView.observe(\.url, options: [.new]) { [weak self] _, change in
+            let value = change.newValue ?? nil
+            Task { @MainActor in
+                self?.navState.currentURL = value
+            }
+        }
+    }
+
+    func load(_ url: URL, into webView: WKWebView) {
+        Log.web.info("WebShell load: \(url.absoluteString, privacy: .public)")
+        navState.lastError = nil
+        let request = URLRequest(url: url)
+        webView.load(request)
+    }
+
+    #if canImport(UIKit)
+        func attachRefresh(_ control: UIRefreshControl, webView: WKWebView) {
+            refreshControl = control
+            control.addAction(
+                UIAction { [weak self, weak webView] _ in
+                    webView?.reload()
+                    Task { @MainActor in
+                        self?.refreshControl?.endRefreshing()
+                    }
+                },
+                for: .valueChanged
+            )
+        }
+    #endif
+
+    // MARK: - WKNavigationDelegate
+
+    func webView(
+        _: WKWebView,
+        decidePolicyFor navigationAction: WKNavigationAction
+    ) async -> WKNavigationActionPolicy {
+        guard let url = navigationAction.request.url else { return .allow }
+        // Eigene Host-Whitelist: alles auf zitare.com bzw. .mana.how darf
+        // im WebView öffnen. Alles andere geht in den System-Browser.
+        // Custom-Scheme zitare:// catchen wir hier nicht — Universal-
+        // Links auf zitare.com sind der präferierte Pfad.
+        if let host = url.host, isAllowedHost(host) {
+            return .allow
+        }
+        if url.scheme == "http" || url.scheme == "https" {
+            Log.web.info("WebShell → openURL extern: \(url.absoluteString, privacy: .public)")
+            openURL(url)
+            return .cancel
+        }
+        return .cancel
+    }
+
+    func webView(_: WKWebView, didFail _: WKNavigation, withError error: Error) {
+        Log.web.warning("didFail: \(String(describing: error), privacy: .public)")
+        navState.lastError = (error as NSError).localizedDescription
+    }
+
+    func webView(_: WKWebView, didFailProvisionalNavigation _: WKNavigation, withError error: Error) {
+        Log.web.warning("didFailProvisional: \(String(describing: error), privacy: .public)")
+        navState.lastError = (error as NSError).localizedDescription
+    }
+
+    func webView(_: WKWebView, didFinish _: WKNavigation) {
+        navState.lastError = nil
+    }
+
+    // MARK: - WKUIDelegate
+
+    func webView(
+        _ webView: WKWebView,
+        createWebViewWith _: WKWebViewConfiguration,
+        for navigationAction: WKNavigationAction,
+        windowFeatures _: WKWindowFeatures
+    ) -> WKWebView? {
+        // `target=_blank`-Links: kein neues Fenster aufmachen, sondern
+        // im aktuellen WebView laden bzw. extern öffnen.
+        if let url = navigationAction.request.url {
+            if let host = url.host, isAllowedHost(host) {
+                webView.load(navigationAction.request)
+            } else {
+                openURL(url)
+            }
+        }
+        return nil
+    }
+
+    // MARK: - Helpers
+
+    private func isAllowedHost(_ host: String) -> Bool {
+        host == "zitare.com"
+            || host == "www.zitare.com"
+            || host.hasSuffix(".mana.how")
+            || host == "mana.how"
+    }
+}

Sources/Features/WebShell/WebShellView.swift

@@ -1,38 +1,169 @@
 import SwiftUI
+import WebKit
 
-/// Phase ζ-1 Placeholder.
+/// Phase ζ-1: SwiftUI-Hülle um `WKWebView`. Eine `WebShellView`-Instanz
+/// gehört zu einem Tab und behält ihren Web-State (Scroll-Position,
+/// Browser-History) während der Tab aktiv bleibt.
 ///
-/// Wird in ζ-1 zu einer echten `UIViewRepresentable`/
+/// **Verhalten:**
-/// `NSViewRepresentable` um `WKWebView`. Aufgabenliste in ζ-1:
+/// - Lädt `target` beim ersten Auftauchen.
-///
+/// - Wechselt `target` während die View lebt → lädt neue URL.
-/// - WebView-Konfiguration: `WKWebViewConfiguration` mit non-persistent
+/// - Pull-to-Refresh über `UIRefreshControl` (iOS).
-///   DataStore in Debug-Builds; Persistent in Release.
+/// - External-Links (anderer Host, `target=_blank`) öffnen im System-
-/// - Cookie-Bridge: nach ManaCore-Login JWT als `mana.access`-Cookie
+///   Browser via `openURL`-Environment, nicht im WebView.
-///   für `.mana.how` ins `WKHTTPCookieStore` schreiben.
+/// - Cookies werden über das default `WKWebsiteDataStore` geteilt,
-/// - Pull-to-Refresh via `UIRefreshControl` (iOS) /
+///   sodass `CookieBridge` einmal injizierte `mana.access`-Cookies
-///   `NSScrollView` (macOS).
+///   sichtbar sind.
-/// - `WKNavigationDelegate` für Deep-Link-Catching: wenn der WebView
-///   eine Navigation auf `zitare://` oder eine andere mana-Domain
-///   versucht, abfangen und natively routen.
-/// - `WKUIDelegate` für `target=_blank`-Links (Safari öffnen, nicht
-///   im WebView).
-/// - Native-Toolbar overlay (ζ-5).
-///
-/// Heute nur die Signatur, damit `RootView` schon den finalen
-/// Import-Pfad nutzt.
 struct WebShellView: View {
-    let initialURL: URL
+    let target: WebTarget
+
+    @State private var navState = WebNavState()
+    @Environment(\.openURL) private var openURL
 
     var body: some View {
-        VStack(spacing: 12) {
+        VStack(spacing: 0) {
-            Text("WebShellView")
+            if navState.isLoading {
-                .font(.headline)
+                ProgressView(value: navState.estimatedProgress)
-            Text("ζ-1 — TODO: WKWebView auf \(initialURL.absoluteString)")
+                    .progressViewStyle(.linear)
-                .font(.caption)
+                    .frame(height: 2)
-                .foregroundStyle(.secondary)
+            }
-                .multilineTextAlignment(.center)
+            #if canImport(UIKit)
-                .padding(.horizontal)
+                WebViewRepresentable(
+                    target: target,
+                    navState: navState,
+                    openURL: openURL
+                )
+                .background(ZitareTheme.background)
+            #elseif canImport(AppKit)
+                MacWebViewRepresentable(
+                    target: target,
+                    navState: navState,
+                    openURL: openURL
+                )
+                .background(ZitareTheme.background)
+            #endif
+            if let error = navState.lastError {
+                errorBar(error)
+            }
         }
-        .frame(maxWidth: .infinity, maxHeight: .infinity)
+    }
+
+    private func errorBar(_ message: String) -> some View {
+        HStack(spacing: 12) {
+            Image(systemName: "exclamationmark.triangle.fill")
+                .foregroundStyle(ZitareTheme.warning)
+            Text(message)
+                .font(.caption)
+                .lineLimit(2)
+            Spacer()
+        }
+        .padding(.horizontal, 12)
+        .padding(.vertical, 8)
+        .background(ZitareTheme.muted)
     }
 }
+
+/// URL + monoton wachsende `reloadToken`. Ein neuer Token zwingt den
+/// WebView, dieselbe URL nochmal zu laden — wird gebraucht wenn der
+/// User auf einen Universal-Link tappt, der zur aktuellen URL führt.
+struct WebTarget: Equatable {
+    let url: URL
+    let reloadToken: Int
+
+    init(url: URL, reloadToken: Int = 0) {
+        self.url = url
+        self.reloadToken = reloadToken
+    }
+}
+
+/// Reactive Navigation-State, geteilt zwischen SwiftUI und Coordinator.
+@Observable
+final class WebNavState {
+    var isLoading: Bool = false
+    var estimatedProgress: Double = 0
+    var lastError: String?
+    var currentURL: URL?
+    var canGoBack: Bool = false
+}
+
+#if canImport(UIKit)
+    import UIKit
+
+    private struct WebViewRepresentable: UIViewRepresentable {
+        let target: WebTarget
+        let navState: WebNavState
+        let openURL: OpenURLAction
+
+        func makeCoordinator() -> WebShellCoordinator {
+            WebShellCoordinator(navState: navState, openURL: openURL)
+        }
+
+        func makeUIView(context: Context) -> WKWebView {
+            let config = WKWebViewConfiguration()
+            config.websiteDataStore = .default()
+            config.applicationNameForUserAgent = "ZitareNative/0.1 (iOS)"
+            let webView = WKWebView(frame: .zero, configuration: config)
+            webView.navigationDelegate = context.coordinator
+            webView.uiDelegate = context.coordinator
+            webView.allowsBackForwardNavigationGestures = true
+            webView.scrollView.refreshControl = makeRefreshControl(
+                webView: webView,
+                coordinator: context.coordinator
+            )
+            context.coordinator.observe(webView: webView)
+            context.coordinator.load(target.url, into: webView)
+            return webView
+        }
+
+        func updateUIView(_ webView: WKWebView, context: Context) {
+            let coord = context.coordinator
+            if coord.lastTarget != target {
+                coord.load(target.url, into: webView)
+                coord.lastTarget = target
+            }
+        }
+
+        private func makeRefreshControl(
+            webView: WKWebView,
+            coordinator: WebShellCoordinator
+        ) -> UIRefreshControl {
+            let refresh = UIRefreshControl()
+            coordinator.attachRefresh(refresh, webView: webView)
+            return refresh
+        }
+    }
+
+#elseif canImport(AppKit)
+    import AppKit
+
+    private struct MacWebViewRepresentable: NSViewRepresentable {
+        let target: WebTarget
+        let navState: WebNavState
+        let openURL: OpenURLAction
+
+        func makeCoordinator() -> WebShellCoordinator {
+            WebShellCoordinator(navState: navState, openURL: openURL)
+        }
+
+        func makeNSView(context: Context) -> WKWebView {
+            let config = WKWebViewConfiguration()
+            config.websiteDataStore = .default()
+            config.applicationNameForUserAgent = "ZitareNative/0.1 (macOS)"
+            let webView = WKWebView(frame: .zero, configuration: config)
+            webView.navigationDelegate = context.coordinator
+            webView.uiDelegate = context.coordinator
+            webView.allowsBackForwardNavigationGestures = true
+            context.coordinator.observe(webView: webView)
+            context.coordinator.load(target.url, into: webView)
+            return webView
+        }
+
+        func updateNSView(_ webView: WKWebView, context: Context) {
+            let coord = context.coordinator
+            if coord.lastTarget != target {
+                coord.load(target.url, into: webView)
+                coord.lastTarget = target
+            }
+        }
+    }
+#endif