@swiftbrowser/swift 0.0.0-stage → 0.2.0

package/Sources/SwiftUI/Charts/ChartContent.swift

@@ -0,0 +1,376 @@
+// `ChartContent`, its result builder, the structural content types and the
+// mark modifiers. Content resolves to `_RawMark`s (one per data point) that
+// Chart.swift scales into the `chart` element's unit-coordinate marks.
+
+/// The content of a `Chart`: marks, groups of marks, or a type with a `body`.
+/// Unlike `View` it is not main-actor isolated: the runtime resolves it from
+/// the (nonisolated) `_HostView` requirements.
+public protocol ChartContent {
+    associatedtype Body: ChartContent
+    @ChartContentBuilder var body: Self.Body { get }
+}
+
+extension Never: @preconcurrency ChartContent {}
+
+/// Content the resolver reads directly instead of evaluating `body`.
+public protocol _PrimitiveChartContent: ChartContent where Body == Never {}
+
+extension _PrimitiveChartContent {
+    public var body: Never { fatalError("\(Self.self) is primitive chart content and has no body") }
+}
+
+/// Internal: contributes raw marks.
+protocol _ChartContentNode {
+    func _collect(into collector: inout _ChartCollector, modifiers: _MarkModifiers)
+}
+
+extension ChartContent {
+    func _collectAny(into collector: inout _ChartCollector, modifiers: _MarkModifiers) {
+        if let node = self as? any _ChartContentNode {
+            node._collect(into: &collector, modifiers: modifiers)
+        } else {
+            body._collectAny(into: &collector, modifiers: modifiers)
+        }
+    }
+}
+
+// MARK: - Raw marks
+
+/// An annotation view attached to a mark.
+struct _MarkAnnotation {
+    var position: AnnotationPosition
+    var alignment: Alignment
+    var spacing: Double
+    var content: any View
+}
+
+/// Everything the modifiers set; an inner modifier overrides an outer one.
+struct _MarkModifiers {
+    var style: (any ShapeStyle)?
+    var styleBy: _LabelledValue?
+    var symbolBy: _LabelledValue?
+    var symbol: String?
+    var symbolSize: Double?
+    var interpolation = "linear"
+    var opacity = 1.0
+    var lineWidth: Double?
+    var cornerRadius = 0.0
+    var mask: (any ChartContent)?
+    var annotations: [_MarkAnnotation] = []
+}
+
+enum _RawMarkKind: Equatable {
+    case bar, rectangle, line, area, point, rule
+}
+
+/// One mark before scaling.
+struct _RawMark {
+    var kind: _RawMarkKind
+    var x: _PlottableValue?
+    var xStart: _PlottableValue?
+    var xEnd: _PlottableValue?
+    var y: _PlottableValue?
+    var yStart: _PlottableValue?
+    var yEnd: _PlottableValue?
+    var series: _PlottableValue?
+    var width: MarkDimension?
+    var height: MarkDimension?
+    var modifiers = _MarkModifiers()
+
+    var xValues: [_PlottableValue] { [x, xStart, xEnd].compactMap { $0 } }
+    var yValues: [_PlottableValue] { [y, yStart, yEnd].compactMap { $0 } }
+}
+
+struct _ChartCollector {
+    var marks: [_RawMark] = []
+}
+
+// MARK: - Structural content
+
+public struct _EmptyChartContent {
+    public init() {}
+}
+extension _EmptyChartContent: _PrimitiveChartContent {}
+extension _EmptyChartContent: _ChartContentNode {
+    func _collect(into collector: inout _ChartCollector, modifiers: _MarkModifiers) {}
+}
+
+public struct _TupleChartContent<T> {
+    let children: [any ChartContent]
+}
+extension _TupleChartContent: _PrimitiveChartContent {}
+extension _TupleChartContent: _ChartContentNode {
+    func _collect(into collector: inout _ChartCollector, modifiers: _MarkModifiers) {
+        for child in children { child._collectAny(into: &collector, modifiers: modifiers) }
+    }
+}
+
+public struct _ConditionalChartContent<TrueContent: ChartContent, FalseContent: ChartContent> {
+    enum Storage {
+        case trueContent(TrueContent)
+        case falseContent(FalseContent)
+    }
+    let storage: Storage
+}
+extension _ConditionalChartContent: _PrimitiveChartContent {}
+extension _ConditionalChartContent: _ChartContentNode {
+    func _collect(into collector: inout _ChartCollector, modifiers: _MarkModifiers) {
+        switch storage {
+        case .trueContent(let content): content._collectAny(into: &collector, modifiers: modifiers)
+        case .falseContent(let content): content._collectAny(into: &collector, modifiers: modifiers)
+        }
+    }
+}
+
+extension Optional: ChartContent where Wrapped: ChartContent {
+    public typealias Body = Never
+    public var body: Never { fatalError("Optional is primitive chart content and has no body") }
+}
+extension Optional: _ChartContentNode where Wrapped: ChartContent {
+    func _collect(into collector: inout _ChartCollector, modifiers: _MarkModifiers) {
+        if case .some(let content) = self { content._collectAny(into: &collector, modifiers: modifiers) }
+    }
+}
+
+public struct _ArrayChartContent<Element: ChartContent> {
+    let elements: [Element]
+}
+extension _ArrayChartContent: _PrimitiveChartContent {}
+extension _ArrayChartContent: _ChartContentNode {
+    func _collect(into collector: inout _ChartCollector, modifiers: _MarkModifiers) {
+        for element in elements { element._collectAny(into: &collector, modifiers: modifiers) }
+    }
+}
+
+/// Type-erased chart content.
+public struct AnyChartContent {
+    let storage: any ChartContent
+    public init<C: ChartContent>(_ content: C) { storage = content }
+}
+extension AnyChartContent: _PrimitiveChartContent {}
+extension AnyChartContent: _ChartContentNode {
+    func _collect(into collector: inout _ChartCollector, modifiers: _MarkModifiers) {
+        storage._collectAny(into: &collector, modifiers: modifiers)
+    }
+}
+
+/// `ForEach` over chart content: one mark group per element, with modifiers
+/// applied to the `ForEach` distributed to each element's marks.
+extension ForEach: ChartContent where Content: ChartContent {
+    public typealias Body = Never
+    public var body: Never { fatalError("ForEach is primitive chart content and has no body") }
+}
+extension ForEach: _ChartContentNode where Content: ChartContent {
+    func _collect(into collector: inout _ChartCollector, modifiers: _MarkModifiers) {
+        for element in data { content(element)._collectAny(into: &collector, modifiers: modifiers) }
+    }
+}
+
+extension ForEach where Content: ChartContent {
+    public init(_ data: Data, id: KeyPath<Data.Element, ID>,
+                @ChartContentBuilder content: @escaping (Data.Element) -> Content) {
+        self.init(_data: data, id: { $0[keyPath: id] }, content: content)
+    }
+}
+
+extension ForEach where Content: ChartContent, Data.Element: Identifiable, ID == Data.Element.ID {
+    public init(_ data: Data, @ChartContentBuilder content: @escaping (Data.Element) -> Content) {
+        self.init(_data: data, id: { $0.id }, content: content)
+    }
+}
+
+extension ForEach where Content: ChartContent, Data == Range<Int>, ID == Int {
+    public init(_ data: Range<Int>, @ChartContentBuilder content: @escaping (Int) -> Content) {
+        self.init(_data: data, id: { $0 }, content: content)
+    }
+}
+
+// MARK: - ChartContentBuilder
+
+@resultBuilder
+public enum ChartContentBuilder {
+    public static func buildBlock() -> _EmptyChartContent { _EmptyChartContent() }
+
+    public static func buildBlock<Content: ChartContent>(_ content: Content) -> Content { content }
+
+    public static func buildBlock<each Content: ChartContent>(
+        _ content: repeat each Content
+    ) -> _TupleChartContent<(repeat each Content)> {
+        var children: [any ChartContent] = []
+        for child in repeat each content { children.append(child) }
+        return _TupleChartContent(children: children)
+    }
+
+    public static func buildExpression<Content: ChartContent>(_ content: Content) -> Content { content }
+
+    public static func buildOptional<Content: ChartContent>(_ content: Content?) -> Content? { content }
+
+    public static func buildEither<TrueContent: ChartContent, FalseContent: ChartContent>(
+        first: TrueContent
+    ) -> _ConditionalChartContent<TrueContent, FalseContent> {
+        _ConditionalChartContent(storage: .trueContent(first))
+    }
+
+    public static func buildEither<TrueContent: ChartContent, FalseContent: ChartContent>(
+        second: FalseContent
+    ) -> _ConditionalChartContent<TrueContent, FalseContent> {
+        _ConditionalChartContent(storage: .falseContent(second))
+    }
+
+    public static func buildArray<Content: ChartContent>(_ components: [Content]) -> _ArrayChartContent<Content> {
+        _ArrayChartContent(elements: components)
+    }
+
+    public static func buildLimitedAvailability<Content: ChartContent>(_ content: Content) -> AnyChartContent {
+        AnyChartContent(content)
+    }
+}
+
+// MARK: - Modifiers
+
+/// Content with a modifier applied to every mark beneath it.
+public struct _ModifiedChartContent<Content: ChartContent> {
+    let content: Content
+    let transform: (inout _MarkModifiers) -> Void
+}
+extension _ModifiedChartContent: _PrimitiveChartContent {}
+extension _ModifiedChartContent: _ChartContentNode {
+    func _collect(into collector: inout _ChartCollector, modifiers: _MarkModifiers) {
+        // Outer modifiers run first so that the mark's own (inner) ones win.
+        var modified = modifiers
+        transform(&modified)
+        content._collectAny(into: &collector, modifiers: modified)
+    }
+}
+
+/// Where an annotation sits relative to its mark (also the legend position).
+public enum AnnotationPosition: Hashable, Sendable {
+    case automatic, top, bottom, leading, trailing, overlay
+    case topLeading, topTrailing, bottomLeading, bottomTrailing
+
+    /// The protocol's position and the alignment it implies.
+    var _resolved: (position: String, alignment: Alignment?) {
+        switch self {
+        case .automatic, .top: ("top", nil)
+        case .bottom: ("bottom", nil)
+        case .leading: ("leading", nil)
+        case .trailing: ("trailing", nil)
+        case .overlay: ("overlay", nil)
+        case .topLeading: ("top", .leading)
+        case .topTrailing: ("top", .trailing)
+        case .bottomLeading: ("bottom", .leading)
+        case .bottomTrailing: ("bottom", .trailing)
+        }
+    }
+}
+
+/// How a line or area is interpolated between its points.
+public enum InterpolationMethod: Hashable, Sendable {
+    case linear, cardinal, catmullRom, monotone, stepStart, stepCenter, stepEnd
+
+    var _name: String {
+        switch self {
+        case .linear: "linear"
+        case .cardinal: "cardinal"
+        case .catmullRom: "catmullRom"
+        case .monotone: "monotone"
+        case .stepStart: "stepStart"
+        case .stepCenter: "stepCenter"
+        case .stepEnd: "stepEnd"
+        }
+    }
+
+    public static func cardinal(tension: CGFloat) -> InterpolationMethod { .cardinal }
+    public static func catmullRom(alpha: CGFloat) -> InterpolationMethod { .catmullRom }
+}
+
+/// The shape of a point or legend symbol.
+public struct BasicChartSymbolShape: Hashable, Sendable {
+    let name: String
+
+    public static let circle = BasicChartSymbolShape(name: "circle")
+    public static let square = BasicChartSymbolShape(name: "square")
+    public static let triangle = BasicChartSymbolShape(name: "triangle")
+    public static let diamond = BasicChartSymbolShape(name: "diamond")
+    public static let pentagon = BasicChartSymbolShape(name: "diamond")
+    public static let cross = BasicChartSymbolShape(name: "cross")
+    public static let plus = BasicChartSymbolShape(name: "plus")
+    public static let asterisk = BasicChartSymbolShape(name: "asterisk")
+}
+
+/// The symbol palette for `symbol(by:)`, in the protocol's order.
+let _chartSymbolPalette = ["circle", "square", "triangle", "diamond", "cross", "plus", "asterisk"]
+
+/// The color palette for `foregroundStyle(by:)`.
+let _chartColorPalette: [Color] = [.blue, .green, .orange, .purple, .red, .teal,
+                                   .yellow, .pink, .indigo, .mint, .cyan, .brown]
+
+extension ChartContent {
+    func _modified(_ transform: @escaping (inout _MarkModifiers) -> Void) -> _ModifiedChartContent<Self> {
+        _ModifiedChartContent(content: self, transform: transform)
+    }
+
+    public func foregroundStyle<S: ShapeStyle>(_ style: S) -> some ChartContent {
+        _modified { $0.style = style }
+    }
+
+    public func foregroundStyle<Value: Plottable>(by value: PlottableValue<Value>) -> some ChartContent {
+        let erased = value._erased
+        return _modified { $0.styleBy = erased }
+    }
+
+    public func symbol<Value: Plottable>(by value: PlottableValue<Value>) -> some ChartContent {
+        let erased = value._erased
+        return _modified { $0.symbolBy = erased }
+    }
+
+    public func symbol(_ shape: BasicChartSymbolShape) -> some ChartContent {
+        _modified { $0.symbol = shape.name }
+    }
+
+    public func symbolSize(_ area: CGFloat) -> some ChartContent {
+        // SwiftUI takes an area in points²; the protocol wants a diameter.
+        let diameter = area.squareRoot()
+        return _modified { $0.symbolSize = diameter }
+    }
+
+    public func symbolSize(_ size: CGSize) -> some ChartContent {
+        _modified { $0.symbolSize = min(size.width, size.height) }
+    }
+
+    public func interpolationMethod(_ method: InterpolationMethod) -> some ChartContent {
+        _modified { $0.interpolation = method._name }
+    }
+
+    public func opacity(_ opacity: Double) -> some ChartContent {
+        _modified { $0.opacity = max(0, min(1, opacity)) }
+    }
+
+    public func lineStyle(_ style: StrokeStyle) -> some ChartContent {
+        _modified { $0.lineWidth = style.lineWidth }
+    }
+
+    public func cornerRadius(_ radius: CGFloat, style: RoundedCornerStyle = .continuous) -> some ChartContent {
+        _modified { $0.cornerRadius = radius }
+    }
+
+    /// Clips the marks with the geometry of the first area or rectangle mark
+    /// in `content`, which is scaled like the chart's own marks.
+    public func mask<C: ChartContent>(@ChartContentBuilder _ content: () -> C) -> some ChartContent {
+        let mask = content()
+        return _modified { $0.mask = mask }
+    }
+
+    public func annotation<C: View>(position: AnnotationPosition = .automatic, alignment: Alignment = .center,
+                                    spacing: CGFloat? = nil,
+                                    @ViewBuilder content: () -> C) -> some ChartContent {
+        let view = content()
+        let annotation = _MarkAnnotation(position: position, alignment: alignment, spacing: spacing ?? 4, content: view)
+        return _modified { $0.annotations.append(annotation) }
+    }
+
+    /// Accepted for source compatibility; the shim has no accessibility tree.
+    public func accessibilityLabel(_ label: String) -> some ChartContent { self }
+    public func accessibilityValue(_ value: String) -> some ChartContent { self }
+    public func accessibilityHidden(_ hidden: Bool) -> some ChartContent { self }
+}

