craft-native 0.0.123 → 0.0.124

package/dist/ios/templates/CraftNativeScreen.swift

@@ -5,6 +5,18 @@ import UIKit
 
 private let craftNativeCapabilityTimeoutMilliseconds = 30_000
 
+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 }
+    let trimmed = text.trimmingCharacters(in: .whitespacesAndNewlines)
+    if trimmed.hasPrefix("repeat(") {
+        let digits = trimmed.dropFirst("repeat(".count).prefix { $0.isNumber }
+        if let count = Int(digits) { return max(1, count) }
+    }
+    let tracks = trimmed.split(whereSeparator: { $0 == " " || $0 == "\t" || $0 == "\n" })
+    return max(1, tracks.count)
+}
+
 /// A WebView-free host for the first stx-native vertical slice. The bundled
 /// JavaScript sends whole, compiled view trees to UIKit and receives control
 /// events and Craft API replies through JavaScriptCore.
@@ -31,6 +43,16 @@ private struct CraftNativeLayoutStyle {
     let bottom: CGFloat?
     let left: CGFloat?
     let alignSelf: String?
+    let flexGrow: CGFloat
+    let flexShrink: CGFloat
+    let flexBasis: CGFloat?
+    let marginTop: CGFloat
+    let marginRight: CGFloat
+    let marginBottom: CGFloat
+    let marginLeft: CGFloat
+    let display: String
+    let gridColumns: Int
+    let gridAutoRows: CGFloat?
 
     init(_ raw: [String: Any]) {
         func number(_ value: Any?) -> CGFloat? { (value as? NSNumber).map { CGFloat(truncating: $0) } }
@@ -46,6 +68,19 @@ private struct CraftNativeLayoutStyle {
         bottom = number(raw["bottom"])
         left = number(raw["left"])
         alignSelf = raw["alignSelf"] as? String
+        flexGrow = number(raw["flexGrow"] ?? raw["flex"]) ?? 0
+        flexShrink = number(raw["flexShrink"]) ?? 0
+        flexBasis = number(raw["flexBasis"])
+        let margin = number(raw["margin"]) ?? 0
+        let horizontalMargin = number(raw["marginHorizontal"]) ?? margin
+        let verticalMargin = number(raw["marginVertical"]) ?? margin
+        marginTop = number(raw["marginTop"]) ?? verticalMargin
+        marginRight = number(raw["marginRight"]) ?? horizontalMargin
+        marginBottom = number(raw["marginBottom"]) ?? verticalMargin
+        marginLeft = number(raw["marginLeft"]) ?? horizontalMargin
+        display = raw["display"] as? String ?? "flex"
+        gridColumns = craftNativeGridColumnCount(raw["gridTemplateColumns"] ?? raw["gridColumns"])
+        gridAutoRows = number(raw["gridAutoRows"])
     }
 }
 
@@ -56,6 +91,9 @@ private final class CraftNativeFlowView: UIStackView {
     var gap: CGFloat = 0 { didSet { spacing = gap; invalidateIntrinsicContentSize(); setNeedsLayout() } }
     var rowGap: CGFloat? { didSet { invalidateIntrinsicContentSize(); setNeedsLayout() } }
     var columnGap: CGFloat? { didSet { invalidateIntrinsicContentSize(); setNeedsLayout() } }
+    var grid = false { didSet { invalidateIntrinsicContentSize(); setNeedsLayout() } }
+    var gridColumns = 1 { didSet { invalidateIntrinsicContentSize(); setNeedsLayout() } }
+    var gridAutoRows: CGFloat? { didSet { invalidateIntrinsicContentSize(); setNeedsLayout() } }
     var padding = UIEdgeInsets.zero {
         didSet {
             layoutMargins = padding
@@ -112,11 +150,20 @@ private final class CraftNativeFlowView: UIStackView {
     }
 
     override var intrinsicContentSize: CGSize {
-        let children = subviews.filter { !$0.isHidden && !($0 is CraftNativeFlexSpacer) }
+        let children = subviews.filter {
+            !$0.isHidden && !($0 is CraftNativeFlexSpacer)
+                && (childStyles[ObjectIdentifier($0)] ?? CraftNativeLayoutStyle([:])).position != "absolute"
+        }
         guard !children.isEmpty else { return CGSize(width: UIView.noIntrinsicMetric, height: UIView.noIntrinsicMetric) }
+        if grid { return gridIntrinsicContentSize(children) }
         let sizes = children.map { measuredSize(for: $0, available: CGSize(width: 10_000, height: 10_000)) }
-        let main = sizes.map { axis == .horizontal ? $0.width : $0.height }.reduce(0, +)
-        let cross = sizes.map { axis == .horizontal ? $0.height : $0.width }.max() ?? 0
+        let styles = children.map { childStyles[ObjectIdentifier($0)] ?? CraftNativeLayoutStyle([:]) }
+        let main = sizes.enumerated().map { index, size in
+            (axis == .horizontal ? size.width : size.height) + mainMargins(styles[index])
+        }.reduce(0, +)
+        let cross = sizes.enumerated().map { index, size in
+            (axis == .horizontal ? size.height : size.width) + crossMargins(styles[index])
+        }.max() ?? 0
         let mainGap = max(0, CGFloat(max(0, children.count - 1))) * mainGapValue
         if axis == .horizontal {
             return CGSize(width: padding.left + padding.right + main + mainGap, height: padding.top + padding.bottom + cross)
@@ -127,6 +174,10 @@ private final class CraftNativeFlowView: UIStackView {
     override func layoutSubviews() {
         super.layoutSubviews()
         let content = bounds.inset(by: padding)
+        if grid {
+            layoutGrid(content: content)
+            return
+        }
         let availableMain = axis == .horizontal ? content.width : content.height
         var lines: [([UIView], [CGSize], CGFloat, CGFloat)] = []
         var items: [UIView] = []
@@ -144,8 +195,8 @@ private final class CraftNativeFlowView: UIStackView {
             let style = childStyles[ObjectIdentifier(child)] ?? CraftNativeLayoutStyle([:])
             if style.position == "absolute" { continue }
             let size = measuredSize(for: child, available: content.size, style: style)
-            let childMain = axis == .horizontal ? size.width : size.height
-            let childCross = axis == .horizontal ? size.height : size.width
+            let childMain = (axis == .horizontal ? size.width : size.height) + mainMargins(style)
+            let childCross = (axis == .horizontal ? size.height : size.width) + crossMargins(style)
             let next = items.isEmpty ? childMain : main + mainGapValue + childMain
             if wrap && !items.isEmpty && next > availableMain { flush() }
             items.append(child); sizes.append(size)
@@ -156,29 +207,39 @@ private final class CraftNativeFlowView: UIStackView {
 
         var crossOffset: CGFloat = 0
         for (lineItems, lineSizes, lineMain, lineCross) in lines {
-            let free = max(0, availableMain - lineMain)
+            let styles = lineItems.map { childStyles[ObjectIdentifier($0)] ?? CraftNativeLayoutStyle([:]) }
+            let distributed = distributeMainAxisSizes(lineSizes, styles: styles, available: availableMain, lineMain: lineMain)
+            let distributedMain = distributed.enumerated().reduce(0) { total, entry in
+                total + (axis == .horizontal ? entry.element.width : entry.element.height) + mainMargins(styles[entry.offset])
+            } + CGFloat(max(0, lineItems.count - 1)) * mainGapValue
+            let free = max(0, availableMain - distributedMain)
             let (leading, between) = distribution(free: free, count: lineItems.count)
             var mainOffset = leading
             for (index, child) in lineItems.enumerated() {
                 let style = childStyles[ObjectIdentifier(child)] ?? CraftNativeLayoutStyle([:])
-                let size = lineSizes[index]
+                let size = distributed[index]
                 let childCross = axis == .horizontal ? size.height : size.width
+                let mainLeading = axis == .horizontal ? style.marginLeft : style.marginTop
+                let mainTrailing = axis == .horizontal ? style.marginRight : style.marginBottom
+                let crossLeading = axis == .horizontal ? style.marginTop : style.marginLeft
+                let crossTrailing = axis == .horizontal ? style.marginBottom : style.marginRight
                 let alignment = style.alignSelf ?? alignItems
-                let crossSize: CGFloat = alignment == "stretch" && styleCrossDimension(style) == nil ? lineCross : childCross
+                let crossSize: CGFloat = alignment == "stretch" && styleCrossDimension(style) == nil
+                    ? max(0, lineCross - crossLeading - crossTrailing) : childCross
                 let crossPosition: CGFloat
                 switch alignment {
-                case "center": crossPosition = (lineCross - crossSize) / 2
-                case "flex-end": crossPosition = lineCross - crossSize
-                default: crossPosition = 0
+                case "center": crossPosition = crossLeading + (lineCross - crossLeading - crossTrailing - crossSize) / 2
+                case "flex-end": crossPosition = lineCross - crossTrailing - crossSize
+                default: crossPosition = crossLeading
                 }
                 let frame: CGRect
                 if axis == .horizontal {
-                    frame = CGRect(x: content.minX + mainOffset, y: content.minY + crossOffset + crossPosition, width: size.width, height: crossSize)
+                    frame = CGRect(x: content.minX + mainOffset + mainLeading, y: content.minY + crossOffset + crossPosition, width: size.width, height: crossSize)
                 } else {
-                    frame = CGRect(x: content.minX + crossOffset + crossPosition, y: content.minY + mainOffset, width: crossSize, height: size.height)
+                    frame = CGRect(x: content.minX + crossOffset + crossPosition, y: content.minY + mainOffset + mainLeading, width: crossSize, height: size.height)
                 }
                 child.frame = frame.integral
-                mainOffset += (axis == .horizontal ? size.width : size.height) + mainGapValue + between
+                mainOffset += mainLeading + (axis == .horizontal ? size.width : size.height) + mainTrailing + mainGapValue + between
             }
             crossOffset += lineCross + crossGapValue
         }
@@ -195,9 +256,93 @@ private final class CraftNativeFlowView: UIStackView {
         }
     }
 
+    private func gridIntrinsicContentSize(_ children: [UIView]) -> CGSize {
+        let columns = max(1, gridColumns)
+        let horizontalGap = columnGap ?? gap
+        let verticalGap = rowGap ?? gap
+        var columnWidth: CGFloat = 0
+        var rowHeights: [CGFloat] = []
+        let flowChildren = children.filter {
+            (childStyles[ObjectIdentifier($0)] ?? CraftNativeLayoutStyle([:])).position != "absolute"
+        }
+        for (index, child) in flowChildren.enumerated() {
+            let style = childStyles[ObjectIdentifier(child)] ?? CraftNativeLayoutStyle([:])
+            let size = measuredSize(for: child, available: CGSize(width: 10_000, height: 10_000), style: style)
+            let row = index / columns
+            while rowHeights.count <= row { rowHeights.append(gridAutoRows ?? 0) }
+            columnWidth = max(columnWidth, size.width + style.marginLeft + style.marginRight)
+            rowHeights[row] = max(rowHeights[row], size.height + style.marginTop + style.marginBottom)
+        }
+        let width = padding.left + padding.right + CGFloat(columns) * columnWidth + CGFloat(max(0, columns - 1)) * horizontalGap
+        let height = padding.top + padding.bottom + rowHeights.reduce(0, +) + CGFloat(max(0, rowHeights.count - 1)) * verticalGap
+        return CGSize(width: width, height: height)
+    }
+
+    private func layoutGrid(content: CGRect) {
+        let children = subviews.filter { !$0.isHidden && !($0 is CraftNativeFlexSpacer) }
+        let flowChildren = children.filter {
+            (childStyles[ObjectIdentifier($0)] ?? CraftNativeLayoutStyle([:])).position != "absolute"
+        }
+        let columns = max(1, gridColumns)
+        let horizontalGap = columnGap ?? gap
+        let verticalGap = rowGap ?? gap
+        let cellWidth = max(0, (content.width - CGFloat(max(0, columns - 1)) * horizontalGap) / CGFloat(columns))
+        var rowHeights: [CGFloat] = []
+        var sizes: [CGSize] = []
+        for (index, child) in flowChildren.enumerated() {
+            let style = childStyles[ObjectIdentifier(child)] ?? CraftNativeLayoutStyle([:])
+            let size = measuredSize(
+                for: child,
+                available: CGSize(width: max(0, cellWidth - style.marginLeft - style.marginRight), height: content.height),
+                style: style
+            )
+            sizes.append(size)
+            let row = index / columns
+            while rowHeights.count <= row { rowHeights.append(gridAutoRows ?? 0) }
+            rowHeights[row] = max(rowHeights[row], size.height + style.marginTop + style.marginBottom)
+        }
+        var rowTop = content.minY
+        for (index, child) in flowChildren.enumerated() {
+            let style = childStyles[ObjectIdentifier(child)] ?? CraftNativeLayoutStyle([:])
+            let row = index / columns
+            let column = index % columns
+            let rowHeight = rowHeights[row]
+            let size = sizes[index]
+            let align = style.alignSelf ?? alignItems
+            let availableWidth = max(0, cellWidth - style.marginLeft - style.marginRight)
+            let availableHeight = max(0, rowHeight - style.marginTop - style.marginBottom)
+            let width = align == "stretch" && style.width == nil ? availableWidth : min(availableWidth, size.width)
+            let height = align == "stretch" && style.height == nil ? availableHeight : min(availableHeight, size.height)
+            let x = content.minX + CGFloat(column) * (cellWidth + horizontalGap) + style.marginLeft
+                + (align == "center" ? (availableWidth - width) / 2 : align == "flex-end" ? availableWidth - width : 0)
+            let y = rowTop + style.marginTop
+                + (align == "center" ? (availableHeight - height) / 2 : align == "flex-end" ? availableHeight - height : 0)
+            child.frame = CGRect(x: x, y: y, width: width, height: height).integral
+            if column == columns - 1 || index == flowChildren.count - 1 { rowTop += rowHeight + verticalGap }
+        }
+        for child in children {
+            let style = childStyles[ObjectIdentifier(child)] ?? CraftNativeLayoutStyle([:])
+            guard style.position == "absolute" else { continue }
+            let size = measuredSize(for: child, available: content.size, style: style)
+            let width = style.left != nil && style.right != nil ? max(0, content.width - (style.left ?? 0) - (style.right ?? 0)) : size.width
+            let height = style.top != nil && style.bottom != nil ? max(0, content.height - (style.top ?? 0) - (style.bottom ?? 0)) : size.height
+            let x = style.left ?? (style.right.map { content.width - $0 - width } ?? 0)
+            let y = style.top ?? (style.bottom.map { content.height - $0 - height } ?? 0)
+            child.frame = CGRect(x: content.minX + x, y: content.minY + y, width: width, height: height).integral
+        }
+    }
+
     private var mainGapValue: CGFloat { axis == .horizontal ? (columnGap ?? gap) : (rowGap ?? gap) }
     private var crossGapValue: CGFloat { axis == .horizontal ? (rowGap ?? 0) : (columnGap ?? 0) }
 
+    private func mainMargins(_ style: CraftNativeLayoutStyle) -> CGFloat {
+        axis == .horizontal ? style.marginLeft + style.marginRight : style.marginTop + style.marginBottom
+    }
+
+    private func crossMargins(_ style: CraftNativeLayoutStyle) -> CGFloat {
+        axis == .horizontal ? style.marginTop + style.marginBottom : style.marginLeft + style.marginRight
+    }
+
     private func styleCrossDimension(_ style: CraftNativeLayoutStyle) -> CGFloat? {
         axis == .horizontal ? style.height : style.width
     }
@@ -206,11 +351,31 @@ private final class CraftNativeFlowView: UIStackView {
         let style = style ?? childStyles[ObjectIdentifier(view)] ?? CraftNativeLayoutStyle([:])
         let intrinsic = view.intrinsicContentSize
         let fitted = view.sizeThatFits(available)
-        let width = style.width ?? (intrinsic.width > 0 && intrinsic.width != UIView.noIntrinsicMetric ? intrinsic.width : max(0, fitted.width))
-        let height = style.height ?? (intrinsic.height > 0 && intrinsic.height != UIView.noIntrinsicMetric ? intrinsic.height : max(0, fitted.height))
+        let width = (axis == .horizontal ? style.flexBasis : nil) ?? style.width ?? (intrinsic.width > 0 && intrinsic.width != UIView.noIntrinsicMetric ? intrinsic.width : max(0, fitted.width))
+        let height = (axis == .vertical ? style.flexBasis : nil) ?? style.height ?? (intrinsic.height > 0 && intrinsic.height != UIView.noIntrinsicMetric ? intrinsic.height : max(0, fitted.height))
         return CGSize(width: clamp(width, min: style.minWidth, max: style.maxWidth), height: clamp(height, min: style.minHeight, max: style.maxHeight))
     }
 
+    private func distributeMainAxisSizes(
+        _ sizes: [CGSize],
+        styles: [CraftNativeLayoutStyle],
+        available: CGFloat,
+        lineMain: CGFloat
+    ) -> [CGSize] {
+        let free = available - lineMain
+        let factors = free >= 0 ? styles.map(\.flexGrow) : styles.map(\.flexShrink)
+        let total = factors.reduce(0, +)
+        guard total > 0, free != 0 else { return sizes }
+        return sizes.enumerated().map { index, size in
+            let delta = free * factors[index] / total
+            let style = styles[index]
+            if axis == .horizontal {
+                return CGSize(width: clamp(max(0, size.width + delta), min: style.minWidth, max: style.maxWidth), height: size.height)
+            }
+            return CGSize(width: size.width, height: clamp(max(0, size.height + delta), min: style.minHeight, max: style.maxHeight))
+        }
+    }
+
     private func clamp(_ value: CGFloat, min lower: CGFloat?, max upper: CGFloat?) -> CGFloat {
         var result = value
         if let lower { result = max(result, lower) }
@@ -264,7 +429,60 @@ private final class CraftNativeScrollView: UIScrollView {
 
 private final class CraftNativeFlexSpacer: UIView {}
 
-final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate {
+private final class CraftNativeTextView: UITextView {
+    private let placeholderLabel = UILabel()
+    var placeholder: String? {
+        didSet { refreshPlaceholder() }
+    }
+    var placeholderColor: UIColor? {
+        didSet { placeholderLabel.textColor = placeholderColor ?? .placeholderText }
+    }
+    var placeholderFont: UIFont? {
+        didSet { placeholderLabel.font = placeholderFont ?? .systemFont(ofSize: 16) }
+    }
+
+    override init(frame: CGRect, textContainer: NSTextContainer?) {
+        super.init(frame: frame, textContainer: textContainer)
+        configurePlaceholder()
+    }
+
+    convenience init() {
+        self.init(frame: .zero, textContainer: nil)
+    }
+
+    required init?(coder: NSCoder) {
+        super.init(coder: coder)
+        configurePlaceholder()
+    }
+
+    override func layoutSubviews() {
+        super.layoutSubviews()
+        let inset = textContainerInset
+        let padding = textContainer.lineFragmentPadding
+        placeholderLabel.frame = CGRect(
+            x: inset.left + padding,
+            y: inset.top,
+            width: max(0, bounds.width - inset.left - inset.right - padding * 2),
+            height: max(0, bounds.height - inset.top - inset.bottom)
+        )
+    }
+
+    func refreshPlaceholder() {
+        placeholderLabel.text = placeholder
+        placeholderLabel.isHidden = !(text?.isEmpty ?? true) || placeholder?.isEmpty != false
+    }
+
+    private func configurePlaceholder() {
+        placeholderLabel.numberOfLines = 0
+        placeholderLabel.font = font
+        placeholderLabel.textColor = .placeholderText
+        placeholderLabel.isUserInteractionEnabled = false
+        addSubview(placeholderLabel)
+        refreshPlaceholder()
+    }
+}
+
+final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate, UITextFieldDelegate, UITextViewDelegate {
     private final class RenderedNode {
         let identity: String
         let type: String
@@ -290,15 +508,33 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
     private var handlers: [ObjectIdentifier: String] = [:]
     private var focusHandlers: [ObjectIdentifier: String] = [:]
     private var blurHandlers: [ObjectIdentifier: String] = [:]
+    private var endEditingHandlers: [ObjectIdentifier: String] = [:]
     private var submitHandlers: [ObjectIdentifier: String] = [:]
+    private var inputIdentities: [ObjectIdentifier: String] = [:]
+    private var inputDrafts: [String: String] = [:]
+    private var longPressHandlers: [ObjectIdentifier: String] = [:]
+    private var textMaxLengths: [ObjectIdentifier: Int] = [:]
     private var scrollHandlers: [ObjectIdentifier: String] = [:]
     private var scrollBeginHandlers: [ObjectIdentifier: String] = [:]
     private var scrollEndHandlers: [ObjectIdentifier: String] = [:]
+    private var scrollMomentumBeginHandlers: [ObjectIdentifier: String] = [:]
+    private var scrollMomentumEndHandlers: [ObjectIdentifier: String] = [:]
+    private var sliderCompleteHandlers: [ObjectIdentifier: String] = [:]
+    private var sliderSteps: [ObjectIdentifier: Float] = [:]
+    private var layoutHandlers: [ObjectIdentifier: String] = [:]
+    private var lastLayoutFrames: [ObjectIdentifier: CGRect] = [:]
     private var tapRecognizers: [ObjectIdentifier: UITapGestureRecognizer] = [:]
+    private var longPressRecognizers: [ObjectIdentifier: UILongPressGestureRecognizer] = [:]
     private var imageSources: [ObjectIdentifier: String] = [:]
     private var imageTasks: [ObjectIdentifier: URLSessionDataTask] = [:]
+    private var imageErrors: [ObjectIdentifier: String] = [:]
+    private var tintedImages = Set<ObjectIdentifier>()
+    private var imageLoadStartHandlers: [ObjectIdentifier: String] = [:]
+    private var imageLoadHandlers: [ObjectIdentifier: String] = [:]
+    private var imageLoadEndHandlers: [ObjectIdentifier: String] = [:]
+    private var imageErrorHandlers: [ObjectIdentifier: String] = [:]
     private var renderedRoot: RenderedNode?
-    private weak var lastFocusedInput: UITextField?
+    private weak var lastFocusedInput: UIView?
     private var flatListRows: [ObjectIdentifier: [String: RenderedNode]] = [:]
     private var flatListOwners: [String: String] = [:]
     private let mutationDocument = CraftNativeMutationDocument()
@@ -346,6 +582,38 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         observeNativeEvents()
     }
 
+    override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
+        super.traitCollectionDidChange(previousTraitCollection)
+        guard previousTraitCollection?.userInterfaceStyle != traitCollection.userInterfaceStyle else { return }
+        refreshTraitDefaults()
+    }
+
+    override func viewWillAppear(_ animated: Bool) {
+        super.viewWillAppear(animated)
+        refreshTraitDefaults()
+    }
+
+    private func refreshTraitDefaults() {
+        view.backgroundColor = config.resolvedBackgroundColor
+        if let document = mutationDocument.node("root") {
+            renderCommitted(document)
+        } else {
+            rootStack.setNeedsLayout()
+        }
+        refreshTraitDefaults(in: renderedRoot)
+    }
+
+    private func refreshTraitDefaults(in node: RenderedNode?) {
+        guard let node else { return }
+        (node.view as? CraftNativeFlatList)?.refreshThemeDefaults()
+        node.children.forEach { refreshTraitDefaults(in: $0) }
+    }
+
+    override func viewDidLayoutSubviews() {
+        super.viewDidLayoutSubviews()
+        emitLayoutEvents()
+    }
+
     private func setupJavaScript() {
         if let routeName = routeName {
             jsContext.setObject(routeName, forKeyedSubscript: "__stxNativeRoute" as NSString)
@@ -610,10 +878,12 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         let events = node["events"] as? [String: String] ?? [:]
         let children = node["children"] as? [Any] ?? []
         let current: RenderedNode
-        if let previous = previous, previous.identity == identity, previous.type == type {
+        let wantsMultilineTextView = type == "TextInput" && props["multiline"] as? Bool == true
+        let canReuseInput = type != "TextInput" || ((previous?.view is UITextView) == wantsMultilineTextView)
+        if let previous = previous, previous.identity == identity, previous.type == type, canReuseInput {
             current = previous
         } else {
-            current = RenderedNode(identity: identity, type: type, view: makeView(type))
+            current = RenderedNode(identity: identity, type: type, view: makeView(type, props: props))
         }
 
         let result = current.view
@@ -624,26 +894,68 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
             result.setContentHuggingPriority(.required, for: .vertical)
         }
         applyViewStyle(style, to: result, node: current)
+        updateLayoutHandler(events["onLayout"], for: result)
 
         switch type {
         case "Text":
             let label = result as! UILabel
+            label.numberOfLines = max(0, (props["numberOfLines"] as? NSNumber)?.intValue ?? 0)
+            label.lineBreakMode = textLineBreakMode(props["ellipsizeMode"])
             configureText(label, text: children.compactMap { $0 as? String }.joined(), style: style)
-        case "Button":
+        case "Button", "Link":
             let button = result as! UIButton
-            button.setTitle(props["title"] as? String ?? children.compactMap { $0 as? String }.joined(), for: .normal)
-            button.setTitleColor(color(style["color"]) ?? .systemBlue, for: .normal)
-            button.titleLabel?.font = textFont(
+            let title = props["title"] as? String ?? children.compactMap { $0 as? String }.joined()
+            let transformedTitle = transformedText(title, style: style)
+            let titleColor = color(props["color"]) ?? color(style["color"]) ?? .systemBlue
+            let font = textFont(
                 style,
-                default: button.titleLabel?.font ?? .systemFont(ofSize: UIFont.buttonFontSize)
+                default: .systemFont(ofSize: 16)
             )
-            updateHandler(events["onPress"] ?? events["onClick"], for: button)
+            button.setAttributedTitle(NSAttributedString(
+                string: transformedTitle,
+                attributes: buttonTitleAttributes(style, color: titleColor, font: font, forceUnderline: type == "Link")
+            ), for: .normal)
+            button.contentHorizontalAlignment = buttonAlignment(style["textAlign"])
+            button.isEnabled = props["disabled"] as? Bool != true
+            updateHandler(nonEmptyHandler(events["onPress"]) ?? nonEmptyHandler(events["onClick"]), for: button)
         case "TextInput":
+            if let textView = result as? UITextView {
+                inputIdentities[ObjectIdentifier(textView)] = current.identity
+                configureTextView(
+                    textView,
+                    props: props,
+                    style: style,
+                    events: events,
+                    defaultValue: previous?.view === textView
+                        ? nil
+                        : inputDrafts[current.identity] ?? props["defaultValue"] as? String
+                )
+                break
+            }
             let field = result as! UITextField
             field.placeholder = props["placeholder"] as? String
+            if let placeholder = field.placeholder,
+               let placeholderColor = color(props["placeholderTextColor"]) {
+                field.attributedPlaceholder = NSAttributedString(
+                    string: placeholder,
+                    attributes: [.foregroundColor: placeholderColor]
+                )
+            } else {
+                field.attributedPlaceholder = nil
+            }
+            field.tintColor = color(props["selectionColor"])
+            let fieldId = ObjectIdentifier(field)
+            inputIdentities[fieldId] = current.identity
+            if let maxLength = (props["maxLength"] as? NSNumber)?.intValue, maxLength > 0 {
+                textMaxLengths[fieldId] = maxLength
+            } else {
+                textMaxLengths.removeValue(forKey: fieldId)
+            }
+            field.delegate = self
             field.textColor = color(style["color"]) ?? .label
-            field.font = textFont(style, default: field.font ?? .systemFont(ofSize: UIFont.systemFontSize))
+            field.font = textFont(style, default: .systemFont(ofSize: 16))
             field.textAlignment = textAlignment(style["textAlign"])
+            field.defaultTextAttributes = inputTextAttributes(style, font: field.font ?? .systemFont(ofSize: 16), alignment: field.textAlignment)
             let desiredKeyboardType = keyboardType(props["keyboardType"])
             if field.keyboardType != desiredKeyboardType { field.keyboardType = desiredKeyboardType }
             let desiredReturnKeyType = returnKeyType(props["returnKeyType"])
@@ -656,26 +968,99 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
             if field.isSecureTextEntry != desiredSecureEntry { field.isSecureTextEntry = desiredSecureEntry }
             let desiredEnabled = props["editable"] as? Bool != false
             if field.isEnabled != desiredEnabled { field.isEnabled = desiredEnabled }
-            updateField(field, value: props["value"] as? String)
-            updateHandler(events["onChange"] ?? events["onChangeText"], for: field)
+            if let value = props["value"] as? String {
+                updateField(field, value: value)
+            } else if previous?.view !== field {
+                updateField(field, value: inputDrafts[current.identity] ?? props["defaultValue"] as? String)
+            }
+            updateHandler(nonEmptyHandler(events["onChange"]) ?? nonEmptyHandler(events["onChangeText"]), for: field)
             updateAuxiliaryHandler(events["onFocus"], in: &focusHandlers, for: field)
-            updateAuxiliaryHandler(events["onBlur"] ?? events["onEndEditing"], in: &blurHandlers, for: field)
+            updateAuxiliaryHandler(events["onBlur"], in: &blurHandlers, for: field)
+            updateAuxiliaryHandler(events["onEndEditing"], in: &endEditingHandlers, for: field)
             updateAuxiliaryHandler(events["onSubmitEditing"], in: &submitHandlers, for: field)
             if props["autoFocus"] as? Bool == true, !field.isFirstResponder {
                 DispatchQueue.main.async { _ = field.becomeFirstResponder() }
             }
+        case "Switch":
+            let toggle = result as! UISwitch
+            toggle.isOn = props["value"] as? Bool ?? props["checked"] as? Bool ?? false
+            toggle.isEnabled = props["disabled"] as? Bool != true
+            if let track = props["trackColor"] as? [String: Any] {
+                toggle.onTintColor = color(track["true"])
+                toggle.tintColor = color(track["false"])
+            } else {
+                toggle.onTintColor = nil
+                toggle.tintColor = nil
+            }
+            toggle.thumbTintColor = color(props["thumbColor"])
+            if let background = color(props["ios_backgroundColor"]) { toggle.tintColor = background }
+            updateHandler(nonEmptyHandler(events["onValueChange"]) ?? nonEmptyHandler(events["onChange"]), for: toggle)
+        case "Slider":
+            let slider = result as! UISlider
+            slider.minimumValue = (props["minimumValue"] as? NSNumber)?.floatValue ?? 0
+            slider.maximumValue = max(slider.minimumValue + .leastNonzeroMagnitude, (props["maximumValue"] as? NSNumber)?.floatValue ?? 1)
+            let value = (props["value"] as? NSNumber)?.floatValue ?? slider.minimumValue
+            if let step = (props["step"] as? NSNumber)?.floatValue, step > 0 { sliderSteps[ObjectIdentifier(slider)] = step }
+            else { sliderSteps.removeValue(forKey: ObjectIdentifier(slider)) }
+            slider.value = snappedSliderValue(value, for: slider)
+            slider.minimumTrackTintColor = color(props["minimumTrackTintColor"])
+            slider.maximumTrackTintColor = color(props["maximumTrackTintColor"])
+            slider.thumbTintColor = color(props["thumbTintColor"])
+            slider.isEnabled = props["disabled"] as? Bool != true
+            updateHandler(nonEmptyHandler(events["onValueChange"]) ?? nonEmptyHandler(events["onChange"]), for: slider)
+            updateAuxiliaryHandler(events["onSlidingComplete"], in: &sliderCompleteHandlers, for: slider)
+        case "ActivityIndicator":
+            let indicator = result as! UIActivityIndicatorView
+            let requestedSize = props["size"]
+            indicator.style = (requestedSize as? String) == "large" ? .large : .medium
+            let scale: CGFloat
+            if let numericSize = requestedSize as? NSNumber {
+                scale = max(0.5, CGFloat(numericSize.doubleValue / 20.0))
+            } else if (requestedSize as? String) == "small" {
+                scale = 0.75
+            } else {
+                scale = 1
+            }
+            indicator.transform = CGAffineTransform(scaleX: scale, y: scale)
+            indicator.color = color(props["color"]) ?? .tintColor
+            indicator.hidesWhenStopped = props["hidesWhenStopped"] as? Bool ?? true
+            if props["animating"] as? Bool == false {
+                indicator.stopAnimating()
+            } else {
+                indicator.startAnimating()
+            }
         case "Image":
             let image = result as! UIImageView
-            image.contentMode = imageContentMode(style["resizeMode"] ?? props["resizeMode"])
+            let imageID = ObjectIdentifier(image)
+            if let tint = color(style["tintColor"]) {
+                tintedImages.insert(imageID)
+                image.tintColor = tint
+            } else {
+                tintedImages.remove(imageID)
+                image.tintColor = nil
+            }
+            if let current = image.image { image.image = imageForDisplay(current, view: image) }
+            let requestedResizeMode = style["resizeMode"] as? String ?? props["resizeMode"] as? String
+            image.contentMode = imageContentMode(requestedResizeMode)
             image.clipsToBounds = image.contentMode == .scaleAspectFill
+            updateAuxiliaryHandler(events["onLoadStart"], in: &imageLoadStartHandlers, for: image)
+            updateAuxiliaryHandler(events["onLoad"], in: &imageLoadHandlers, for: image)
+            updateAuxiliaryHandler(events["onLoadEnd"], in: &imageLoadEndHandlers, for: image)
+            updateAuxiliaryHandler(events["onError"], in: &imageErrorHandlers, for: image)
             updateImage(image, source: props["source"])
         case "ScrollView":
             let scroll = result as! CraftNativeScrollView
-            let direction = (props["horizontal"] as? Bool) == true || style["flexDirection"] as? String == "row"
+            let flexDirection = style["flexDirection"] as? String
+            let direction = (props["horizontal"] as? Bool) == true
+                || flexDirection == "row"
+                || flexDirection == "row-reverse"
                 ? NSLayoutConstraint.Axis.horizontal : .vertical
             scroll.setAxis(direction)
             scroll.delegate = self
             scroll.isScrollEnabled = props["scrollEnabled"] as? Bool != false
+            scroll.bounces = props["bounces"] as? Bool ?? true
+            scroll.isPagingEnabled = props["pagingEnabled"] as? Bool ?? false
+            scroll.keyboardDismissMode = keyboardDismissMode(props["keyboardDismissMode"])
             scroll.showsVerticalScrollIndicator = props["showsVerticalScrollIndicator"] as? Bool != false
             scroll.showsHorizontalScrollIndicator = props["showsHorizontalScrollIndicator"] as? Bool != false
             scroll.alwaysBounceVertical = props["alwaysBounceVertical"] as? Bool ?? (direction == .vertical)
@@ -683,6 +1068,8 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
             updateAuxiliaryHandler(events["onScroll"], in: &scrollHandlers, for: scroll)
             updateAuxiliaryHandler(events["onScrollBeginDrag"], in: &scrollBeginHandlers, for: scroll)
             updateAuxiliaryHandler(events["onScrollEndDrag"], in: &scrollEndHandlers, for: scroll)
+            updateAuxiliaryHandler(events["onMomentumScrollBegin"], in: &scrollMomentumBeginHandlers, for: scroll)
+            updateAuxiliaryHandler(events["onMomentumScrollEnd"], in: &scrollMomentumEndHandlers, for: scroll)
             configureStack(scroll.contentStack, style: style)
             reconcileChildren(children, in: scroll.contentStack, parent: current, path: path, style: style)
         case "FlatList":
@@ -700,24 +1087,30 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
             configureStack(stack, style: style)
             reconcileChildren(children, in: stack, parent: current, path: path, style: style)
         }
-        if type != "Button" && type != "TextInput" {
-            updatePressHandler(events["onPress"] ?? events["onClick"], for: result)
+        updateLongPressHandler(events["onLongPress"], for: result)
+        if type != "Button" && type != "Link" && type != "TextInput" && type != "Switch" && type != "Slider" && type != "ActivityIndicator" {
+            updatePressHandler(nonEmptyHandler(events["onPress"]) ?? nonEmptyHandler(events["onClick"]), for: result)
         }
         applyAccessibility(props, type: type, to: result)
         return current
     }
 
-    private func makeView(_ type: String) -> UIView {
+    private func makeView(_ type: String, props: [String: Any]) -> UIView {
         switch type {
         case "Text":
             let label = UILabel()
             label.numberOfLines = 0
             return label
-        case "Button":
+        case "Button", "Link":
             let button = UIButton(type: .system)
             button.addTarget(self, action: #selector(buttonPressed(_:)), for: .touchUpInside)
             return button
         case "TextInput":
+            if props["multiline"] as? Bool == true {
+                let textView = CraftNativeTextView()
+                textView.delegate = self
+                return textView
+            }
             let field = UITextField()
             field.borderStyle = .roundedRect
             field.addTarget(self, action: #selector(textChanged(_:)), for: .editingChanged)
@@ -725,12 +1118,25 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
             field.addTarget(self, action: #selector(textBlurred(_:)), for: .editingDidEnd)
             field.addTarget(self, action: #selector(textSubmitted(_:)), for: .editingDidEndOnExit)
             return field
+        case "Switch":
+            let toggle = UISwitch()
+            toggle.addTarget(self, action: #selector(switchChanged(_:)), for: .valueChanged)
+            return toggle
+        case "Slider":
+            let slider = UISlider()
+            slider.addTarget(self, action: #selector(sliderChanged(_:)), for: .valueChanged)
+            slider.addTarget(self, action: #selector(sliderFinished(_:)), for: [.touchUpInside, .touchUpOutside, .touchCancel])
+            return slider
+        case "ActivityIndicator":
+            return UIActivityIndicatorView(style: .medium)
         case "Image":
             return UIImageView()
         case "ScrollView":
             return CraftNativeScrollView()
         case "FlatList":
             return CraftNativeFlatList()
+        case "View", "SafeAreaView":
+            return CraftNativeFlowView()
         default:
             return CraftNativeFlowView()
         }
@@ -805,6 +1211,23 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         let owner = parent.protocolId ?? path
         flatListOwners = flatListOwners.filter { $0.value != owner }
         for child in children { registerFlatListOwnership(child, owner: owner) }
+        list.bounces = props["bounces"] as? Bool ?? true
+        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) ?? [:]]) }
+        }
+        list.onScrollBeginDrag = nonEmptyHandler(events["onScrollBeginDrag"]).map { handler in
+            { [weak self] scrollView in self?.send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": self?.scrollEvent(scrollView) ?? [:]]) }
+        }
+        list.onScrollEndDrag = nonEmptyHandler(events["onScrollEndDrag"]).map { handler in
+            { [weak self] scrollView in self?.send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": self?.scrollEvent(scrollView) ?? [:]]) }
+        }
+        list.onMomentumScrollBegin = nonEmptyHandler(events["onMomentumScrollBegin"]).map { handler in
+            { [weak self] scrollView in self?.send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": self?.scrollEvent(scrollView) ?? [:]]) }
+        }
+        list.onMomentumScrollEnd = nonEmptyHandler(events["onMomentumScrollEnd"]).map { handler in
+            { [weak self] scrollView in self?.send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": self?.scrollEvent(scrollView) ?? [:]]) }
+        }
 
         list.apply(
             nodes: children,
@@ -823,15 +1246,18 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
                     path: "\(path).\(identity)",
                     previous: previous
                 )
+                if let previous, previous.view !== next.view {
+                    self.forgetHandlers(previous)
+                }
                 self.flatListRows[listKey, default: [:]][identity] = next
                 return next.view
             },
             recycleItem: { [weak self] identity in
                 guard let self = self,
                       let row = self.flatListRows[listKey]?.removeValue(forKey: identity) else { return }
-                self.forgetHandlers(row)
+                self.forgetHandlers(row, preservingInputDrafts: true)
             },
-            endReached: events["onEndReached"].map { [weak self] handler in
+            endReached: nonEmptyHandler(events["onEndReached"]).map { [weak self] handler in
                 { self?.send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]]) }
             }
         )
@@ -855,7 +1281,7 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         node.view.removeFromSuperview()
     }
 
-    private func forgetHandlers(_ node: RenderedNode) {
+    private func forgetHandlers(_ node: RenderedNode, preservingInputDrafts: Bool = false) {
         if let list = node.view as? CraftNativeFlatList {
             let listKey = ObjectIdentifier(list)
             list.discardAll()
@@ -864,26 +1290,92 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         }
         let id = ObjectIdentifier(node.view)
         handlers.removeValue(forKey: id)
+        layoutHandlers.removeValue(forKey: id)
+        lastLayoutFrames.removeValue(forKey: id)
         focusHandlers.removeValue(forKey: id)
         blurHandlers.removeValue(forKey: id)
+        endEditingHandlers.removeValue(forKey: id)
         submitHandlers.removeValue(forKey: id)
+        inputIdentities.removeValue(forKey: id)
+        if node.type == "TextInput" && !preservingInputDrafts { inputDrafts.removeValue(forKey: node.identity) }
+        longPressHandlers.removeValue(forKey: id)
+        textMaxLengths.removeValue(forKey: id)
         scrollHandlers.removeValue(forKey: id)
         scrollBeginHandlers.removeValue(forKey: id)
         scrollEndHandlers.removeValue(forKey: id)
+        scrollMomentumBeginHandlers.removeValue(forKey: id)
+        scrollMomentumEndHandlers.removeValue(forKey: id)
+        sliderCompleteHandlers.removeValue(forKey: id)
+        sliderSteps.removeValue(forKey: id)
         if let recognizer = tapRecognizers.removeValue(forKey: id) {
             node.view.removeGestureRecognizer(recognizer)
         }
+        if let recognizer = longPressRecognizers.removeValue(forKey: id) {
+            node.view.removeGestureRecognizer(recognizer)
+        }
         imageSources.removeValue(forKey: id)
         imageTasks.removeValue(forKey: id)?.cancel()
-        for child in node.children { forgetHandlers(child) }
+        imageErrors.removeValue(forKey: id)
+        tintedImages.remove(id)
+        imageLoadStartHandlers.removeValue(forKey: id)
+        imageLoadHandlers.removeValue(forKey: id)
+        imageLoadEndHandlers.removeValue(forKey: id)
+        imageErrorHandlers.removeValue(forKey: id)
+        for child in node.children { forgetHandlers(child, preservingInputDrafts: preservingInputDrafts) }
     }
 
     private func updateHandler(_ handler: String?, for view: UIView) {
         let id = ObjectIdentifier(view)
-        if let handler = handler { handlers[id] = handler }
+        if let handler, !handler.isEmpty { handlers[id] = handler }
         else { handlers.removeValue(forKey: id) }
     }
 
+    private func snappedSliderValue(_ value: Float, for slider: UISlider) -> Float {
+        let bounded = min(slider.maximumValue, max(slider.minimumValue, value))
+        guard let step = sliderSteps[ObjectIdentifier(slider)], step > 0 else { return bounded }
+        let steps = ((bounded - slider.minimumValue) / step).rounded()
+        return min(slider.maximumValue, max(slider.minimumValue, slider.minimumValue + steps * step))
+    }
+
+    private func updateLayoutHandler(_ handler: String?, for view: UIView) {
+        let id = ObjectIdentifier(view)
+        guard let handler, !handler.isEmpty else {
+            layoutHandlers.removeValue(forKey: id)
+            lastLayoutFrames.removeValue(forKey: id)
+            return
+        }
+        if layoutHandlers[id] != handler { lastLayoutFrames.removeValue(forKey: id) }
+        layoutHandlers[id] = handler
+    }
+
+    private func emitLayoutEvents() {
+        guard let renderedRoot else { return }
+        emitLayoutEvents(for: renderedRoot)
+    }
+
+    private func emitLayoutEvents(for node: RenderedNode) {
+        let id = ObjectIdentifier(node.view)
+        if let handler = layoutHandlers[id], node.view.window != nil {
+            let frame = node.view.frame
+            if lastLayoutFrames[id] != frame {
+                lastLayoutFrames[id] = frame
+                send(type: "EVENT", payload: [
+                    "handlerName": handler,
+                    "nativeEvent": ["layout": [
+                        "x": frame.minX,
+                        "y": frame.minY,
+                        "width": frame.width,
+                        "height": frame.height,
+                    ]],
+                ])
+            }
+        }
+        for child in node.children { emitLayoutEvents(for: child) }
+        if let list = node.view as? CraftNativeFlatList {
+            flatListRows[ObjectIdentifier(list)]?.values.forEach { emitLayoutEvents(for: $0) }
+        }
+    }
+
     private func updateAuxiliaryHandler(
         _ handler: String?,
         in handlers: inout [ObjectIdentifier: String],
@@ -894,8 +1386,14 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         else { handlers.removeValue(forKey: id) }
     }
 
+    private func nonEmptyHandler(_ handler: String?) -> String? {
+        guard let handler, !handler.isEmpty else { return nil }
+        return handler
+    }
+
     private func updatePressHandler(_ handler: String?, for view: UIView) {
         let id = ObjectIdentifier(view)
+        let handler = handler?.isEmpty == false ? handler : nil
         updateHandler(handler, for: view)
         if handler != nil, tapRecognizers[id] == nil {
             let recognizer = UITapGestureRecognizer(target: self, action: #selector(viewPressed(_:)))
@@ -904,7 +1402,26 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         } else if handler == nil, let recognizer = tapRecognizers.removeValue(forKey: id) {
             view.removeGestureRecognizer(recognizer)
         }
-        if view is UIImageView { view.isUserInteractionEnabled = handler != nil }
+        if !(view is UIScrollView) { view.isUserInteractionEnabled = handler != nil || longPressHandlers[id] != nil }
+    }
+
+    private func updateLongPressHandler(_ handler: String?, for view: UIView) {
+        let id = ObjectIdentifier(view)
+        if let handler, !handler.isEmpty {
+            longPressHandlers[id] = handler
+            if !(view is UIScrollView) { view.isUserInteractionEnabled = true }
+            if longPressRecognizers[id] == nil {
+                let recognizer = UILongPressGestureRecognizer(target: self, action: #selector(viewLongPressed(_:)))
+                longPressRecognizers[id] = recognizer
+                view.addGestureRecognizer(recognizer)
+            }
+        } else {
+            longPressHandlers.removeValue(forKey: id)
+            if let recognizer = longPressRecognizers.removeValue(forKey: id) {
+                view.removeGestureRecognizer(recognizer)
+            }
+            if !(view is UIScrollView) { view.isUserInteractionEnabled = handlers[id] != nil }
+        }
     }
 
     private func updateField(_ field: UITextField, value: String?) {
@@ -920,15 +1437,86 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         }
     }
 
+    private func updateTextView(_ textView: UITextView, value: String?) {
+        guard let value = value, textView.text != value, textView.markedTextRange == nil else { return }
+        let selection = textView.selectedTextRange
+        let start = selection.map { textView.offset(from: textView.beginningOfDocument, to: $0.start) }
+        let end = selection.map { textView.offset(from: textView.beginningOfDocument, to: $0.end) }
+        textView.text = value
+        if let start = start, let end = end,
+           let from = textView.position(from: textView.beginningOfDocument, offset: min(start, value.utf16.count)),
+           let to = textView.position(from: textView.beginningOfDocument, offset: min(end, value.utf16.count)) {
+            textView.selectedTextRange = textView.textRange(from: from, to: to)
+        }
+    }
+
+    private func configureTextView(
+        _ textView: UITextView,
+        props: [String: Any],
+        style: [String: Any],
+        events: [String: String],
+        defaultValue: String?
+    ) {
+        let id = ObjectIdentifier(textView)
+        textView.delegate = self
+        textView.textColor = color(style["color"]) ?? .label
+        textView.font = textFont(style, default: .systemFont(ofSize: 16))
+        textView.textAlignment = textAlignment(style["textAlign"])
+        textView.tintColor = color(props["selectionColor"])
+        textView.keyboardType = keyboardType(props["keyboardType"])
+        textView.returnKeyType = returnKeyType(props["returnKeyType"])
+        textView.autocorrectionType = props["autoCorrect"] as? Bool == false ? .no : .default
+        textView.autocapitalizationType = capitalizationType(props["autoCapitalize"])
+        textView.isSecureTextEntry = props["secureTextEntry"] as? Bool == true
+        textView.isEditable = props["editable"] as? Bool != false
+        textView.isScrollEnabled = false
+        if let numberOfLines = (props["numberOfLines"] as? NSNumber)?.intValue, numberOfLines > 0 {
+            textView.textContainer.maximumNumberOfLines = numberOfLines
+        } else {
+            textView.textContainer.maximumNumberOfLines = 0
+        }
+        if let maxLength = (props["maxLength"] as? NSNumber)?.intValue, maxLength > 0 {
+            textMaxLengths[id] = maxLength
+        } else {
+            textMaxLengths.removeValue(forKey: id)
+        }
+        if let craftTextView = textView as? CraftNativeTextView {
+            craftTextView.placeholder = props["placeholder"] as? String
+            craftTextView.placeholderColor = color(props["placeholderTextColor"])
+            craftTextView.placeholderFont = textView.font
+        }
+        updateTextView(textView, value: (props["value"] as? String) ?? defaultValue)
+        let selectedRange = textView.selectedRange
+        let attributes = inputTextAttributes(style, font: textView.font ?? .systemFont(ofSize: 16), alignment: textView.textAlignment)
+        textView.typingAttributes = attributes
+        if !textView.text.isEmpty {
+            textView.attributedText = NSAttributedString(string: textView.text, attributes: attributes)
+            textView.selectedRange = selectedRange
+        }
+        (textView as? CraftNativeTextView)?.refreshPlaceholder()
+        updateHandler(nonEmptyHandler(events["onChange"]) ?? nonEmptyHandler(events["onChangeText"]), for: textView)
+        updateAuxiliaryHandler(events["onFocus"], in: &focusHandlers, for: textView)
+        updateAuxiliaryHandler(events["onBlur"], in: &blurHandlers, for: textView)
+        updateAuxiliaryHandler(events["onEndEditing"], in: &endEditingHandlers, for: textView)
+        updateAuxiliaryHandler(events["onSubmitEditing"], in: &submitHandlers, for: textView)
+        if props["autoFocus"] as? Bool == true, !textView.isFirstResponder {
+            DispatchQueue.main.async { _ = textView.becomeFirstResponder() }
+        }
+    }
+
     private func configureStack(_ stack: CraftNativeFlowView, style: [String: Any]) {
         let direction = style["flexDirection"] as? String
         stack.axis = direction == "row" || direction == "row-reverse" ? .horizontal : .vertical
         stack.wrap = style["flexWrap"] as? String == "wrap" || style["flexWrap"] as? Bool == true
         stack.alignItems = style["alignItems"] as? String ?? "stretch"
         stack.justifyContent = style["justifyContent"] as? String ?? "flex-start"
-        stack.gap = number(style["gap"]) ?? 0
-        stack.rowGap = number(style["rowGap"])
-        stack.columnGap = number(style["columnGap"])
+        let gap = number(style["gap"]) ?? 0
+        stack.gap = gap
+        stack.rowGap = number(style["rowGap"]) ?? gap
+        stack.columnGap = number(style["columnGap"]) ?? gap
+        stack.grid = style["display"] as? String == "grid"
+        stack.gridColumns = craftNativeGridColumnCount(style["gridTemplateColumns"] ?? style["gridColumns"])
+        stack.gridAutoRows = number(style["gridAutoRows"])
         let padding = number(style["padding"]) ?? 0
         let horizontal = number(style["paddingHorizontal"]) ?? padding
         let vertical = number(style["paddingVertical"]) ?? padding
@@ -953,19 +1541,19 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         view.layer.cornerRadius = number(style["borderRadius"]) ?? 0
         view.layer.borderWidth = number(style["borderWidth"]) ?? 0
         view.layer.borderColor = (color(style["borderColor"]) ?? .clear).cgColor
+        let elevation = max(0, number(style["elevation"]) ?? 0)
+        view.layer.shadowColor = UIColor.black.cgColor
+        view.layer.shadowOpacity = elevation > 0 ? Float(min(0.28, 0.12 + elevation * 0.02)) : 0
+        view.layer.shadowRadius = elevation * 0.5
+        view.layer.shadowOffset = CGSize(width: 0, height: elevation * 0.25)
         view.clipsToBounds = style["overflow"] as? String == "hidden"
+        view.layer.masksToBounds = view.clipsToBounds
     }
 
     private func configureText(_ label: UILabel, text: String, style: [String: Any]) {
-        let transformed: String
-        switch style["textTransform"] as? String {
-        case "uppercase": transformed = text.uppercased()
-        case "lowercase": transformed = text.lowercased()
-        case "capitalize": transformed = text.capitalized
-        default: transformed = text
-        }
+        let transformed = transformedText(text, style: style)
         label.textColor = color(style["color"]) ?? .label
-        label.font = textFont(style, default: .systemFont(ofSize: UIFont.systemFontSize))
+        label.font = textFont(style, default: .systemFont(ofSize: 16))
         label.textAlignment = textAlignment(style["textAlign"])
         var attributes: [NSAttributedString.Key: Any] = [:]
         if let spacing = number(style["letterSpacing"]) { attributes[.kern] = spacing }
@@ -988,6 +1576,85 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         if attributes.isEmpty { label.text = transformed }
     }
 
+    private func textLineBreakMode(_ value: Any?) -> NSLineBreakMode {
+        switch value as? String {
+        case "head": return .byTruncatingHead
+        case "middle": return .byTruncatingMiddle
+        case "tail": return .byTruncatingTail
+        case "clip": return .byClipping
+        default: return .byTruncatingTail
+        }
+    }
+
+    private func buttonTitleAttributes(
+        _ style: [String: Any],
+        color: UIColor,
+        font: UIFont,
+        forceUnderline: Bool
+    ) -> [NSAttributedString.Key: Any] {
+        var attributes: [NSAttributedString.Key: Any] = [
+            .foregroundColor: color,
+            .font: font,
+        ]
+        if let spacing = number(style["letterSpacing"]) { attributes[.kern] = spacing }
+        if let lineHeight = number(style["lineHeight"]) {
+            let paragraph = NSMutableParagraphStyle()
+            paragraph.minimumLineHeight = lineHeight
+            paragraph.maximumLineHeight = lineHeight
+            attributes[.paragraphStyle] = paragraph
+        }
+        switch style["textDecorationLine"] as? String {
+        case "underline": attributes[.underlineStyle] = NSUnderlineStyle.single.rawValue
+        case "line-through": attributes[.strikethroughStyle] = NSUnderlineStyle.single.rawValue
+        case "underline line-through":
+            attributes[.underlineStyle] = NSUnderlineStyle.single.rawValue
+            attributes[.strikethroughStyle] = NSUnderlineStyle.single.rawValue
+        default: break
+        }
+        if forceUnderline { attributes[.underlineStyle] = NSUnderlineStyle.single.rawValue }
+        return attributes
+    }
+
+    private func inputTextAttributes(
+        _ style: [String: Any],
+        font: UIFont,
+        alignment: NSTextAlignment
+    ) -> [NSAttributedString.Key: Any] {
+        var attributes: [NSAttributedString.Key: Any] = [
+            .foregroundColor: color(style["color"]) ?? .label,
+            .font: font,
+        ]
+        if let spacing = number(style["letterSpacing"]) { attributes[.kern] = spacing }
+        if let lineHeight = number(style["lineHeight"]) {
+            let paragraph = NSMutableParagraphStyle()
+            paragraph.minimumLineHeight = lineHeight
+            paragraph.maximumLineHeight = lineHeight
+            paragraph.alignment = alignment
+            attributes[.paragraphStyle] = paragraph
+        }
+        switch style["textDecorationLine"] as? String {
+        case "underline": attributes[.underlineStyle] = NSUnderlineStyle.single.rawValue
+        case "line-through": attributes[.strikethroughStyle] = NSUnderlineStyle.single.rawValue
+        case "underline line-through":
+            attributes[.underlineStyle] = NSUnderlineStyle.single.rawValue
+            attributes[.strikethroughStyle] = NSUnderlineStyle.single.rawValue
+        default: break
+        }
+        return attributes
+    }
+
+    private func transformedText(_ text: String, style: [String: Any]) -> String {
+        switch style["textTransform"] as? String {
+        case "uppercase": return text.uppercased()
+        case "lowercase": return text.lowercased()
+        case "capitalize": return text.split(separator: " ", omittingEmptySubsequences: false).map { word in
+            guard let first = word.first else { return String(word) }
+            return String(first).uppercased() + String(word.dropFirst())
+        }.joined(separator: " ")
+        default: return text
+        }
+    }
+
     private func textFont(_ style: [String: Any], default fallback: UIFont) -> UIFont {
         let size = number(style["fontSize"]) ?? fallback.pointSize
         let weight: UIFont.Weight
@@ -1021,6 +1688,15 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         }
     }
 
+    private func buttonAlignment(_ value: Any?) -> UIControl.ContentHorizontalAlignment {
+        switch value as? String {
+        case "left": return .left
+        case "right": return .right
+        case "center": return .center
+        default: return .center
+        }
+    }
+
     private func imageContentMode(_ value: Any?) -> UIView.ContentMode {
         switch value as? String {
         case "cover": return .scaleAspectFill
@@ -1030,6 +1706,14 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         }
     }
 
+    private func keyboardDismissMode(_ value: Any?) -> UIScrollView.KeyboardDismissMode {
+        switch value as? String {
+        case "on-drag": return .onDrag
+        case "interactive": return .interactive
+        default: return .none
+        }
+    }
+
     private func updateImage(_ view: UIImageView, source: Any?) {
         let uri = (source as? String) ?? (source as? [String: Any])?["uri"] as? String
         let id = ObjectIdentifier(view)
@@ -1042,8 +1726,10 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         guard imageSources[id] != uri else { return }
         imageTasks.removeValue(forKey: id)?.cancel()
         imageSources[id] = uri
+        imageErrors.removeValue(forKey: id)
         view.image = nil
         view.accessibilityValue = nil
+        emitImageEvent(view, handler: imageLoadStartHandlers[id])
 
         if uri.hasPrefix("data:image/") {
             guard let comma = uri.firstIndex(of: ","),
@@ -1052,7 +1738,9 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
                 imageFailure(view, uri: uri, message: "Image data is invalid")
                 return
             }
-            view.image = image
+            view.image = imageForDisplay(image, view: view)
+            emitImageEvent(view, handler: imageLoadHandlers[id])
+            emitImageEvent(view, handler: imageLoadEndHandlers[id])
             return
         }
         if let url = URL(string: uri), url.scheme == "https" {
@@ -1065,7 +1753,9 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
                         self.imageFailure(view, uri: uri, message: "Image download failed")
                         return
                     }
-                    view.image = image
+                    view.image = self.imageForDisplay(image, view: view)
+                    self.emitImageEvent(view, handler: self.imageLoadHandlers[ObjectIdentifier(view)])
+                    self.emitImageEvent(view, handler: self.imageLoadEndHandlers[ObjectIdentifier(view)])
                 }
             }
             imageTasks[id] = task
@@ -1077,26 +1767,48 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
                 imageFailure(view, uri: uri, message: "Bundled image was not found")
                 return
             }
-            view.image = image
+            view.image = imageForDisplay(image, view: view)
+            emitImageEvent(view, handler: imageLoadHandlers[id])
+            emitImageEvent(view, handler: imageLoadEndHandlers[id])
             return
         }
         imageFailure(view, uri: uri, message: "Unsupported image source")
     }
 
     private func imageFailure(_ view: UIImageView, uri: String?, message: String) {
+        imageErrors[ObjectIdentifier(view)] = message
         view.image = nil
         view.accessibilityValue = message
+        let id = ObjectIdentifier(view)
+        emitImageEvent(view, handler: imageErrorHandlers[id], nativeEvent: ["error": ["message": message]])
+        emitImageEvent(view, handler: imageLoadEndHandlers[id])
         NSLog("[craft native] %@: %@", message, uri ?? "<missing>")
     }
 
+    private func imageForDisplay(_ image: UIImage, view: UIImageView) -> UIImage {
+        image.withRenderingMode(tintedImages.contains(ObjectIdentifier(view)) ? .alwaysTemplate : .alwaysOriginal)
+    }
+
+    private func emitImageEvent(
+        _ view: UIImageView,
+        handler: String?,
+        nativeEvent: [String: Any] = [:]
+    ) {
+        guard let handler, !handler.isEmpty else { return }
+        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": nativeEvent])
+    }
+
     private func applyAccessibility(_ props: [String: Any], type: String, to view: UIView) {
-        view.accessibilityLabel = props["accessibilityLabel"] as? String
+        view.accessibilityLabel = (props["accessibilityLabel"] as? String)
+            ?? (type == "Image" ? 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
+        } else if type != "TextInput" {
+            view.accessibilityValue = nil
         }
         let role = props["accessibilityRole"] as? String
-        view.isAccessibilityElement = role != "none" && (view.accessibilityLabel != nil || role != nil || ["Text", "Button", "Image", "TextInput"].contains(type))
+        view.isAccessibilityElement = role != "none" && (view.accessibilityLabel != nil || role != nil || ["Text", "Button", "Link", "Image", "TextInput", "Switch", "Slider"].contains(type))
         var traits: UIAccessibilityTraits = []
         switch role ?? type.lowercased() {
         case "button": traits.insert(.button)
@@ -1107,11 +1819,24 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         default: break
         }
         if let state = props["accessibilityState"] as? [String: Any] {
-            if state["disabled"] as? Bool == true { traits.insert(.notEnabled) }
+            if state["disabled"] as? Bool == true {
+                traits.insert(.notEnabled)
+                if let control = view as? UIControl {
+                    control.isEnabled = false
+                } else if handlers[ObjectIdentifier(view)] != nil || longPressHandlers[ObjectIdentifier(view)] != nil {
+                    view.isUserInteractionEnabled = false
+                }
+            }
             if state["selected"] as? Bool == true { traits.insert(.selected) }
             if state["checked"] as? Bool == true { traits.insert(.selected) }
         }
         if let control = view as? UIControl, !control.isEnabled { traits.insert(.notEnabled) }
+        if type == "Image", let message = imageErrors[ObjectIdentifier(view)] {
+            let current = view.accessibilityValue
+            if current?.contains(message) != true {
+                view.accessibilityValue = [current, message].compactMap { $0 }.joined(separator: ", ")
+            }
+        }
         view.accessibilityTraits = traits
     }
 
@@ -1138,10 +1863,55 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         }
     }
 
+    func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool {
+        guard let maxLength = textMaxLengths[ObjectIdentifier(textField)],
+              let current = textField.text,
+              let stringRange = Range(range, in: current) else { return true }
+        return current.replacingCharacters(in: stringRange, with: string).utf16.count <= maxLength
+    }
+
+    func textView(_ textView: UITextView, shouldChangeTextIn range: NSRange, replacementText text: String) -> Bool {
+        if text == "\n", let handler = submitHandlers[ObjectIdentifier(textView)] {
+            send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": ["text": textView.text ?? ""]])
+        }
+        guard let maxLength = textMaxLengths[ObjectIdentifier(textView)],
+              let current = textView.text,
+              let stringRange = Range(range, in: current) else { return true }
+        return current.replacingCharacters(in: stringRange, with: text).utf16.count <= maxLength
+    }
+
+    func textViewDidChange(_ textView: UITextView) {
+        lastFocusedInput = textView
+        let id = ObjectIdentifier(textView)
+        inputIdentities[id].map { inputDrafts[$0] = textView.text ?? "" }
+        (textView as? CraftNativeTextView)?.refreshPlaceholder()
+        guard let handler = handlers[id] else { return }
+        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": ["text": textView.text ?? ""]])
+    }
+
+    func textViewDidBeginEditing(_ textView: UITextView) {
+        lastFocusedInput = textView
+        guard let handler = focusHandlers[ObjectIdentifier(textView)] else { return }
+        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": ["text": textView.text ?? ""]])
+    }
+
+    func textViewDidEndEditing(_ textView: UITextView) {
+        let id = ObjectIdentifier(textView)
+        let nativeEvent: [String: Any] = ["text": textView.text ?? ""]
+        if let handler = blurHandlers[id] {
+            send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": nativeEvent])
+        }
+        if let handler = endEditingHandlers[id] {
+            send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": nativeEvent])
+        }
+    }
+
     @objc private func textChanged(_ sender: UITextField) {
         lastFocusedInput = sender
+        let id = ObjectIdentifier(sender)
+        inputIdentities[id].map { inputDrafts[$0] = sender.text ?? "" }
         let focused = sender.isFirstResponder ? sender : firstResponder(in: rootStack)
-        guard let handler = handlers[ObjectIdentifier(sender)] else { return }
+        guard let handler = handlers[id] else { return }
         send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": ["text": sender.text ?? ""]])
         restoreFocus(focused)
         DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) { [weak self, weak focused] in
@@ -1149,15 +1919,38 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         }
     }
 
+    @objc private func switchChanged(_ sender: UISwitch) {
+        guard let handler = handlers[ObjectIdentifier(sender)] else { return }
+        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": ["value": sender.isOn]])
+    }
+
+    @objc private func sliderChanged(_ sender: UISlider) {
+        let value = snappedSliderValue(sender.value, for: sender)
+        if sender.value != value { sender.value = value }
+        guard let handler = handlers[ObjectIdentifier(sender)] else { return }
+        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": ["value": value]])
+    }
+
+    @objc private func sliderFinished(_ sender: UISlider) {
+        guard let handler = sliderCompleteHandlers[ObjectIdentifier(sender)] else { return }
+        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": ["value": snappedSliderValue(sender.value, for: sender)]])
+    }
+
     @objc private func textFocused(_ sender: UITextField) {
         lastFocusedInput = sender
         guard let handler = focusHandlers[ObjectIdentifier(sender)] else { return }
-        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]])
+        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": ["text": sender.text ?? ""]])
     }
 
     @objc private func textBlurred(_ sender: UITextField) {
-        guard let handler = blurHandlers[ObjectIdentifier(sender)] else { return }
-        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": ["text": sender.text ?? ""]])
+        let id = ObjectIdentifier(sender)
+        let nativeEvent: [String: Any] = ["text": sender.text ?? ""]
+        if let handler = blurHandlers[id] {
+            send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": nativeEvent])
+        }
+        if let handler = endEditingHandlers[id] {
+            send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": nativeEvent])
+        }
     }
 
     @objc private func textSubmitted(_ sender: UITextField) {
@@ -1170,6 +1963,13 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]])
     }
 
+    @objc private func viewLongPressed(_ sender: UILongPressGestureRecognizer) {
+        guard sender.state == .began,
+              let view = sender.view,
+              let handler = longPressHandlers[ObjectIdentifier(view)] else { return }
+        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": [:]])
+    }
+
     func scrollViewDidScroll(_ scrollView: UIScrollView) {
         guard let handler = scrollHandlers[ObjectIdentifier(scrollView)] else { return }
         send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": scrollEvent(scrollView)])
@@ -1185,6 +1985,16 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
         send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": scrollEvent(scrollView)])
     }
 
+    func scrollViewWillBeginDecelerating(_ scrollView: UIScrollView) {
+        guard let handler = scrollMomentumBeginHandlers[ObjectIdentifier(scrollView)] else { return }
+        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": scrollEvent(scrollView)])
+    }
+
+    func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
+        guard let handler = scrollMomentumEndHandlers[ObjectIdentifier(scrollView)] else { return }
+        send(type: "EVENT", payload: ["handlerName": handler, "nativeEvent": scrollEvent(scrollView)])
+    }
+
     private func scrollEvent(_ scrollView: UIScrollView) -> [String: Any] {
         [
             "contentOffset": ["x": scrollView.contentOffset.x, "y": scrollView.contentOffset.y],
@@ -1208,10 +2018,12 @@ final class CraftNativeScreenController: UIViewController, UIScrollViewDelegate
     private func keyboardType(_ value: Any?) -> UIKeyboardType {
         switch value as? String {
         case "email-address": return .emailAddress
-        case "numeric": return .numberPad
+        case "numeric", "number-pad": return .numberPad
         case "phone-pad": return .phonePad
         case "decimal-pad": return .decimalPad
         case "url": return .URL
+        case "web-search": return .webSearch
+        case "visible-password": return .asciiCapable
         default: return .default
         }
     }