@swiftbrowser/swift 0.1.0 → 0.3.0

package/Sources/MapKit/Map.swift

@@ -0,0 +1,638 @@
+// The SwiftUI map (iOS 17's `Map` with `Annotation`, `Marker`, overlays and
+// `MapReader`, and iOS 14's `Map(coordinateRegion:annotationItems:)`).
+//
+// A map is a surface with a grid of latitude and longitude lines; its content
+// is views that place themselves with the map's projection (Geometry.swift),
+// which the map hands down in the environment. `MapReader`'s proxy converts
+// between points in the map and coordinates with the same projection, so a
+// tap on the map (`onTapGesture { point in }`) finds the coordinate under it.
+
+@_exported import CoreLocation
+#if canImport(WASILibc)
+import WASILibc
+#elseif canImport(Glibc)
+import Glibc
+#elseif canImport(Musl)
+import Musl
+#elseif canImport(Darwin)
+import Darwin
+#endif
+import SwiftUI
+
+// MARK: - Content
+
+/// Something drawn on a map. Map content is made of views here, so any
+/// `MapContent` is also a `View`; `MapContentBuilder` is `ViewBuilder`.
+public protocol MapContent: View {}
+
+public typealias MapContentBuilder = ViewBuilder
+
+/// A map without content.
+public struct EmptyMapContent: MapContent {
+    public init() {}
+    public var body: some View { EmptyView() }
+}
+
+extension MapContent {
+    /// Whether annotations show their titles; accepted (titles are shown).
+    public func annotationTitles(_ visibility: Visibility) -> Self { self }
+    /// Which annotations the map may hide when crowded; accepted.
+    public func annotationSubtitles(_ visibility: Visibility) -> Self { self }
+}
+
+/// The user's location; the browser's map has none, so nothing is drawn.
+public struct UserAnnotation: MapContent {
+    public init(anchor: UnitPoint = .center) {}
+    public var body: some View { EmptyView() }
+}
+
+// MARK: - Map
+
+/// A map showing a region, with content placed on it.
+public struct Map<Content: View>: View {
+    let position: MapCameraPosition
+    let binding: Binding<MapCameraPosition>?
+    let content: Content
+    @Environment(\._mapProxy) private var proxy
+
+    public init(initialPosition: MapCameraPosition = .automatic, bounds: MapCameraBounds? = nil,
+                interactionModes: MapInteractionModes = .all, scope: Namespace.ID? = nil,
+                @MapContentBuilder content: () -> Content) {
+        position = initialPosition
+        binding = nil
+        self.content = content()
+    }
+
+    public init(position: Binding<MapCameraPosition>, bounds: MapCameraBounds? = nil,
+                interactionModes: MapInteractionModes = .all, scope: Namespace.ID? = nil,
+                @MapContentBuilder content: () -> Content) {
+        self.position = position.wrappedValue
+        binding = position
+        self.content = content()
+    }
+
+    public init<SelectedValue: Hashable>(initialPosition: MapCameraPosition = .automatic, bounds: MapCameraBounds? = nil,
+                                         interactionModes: MapInteractionModes = .all, selection: Binding<SelectedValue?>,
+                                         scope: Namespace.ID? = nil, @MapContentBuilder content: () -> Content) {
+        self.init(initialPosition: initialPosition, bounds: bounds, interactionModes: interactionModes, scope: scope, content: content)
+    }
+
+    public init<SelectedValue: Hashable>(position: Binding<MapCameraPosition>, bounds: MapCameraBounds? = nil,
+                                         interactionModes: MapInteractionModes = .all, selection: Binding<SelectedValue?>,
+                                         scope: Namespace.ID? = nil, @MapContentBuilder content: () -> Content) {
+        self.init(position: position, bounds: bounds, interactionModes: interactionModes, scope: scope, content: content)
+    }
+
+    /// The region shown: the position's (read again from a binding), else the world.
+    var region: MKCoordinateRegion {
+        (binding?.wrappedValue ?? position).shownRegion ?? .world
+    }
+
+    public var body: some View {
+        GeometryReader { geometry in
+            let size = geometry.size
+            let projection = size.width > 0 && size.height > 0 ? _MapProjection(region: region, size: size) : nil
+            let _ = proxy?.projection = projection
+            ZStack(alignment: .topLeading) {
+                _MapSurface(projection: projection)
+                if let projection {
+                    content.environment(\._mapProjection, projection)
+                }
+            }
+            .frame(width: size.width, height: size.height)
+            .clipped()
+        }
+    }
+}
+
+extension Map where Content == EmptyMapContent {
+    public init(initialPosition: MapCameraPosition = .automatic, bounds: MapCameraBounds? = nil,
+                interactionModes: MapInteractionModes = .all, scope: Namespace.ID? = nil) {
+        self.init(initialPosition: initialPosition, bounds: bounds, interactionModes: interactionModes, scope: scope) { EmptyMapContent() }
+    }
+
+    public init(position: Binding<MapCameraPosition>, bounds: MapCameraBounds? = nil,
+                interactionModes: MapInteractionModes = .all, scope: Namespace.ID? = nil) {
+        self.init(position: position, bounds: bounds, interactionModes: interactionModes, scope: scope) { EmptyMapContent() }
+    }
+
+    /// iOS 14: a map of a region, without annotations.
+    public init(coordinateRegion: Binding<MKCoordinateRegion>, interactionModes: MapInteractionModes = .all,
+                showsUserLocation: Bool = false, userTrackingMode: Binding<MapUserTrackingMode>? = nil) {
+        self.init(initialPosition: .region(coordinateRegion.wrappedValue), interactionModes: interactionModes) { EmptyMapContent() }
+    }
+}
+
+/// The map's surface: a plain land color with a grid of latitude and
+/// longitude lines, at a spacing that suits the region shown.
+struct _MapSurface: View {
+    let projection: _MapProjection?
+
+    var body: some View {
+        ZStack(alignment: .bottomLeading) {
+            Rectangle().fill(Color(red: 0.93, green: 0.92, blue: 0.88))
+            if let projection {
+                _Graticule(projection: projection).stroke(Color(red: 0.8, green: 0.84, blue: 0.88), lineWidth: 1)
+            }
+            Text("Map preview")
+                .font(.caption2)
+                .foregroundStyle(Color(red: 0.45, green: 0.45, blue: 0.45))
+                .padding(6)
+        }
+    }
+}
+
+/// Lines of latitude and longitude across the visible region.
+struct _Graticule: Shape {
+    let projection: _MapProjection
+
+    func path(in rect: CGRect) -> Path {
+        let visible = projection.visible
+        let extent = max(abs(visible.east - visible.west), abs(visible.north - visible.south))
+        let steps: [Double] = [0.001, 0.002, 0.005, 0.01, 0.02, 0.05, 0.1, 0.2, 0.5, 1, 2, 5, 10, 15, 30]
+        let step = steps.first { extent / $0 <= 12 } ?? 30
+        var path = Path()
+        var longitude = (visible.west / step).rounded(.down) * step
+        while longitude <= visible.east {
+            let x = projection.point(for: CLLocationCoordinate2D(latitude: 0, longitude: longitude)).x
+            path.move(to: CGPoint(x: x, y: rect.minY))
+            path.addLine(to: CGPoint(x: x, y: rect.maxY))
+            longitude += step
+        }
+        var latitude = (max(-85, visible.south) / step).rounded(.down) * step
+        while latitude <= min(85, visible.north) {
+            let y = projection.point(for: CLLocationCoordinate2D(latitude: latitude, longitude: 0)).y
+            path.move(to: CGPoint(x: rect.minX, y: y))
+            path.addLine(to: CGPoint(x: rect.maxX, y: y))
+            latitude += step
+        }
+        return path
+    }
+}
+
+// MARK: - Reader and proxy
+
+/// The current projection of a map inside a `MapReader`, kept across renders.
+@MainActor public final class _MapProxyBox {
+    var projection: _MapProjection?
+    init() {}
+}
+
+struct _MapProxyKey: EnvironmentKey {
+    static let defaultValue: _MapProxyBox? = nil
+}
+
+extension EnvironmentValues {
+    /// The `MapReader` a map reports its projection to.
+    public var _mapProxy: _MapProxyBox? {
+        get { self[_MapProxyKey.self] }
+        set { self[_MapProxyKey.self] = newValue }
+    }
+}
+
+/// Converts between points in a map and coordinates.
+@MainActor public struct MapProxy {
+    let box: _MapProxyBox
+
+    /// The coordinate at `point` in the map's coordinates; nil before the map is laid out.
+    public func convert(_ point: CGPoint, from coordinateSpace: CoordinateSpace) -> CLLocationCoordinate2D? {
+        box.projection?.coordinate(at: point)
+    }
+
+    /// Where `coordinate` is in the map's coordinates; nil before the map is laid out.
+    public func convert(_ coordinate: CLLocationCoordinate2D, to coordinateSpace: CoordinateSpace) -> CGPoint? {
+        box.projection?.point(for: coordinate)
+    }
+
+    /// The region the map shows; nil before the map is laid out.
+    public var region: MKCoordinateRegion? {
+        guard let projection = box.projection else { return nil }
+        let visible = projection.visible
+        return MKCoordinateRegion(
+            center: CLLocationCoordinate2D(latitude: (visible.north + visible.south) / 2, longitude: (visible.east + visible.west) / 2),
+            span: MKCoordinateSpan(latitudeDelta: visible.north - visible.south, longitudeDelta: visible.east - visible.west))
+    }
+}
+
+/// A view whose content can convert between the map's points and coordinates.
+public struct MapReader<Content: View>: View {
+    @State private var box = _MapProxyBox()
+    let content: (MapProxy) -> Content
+
+    public init(@ViewBuilder content: @escaping (MapProxy) -> Content) {
+        self.content = content
+    }
+
+    public var body: some View {
+        content(MapProxy(box: box)).environment(\._mapProxy, box)
+    }
+}
+
+// MARK: - Annotations and markers
+
+/// A view at a coordinate, with its title below it.
+public struct Annotation<Label: View, Content: View>: MapContent {
+    let coordinate: CLLocationCoordinate2D
+    let content: Content
+    let label: Label
+    @Environment(\._mapProjection) private var projection
+
+    public init(coordinate: CLLocationCoordinate2D, anchor: UnitPoint = .center,
+                @ViewBuilder content: () -> Content, @ViewBuilder label: () -> Label) {
+        self.coordinate = coordinate
+        self.content = content()
+        self.label = label()
+    }
+
+    public var body: some View {
+        if let projection {
+            let point = projection.point(for: coordinate)
+            content
+                .overlay(alignment: .bottom) { _MapTitle(label: label) }
+                .position(x: point.x, y: point.y)
+        }
+    }
+}
+
+extension Annotation where Label == Text {
+    public init(_ titleKey: LocalizedStringKey, coordinate: CLLocationCoordinate2D, anchor: UnitPoint = .center,
+                @ViewBuilder content: () -> Content) {
+        self.init(coordinate: coordinate, anchor: anchor, content: content) { Text(titleKey) }
+    }
+
+    @_disfavoredOverload
+    public init<S: StringProtocol>(_ title: S, coordinate: CLLocationCoordinate2D, anchor: UnitPoint = .center,
+                                   @ViewBuilder content: () -> Content) {
+        self.init(coordinate: coordinate, anchor: anchor, content: content) { Text(String(title)) }
+    }
+}
+
+/// An annotation's or marker's title, below it.
+struct _MapTitle<Label: View>: View {
+    let label: Label
+    var body: some View {
+        label
+            .font(.caption2.weight(.semibold))
+            .foregroundStyle(Color(red: 0.2, green: 0.2, blue: 0.2))
+            .fixedSize()
+            .offset(y: 16)
+    }
+}
+
+/// A balloon at a coordinate: a symbol, a monogram or nothing, on a colored circle.
+public struct Marker<Label: View>: MapContent {
+    let coordinate: CLLocationCoordinate2D
+    let label: Label
+    var symbol: String?
+    var monogram: Text?
+    var color: Color = .red
+    @Environment(\._mapProjection) private var projection
+
+    public init(coordinate: CLLocationCoordinate2D, @ViewBuilder label: () -> Label) {
+        self.coordinate = coordinate
+        self.label = label()
+    }
+
+    /// The marker's color (red by default, as in MapKit).
+    public func tint(_ tint: Color?) -> Marker {
+        var copy = self
+        copy.color = tint ?? .red
+        return copy
+    }
+
+    public var body: some View {
+        if let projection {
+            let point = projection.point(for: coordinate)
+            ZStack {
+                Circle().fill(color)
+                if let monogram {
+                    monogram.font(.caption.bold()).foregroundStyle(.white)
+                } else {
+                    Image(systemName: symbol ?? "mappin").font(.caption.bold()).foregroundStyle(.white)
+                }
+            }
+            .frame(width: 28, height: 28)
+            .overlay(alignment: .bottom) { _MapTitle(label: label) }
+            .position(x: point.x, y: point.y)
+        }
+    }
+}
+
+extension Marker where Label == Text {
+    public init(_ titleKey: LocalizedStringKey, coordinate: CLLocationCoordinate2D) {
+        self.init(coordinate: coordinate) { Text(titleKey) }
+    }
+
+    @_disfavoredOverload
+    public init<S: StringProtocol>(_ title: S, coordinate: CLLocationCoordinate2D) {
+        self.init(coordinate: coordinate) { Text(String(title)) }
+    }
+
+    public init(_ titleKey: LocalizedStringKey, systemImage: String, coordinate: CLLocationCoordinate2D) {
+        self.init(titleKey, coordinate: coordinate)
+        symbol = systemImage
+    }
+
+    @_disfavoredOverload
+    public init<S: StringProtocol>(_ title: S, systemImage: String, coordinate: CLLocationCoordinate2D) {
+        self.init(title, coordinate: coordinate)
+        symbol = systemImage
+    }
+
+    public init(_ titleKey: LocalizedStringKey, monogram: Text, coordinate: CLLocationCoordinate2D) {
+        self.init(titleKey, coordinate: coordinate)
+        self.monogram = monogram
+    }
+
+    @_disfavoredOverload
+    public init<S: StringProtocol>(_ title: S, monogram: Text, coordinate: CLLocationCoordinate2D) {
+        self.init(title, coordinate: coordinate)
+        self.monogram = monogram
+    }
+}
+
+// MARK: - Overlays
+
+/// A line through coordinates.
+public struct MapPolyline: MapContent {
+    public enum ContourStyle: Sendable { case straight, geodesic }
+
+    let coordinates: [CLLocationCoordinate2D]
+    var stroke: AnyShapeStyle = AnyShapeStyle(Color.blue)
+    var lineWidth: CGFloat = 3
+    @Environment(\._mapProjection) private var projection
+
+    public init(coordinates: [CLLocationCoordinate2D], contourStyle: ContourStyle = .straight) {
+        self.coordinates = coordinates
+    }
+
+    public func stroke<S: ShapeStyle>(_ content: S, lineWidth: CGFloat = 1) -> MapPolyline {
+        var copy = self
+        copy.stroke = AnyShapeStyle(content)
+        copy.lineWidth = lineWidth
+        return copy
+    }
+
+    public func stroke<S: ShapeStyle>(_ content: S, style: StrokeStyle) -> MapPolyline {
+        stroke(content, lineWidth: style.lineWidth)
+    }
+
+    public var body: some View {
+        if let projection {
+            _MapOutline(points: coordinates.map(projection.point(for:)), closed: false)
+                .stroke(stroke, style: StrokeStyle(lineWidth: lineWidth, lineCap: .round, lineJoin: .round))
+        }
+    }
+}
+
+/// A filled shape with corners at coordinates.
+public struct MapPolygon: MapContent {
+    let coordinates: [CLLocationCoordinate2D]
+    var fill: AnyShapeStyle = AnyShapeStyle(Color.blue.opacity(0.3))
+    var stroke: AnyShapeStyle?
+    var lineWidth: CGFloat = 1
+    @Environment(\._mapProjection) private var projection
+
+    public init(coordinates: [CLLocationCoordinate2D]) {
+        self.coordinates = coordinates
+    }
+
+    public func foregroundStyle<S: ShapeStyle>(_ style: S) -> MapPolygon {
+        var copy = self
+        copy.fill = AnyShapeStyle(style)
+        return copy
+    }
+
+    public func stroke<S: ShapeStyle>(_ content: S, lineWidth: CGFloat = 1) -> MapPolygon {
+        var copy = self
+        copy.stroke = AnyShapeStyle(content)
+        copy.lineWidth = lineWidth
+        return copy
+    }
+
+    public var body: some View {
+        if let projection {
+            let outline = _MapOutline(points: coordinates.map(projection.point(for:)), closed: true)
+            ZStack {
+                outline.fill(fill)
+                if let stroke { outline.stroke(stroke, lineWidth: lineWidth) }
+            }
+        }
+    }
+}
+
+/// A circle of `radius` meters around a coordinate.
+public struct MapCircle: MapContent {
+    let center: CLLocationCoordinate2D
+    let radius: CLLocationDistance
+    var fill: AnyShapeStyle = AnyShapeStyle(Color.blue.opacity(0.3))
+    var stroke: AnyShapeStyle?
+    var lineWidth: CGFloat = 1
+    @Environment(\._mapProjection) private var projection
+
+    public init(center: CLLocationCoordinate2D, radius: CLLocationDistance) {
+        self.center = center
+        self.radius = radius
+    }
+
+    public func foregroundStyle<S: ShapeStyle>(_ style: S) -> MapCircle {
+        var copy = self
+        copy.fill = AnyShapeStyle(style)
+        return copy
+    }
+
+    public func stroke<S: ShapeStyle>(_ content: S, lineWidth: CGFloat = 1) -> MapCircle {
+        var copy = self
+        copy.stroke = AnyShapeStyle(content)
+        copy.lineWidth = lineWidth
+        return copy
+    }
+
+    /// Points around the circle, as coordinates.
+    var outline: [CLLocationCoordinate2D] {
+        let metersPerDegree = 111_320.0
+        let latitudeRadius = radius / metersPerDegree
+        let longitudeRadius = radius / (metersPerDegree * max(0.01, cos(center.latitude * .pi / 180)))
+        return (0..<72).map { step in
+            let angle = Double(step) / 72 * 2 * .pi
+            return CLLocationCoordinate2D(latitude: center.latitude + latitudeRadius * sin(angle),
+                                          longitude: center.longitude + longitudeRadius * cos(angle))
+        }
+    }
+
+    public var body: some View {
+        if let projection {
+            let shape = _MapOutline(points: outline.map(projection.point(for:)), closed: true)
+            ZStack {
+                shape.fill(fill)
+                if let stroke { shape.stroke(stroke, lineWidth: lineWidth) }
+            }
+        }
+    }
+}
+
+/// Points joined by straight lines (and closed, for an area).
+struct _MapOutline: Shape {
+    let points: [CGPoint]
+    let closed: Bool
+
+    func path(in rect: CGRect) -> Path {
+        var path = Path()
+        path.addLines(points)
+        if closed { path.closeSubpath() }
+        return path
+    }
+}
+
+// MARK: - iOS 14 annotations
+
+/// iOS 14 map annotations (`Map(coordinateRegion:annotationItems:annotationContent:)`).
+public protocol MapAnnotationProtocol: View {}
+
+/// iOS 14: a balloon marker at a coordinate.
+public struct MapMarker: MapAnnotationProtocol {
+    let coordinate: CLLocationCoordinate2D
+    let tint: Color?
+
+    public init(coordinate: CLLocationCoordinate2D, tint: Color? = nil) {
+        self.coordinate = coordinate
+        self.tint = tint
+    }
+
+    public var body: some View {
+        Marker(coordinate: coordinate) { EmptyView() }.tint(tint)
+    }
+}
+
+/// iOS 14: a pin at a coordinate.
+public struct MapPin: MapAnnotationProtocol {
+    let coordinate: CLLocationCoordinate2D
+    let tint: Color?
+
+    public init(coordinate: CLLocationCoordinate2D, tint: Color? = nil) {
+        self.coordinate = coordinate
+        self.tint = tint
+    }
+
+    public var body: some View {
+        Marker(coordinate: coordinate) { EmptyView() }.tint(tint)
+    }
+}
+
+/// iOS 14: a view at a coordinate.
+public struct MapAnnotation<Content: View>: MapAnnotationProtocol {
+    let coordinate: CLLocationCoordinate2D
+    let content: Content
+
+    public init(coordinate: CLLocationCoordinate2D, anchorPoint: CGPoint = CGPoint(x: 0.5, y: 0.5),
+                @ViewBuilder content: () -> Content) {
+        self.coordinate = coordinate
+        self.content = content()
+    }
+
+    public var body: some View {
+        Annotation(coordinate: coordinate, content: { content }, label: { EmptyView() })
+    }
+}
+
+/// iOS 14 annotations over a collection: one per element.
+public struct _MapAnnotations<Items: RandomAccessCollection, Item: MapAnnotationProtocol>: MapContent
+where Items.Element: Identifiable {
+    let items: Items
+    let content: (Items.Element) -> Item
+
+    public var body: some View {
+        ForEach(items) { item in content(item) }
+    }
+}
+
+extension Map {
+    /// iOS 14: a map of a region with an annotation for each item.
+    public init<Items: RandomAccessCollection, Item: MapAnnotationProtocol>(
+        coordinateRegion: Binding<MKCoordinateRegion>, interactionModes: MapInteractionModes = .all,
+        showsUserLocation: Bool = false, userTrackingMode: Binding<MapUserTrackingMode>? = nil,
+        annotationItems: Items, annotationContent: @escaping (Items.Element) -> Item
+    ) where Items.Element: Identifiable, Content == _MapAnnotations<Items, Item> {
+        self.init(initialPosition: .region(coordinateRegion.wrappedValue), interactionModes: interactionModes) {
+            _MapAnnotations(items: annotationItems, content: annotationContent)
+        }
+    }
+}
+
+// MARK: - Styles and controls
+
+/// How a map is drawn; accepted (the browser's map is a plain surface).
+public struct MapStyle: Sendable {
+    public enum Elevation: Sendable { case automatic, flat, realistic }
+    public enum StandardEmphasis: Sendable { case automatic, muted }
+
+    public static var standard: MapStyle { MapStyle() }
+    public static var hybrid: MapStyle { MapStyle() }
+    public static var imagery: MapStyle { MapStyle() }
+
+    public static func standard(elevation: Elevation = .automatic, emphasis: StandardEmphasis = .automatic,
+                                pointsOfInterest: PointOfInterestCategories = .all, showsTraffic: Bool = false) -> MapStyle {
+        MapStyle()
+    }
+
+    public static func hybrid(elevation: Elevation = .automatic, pointsOfInterest: PointOfInterestCategories = .all,
+                              showsTraffic: Bool = false) -> MapStyle {
+        MapStyle()
+    }
+
+    public static func imagery(elevation: Elevation = .automatic) -> MapStyle { MapStyle() }
+}
+
+/// Points of interest a map shows; accepted.
+public struct PointOfInterestCategories: Sendable {
+    public static var all: PointOfInterestCategories { PointOfInterestCategories() }
+    public static var excludingAll: PointOfInterestCategories { PointOfInterestCategories() }
+}
+
+/// When a map reports camera changes.
+public enum MapCameraUpdateFrequency: Sendable { case continuous, onEnd }
+
+/// A camera change: the map's camera and region.
+public struct MapCameraUpdateContext: Sendable {
+    public let camera: MapCamera
+    public let region: MKCoordinateRegion
+}
+
+/// The map's controls; none are drawn in the browser.
+public struct MapUserLocationButton: View {
+    public init(scope: Namespace.ID? = nil) {}
+    public var body: some View { EmptyView() }
+}
+
+public struct MapCompass: View {
+    public init(scope: Namespace.ID? = nil) {}
+    public var body: some View { EmptyView() }
+}
+
+public struct MapScaleView: View {
+    public init(anchorEdge: HorizontalEdge = .leading, scope: Namespace.ID? = nil) {}
+    public var body: some View { EmptyView() }
+}
+
+public struct MapPitchToggle: View {
+    public init(scope: Namespace.ID? = nil) {}
+    public var body: some View { EmptyView() }
+}
+
+nonisolated extension View {
+    /// The map's style; accepted.
+    public func mapStyle(_ style: MapStyle) -> some View { self }
+
+    /// The map's controls; accepted (none are drawn).
+    public func mapControls<C: View>(@ViewBuilder _ content: () -> C) -> some View { self }
+
+    /// Whether the map's controls show; accepted.
+    public func mapControlVisibility(_ visibility: Visibility) -> some View { self }
+
+    /// Camera changes; the browser's map does not move, so none are reported.
+    public func onMapCameraChange(frequency: MapCameraUpdateFrequency = .onEnd,
+                                  _ action: @escaping () -> Void) -> some View { self }
+
+    public func onMapCameraChange(frequency: MapCameraUpdateFrequency = .onEnd,
+                                  _ action: @escaping (MapCameraUpdateContext) -> Void) -> some View { self }
+}