@swiftbrowser/native 0.18.3 → 0.21.0

package/swift/Sources/SwiftBrowserNative/Views/StyleModifier.swift

@@ -53,8 +53,14 @@ extension View {
         if let tint = style.tint { view = AnyView(view.tint(Color(spec: tint))) }
         // `.scrollDisabled`: the scroll views and text editors below (a text editor then as tall as its lines).
         if let disabled = style.raw.bool("scrollDisabled") { view = AnyView(view.scrollDisabled(disabled)) }
+        // `.textSelection(.enabled)`: the text below can be selected.
+        if let selectable = style.raw.bool("textSelection") {
+            view = selectable ? AnyView(view.textSelection(.enabled)) : AnyView(view.textSelection(.disabled))
+        }
         // `labelIcon` marks a `Label`'s icon; HStackElement draws the label as one.
         if let alignment = style.raw.string("gridColumnAlignment") { view = AnyView(view.gridColumnAlignment(HorizontalAlignment(name: alignment))) }
+        if let columns = style.gridCellColumns { view = AnyView(view.gridCellColumns(columns)) }
+        if let anchor = style.gridCellAnchor { view = AnyView(view.gridCellAnchor(UnitPoint(spec: anchor))) }
 
         // Layout.
         if style.fixedSizeHorizontal != nil || style.fixedSizeVertical != nil {
@@ -103,6 +109,7 @@ extension View {
             view = AnyView(view.aspectRatio(ratio.map { CGFloat($0) }, contentMode: mode))
         }
         if let position = style.position { view = AnyView(view.position(x: position.x, y: position.y)) }
+        if let guide = style.alignmentGuide { view = view.alignmentGuide(spec: guide) }
 
         // Paint.
         if let background = style.background {
@@ -115,6 +122,7 @@ extension View {
         if let radius = style.cornerRadius { view = AnyView(view.clipShape(RoundedRectangle(cornerRadius: radius, style: .continuous))) }
         if style.clipped { view = AnyView(view.clipped()) }
         if let mask = style.mask { view = AnyView(view.mask { Rectangle().fill(AnyShapeStyle(spec: mask)) }) }
+        if style.compositingGroup { view = AnyView(view.compositingGroup()) }
         if let shadow = style.shadow {
             view = AnyView(view.shadow(color: shadow.color.map(Color.init(spec:)) ?? Color.black.opacity(0.33), radius: shadow.radius, x: shadow.x, y: shadow.y))
         }
@@ -133,6 +141,12 @@ extension View {
         if let rotation = style.rotation {
             view = AnyView(view.rotationEffect(.degrees(rotation), anchor: style.rotationAnchor.map(UnitPoint.init(spec:)) ?? .center))
         }
+        if let rotation = style.rotation3D {
+            view = AnyView(view.rotation3DEffect(
+                .degrees(rotation.angle), axis: (x: rotation.x, y: rotation.y, z: rotation.z),
+                anchor: rotation.anchor.map(UnitPoint.init(spec:)) ?? .center, perspective: rotation.perspective
+            ))
+        }
         if let scale = style.scale {
             view = AnyView(view.scaleEffect(x: scale.x, y: scale.y, anchor: style.scaleAnchor.map(UnitPoint.init(spec:)) ?? .center))
         }
@@ -146,6 +160,11 @@ extension View {
         if style.contentShape == "rectangle" { view = AnyView(view.contentShape(Rectangle())) }
         if style.hidden { view = AnyView(view.hidden()) }
         if let help = style.help { view = AnyView(view.help(help)) }
+        if let pointer = style.pointerStyle { view = view.pointerStyle(name: pointer) }
+        if let effect = style.symbolEffect { view = AnyView(view.modifier(SymbolEffectModifier(spec: effect))) }
+        // The events a box sends of its own.
+        if let id, style.hover { view = AnyView(view.modifier(HoverReport(id: id))) }
+        if let id, let threshold = style.scrollVisibilityThreshold { view = AnyView(view.modifier(ScrollVisibilityReport(id: id, threshold: threshold))) }
         // A `ScrollViewReader`'s `.id(x)`: the element's own id names it to a `scrollTo` and a scroll position.
         if style.scrollID, let id { view = AnyView(view.id(id)) }
         if let width = style.raw.double("inspectorColumnWidth") { view = AnyView(view.inspectorColumnWidth(width)) }
@@ -176,6 +195,133 @@ extension View {
     }
 }
 
+extension View {
+    /// `.alignmentGuide`: the guide by name on its axis, at `a + b·width + c·height` of the view.
+    func alignmentGuide(spec: AlignmentGuideSpec) -> AnyView {
+        let (a, b, c) = (spec.a, spec.b, spec.c)
+        if spec.axis == "vertical" {
+            return AnyView(alignmentGuide(VerticalAlignment(name: spec.name)) { d in a + b * d.width + c * d.height })
+        }
+        return AnyView(alignmentGuide(HorizontalAlignment(name: spec.name)) { d in a + b * d.width + c * d.height })
+    }
+
+    /// `.pointerStyle`: the Mac's pointer by its CSS name (macOS 15). iOS has no pointer styles of
+    /// this kind (an iPad's pointer takes the shape of what it hovers), so the view is as it was.
+    func pointerStyle(name: String) -> AnyView {
+        #if os(macOS) && !canImport(FoundationBridge)
+        if #available(macOS 15, *) {
+            let style: PointerStyle = switch name {
+            case "pointer", "link": .link
+            case "text": .horizontalText
+            case "vertical-text", "verticalText": .verticalText
+            case "grab", "grabIdle": .grabIdle
+            case "grabbing", "grabActive": .grabActive
+            case "zoom-in", "zoomIn": .zoomIn
+            case "zoom-out", "zoomOut": .zoomOut
+            case "crosshair", "rectSelection": .rectSelection
+            default: .default
+            }
+            return AnyView(self.pointerStyle(style))
+        }
+        #endif
+        return AnyView(self)
+    }
+}
+
+/// `.onHover`: the box's `hover` events, as a pointer (an iPad's, a Mac's) enters and leaves it.
+struct HoverReport: ViewModifier {
+    let id: Int
+    @Environment(\.nativeApp) private var app
+
+    func body(content: Content) -> some View {
+        content.onHover { hovering in app?.dispatch(.hover(id, hovering)) }
+    }
+}
+
+/// `.onScrollVisibilityChange(threshold:)` (iOS 18, macOS 15): the box's `scrollvisibility` as it
+/// crosses the threshold of its scroll view's visible area; earlier systems send none.
+struct ScrollVisibilityReport: ViewModifier {
+    let id: Int
+    let threshold: Double
+    @Environment(\.nativeApp) private var app
+
+    func body(content: Content) -> some View {
+        if #available(iOS 18, macOS 15, *) {
+            content.onScrollVisibilityChange(threshold: threshold) { visible in app?.dispatch(.scrollVisibility(id, visible: visible)) }
+        } else {
+            content
+        }
+    }
+}
+
+/// `.symbolEffect`: SF Symbols' own effect, on the symbols inside. With a `trigger` it plays once each
+/// time the trigger changes; without, it runs while the style has it. `rotate`, `wiggle` and `breathe`,
+/// and a `bounce` that runs on, need iOS 18 / macOS 15; before, the symbol is still.
+struct SymbolEffectModifier: ViewModifier {
+    let spec: SymbolEffectSpec
+
+    private var options: SymbolEffectOptions {
+        var options: SymbolEffectOptions = .default
+        if let speed = spec.speed { options = options.speed(speed) }
+        if let count = spec.repeatCount { options = options.repeat(count) } else if spec.forever { options = options.repeating }
+        return options
+    }
+
+    private var up: Bool { spec.direction != "down" }
+
+    func body(content: Content) -> some View {
+        if let trigger = spec.trigger {
+            discrete(content, trigger: trigger)
+        } else {
+            running(content)
+        }
+    }
+
+    @ViewBuilder
+    private func discrete(_ content: Content, trigger: Double) -> some View {
+        switch spec.effect {
+        case "bounce": content.symbolEffect(up ? .bounce.up : .bounce.down, options: options, value: trigger)
+        case "pulse": content.symbolEffect(.pulse, options: options, value: trigger)
+        case "variableColor": content.symbolEffect(.variableColor, options: options, value: trigger)
+        case "rotate", "wiggle", "breathe":
+            if #available(iOS 18, macOS 15, *) {
+                switch spec.effect {
+                case "rotate": content.symbolEffect(.rotate, options: options, value: trigger)
+                case "wiggle": content.symbolEffect(.wiggle, options: options, value: trigger)
+                default: content.symbolEffect(.breathe, options: options, value: trigger)
+                }
+            } else {
+                content
+            }
+        // Scale, appear and disappear only run on: while the style has them.
+        default: running(content)
+        }
+    }
+
+    @ViewBuilder
+    private func running(_ content: Content) -> some View {
+        switch spec.effect {
+        case "pulse": content.symbolEffect(.pulse, options: options, isActive: true)
+        case "variableColor": content.symbolEffect(.variableColor, options: options, isActive: true)
+        case "scale": content.symbolEffect(up ? .scale.up : .scale.down, options: options, isActive: true)
+        case "appear": content.symbolEffect(.appear, options: options, isActive: true)
+        case "disappear": content.symbolEffect(.disappear, options: options, isActive: true)
+        case "bounce", "rotate", "wiggle", "breathe":
+            if #available(iOS 18, macOS 15, *) {
+                switch spec.effect {
+                case "bounce": content.symbolEffect(up ? .bounce.up : .bounce.down, options: options, isActive: true)
+                case "rotate": content.symbolEffect(.rotate, options: options, isActive: true)
+                case "wiggle": content.symbolEffect(.wiggle, options: options, isActive: true)
+                default: content.symbolEffect(.breathe, options: options, isActive: true)
+                }
+            } else {
+                content
+            }
+        default: content
+        }
+    }
+}
+
 extension View {
     /// `.scrollTransition`: SwiftUI's own, its closure answering each phase
     /// with the app's effects for it (SwiftUI draws between them as the view

package/swift/Sources/SwiftBrowserProtocol/Drawing.swift

@@ -0,0 +1,306 @@
+import Foundation
+
+// The props and event values of the kinds that draw or lay out on the app's
+// say (docs/ops-protocol.md): a custom `layout`, a `canvas`'s commands, and
+// the drag and drop pair.
+
+// MARK: - layout (a custom `Layout`)
+
+/// One axis of a proposal: points, unbounded (`"infinity"`), or unspecified (nil).
+public enum LayoutDimensionSpec: Equatable, Sendable {
+    case points(Double)
+    case infinity
+
+    public init?(json: JSONValue) {
+        if let value = json.double { self = .points(value) } else if json.string == "infinity" { self = .infinity } else { return nil }
+    }
+
+    /// From a length: unbounded when not finite, else to two decimals as the protocol carries it.
+    public init(_ value: Double) {
+        self = value.isFinite ? .points((value * 100).rounded() / 100) : .infinity
+    }
+
+    public var value: Double {
+        switch self {
+        case .points(let points): points
+        case .infinity: .infinity
+        }
+    }
+
+    public var json: JSONValue {
+        switch self {
+        case .points(let points): .number(points)
+        case .infinity: .string("infinity")
+        }
+    }
+}
+
+/// A proposal as Swift's `ProposedViewSize`: nil for an unspecified axis.
+public struct LayoutProposalSpec: Equatable, Sendable {
+    public var width: LayoutDimensionSpec?
+    public var height: LayoutDimensionSpec?
+
+    public init(width: LayoutDimensionSpec?, height: LayoutDimensionSpec?) {
+        self.width = width
+        self.height = height
+    }
+
+    public init?(json: JSONValue) {
+        guard let fields = json.object else { return nil }
+        width = LayoutDimensionSpec(json: fields.value("width"))
+        height = LayoutDimensionSpec(json: fields.value("height"))
+    }
+
+    public var json: JSONValue {
+        .object(["width": width?.json ?? .null, "height": height?.json ?? .null])
+    }
+}
+
+/// A size whose axes may be unbounded.
+public struct LayoutSizeSpec: Equatable, Sendable {
+    public var width: LayoutDimensionSpec
+    public var height: LayoutDimensionSpec
+
+    public init(width: Double, height: Double) {
+        self.width = LayoutDimensionSpec(width)
+        self.height = LayoutDimensionSpec(height)
+    }
+
+    public init?(json: JSONValue) {
+        guard let width = LayoutDimensionSpec(json: json["width"]), let height = LayoutDimensionSpec(json: json["height"]) else { return nil }
+        self.width = width
+        self.height = height
+    }
+
+    public var json: JSONValue { .object(["width": width.json, "height": height.json]) }
+}
+
+/// A subview's sizes for a zero, unspecified and unbounded proposal: what the app's layout measures it by.
+public struct LayoutMeasurementSpec: Equatable, Sendable {
+    public var min: LayoutSizeSpec
+    public var ideal: LayoutSizeSpec
+    public var max: LayoutSizeSpec
+
+    public init(min: LayoutSizeSpec, ideal: LayoutSizeSpec, max: LayoutSizeSpec) {
+        self.min = min
+        self.ideal = ideal
+        self.max = max
+    }
+
+    public var json: JSONValue { .object(["min": min.json, "ideal": ideal.json, "max": max.json]) }
+}
+
+/// `layout`: the app's answer for `proposal` (nil until its first): its size, and one frame per child
+/// relative to its origin; `sizes`, its own size for a zero, unspecified and unbounded proposal.
+public struct LayoutProps: Equatable, Sendable {
+    public struct Frame: Equatable, Sendable {
+        public var x: Double
+        public var y: Double
+        public var width: Double
+        public var height: Double
+    }
+
+    public var proposal: LayoutProposalSpec?
+    public var size: SizeSpec?
+    public var frames: [Frame]?
+    public var min: LayoutSizeSpec?
+    public var ideal: LayoutSizeSpec?
+    public var max: LayoutSizeSpec?
+
+    public init(props: JSONObject) {
+        proposal = LayoutProposalSpec(json: props.value("proposal"))
+        size = SizeSpec(json: props.value("size"))
+        frames = props.array("frames")?.compactMap { json -> Frame? in
+            guard let fields = json.object else { return nil }
+            return Frame(x: fields.double("x") ?? 0, y: fields.double("y") ?? 0, width: fields.double("width") ?? 0, height: fields.double("height") ?? 0)
+        }
+        let sizes = props.object("sizes")
+        min = sizes.flatMap { LayoutSizeSpec(json: $0.value("min")) }
+        ideal = sizes.flatMap { LayoutSizeSpec(json: $0.value("ideal")) }
+        max = sizes.flatMap { LayoutSizeSpec(json: $0.value("max")) }
+    }
+}
+
+// MARK: - canvas
+
+/// What a `canvas` command paints with: a view's shape style, or a gradient in the drawing's own points.
+public enum CanvasShadingSpec: Equatable, Sendable {
+    case style(ShapeStyleSpec)
+    case linearGradient(stops: [GradientStopSpec], start: PointSpec, end: PointSpec)
+    case radialGradient(stops: [GradientStopSpec], center: PointSpec, startRadius: Double, endRadius: Double)
+
+    public init?(json: JSONValue) {
+        if let gradient = json["canvasLinearGradient"].object,
+           let start = PointSpec(json: gradient.value("start")), let end = PointSpec(json: gradient.value("end"))
+        {
+            self = .linearGradient(stops: (gradient.array("stops") ?? []).compactMap(GradientStopSpec.init(json:)), start: start, end: end)
+        } else if let gradient = json["canvasRadialGradient"].object, let center = PointSpec(json: gradient.value("center")) {
+            self = .radialGradient(
+                stops: (gradient.array("stops") ?? []).compactMap(GradientStopSpec.init(json:)), center: center,
+                startRadius: gradient.double("startRadius") ?? 0, endRadius: gradient.double("endRadius") ?? 0
+            )
+        } else if let style = ShapeStyleSpec(json: json) {
+            self = .style(style)
+        } else {
+            return nil
+        }
+    }
+}
+
+/// A `GraphicsContext.Filter`.
+public enum CanvasFilterSpec: Equatable, Sendable {
+    case blur(Double)
+    case shadow(color: ColorSpec?, radius: Double, x: Double, y: Double)
+    case grayscale(Double)
+    case saturation(Double)
+    case brightness(Double)
+    case contrast(Double)
+    case hueRotation(Double)
+    case invert(Double)
+
+    public init?(json: JSONValue) {
+        guard let fields = json.object else { return nil }
+        if let radius = fields.double("blur") {
+            self = .blur(radius)
+        } else if let shadow = fields.object("shadow") {
+            self = .shadow(color: ColorSpec(json: shadow.value("color")), radius: shadow.double("radius") ?? 0, x: shadow.double("x") ?? 0, y: shadow.double("y") ?? 0)
+        } else if let amount = fields.double("grayscale") {
+            self = .grayscale(amount)
+        } else if let amount = fields.double("saturation") {
+            self = .saturation(amount)
+        } else if let amount = fields.double("brightness") {
+            self = .brightness(amount)
+        } else if let amount = fields.double("contrast") {
+            self = .contrast(amount)
+        } else if let degrees = fields.double("hueRotation") {
+            self = .hueRotation(degrees)
+        } else if let amount = fields.double("invert") {
+            self = .invert(amount)
+        } else {
+            return nil
+        }
+    }
+}
+
+/// One thing a `canvas` drew, with the context's state at the time: paths are SVG path data in the drawing's
+/// coordinates (before `transform`), clips in the canvas's own.
+public struct CanvasCommand: Equatable, Sendable {
+    public enum Operation: Equatable, Sendable {
+        case fill(path: String, shading: CanvasShadingSpec, evenOdd: Bool)
+        case stroke(path: String, shading: CanvasShadingSpec, style: StrokeStyleSpec)
+        case image(ImageProps, x: Double, y: Double, anchor: UnitPointSpec, width: Double?, height: Double?, shading: CanvasShadingSpec?)
+        case text(String, x: Double, y: Double, anchor: UnitPointSpec, shading: CanvasShadingSpec, font: FontSpec?)
+    }
+
+    /// `lineWidth`, the caps and joins by name, the dash pattern.
+    public struct StrokeStyleSpec: Equatable, Sendable {
+        public var lineWidth: Double
+        public var lineCap: String?
+        public var lineJoin: String?
+        public var miterLimit: Double?
+        public var dash: [Double]
+        public var dashPhase: Double
+    }
+
+    public var operation: Operation
+    /// `[a, b, c, d, tx, ty]`; nil for the identity.
+    public var transform: [Double]?
+    public var opacity: Double
+    public var blendMode: String?
+    public var clips: [String]
+    public var filters: [CanvasFilterSpec]
+
+    public init?(json: JSONValue) {
+        guard let fields = json.object, let op = fields.string("op") else { return nil }
+        let anchor = UnitPointSpec(json: fields.value("anchor")) ?? UnitPointSpec(x: 0.5, y: 0.5)
+        switch op {
+        case "fill":
+            guard let path = fields.string("path"), let shading = CanvasShadingSpec(json: fields.value("shading")) else { return nil }
+            operation = .fill(path: path, shading: shading, evenOdd: fields.bool("evenOdd") ?? false)
+        case "stroke":
+            guard let path = fields.string("path"), let shading = CanvasShadingSpec(json: fields.value("shading")) else { return nil }
+            operation = .stroke(path: path, shading: shading, style: StrokeStyleSpec(
+                lineWidth: fields.double("lineWidth") ?? 1, lineCap: fields.string("lineCap"), lineJoin: fields.string("lineJoin"),
+                miterLimit: fields.double("miterLimit"), dash: (fields.array("dash") ?? []).compactMap(\.double), dashPhase: fields.double("dashPhase") ?? 0
+            ))
+        case "image":
+            operation = .image(
+                ImageProps(props: fields.object("image") ?? [:]), x: fields.double("x") ?? 0, y: fields.double("y") ?? 0, anchor: anchor,
+                width: fields.double("width"), height: fields.double("height"), shading: CanvasShadingSpec(json: fields.value("shading"))
+            )
+        case "text":
+            guard let text = fields.string("text") else { return nil }
+            operation = .text(
+                text, x: fields.double("x") ?? 0, y: fields.double("y") ?? 0, anchor: anchor,
+                shading: CanvasShadingSpec(json: fields.value("shading")) ?? .style(.hierarchical(level: 1, opacity: 1)), font: FontSpec(json: fields.value("font"))
+            )
+        default:
+            return nil
+        }
+        let matrix = (fields.array("transform") ?? []).compactMap(\.double)
+        transform = matrix.count == 6 ? matrix : nil
+        opacity = fields.double("opacity") ?? 1
+        blendMode = fields.string("blendMode")
+        clips = (fields.array("clips") ?? []).compactMap(\.string)
+        filters = (fields.array("filters") ?? []).compactMap(CanvasFilterSpec.init(json:))
+    }
+}
+
+/// `canvas`: the commands the app's renderer drew for `width` × `height`, the size it was told.
+public struct CanvasProps: Equatable, Sendable {
+    public var width: Double
+    public var height: Double
+    public var commands: [CanvasCommand]
+
+    public init(props: JSONObject) {
+        width = props.double("width") ?? 0
+        height = props.double("height") ?? 0
+        commands = (props.array("commands") ?? []).compactMap(CanvasCommand.init(json:))
+    }
+}
+
+// MARK: - drag and drop
+
+/// `dropdestination`: the MIME patterns (`text/plain`, `image/*`, `*/*`) it takes from outside the app.
+public struct DropDestinationProps: Equatable, Sendable {
+    public var accepts: [String]
+
+    public init(props: JSONObject) {
+        accepts = (props.array("accepts") ?? []).compactMap(\.string)
+    }
+
+    /// Whether text dragged in from outside the app is taken.
+    public var acceptsText: Bool {
+        accepts.contains { $0 == "*/*" || $0.hasPrefix("text/") }
+    }
+
+    /// Whether files (or folders) dragged in from another app may be taken: any pattern beyond text.
+    public var acceptsFiles: Bool {
+        accepts.contains { $0 == "*/*" || !$0.hasPrefix("text/") }
+    }
+
+    /// Whether a file of the MIME type is taken, as the page's `acceptsType` decides (src/dragDrop.ts).
+    public func accepts(mimeType: String) -> Bool {
+        let mime = mimeType.split(separator: ";").first.map { $0.trimmingCharacters(in: .whitespaces).lowercased() } ?? ""
+        let type = mime.isEmpty ? "application/octet-stream" : mime
+        return accepts.contains { pattern in
+            let p = pattern.lowercased()
+            if p == "*/*" { return true }
+            if p.hasSuffix("/*") { return type.hasPrefix(String(p.dropLast())) }
+            return type == p
+        }
+    }
+}
+
+/// What a `draggable` carries natively: a marker and the element's id, as text, so a drop names its source.
+public enum DragPayload {
+    private static let prefix = "\u{2063}swiftbrowser-drag:"
+
+    public static func text(for source: Int) -> String { prefix + String(source) }
+
+    /// The `draggable` a dropped text names, if it is one of these.
+    public static func source(of text: String) -> Int? {
+        guard text.hasPrefix(prefix) else { return nil }
+        return Int(text.dropFirst(prefix.count))
+    }
+}

package/swift/Sources/SwiftBrowserProtocol/Props.swift

@@ -132,6 +132,8 @@ public struct ScrollViewProps: Equatable, Sendable {
     public var scrollOffset: ScrollOffsetSpec?
     /// `.defaultScrollAnchor(_:)`: where the content starts, and where it stays as it grows.
     public var defaultScrollAnchor: UnitPointSpec?
+    /// `.scrollDismissesKeyboard(_:)`: `immediately` or `interactively`; nil leaves the keyboard be.
+    public var dismissesKeyboard: String?
     public init(props: JSONObject) {
         axes = props.string("axes") ?? "vertical"
         showsIndicators = props.bool("showsIndicators") ?? true
@@ -142,6 +144,7 @@ public struct ScrollViewProps: Equatable, Sendable {
         reportsGeometry = props.bool("reportsGeometry") ?? false
         scrollOffset = ScrollOffsetSpec(json: props.value("scrollOffset"))
         defaultScrollAnchor = UnitPointSpec(json: props.value("defaultScrollAnchor"))
+        dismissesKeyboard = props.bool("dismissesKeyboard") == true ? "immediately" : props.string("dismissesKeyboard")
     }
 }
 
@@ -183,9 +186,22 @@ public struct ListProps: Equatable, Sendable {
 public struct SectionProps: Equatable, Sendable {
     public var header: String?
     public var footer: String?
+    /// `Section(isExpanded:)`: the section collapses (in a sidebar-style list); a `tap` toggles it.
+    public var collapsible: Bool
+    public var expanded: Bool
     public init(props: JSONObject) {
         header = props.string("header")
         footer = props.string("footer")
+        collapsible = props.bool("collapsible") ?? false
+        expanded = props.bool("expanded") ?? true
+    }
+}
+
+/// `disclosuregroup`: open or not; its children are the label (first) and the content; a `tap` toggles it.
+public struct DisclosureGroupProps: Equatable, Sendable {
+    public var expanded: Bool
+    public init(props: JSONObject) {
+        expanded = props.bool("expanded") ?? false
     }
 }
 
@@ -284,12 +300,19 @@ public struct NavScreenProps: Equatable, Sendable {
     public var depth: Int
     public var toolbarRole: String?
     public var backButtonHidden: Bool
+    /// `.toolbar(.hidden, for: .navigationBar)` / `.bottomBar`, and `.statusBarHidden()`.
+    public var navigationBarHidden: Bool
+    public var bottomBarHidden: Bool
+    public var statusBarHidden: Bool
     public init(props: JSONObject) {
         title = props.string("title") ?? ""
         displayMode = props.string("displayMode") ?? "automatic"
         depth = props.int("depth") ?? 0
         toolbarRole = props.string("toolbarRole")
         backButtonHidden = props.bool("backButtonHidden") ?? false
+        navigationBarHidden = props.bool("navigationBarHidden") ?? false
+        bottomBarHidden = props.bool("bottomBarHidden") ?? false
+        statusBarHidden = props.bool("statusBarHidden") ?? false
     }
 }
 
@@ -302,9 +325,12 @@ public struct NavSplitProps: Equatable, Sendable {
 public struct NavLinkProps: Equatable, Sendable {
     public var selected: Bool
     public var plain: Bool
+    /// A split view sidebar's link: its row's selection takes the tap.
+    public var selects: Bool
     public init(props: JSONObject) {
         selected = props.bool("selected") ?? false
         plain = props.string("style") == "plain"
+        selects = props.bool("selects") ?? false
     }
 }
 
@@ -532,11 +558,14 @@ public struct SliderProps: Equatable, Sendable {
     public var min: Double
     public var max: Double
     public var step: Double?
+    /// What each child is, in order: `label`, `min` (the minimum value's label), `max`.
+    public var labels: [String]
     public init(props: JSONObject) {
         value = props.double("value") ?? 0
         min = props.double("min") ?? 0
         max = props.double("max") ?? 1
         step = props.double("step")
+        labels = props.array("labels")?.compactMap(\.string) ?? []
     }
 }
 
@@ -550,8 +579,8 @@ public struct TapGestureProps: Equatable, Sendable {
     }
 }
 
-/// The producer-only `native` kind (docs/native.md, "The native escape hatch").
-public struct NativeProps: Equatable, Sendable {
+/// The `registered` kind: a view registered under `name` (docs/native.md, "Registered views").
+public struct RegisteredProps: Equatable, Sendable {
     public var name: String
     public var props: JSONValue
     public init(props: JSONObject) {

package/swift/Sources/SwiftBrowserProtocol/RendererEvent.swift

@@ -158,9 +158,9 @@ public struct RendererEvent: Equatable, Sendable {
     }
     /// A `menu` opened or closed (lazy menus build their items on `open`).
     public static func menu(_ id: Int, open: Bool) -> RendererEvent { with("menu", id: id, ["open": .bool(open)]) }
-    /// The host's answer to a `native` element's own event (docs/native.md, the escape hatch).
-    public static func native(_ id: Int, name: String, value: JSONValue) -> RendererEvent {
-        with("native", id: id, ["name": .string(name), "value": value])
+    /// What a `registered` element's view sent (docs/native.md, `ViewRegistry`).
+    public static func registered(_ id: Int, name: String, value: JSONValue) -> RendererEvent {
+        with("registered", id: id, ["name": .string(name), "value": value])
     }
 
     /// The device appearance, text size or size class (sent once at launch and on change).
@@ -178,6 +178,27 @@ public struct RendererEvent: Equatable, Sendable {
         return RendererEvent(type: "environment", fields: fields)
     }
 
+    /// A styled box with `hover` was entered (`true`) or left by the pointer (`.onHover`).
+    public static func hover(_ id: Int, _ hovering: Bool) -> RendererEvent { with("hover", id: id, ["value": .bool(hovering)]) }
+    /// A styled box with `scrollVisibility` crossed its threshold of the scroll view's visible area.
+    public static func scrollVisibility(_ id: Int, visible: Bool) -> RendererEvent { with("scrollvisibility", id: id, ["visible": .bool(visible)]) }
+    /// A `draggable` was lifted: the app makes its payload now and keeps it until `dragend`.
+    public static func dragStart(_ id: Int) -> RendererEvent { with("dragstart", id: id) }
+    /// The lifted `draggable` was dropped.
+    public static func dragEnd(_ id: Int) -> RendererEvent { with("dragend", id: id) }
+    /// A drag over a `dropdestination`: `entered`, `exited` or `performed`, with the lifted `draggable`
+    /// (`source`) or what came from outside the app (`items`); the point in the destination's own box.
+    public static func drop(_ id: Int, phase: String, source: Int? = nil, items: [JSONValue]? = nil, x: Double = 0, y: Double = 0) -> RendererEvent {
+        var fields: JSONObject = ["phase": .string(phase), "x": .number(x), "y": .number(y)]
+        if let source { fields["source"] = .number(Double(source)) }
+        if let items { fields["items"] = .array(items) }
+        return with("drop", id: id, fields)
+    }
+    /// A `layout` element's record: the proposal it was placed with and each child's min, ideal and max sizes.
+    public static func layout(_ id: Int, proposal: LayoutProposalSpec, children: [LayoutMeasurementSpec]) -> RendererEvent {
+        with("layout", id: id, ["proposal": proposal.json, "children": .array(children.map(\.json))])
+    }
+
     /// Several events delivered at once; the app renders once for all of them.
     public static func batch(_ events: [RendererEvent]) -> RendererEvent {
         RendererEvent(type: "batch", fields: ["events": .array(events.map(\.json))])