package/Sources/SwiftUI/Charts/ChartProxy.swift

@@ -0,0 +1,57 @@
+/// `ChartProxy`, `.chartOverlay`, `.chartBackground` and the selection
+/// modifiers. The page lays charts out and draws their marks (Phase 7), so
+/// the Swift side knows no plot geometry: a proxy maps no value to a
+/// position or back (nil), and its plot frame is unknown (nil). An overlay
+/// or background is drawn over or under the chart with that proxy. The
+/// page reports no taps or drags on a chart, so a selection binding is
+/// never set by the viewer.
+
+/// Positions in a chart's plot, for overlays: unknown in the browser.
+public struct ChartProxy {
+    init() {}
+
+    /// Nil: the plot's geometry is the page's.
+    public func position<P: Plottable>(forX value: P) -> CGFloat? { nil }
+    public func position<P: Plottable>(forY value: P) -> CGFloat? { nil }
+    public func position<X: Plottable, Y: Plottable>(for value: (x: X, y: Y)) -> CGPoint? { nil }
+    public func value<P: Plottable>(atX position: CGFloat, as type: P.Type = P.self) -> P? { nil }
+    public func value<P: Plottable>(atY position: CGFloat, as type: P.Type = P.self) -> P? { nil }
+    public func value<X: Plottable, Y: Plottable>(at location: CGPoint, as type: (X, Y).Type = (X, Y).self) -> (X, Y)? { nil }
+    /// Nil: the plot's frame is the page's.
+    public var plotFrame: Anchor<CGRect>? { nil }
+    /// Zero.
+    public var plotSize: CGSize { .zero }
+}
+
+nonisolated extension View {
+    /// Draws `content` over the chart with a proxy (see the file comment).
+    public func chartOverlay<V: View>(alignment: Alignment = .center,
+                                      @ViewBuilder content: @escaping (ChartProxy) -> V) -> some View {
+        overlay(alignment: alignment) { content(ChartProxy()) }
+    }
+
+    /// Draws `content` under the chart with a proxy (see the file comment).
+    public func chartBackground<V: View>(alignment: Alignment = .center,
+                                         @ViewBuilder content: @escaping (ChartProxy) -> V) -> some View {
+        background(alignment: alignment) { content(ChartProxy()) }
+    }
+
+    /// Styles the chart's plot area with `content`. The page lays the plot
+    /// out inside the chart, so the plot is not a view of its own here:
+    /// `content` gets the whole chart (an overlay covers the axes too).
+    public func chartPlotStyle<Content: View>(@ViewBuilder content: @escaping (ChartPlotContent) -> Content) -> some View {
+        content(ChartPlotContent(content: AnyView(self)))
+    }
+
+    /// Accepted: the viewer cannot select a value on the page.
+    public func chartXSelection<P: Plottable>(value: Binding<P?>) -> some View { self }
+    public func chartXSelection<P: Plottable & Comparable>(range: Binding<ClosedRange<P>?>) -> some View { self }
+    public func chartYSelection<P: Plottable>(value: Binding<P?>) -> some View { self }
+    public func chartYSelection<P: Plottable & Comparable>(range: Binding<ClosedRange<P>?>) -> some View { self }
+}
+
+/// The plot area `chartPlotStyle` styles: here, the whole chart (see there).
+public struct ChartPlotContent: View {
+    let content: AnyView
+    public var body: some View { content }
+}

