SwiftUI–AppKit/UIKit Integration Enhancements (iOS/macOS 27)

import SwiftUI
import AppKit
import Observation

// MARK: - Observable Model
@Observable
final class ColorModel {
    var hue: Double = 0.5
    var saturation: Double = 0.8
    var brightness: Double = 0.7

    var color: Color {
        Color(hue: hue, saturation: saturation, brightness: brightness)
    }

    func resetToFull() {
        saturation = 1.0
        brightness = 1.0
    }
}

// MARK: - NSGestureRecognizerRepresentable conformance (new in macOS 26)
struct ForceClickReset: NSGestureRecognizerRepresentable {
    var model: ColorModel

    func makeNSGestureRecognizer(context: Context) -> NSPressGestureRecognizer {
        let recognizer = NSPressGestureRecognizer()
        // Stage 2 pressure = force click on supported trackpads
        recognizer.pressureStage = .two
        return recognizer
    }

    func handleNSGestureRecognizerAction(
        _ recognizer: NSPressGestureRecognizer,
        context: Context
    ) {
        guard recognizer.state == .began else { return }
        withAnimation(.spring(duration: 0.3)) {
            model.resetToFull()
        }
    }
}

// MARK: - SwiftUI Color Swatch View
struct ColorSwatchView: View {
    @State private var model = ColorModel()

    var body: some View {
        VStack(spacing: 20) {
            RoundedRectangle(cornerRadius: 20)
                .fill(model.color)
                .frame(width: 200, height: 200)
                .shadow(radius: 8)
                // Attach the AppKit gesture recognizer via .gesture()
                .gesture(ForceClickReset(model: model))
                .overlay(
                    Text("Force Click\nto Reset")
                        .font(.caption)
                        .multilineTextAlignment(.center)
                        .foregroundStyle(.white.opacity(0.8))
                )

            VStack(alignment: .leading) {
                Text("Hue").font(.caption)
                Slider(value: $model.hue, in: 0...1)
                Text("Saturation").font(.caption)
                Slider(value: $model.saturation, in: 0...1)
                Text("Brightness").font(.caption)
                Slider(value: $model.brightness, in: 0...1)
            }
            .padding(.horizontal)
        }
        .padding()
        .frame(width: 300)
    }
}

#Preview {
    ColorSwatchView()
}