craft-native 0.0.204 → 0.0.206

package/dist/ios/templates/CraftNativeScreen.swift

@@ -21,6 +21,12 @@ private func number(_ value: Any?) -> CGFloat? {
     return value.isFinite ? value : nil
 }
 
+private func craftNativePickerValue(_ value: Any?) -> String? {
+    if let value = value as? String, !value.isEmpty { return value }
+    if let value = value as? NSNumber, value.doubleValue.isFinite { return String(value.doubleValue) }
+    return nil
+}
+
 private func craftNativeGridColumnCount(_ value: Any?) -> Int {
     if let number = value as? NSNumber { return max(1, number.intValue) }
     guard let text = value as? String else { return 1 }
@@ -751,6 +757,9 @@ private final class CraftNativeVideoView: UIView, AVPlayerViewControllerDelegate
     private var timeObserver: Any?
     private var loops = false
     private var wasPlaying: Bool?
+    private var playIntent: Bool?
+    private var userPaused = false
+    private var ended = false
     /// This video holds a claim on the audio session (`CraftNativeSounds`).
     private var claimedSession = false
     /// The screen's handlers by event name (`onEnd`, `onPlay`, `onPause`,
@@ -829,9 +838,17 @@ private final class CraftNativeVideoView: UIView, AVPlayerViewControllerDelegate
 
     func configure(source: Any?, autoplay: Bool, paused: Bool, loop: Bool, muted: Bool, controls: Bool, resizeMode: String?, pictureInPicture: Bool = false) {
         let uri = (source as? String) ?? (source as? [String: Any])?["uri"] as? String ?? ""
+        let nextShouldPlay = autoplay && !paused
+        if playIntent != nextShouldPlay {
+            userPaused = false
+            ended = false
+        }
+        playIntent = nextShouldPlay
         if uri != sourceURI {
             detachPlayer()
             sourceURI = uri
+            userPaused = false
+            ended = false
             loops = false
             // The copy `craft.media.keep` put on the phone plays in place of
             // the address, so a kept video plays with no signal.
@@ -871,7 +888,11 @@ private final class CraftNativeVideoView: UIView, AVPlayerViewControllerDelegate
             playerController.canStartPictureInPictureAutomaticallyFromInline = floating
         }
         loops = loop
-        if paused || !autoplay { player.pause() } else { player.play() }
+        if nextShouldPlay {
+            if !userPaused && !ended { player.play() }
+        } else {
+            player.pause()
+        }
     }
 
     // MARK: AVPlayerViewControllerDelegate
@@ -915,8 +936,12 @@ private final class CraftNativeVideoView: UIView, AVPlayerViewControllerDelegate
                 queue: .main
             ) { [weak self, weak player] _ in
                 guard let self else { return }
+                self.ended = !self.loops
                 self.fire("onEnd")
-                if self.loops { player?.seek(to: .zero) { _ in player?.play() } }
+                if self.loops {
+                    self.ended = false
+                    player?.seek(to: .zero) { _ in player?.play() }
+                }
             }
         }
         playingObservation = player.observe(\.timeControlStatus, options: [.new]) { [weak self] player, _ in
@@ -927,6 +952,12 @@ private final class CraftNativeVideoView: UIView, AVPlayerViewControllerDelegate
                 // Paused before it ever played is where it starts, not news.
                 if self.wasPlaying == nil && !playing { self.wasPlaying = false; return }
                 self.wasPlaying = playing
+                if playing {
+                    self.userPaused = false
+                    self.ended = false
+                } else if self.playIntent == true {
+                    self.userPaused = true
+                }
                 self.fire(playing ? "onPlay" : "onPause")
             }
         }
@@ -940,6 +971,9 @@ private final class CraftNativeVideoView: UIView, AVPlayerViewControllerDelegate
         detachPlayer()
         playerController.player = nil
         sourceURI = ""