package/Sources/SwiftUI/Charts/Marks.swift

@@ -0,0 +1,204 @@
+// The marks: BarMark, LineMark, AreaMark, PointMark, RuleMark, RectangleMark.
+// Each is one `_RawMark`; Chart.swift groups lines and areas by series.
+
+/// The width (or height) of a bar or rectangle.
+public enum MarkDimension: Equatable, Sendable {
+    /// 80 % of the band.
+    case automatic
+    /// A fraction of the band.
+    case ratio(CGFloat)
+    /// Points, centered on the value.
+    case fixed(CGFloat)
+    /// The band inset by points on each side (treated as `automatic`).
+    case inset(CGFloat)
+}
+
+extension MarkDimension: ExpressibleByFloatLiteral, ExpressibleByIntegerLiteral {
+    public init(floatLiteral value: Double) { self = .fixed(value) }
+    public init(integerLiteral value: Int) { self = .fixed(CGFloat(value)) }
+}
+
+/// A mark that resolves to one `_RawMark`.
+protocol _SingleMark: _PrimitiveChartContent, _ChartContentNode {
+    var _raw: _RawMark { get }
+}
+
+extension _SingleMark {
+    func _collect(into collector: inout _ChartCollector, modifiers: _MarkModifiers) {
+        var mark = _raw
+        mark.modifiers = modifiers
+        collector.marks.append(mark)
+    }
+}
+
+// MARK: - BarMark
+
+public struct BarMark {
+    let _raw: _RawMark
+
+    public init<X: Plottable, Y: Plottable>(x: PlottableValue<X>, y: PlottableValue<Y>,
+                                            width: MarkDimension = .automatic, stacking: MarkStackingMethod = .standard) {
+        _raw = _RawMark(kind: .bar, x: x.value._plottableValue, y: y.value._plottableValue, width: width)
+    }
+
+    public init<X: Plottable, Y: Plottable>(x: PlottableValue<X>, yStart: PlottableValue<Y>, yEnd: PlottableValue<Y>,
+                                            width: MarkDimension = .automatic) {
+        _raw = _RawMark(kind: .bar, x: x.value._plottableValue,
+                        yStart: yStart.value._plottableValue, yEnd: yEnd.value._plottableValue, width: width)
+    }
+
+    public init<X: Plottable, Y: Plottable>(xStart: PlottableValue<X>, xEnd: PlottableValue<X>, y: PlottableValue<Y>,
+                                            height: MarkDimension = .automatic) {
+        _raw = _RawMark(kind: .bar, xStart: xStart.value._plottableValue, xEnd: xEnd.value._plottableValue,
+                        y: y.value._plottableValue, height: height)
+    }
+
+    public init<X: Plottable>(x: PlottableValue<X>, width: MarkDimension = .automatic,
+                              stacking: MarkStackingMethod = .standard) {
+        _raw = _RawMark(kind: .bar, x: x.value._plottableValue, width: width)
+    }
+
+    public init<Y: Plottable>(y: PlottableValue<Y>, height: MarkDimension = .automatic,
+                              stacking: MarkStackingMethod = .standard) {
+        _raw = _RawMark(kind: .bar, y: y.value._plottableValue, height: height)
+    }
+}
+
+/// Accepted for source compatibility; the shim does not stack bars.
+public enum MarkStackingMethod: Hashable, Sendable {
+    case standard, normalized, center, unstacked
+}
+
+// MARK: - LineMark
+
+public struct LineMark {
+    let _raw: _RawMark
+
+    public init<X: Plottable, Y: Plottable>(x: PlottableValue<X>, y: PlottableValue<Y>) {
+        _raw = _RawMark(kind: .line, x: x.value._plottableValue, y: y.value._plottableValue)
+    }
+
+    public init<X: Plottable, Y: Plottable, S: Plottable>(x: PlottableValue<X>, y: PlottableValue<Y>,
+                                                          series: PlottableValue<S>) {
+        _raw = _RawMark(kind: .line, x: x.value._plottableValue, y: y.value._plottableValue,
+                        series: series.value._plottableValue)
+    }
+}
+
+// MARK: - AreaMark
+
+public struct AreaMark {
+    let _raw: _RawMark
+
+    public init<X: Plottable, Y: Plottable>(x: PlottableValue<X>, y: PlottableValue<Y>,
+                                            stacking: MarkStackingMethod = .standard) {
+        _raw = _RawMark(kind: .area, x: x.value._plottableValue, y: y.value._plottableValue)
+    }
+
+    public init<X: Plottable, Y: Plottable, S: Plottable>(x: PlottableValue<X>, y: PlottableValue<Y>,
+                                                          series: PlottableValue<S>,
+                                                          stacking: MarkStackingMethod = .standard) {
+        _raw = _RawMark(kind: .area, x: x.value._plottableValue, y: y.value._plottableValue,
+                        series: series.value._plottableValue)
+    }
+
+    public init<X: Plottable, Y: Plottable>(x: PlottableValue<X>, yStart: PlottableValue<Y>, yEnd: PlottableValue<Y>) {
+        _raw = _RawMark(kind: .area, x: x.value._plottableValue,
+                        yStart: yStart.value._plottableValue, yEnd: yEnd.value._plottableValue)
+    }
+
+    public init<X: Plottable, Y: Plottable, S: Plottable>(x: PlottableValue<X>, yStart: PlottableValue<Y>,
+                                                          yEnd: PlottableValue<Y>, series: PlottableValue<S>) {
+        _raw = _RawMark(kind: .area, x: x.value._plottableValue,
+                        yStart: yStart.value._plottableValue, yEnd: yEnd.value._plottableValue,
+                        series: series.value._plottableValue)
+    }
+}
+
+// MARK: - PointMark
+
+public struct PointMark {
+    let _raw: _RawMark
+
+    public init<X: Plottable, Y: Plottable>(x: PlottableValue<X>, y: PlottableValue<Y>) {
+        _raw = _RawMark(kind: .point, x: x.value._plottableValue, y: y.value._plottableValue)
+    }
+}
+
+// MARK: - RuleMark
+
+public struct RuleMark {
+    let _raw: _RawMark
+
+    /// A horizontal rule across the plot.
+    public init<Y: Plottable>(y: PlottableValue<Y>) {
+        _raw = _RawMark(kind: .rule, y: y.value._plottableValue)
+    }
+
+    /// A vertical rule across the plot.
+    public init<X: Plottable>(x: PlottableValue<X>) {
+        _raw = _RawMark(kind: .rule, x: x.value._plottableValue)
+    }
+
+    public init<X: Plottable, Y: Plottable>(x: PlottableValue<X>, yStart: PlottableValue<Y>, yEnd: PlottableValue<Y>) {
+        _raw = _RawMark(kind: .rule, x: x.value._plottableValue,
+                        yStart: yStart.value._plottableValue, yEnd: yEnd.value._plottableValue)
+    }
+
+    public init<X: Plottable, Y: Plottable>(xStart: PlottableValue<X>, xEnd: PlottableValue<X>, y: PlottableValue<Y>) {
+        _raw = _RawMark(kind: .rule, xStart: xStart.value._plottableValue, xEnd: xEnd.value._plottableValue,
+                        y: y.value._plottableValue)
+    }
+}
+
+// MARK: - RectangleMark
+
+public struct RectangleMark {
+    let _raw: _RawMark
+
+    /// A band between two x values across the plot's height.
+    public init<X: Plottable>(xStart: PlottableValue<X>, xEnd: PlottableValue<X>) {
+        _raw = _RawMark(kind: .rectangle, xStart: xStart.value._plottableValue, xEnd: xEnd.value._plottableValue)
+    }
+
+    /// A band between two y values across the plot's width.
+    public init<Y: Plottable>(yStart: PlottableValue<Y>, yEnd: PlottableValue<Y>) {
+        _raw = _RawMark(kind: .rectangle, yStart: yStart.value._plottableValue, yEnd: yEnd.value._plottableValue)
+    }
+
+    public init<X: Plottable, Y: Plottable>(xStart: PlottableValue<X>, xEnd: PlottableValue<X>,
+                                            yStart: PlottableValue<Y>, yEnd: PlottableValue<Y>) {
+        _raw = _RawMark(kind: .rectangle, xStart: xStart.value._plottableValue, xEnd: xEnd.value._plottableValue,
+                        yStart: yStart.value._plottableValue, yEnd: yEnd.value._plottableValue)
+    }
+
+    public init<X: Plottable, Y: Plottable>(x: PlottableValue<X>, yStart: PlottableValue<Y>, yEnd: PlottableValue<Y>,
+                                            width: MarkDimension = .automatic) {
+        _raw = _RawMark(kind: .rectangle, x: x.value._plottableValue,
+                        yStart: yStart.value._plottableValue, yEnd: yEnd.value._plottableValue, width: width)
+    }
+
+    public init<X: Plottable, Y: Plottable>(xStart: PlottableValue<X>, xEnd: PlottableValue<X>, y: PlottableValue<Y>,
+                                            height: MarkDimension = .automatic) {
+        _raw = _RawMark(kind: .rectangle, xStart: xStart.value._plottableValue, xEnd: xEnd.value._plottableValue,
+                        y: y.value._plottableValue, height: height)
+    }
+
+    public init<X: Plottable, Y: Plottable>(x: PlottableValue<X>, y: PlottableValue<Y>,
+                                            width: MarkDimension = .automatic, height: MarkDimension = .automatic) {
+        _raw = _RawMark(kind: .rectangle, x: x.value._plottableValue, y: y.value._plottableValue,
+                        width: width, height: height)
+    }
+}
+
+extension BarMark: _SingleMark {}
+
+extension LineMark: _SingleMark {}
+
+extension AreaMark: _SingleMark {}
+
+extension PointMark: _SingleMark {}
+
+extension RuleMark: _SingleMark {}
+
+extension RectangleMark: _SingleMark {}