+        playIntent = nil
+        userPaused = false
+        ended = false
         if playerController.parent != nil {
             playerController.willMove(toParent: nil)
             playerController.view.removeFromSuperview()
@@ -956,6 +990,8 @@ private final class CraftNativeMapView: MKMapView, MKMapViewDelegate {
     private var overlayCoordinatesByID: [String: [CLLocationCoordinate2D]] = [:]
     private var overlayColors: [ObjectIdentifier: UIColor] = [:]
     private var overlayWidths: [ObjectIdentifier: CGFloat] = [:]
+    private var initialCameraKey: String?
+    private var pendingFitKey: String?
     private(set) var markerHandlers: [String: String] = [:]
     var onMarkerTap: ((String) -> Void)?
 
@@ -998,7 +1034,8 @@ private final class CraftNativeMapView: MKMapView, MKMapViewDelegate {
             if type == "mapmarker" || type == "marker" {
                 guard let point = points.first else { continue }
                 nextMarkers[id] = (point, childProps["title"] as? String)
-                if let handler = childEvents["onPress"] ?? childEvents["onMarkerPress"], !handler.isEmpty {
+                if let handler = nonEmptyHandler(childEvents["onPress"])
+                    ?? nonEmptyHandler(childEvents["onMarkerPress"]) {
                     nextHandlers[id] = handler
                 }
             } else if type == "mappolyline" || type == "polyline" {
@@ -1056,23 +1093,62 @@ private final class CraftNativeMapView: MKMapView, MKMapViewDelegate {
             addOverlay(overlay)
         }
 
-        if let region = Self.region(props["region"] ?? props["initialRegion"]) {
+        if let region = Self.region(props["region"]) {
+            // `region` is controlled: an authored change is allowed to move
+            // the camera, even when the map itself was already mounted.
+            pendingFitKey = nil
             setRegion(region, animated: false)
+            initialCameraKey = nil
+        } else if let initial = Self.region(props["initialRegion"]) {
+            pendingFitKey = nil
+            let key = "region:\(Self.regionKey(initial))"
+            if initialCameraKey != key {
+                setRegion(initial, animated: false)
+                initialCameraKey = key
+            }
         } else if props["fitToBounds"] as? Bool == true {
-            fitToOverlays()
+            let key = "fit:\(Self.overlayKey(markers: nextMarkers.mapValues { $0.coordinate }, polylines: nextPolylines.mapValues { $0.coordinates }))"
+            if initialCameraKey != key {
+                // A native screen can reconcile before UIKit assigns the map
+                // its final safe-area-constrained bounds. Keep the fit
+                // pending until there is a real viewport, matching Android's
+                // onSizeChanged retry instead of silently accepting a no-op.
+                pendingFitKey = key
+                if fitToOverlays() {
+                    initialCameraKey = key
+                    pendingFitKey = nil
+                }
+            }
+        } else {
+            initialCameraKey = nil
+            pendingFitKey = nil
+        }
+    }
+
+    override func layoutSubviews() {
+        super.layoutSubviews()
+        guard let key = pendingFitKey else { return }
+        pendingFitKey = nil
+        guard fitToOverlays() else {
+            pendingFitKey = key
+            return
         }
+        initialCameraKey = key
     }
 
-    private func fitToOverlays() {
+    @discardableResult
+    private func fitToOverlays() -> Bool {
+        guard bounds.width > 0, bounds.height > 0 else { return false }
         var rect = MKMapRect.null
         for overlay in overlaysByID.values { rect = rect.union(overlay.boundingMapRect) }
         for annotation in annotationsByID.values {
             let point = MKMapPoint(annotation.coordinate)
             rect = rect.union(MKMapRect(x: point.x, y: point.y, width: 0, height: 0))
         }
-        guard !rect.isNull else { return }
+        guard !rect.isNull else { return false }
         let inset = UIEdgeInsets(top: 24, left: 24, bottom: 24, right: 24)
         setVisibleMapRect(rect, edgePadding: inset, animated: false)
+        return true
     }
 
     func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {
@@ -1118,6 +1194,25 @@ private final class CraftNativeMapView: MKMapView, MKMapViewDelegate {
         }
     }
 
+    private static func regionKey(_ region: MKCoordinateRegion) -> String {
+        "\(region.center.latitude),\(region.center.longitude),\(region.span.latitudeDelta),\(region.span.longitudeDelta)"
+    }
+
+    private static func overlayKey(
+        markers: [String: CLLocationCoordinate2D],
+        polylines: [String: [CLLocationCoordinate2D]]
+    ) -> String {
+        let markerKey = markers.keys.sorted().compactMap { id in
+            guard let point = markers[id] else { return nil }
+            return "\(id):\(point.latitude),\(point.longitude)"
+        }.joined(separator: "|")
+        let polylineKey = polylines.keys.sorted().compactMap { id in
+            guard let points = polylines[id] else { return nil }
+            return "\(id):" + points.map { "\($0.latitude),\($0.longitude)" }.joined(separator: ";")
+        }.joined(separator: "|")
+        return "m[\(markerKey)]p[\(polylineKey)]"
+    }
+
     private static func region(_ value: Any?) -> MKCoordinateRegion? {
         guard let value = value as? [String: Any],
               let center = value["center"] as? [String: Any],
@@ -1140,7 +1235,9 @@ private final class CraftNativeMapView: MKMapView, MKMapViewDelegate {
         case "orange": return .systemOrange
         case "purple": return .systemPurple
         case "yellow": return .systemYellow
-        default: return .systemBlue
+        default:
+            guard let value else { return .systemBlue }
+            return UIColor(css: value) ?? UIColor(hex: value) ?? .systemBlue
         }
     }
 
@@ -1371,13 +1468,32 @@ extension UIView {
             let right = sides[1].frame.width
             let bottom = sides[2].frame.height
             let left = sides[3].frame.width
-            sides[0].frame = CGRect(x: 0, y: 0, width: bounds.width, height: top)
-            sides[1].frame = CGRect(x: max(0, bounds.width - right), y: 0, width: right, height: bounds.height)
-            sides[2].frame = CGRect(x: 0, y: max(0, bounds.height - bottom), width: bounds.width, height: bottom)
-            sides[3].frame = CGRect(x: 0, y: 0, width: left, height: bounds.height)
+            let frames = [
+                CGRect(x: 0, y: 0, width: bounds.width, height: top),
+                CGRect(x: max(0, bounds.width - right), y: 0, width: right, height: bounds.height),
+                CGRect(x: 0, y: max(0, bounds.height - bottom), width: bounds.width, height: bottom),
+                CGRect(x: 0, y: 0, width: left, height: bounds.height),
+            ]
+            for (index, side) in sides.enumerated() {
+                side.frame = frames[index]
+                if let shape = side as? CAShapeLayer {
+                    shape.path = craftSideBorderPath(shape.bounds, index: index)
+                }
+            }
         }
     }
 
+    private func craftSideBorderPath(_ bounds: CGRect, index: Int) -> CGPath {
+        let path = UIBezierPath()
+        switch index {
+        case 0: path.move(to: CGPoint(x: bounds.minX, y: bounds.midY)); path.addLine(to: CGPoint(x: bounds.maxX, y: bounds.midY))
+        case 1: path.move(to: CGPoint(x: bounds.midX, y: bounds.minY)); path.addLine(to: CGPoint(x: bounds.midX, y: bounds.maxY))
+        case 2: path.move(to: CGPoint(x: bounds.minX, y: bounds.midY)); path.addLine(to: CGPoint(x: bounds.maxX, y: bounds.midY))
+        default: path.move(to: CGPoint(x: bounds.midX, y: bounds.minY)); path.addLine(to: CGPoint(x: bounds.midX, y: bounds.maxY))
+        }
+        return path.cgPath
+    }
+
     fileprivate func craftApplyBorderStyle(_ style: String?, width: CGFloat, color: UIColor) {
         guard width > 0, style == "dashed" || style == "dotted" else {
             (objc_getAssociatedObject(self, &craftNativeBorderLayerKey) as? CAShapeLayer)?.removeFromSuperlayer()
@@ -1410,6 +1526,7 @@ extension UIView {
         (objc_getAssociatedObject(self, &craftNativeBorderLayerKey) as? CAShapeLayer)?.removeFromSuperlayer()
         objc_setAssociatedObject(self, &craftNativeBorderLayerKey, nil, .OBJC_ASSOCIATION_RETAIN_NONATOMIC)
         layer.borderWidth = 0
+        (objc_getAssociatedObject(self, &craftNativeSideBorderLayersKey) as? [CALayer])?.forEach { $0.removeFromSuperlayer() }
         let top = max(0, widths.count > 0 ? widths[0] : 0)
         let right = max(0, widths.count > 1 ? widths[1] : 0)
         let bottom = max(0, widths.count > 2 ? widths[2] : 0)
@@ -1421,9 +1538,25 @@ extension UIView {
             CGRect(x: 0, y: 0, width: left, height: bounds.height),
         ]
         let layers = frames.enumerated().map { index, frame in
-            let side = CALayer()
+            let side: CALayer
+            if style == "dashed" || style == "dotted" {
+                let shape = CAShapeLayer()
+                shape.strokeColor = (colors.count > index ? colors[index] : .clear).cgColor
+                shape.fillColor = nil
+                shape.lineWidth = index % 2 == 0 ? frame.height : frame.width
+                shape.lineCap = style == "dotted" ? .round : .butt
+                shape.lineDashPattern = style == "dotted"
+                    ? [NSNumber(value: Double(shape.lineWidth)), NSNumber(value: Double(shape.lineWidth * 1.5))]
+                    : [NSNumber(value: Double(shape.lineWidth * 3)), NSNumber(value: Double(shape.lineWidth * 2))]
+                shape.contentsScale = window?.screen.scale ?? traitCollection.displayScale
+                shape.frame = frame
+                shape.path = craftSideBorderPath(shape.bounds, index: index)
+                side = shape
+            } else {
+                side = CALayer()
+                side.backgroundColor = (colors.count > index ? colors[index] : .clear).cgColor
+            }
             side.frame = frame
-            side.backgroundColor = (colors.count > index ? colors[index] : .clear).cgColor
             layer.addSublayer(side)
             return side
         }
@@ -1523,6 +1656,8 @@ extension UIView {
 private class CraftNativeFlowView: UIStackView {
     var pressActiveOpacity: CGFloat?
     var pressBaseOpacity: CGFloat = 1
+    var pressUnderlayColor: UIColor?
+    var pressBaseBackgroundColor: UIColor?
     var wrap = false { didSet { if wrap != oldValue { invalidateMeasurements() } } }
     var alignItems = "stretch" { didSet { alignment = alignmentValue; if alignItems != oldValue { invalidateMeasurements() } } }
     var alignContent = "flex-start" { didSet { if alignContent != oldValue { invalidateMeasurements() } } }
@@ -3174,10 +3309,17 @@ private final class CraftNativeSvgView: UIView {
         var strokeWidth: CGFloat = 1
         var color: String? = "#000000"
         var opacity: CGFloat = 1
+        var fillOpacity: CGFloat = 1
+        var strokeOpacity: CGFloat = 1
+        var strokeDashoffset: CGFloat = 0
+        var strokeMiterlimit: CGFloat = 4
+        var fillRule: String = "nonzero"
         var linecap: String?
         var linejoin: String?
         var dashes: [CGFloat]?
         var vectorEffect: String?
+        var fontWeight: String?
+        var dominantBaseline: String?
 
         func merged(_ node: [String: Any]) -> Paint {
             var next = self
@@ -3189,6 +3331,11 @@ private final class CraftNativeSvgView: UIView {
                 let value = CGFloat(truncating: number)
                 return value.isFinite ? value : nil
             }
+            func string(_ raw: Any?) -> String? {
+                if let value = raw as? String { return value }
+                if let number = raw as? NSNumber { return number.stringValue }
+                return nil
+            }
             if let color = style["color"] as? String { next.color = color }
             if let fill = style["fill"] as? String ?? props["fill"] as? String { next.fill = fill }
             if let stroke = style["stroke"] as? String ?? props["stroke"] as? String { next.stroke = stroke }
@@ -3196,10 +3343,17 @@ private final class CraftNativeSvgView: UIView {
             // Computed style wins over the component prop, matching Android
             // and the browser's cascade when both provide opacity.
             if let opacity = finite(style["opacity"] ?? props["opacity"]) { next.opacity *= opacity }
+            if let opacity = finite(value("fillOpacity")) { next.fillOpacity = opacity }
+            if let opacity = finite(value("strokeOpacity")) { next.strokeOpacity = opacity }
+            if let offset = finite(value("strokeDashoffset")) { next.strokeDashoffset = offset }
+            if let limit = finite(value("strokeMiterlimit")), limit > 0 { next.strokeMiterlimit = limit }
+            if let rule = value("fillRule") as? String { next.fillRule = rule }
             if let cap = value("strokeLinecap") as? String { next.linecap = cap }
             if let join = value("strokeLinejoin") as? String { next.linejoin = join }
             if let dashes = value("strokeDasharray") as? [Any] { next.dashes = dashes.compactMap(finite).filter { $0 >= 0 } }
             if let vectorEffect = value("vectorEffect") as? String { next.vectorEffect = vectorEffect }
+            if let fontWeight = string(value("fontWeight")) { next.fontWeight = fontWeight }
+            if let baseline = value("dominantBaseline") as? String { next.dominantBaseline = baseline }
             return next
         }
 
@@ -3257,10 +3411,13 @@ private final class CraftNativeSvgView: UIView {
             default:
                 guard let path = CraftNativeSvgView.path((shape["props"] as? [String: Any])?["geometry"]) else { continue }
                 context.saveGState()
-                context.setAlpha(own.opacity)
+                path.usesEvenOddFillRule = own.fillRule == "evenodd"
                 if let fill = own.resolve(own.fill) {
+                    context.saveGState()
+                    context.setAlpha(max(0, min(1, own.opacity * own.fillOpacity)))
                     fill.setFill()
                     path.fill()
+                    context.restoreGState()
                 }
                 if let stroke = own.resolve(own.stroke), own.strokeWidth > 0 {
                     // `vector-effect="non-scaling-stroke"`: the stroke is in the
@@ -3277,10 +3434,12 @@ private final class CraftNativeSvgView: UIView {
                         line = path
                     }
                     stroke.setStroke()
+                    context.setAlpha(max(0, min(1, own.opacity * own.strokeOpacity)))
                     line.lineWidth = own.strokeWidth
+                    line.miterLimit = own.strokeMiterlimit
                     line.lineCapStyle = own.linecap == "round" ? .round : own.linecap == "square" ? .square : .butt
                     line.lineJoinStyle = own.linejoin == "round" ? .round : own.linejoin == "bevel" ? .bevel : .miter
-                    if let dashes = own.dashes, !dashes.isEmpty { line.setLineDash(dashes, count: dashes.count, phase: 0) }
+                    if let dashes = own.dashes, !dashes.isEmpty { line.setLineDash(dashes, count: dashes.count, phase: own.strokeDashoffset) }
                     line.stroke()
                 }
                 context.restoreGState()
@@ -3294,10 +3453,21 @@ private final class CraftNativeSvgView: UIView {
         let props = node["props"] as? [String: Any] ?? [:]
         let style = node["style"] as? [String: Any] ?? [:]
         let size = number(props["fontSize"]) ?? number(style["fontSize"]) ?? 12
-        let weight: UIFont.Weight = (props["fontWeight"] as? String ?? style["fontWeight"] as? String).map { ["500": .medium, "600": .semibold, "700": .bold, "bold": .bold][$0] ?? .regular } ?? .regular
+        let weight: UIFont.Weight = {
+            switch paint.fontWeight?.lowercased() {
+            case "500": return .medium
+            case "600": return .semibold
+            case "bold", "700", "800", "900": return .bold
+            default: return .regular
+            }
+        }()
+        let font = UIFont.systemFont(ofSize: size, weight: weight)
+        let resolvedTextColor = paint.resolve(paint.fill) ?? UIColor.label
+        let textAlpha = max(0, min(1, paint.opacity * paint.fillOpacity))
+        let textColor = resolvedTextColor.withAlphaComponent(resolvedTextColor.cgColor.alpha * textAlpha)
         let string = NSAttributedString(string: text, attributes: [
-            .font: UIFont.systemFont(ofSize: size, weight: weight),
-            .foregroundColor: paint.resolve(paint.fill) ?? UIColor.label,
+            .font: font,
+            .foregroundColor: textColor,
         ])
         var x = number(props["x"]) ?? 0
         let y = number(props["y"]) ?? 0
@@ -3306,8 +3476,14 @@ private final class CraftNativeSvgView: UIView {
         case "end": x -= string.size().width
         default: break
         }
-        // y is the baseline, as in SVG.
-        string.draw(at: CGPoint(x: x, y: y - UIFont.systemFont(ofSize: size).ascender))
+        let baseline: CGFloat
+        switch paint.dominantBaseline {
+        case "middle", "central", "mathematical": baseline = y - (font.ascender + font.descender) / 2
+        case "hanging", "text-before-edge", "before-edge": baseline = y + font.ascender
+        case "text-after-edge", "after-edge": baseline = y + font.descender
+        default: baseline = y
+        }
+        string.draw(at: CGPoint(x: x, y: baseline - font.ascender))
     }
 
     static func path(_ value: Any?) -> UIBezierPath? {
@@ -3505,6 +3681,8 @@ private final class CraftNativeIconView: UIImageView {
 
 private final class CraftNativeTextView: UITextView {
     private let placeholderLabel = UILabel()
+    private var nativeTextContainerInset: UIEdgeInsets?
+    private var nativeLineFragmentPadding: CGFloat?
     var placeholder: String? {
         didSet { refreshPlaceholder() }
     }
@@ -3529,6 +3707,20 @@ private final class CraftNativeTextView: UITextView {
         configurePlaceholder()
     }
 
+    func applyAuthoredPadding(_ padding: UIEdgeInsets) {
+        if nativeTextContainerInset == nil {
+            nativeTextContainerInset = textContainerInset
+            nativeLineFragmentPadding = textContainer.lineFragmentPadding
+        }
+        if padding == .zero {
+            textContainerInset = nativeTextContainerInset ?? .zero
+            textContainer.lineFragmentPadding = nativeLineFragmentPadding ?? 0
+        } else {
+            textContainerInset = padding
+            textContainer.lineFragmentPadding = 0
+        }
+    }
+
     override func layoutSubviews() {
         super.layoutSubviews()
         let inset = textContainerInset
@@ -3582,6 +3774,8 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
     private var handlers: [ObjectIdentifier: String] = [:]
     private var pressInHandlers: [ObjectIdentifier: String] = [:]
     private var pressOutHandlers: [ObjectIdentifier: String] = [:]
+    private var underlayShowHandlers: [ObjectIdentifier: String] = [:]
+    private var underlayHideHandlers: [ObjectIdentifier: String] = [:]
     private var focusHandlers: [ObjectIdentifier: String] = [:]
     private var blurHandlers: [ObjectIdentifier: String] = [:]
     private var endEditingHandlers: [ObjectIdentifier: String] = [:]
@@ -3607,6 +3801,10 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
     private var imageSources: [ObjectIdentifier: String] = [:]
     private var imageTasks: [ObjectIdentifier: URLSessionDataTask] = [:]
     private var imageErrors: [ObjectIdentifier: String] = [:]
+    /// Text inputs retain UIKit's generated accessibility value unless the
+    /// bundle authored one; remember that distinction so removing the prop
+    /// restores the native value instead of leaving stale metadata behind.
+    private var authoredAccessibilityValues = Set<ObjectIdentifier>()
     private var checkboxIndeterminate: [ObjectIdentifier: Bool] = [:]
     private var tintedImages = Set<ObjectIdentifier>()
     private var imageLoadStartHandlers: [ObjectIdentifier: String] = [:]
@@ -5138,6 +5336,12 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
             // reads the node's new layout style on its next pass.
             CraftNativeFlexLayout.invalidateAncestors(of: next.view)
         }
+        if !applied.isEmpty {
+            // A targeted mutation can change geometry without causing UIKit
+            // to call viewDidLayoutSubviews again. Keep onLayout delivery
+            // aligned with Android's post-mutation layout pass.
+            scheduleLayoutEvents()
+        }
         restoreFocus(focused)
         return true
     }
@@ -5406,17 +5610,23 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
             }
         case "Picker":
             let picker = result as! UIPickerView
-            let options = children.compactMap { child -> (value: String, label: String)? in
-                guard let node = child as? [String: Any], node["type"] as? String == "Text" else { return nil }
-                let optionProps = node["props"] as? [String: Any] ?? [:]
-                let label = (node["children"] as? [Any] ?? []).compactMap { $0 as? String }.joined()
-                guard !label.isEmpty else { return nil }
-                return (value: optionProps["value"] as? String ?? label, label: label)
-            }
+            let itemOptions = (props["items"] as? [[String: Any]])?.compactMap { item -> (value: String, label: String)? in
+                guard let label = item["label"] as? String, !label.isEmpty else { return nil }
+                return (value: craftNativePickerValue(item["value"]) ?? label, label: label)
+            } ?? []
+            let options = itemOptions.isEmpty
+                ? children.compactMap { child -> (value: String, label: String)? in
+                    guard let node = child as? [String: Any], node["type"] as? String == "Text" else { return nil }
+                    let optionProps = node["props"] as? [String: Any] ?? [:]
+                    let label = (node["children"] as? [Any] ?? []).compactMap { $0 as? String }.joined()
+                    guard !label.isEmpty else { return nil }
+                    return (value: craftNativePickerValue(optionProps["value"]) ?? label, label: label)
+                }
+                : itemOptions
             let pickerID = ObjectIdentifier(picker)
             pickerOptions[pickerID] = options
             picker.reloadAllComponents()
-            if let selected = (props["selectedValue"] as? String) ?? (props["value"] as? String),
+            if let selected = craftNativePickerValue(props["selectedValue"]) ?? craftNativePickerValue(props["value"]),
                let row = options.firstIndex(where: { $0.value == selected }) {
                 picker.selectRow(row, inComponent: 0, animated: false)
             } else if !options.isEmpty {
@@ -5492,9 +5702,12 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
             let pressable = result as! CraftNativeFlowView
             configureStack(pressable, style: style)
             reconcileChildren(children, in: pressable, parent: current, path: path, style: style)
-            pressable.pressActiveOpacity = props["disabled"] as? Bool == true
+            let disabled = props["disabled"] as? Bool == true
+            pressable.pressActiveOpacity = disabled
                 ? nil : number(props["activeOpacity"]) ?? 0.5
             pressable.pressBaseOpacity = number(style["opacity"]) ?? 1
+            pressable.pressUnderlayColor = type == "TouchableHighlight" && !disabled ? color(props["underlayColor"]) : nil
+            pressable.pressBaseBackgroundColor = pressable.backgroundColor
         case "Switch":
             let toggle = result as! UISwitch
             toggle.isOn = props["value"] as? Bool ?? props["checked"] as? Bool ?? false
@@ -5580,6 +5793,15 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
             updateImage(image, source: props["source"], defaultSource: props["defaultSource"])
         case "ImageBackground":
             let background = result as! CraftNativeImageBackgroundView
+            let backgroundID = ObjectIdentifier(background)
+            if let tint = color(style["tintColor"]) {
+                tintedImages.insert(backgroundID)
+                background.tintColor = tint
+            } else {
+                tintedImages.remove(backgroundID)
+                background.tintColor = nil
+            }
+            if let current = background.image { background.image = imageForDisplay(current, view: background) }
             let requestedResizeMode = style["resizeMode"] as? String ?? props["resizeMode"] as? String
             background.contentMode = imageContentMode(requestedResizeMode)
             background.clipsToBounds = background.contentMode == .scaleAspectFill
@@ -5614,8 +5836,10 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
             )
         case "Map":
             let map = result as! CraftNativeMapView
+            let mapMarkerHandler = nonEmptyHandler(events["onMarkerPress"])
             map.configure(props: props, children: children) { [weak self, weak map] markerID in
-                guard let self, let map, let handler = map.markerHandlers[markerID], !handler.isEmpty else { return }
+                guard let self, let map,
+                      let handler = map.markerHandlers[markerID] ?? mapMarkerHandler else { return }
                 self.send(type: "EVENT", payload: [
                     "handlerName": handler,
                     "nativeEvent": ["id": markerID],
@@ -5649,13 +5873,15 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
             let refreshNode = children.compactMap { $0 as? [String: Any] }.first {
                 canonicalType($0["type"] as? String ?? "") == "RefreshControl"
             }
-            let refreshProps = refreshNode?["props"] as? [String: Any] ?? [:]
+            let propRefresh = props["refreshControl"] as? [String: Any] ?? [:]
+            let refreshProps = refreshNode?["props"] as? [String: Any] ?? propRefresh
             let refreshEvents = refreshNode?["events"] as? [String: String] ?? [:]
             let refreshHandlerName = nonEmptyHandler(refreshEvents["onRefresh"])
                 ?? nonEmptyHandler(events["onRefresh"])
+            let refreshing = (refreshProps["refreshing"] ?? props["refreshing"]) as? Bool == true
             scroll.setRefreshHandler(refreshHandlerName.map { [weak self] handler in
                 { self?.send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]]) }
-            }, refreshing: (refreshNode == nil ? props["refreshing"] : refreshProps["refreshing"]) as? Bool == true)
+            }, refreshing: refreshing)
             scroll.setRefreshAppearance(refreshProps)
             var contentStyle = style
             if let override = props["contentContainerStyle"] as? [String: Any] {
@@ -5690,6 +5916,11 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
                 disabled ? nil : nonEmptyHandler(events["onPressOut"]),
                 for: result
             )
+            updateUnderlayHandlers(
+                type == "TouchableHighlight" && !disabled ? nonEmptyHandler(events["onShowUnderlay"]) : nil,
+                type == "TouchableHighlight" && !disabled ? nonEmptyHandler(events["onHideUnderlay"]) : nil,
+                for: result
+            )
             if disabled { result.isUserInteractionEnabled = false }
         }
         applyAccessibility(props, type: type, to: result)
@@ -5931,6 +6162,11 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         let owner = parent.protocolId ?? path
         flatListOwners = flatListOwners.filter { $0.value != owner }
         for child in children { registerFlatListOwnership(child, owner: owner) }
+        let propRefresh = props["refreshControl"] as? [String: Any] ?? [:]
+        let propRefreshEvents = propRefresh["events"] as? [String: String] ?? [:]
+        let refreshHandler = nonEmptyHandler(propRefreshEvents["onRefresh"])
+            ?? nonEmptyHandler(events["onRefresh"])
+        let refreshing = (propRefresh["refreshing"] ?? props["refreshing"]) as? Bool == true
         list.bounces = props["bounces"] as? Bool ?? true
         list.isScrollEnabled = props["scrollEnabled"] as? Bool != false
         list.onFittingHeightChanged = { [weak list] in
@@ -5939,9 +6175,10 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         }
         list.setKeyboardShouldPersistTaps(props["keyboardShouldPersistTaps"])
         list.setContentContainerStyle(props["contentContainerStyle"] as? [String: Any])
-        list.setRefreshHandler(nonEmptyHandler(events["onRefresh"]).map { [weak self] handler in
+        list.setRefreshHandler(refreshHandler.map { [weak self] handler in
             { self?.send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]]) }
-        }, refreshing: props["refreshing"] as? Bool == true)
+        }, refreshing: refreshing)
+        list.setRefreshAppearance(propRefresh)
         list.keyboardDismissMode = keyboardDismissMode(props["keyboardDismissMode"])
         list.onScrollEvent = nonEmptyHandler(events["onScroll"]).map { handler in
             { [weak self] scrollView in self?.send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": self?.scrollEvent(scrollView) ?? [:]]) }
@@ -5993,6 +6230,13 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
                 { self?.send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]]) }
             }
         )
+        let horizontal = props["horizontal"] as? Bool == true
+        list.showsVerticalScrollIndicator = props["showsVerticalScrollIndicator"] as? Bool ?? true
+        list.showsHorizontalScrollIndicator = props["showsHorizontalScrollIndicator"] as? Bool ?? true
+        list.isPagingEnabled = props["pagingEnabled"] as? Bool ?? false
+        list.setScrollTarget(props["scrollTarget"])
+        list.alwaysBounceVertical = props["alwaysBounceVertical"] as? Bool ?? !horizontal
+        list.alwaysBounceHorizontal = props["alwaysBounceHorizontal"] as? Bool ?? horizontal
         parent.children = []
     }
 
@@ -6045,6 +6289,8 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         transitionIDs.removeValue(forKey: id)
         pressInHandlers.removeValue(forKey: id)
         pressOutHandlers.removeValue(forKey: id)
+        underlayShowHandlers.removeValue(forKey: id)
+        underlayHideHandlers.removeValue(forKey: id)
         layoutHandlers.removeValue(forKey: id)
         lastLayoutFrames.removeValue(forKey: id)
         focusHandlers.removeValue(forKey: id)
@@ -6076,6 +6322,7 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         imageSources.removeValue(forKey: id)
         imageTasks.removeValue(forKey: id)?.cancel()
         imageErrors.removeValue(forKey: id)
+        authoredAccessibilityValues.remove(id)
         tintedImages.remove(id)
         imageLoadStartHandlers.removeValue(forKey: id)
         imageLoadHandlers.removeValue(forKey: id)
@@ -6117,6 +6364,19 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
 
     private var layoutEventsScheduled = false
 
+    /// UIView.frame is undefined while a transform is applied. onLayout is
+    /// the authored layout in the parent coordinate space, matching Android's
+    /// left/top/right/bottom values rather than the transformed visual bounds.
+    private func layoutFrame(of view: UIView) -> CGRect {
+        guard !view.transform.isIdentity else { return view.frame }
+        return CGRect(
+            x: view.center.x - view.bounds.width / 2,
+            y: view.center.y - view.bounds.height / 2,
+            width: view.bounds.width,
+            height: view.bounds.height
+        )
+    }
+
     /// A view inside the screen moved: report onLayout once the pass that
     /// moved it is over, however deep it was.
     fileprivate func scheduleLayoutEvents() {
@@ -6132,7 +6392,7 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
     private func emitLayoutEvents(for node: RenderedNode) {
         let id = ObjectIdentifier(node.view)
         if let handler = layoutHandlers[id], isEffectivelyVisible(node.view) {
-            let frame = node.view.frame
+            let frame = layoutFrame(of: node.view)
             if lastLayoutFrames[id] != frame {
                 lastLayoutFrames[id] = frame
                 send(type: "EVENT", payload: [
@@ -6205,8 +6465,10 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         let id = ObjectIdentifier(view)
         if let pressIn, !pressIn.isEmpty { pressInHandlers[id] = pressIn } else { pressInHandlers.removeValue(forKey: id) }
         if let pressOut, !pressOut.isEmpty { pressOutHandlers[id] = pressOut } else { pressOutHandlers.removeValue(forKey: id) }
-        guard pressInHandlers[id] != nil || pressOutHandlers[id] != nil else {
+        let hasUnderlay = (view as? CraftNativeFlowView)?.pressUnderlayColor != nil
+        guard pressInHandlers[id] != nil || pressOutHandlers[id] != nil || hasUnderlay else {
             if let recognizer = pressFeedbackRecognizers.removeValue(forKey: id) { view.removeGestureRecognizer(recognizer) }
+            if let pressable = view as? CraftNativeFlowView { pressable.backgroundColor = pressable.pressBaseBackgroundColor }
             if !ownsTouches(view) { view.isUserInteractionEnabled = handlers[id] != nil || linkTargets[id] != nil || longPressHandlers[id] != nil || view is CraftNativeFlowView }
             return
         }
@@ -6222,6 +6484,12 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         if !ownsTouches(view) { view.isUserInteractionEnabled = true }
     }
 
+    private func updateUnderlayHandlers(_ show: String?, _ hide: String?, for view: UIView) {
+        let id = ObjectIdentifier(view)
+        if let show, !show.isEmpty { underlayShowHandlers[id] = show } else { underlayShowHandlers.removeValue(forKey: id) }
+        if let hide, !hide.isEmpty { underlayHideHandlers[id] = hide } else { underlayHideHandlers.removeValue(forKey: id) }
+    }
+
     private func updateLongPressHandler(_ handler: String?, for view: UIView) {
         let id = ObjectIdentifier(view)
         if let handler, !handler.isEmpty {
@@ -6289,7 +6557,9 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         applyAutofill(to: textView, props: props)
         // The style's padding is where the text starts, as in a web textarea.
         let padding = paddingInsets(style)
-        if padding != .zero {
+        if let craftTextView = textView as? CraftNativeTextView {
+            craftTextView.applyAuthoredPadding(padding)
+        } else if padding != .zero {
             if textView.textContainerInset != padding { textView.textContainerInset = padding }
             textView.textContainer.lineFragmentPadding = 0
         }
@@ -6714,7 +6984,14 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
     }
 
     private func updateImage(_ view: UIImageView, source: Any?, defaultSource: Any? = nil) {
-        let uri = (source as? String) ?? (source as? [String: Any])?["uri"] as? String
+        let sourceObject = source as? [String: Any]
+        let uri = (source as? String) ?? sourceObject?["uri"] as? String
+        let headers = (sourceObject?["headers"] as? [String: Any])?.reduce(into: [String: String]()) { result, entry in
+            if let value = entry.value as? String { result[entry.key] = value }
+        } ?? [:]
+        let requestKey = uri.map { value in
+            value + "\u{0}" + headers.sorted { $0.key < $1.key }.map { "\($0.key)=\($0.value)" }.joined(separator: "\u{0}")
+        }
         let id = ObjectIdentifier(view)
         guard let uri, !uri.isEmpty else {
             if imageSources[id] == "" { return }
@@ -6723,9 +7000,9 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
             imageFailure(view, uri: nil, message: "Image source is missing")
             return
         }
-        guard imageSources[id] != uri else { return }
+        guard let requestKey, imageSources[id] != requestKey else { return }
         imageTasks.removeValue(forKey: id)?.cancel()
-        imageSources[id] = uri
+        imageSources[id] = requestKey
         imageErrors.removeValue(forKey: id)
         view.image = immediateImage(defaultSource).map { imageForDisplay($0, view: view) }
         imageDidChange(view)
@@ -6746,10 +7023,12 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
             return
         }
         if let url = URL(string: uri), Self.loadsImage(from: url) {
-            let task = URLSession.shared.dataTask(with: url) { [weak self, weak view] data, _, _ in
+            var request = URLRequest(url: url)
+            for (name, value) in headers { request.setValue(value, forHTTPHeaderField: name) }
+            let task = URLSession.shared.dataTask(with: request) { [weak self, weak view] data, _, _ in
                 guard let self, let view else { return }
                 DispatchQueue.main.async {
-                    guard self.imageSources[ObjectIdentifier(view)] == uri else { return }
+                    guard self.imageSources[ObjectIdentifier(view)] == requestKey else { return }
                     self.imageTasks.removeValue(forKey: ObjectIdentifier(view))
                     guard let data, let image = UIImage(data: data) else {
                         self.imageFailure(view, uri: uri, message: "Image download failed")
@@ -6823,11 +7102,17 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
     }
 
     private func applyAccessibility(_ props: [String: Any], type: String, to view: UIView) {
+        let id = ObjectIdentifier(view)
         view.accessibilityLabel = (props["accessibilityLabel"] as? String)
             ?? ((type == "Image" || type == "ImageBackground") ? props["alt"] as? String : nil)
         view.accessibilityHint = props["accessibilityHint"] as? String
         if let value = props["accessibilityValue"] {
             view.accessibilityValue = (value as? String) ?? (value as? NSNumber)?.stringValue
+            authoredAccessibilityValues.insert(id)
+        } else if authoredAccessibilityValues.remove(id) != nil {
+            // Clearing an authored value lets UIKit expose the field's live
+            // value again (particularly important for TextInput).
+            view.accessibilityValue = nil
         } else if type != "TextInput" {
             view.accessibilityValue = nil
         }
@@ -7216,13 +7501,21 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate,
         let id = ObjectIdentifier(view)
         switch sender.state {
         case .began:
-            if let pressable = view as? CraftNativeFlowView, let activeOpacity = pressable.pressActiveOpacity {
-                UIView.animate(withDuration: 0.1) { pressable.alpha = pressable.pressBaseOpacity * activeOpacity }
+            if let pressable = view as? CraftNativeFlowView {
+                if let underlayColor = pressable.pressUnderlayColor { pressable.backgroundColor = underlayColor }
+                if let activeOpacity = pressable.pressActiveOpacity {
+                    UIView.animate(withDuration: 0.1) { pressable.alpha = pressable.pressBaseOpacity * activeOpacity }
+                }
             }
             if let handler = pressInHandlers[id] { send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]]) }
+            if let handler = underlayShowHandlers[id] { send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]]) }
         case .ended, .cancelled, .failed:
-            if let pressable = view as? CraftNativeFlowView { UIView.animate(withDuration: 0.1) { pressable.alpha = pressable.pressBaseOpacity } }
+            if let pressable = view as? CraftNativeFlowView {
+                pressable.backgroundColor = pressable.pressBaseBackgroundColor
+                UIView.animate(withDuration: 0.1) { pressable.alpha = pressable.pressBaseOpacity }
+            }
             if let handler = pressOutHandlers[id] { send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]]) }
+            if let handler = underlayHideHandlers[id] { send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]]) }
         default:
             break
         }