@apollohg/react-native-prose-editor 0.1.1 → 0.3.0

package/ios/RichTextEditorView.swift

@@ -25,6 +25,593 @@ enum EditorHeightBehavior: String {
     case autoGrow
 }
 
+struct RemoteSelectionDecoration {
+    let clientId: Int
+    let anchor: UInt32
+    let head: UInt32
+    let color: UIColor
+    let name: String?
+    let isFocused: Bool
+
+    static func from(json: String?) -> [RemoteSelectionDecoration] {
+        guard let json,
+              let data = json.data(using: .utf8),
+              let raw = try? JSONSerialization.jsonObject(with: data) as? [[String: Any]]
+        else {
+            return []
+        }
+
+        return raw.compactMap { item in
+            guard let clientId = item["clientId"] as? NSNumber,
+                  let anchor = item["anchor"] as? NSNumber,
+                  let head = item["head"] as? NSNumber,
+                  let colorRaw = item["color"] as? String,
+                  let color = colorFromString(colorRaw)
+            else {
+                return nil
+            }
+
+            return RemoteSelectionDecoration(
+                clientId: clientId.intValue,
+                anchor: anchor.uint32Value,
+                head: head.uint32Value,
+                color: color,
+                name: item["name"] as? String,
+                isFocused: (item["isFocused"] as? Bool) ?? false
+            )
+        }
+    }
+
+    private static func colorFromString(_ raw: String) -> UIColor? {
+        let value = raw.trimmingCharacters(in: .whitespacesAndNewlines)
+        guard value.hasPrefix("#") else { return nil }
+        let hex = String(value.dropFirst())
+
+        switch hex.count {
+        case 3:
+            let chars = Array(hex)
+            return UIColor(
+                red: component(String(repeating: String(chars[0]), count: 2)),
+                green: component(String(repeating: String(chars[1]), count: 2)),
+                blue: component(String(repeating: String(chars[2]), count: 2)),
+                alpha: 1
+            )
+        case 4:
+            let chars = Array(hex)
+            return UIColor(
+                red: component(String(repeating: String(chars[0]), count: 2)),
+                green: component(String(repeating: String(chars[1]), count: 2)),
+                blue: component(String(repeating: String(chars[2]), count: 2)),
+                alpha: component(String(repeating: String(chars[3]), count: 2))
+            )
+        case 6:
+            return UIColor(
+                red: component(String(hex.prefix(2))),
+                green: component(String(hex.dropFirst(2).prefix(2))),
+                blue: component(String(hex.dropFirst(4).prefix(2))),
+                alpha: 1
+            )
+        case 8:
+            return UIColor(
+                red: component(String(hex.prefix(2))),
+                green: component(String(hex.dropFirst(2).prefix(2))),
+                blue: component(String(hex.dropFirst(4).prefix(2))),
+                alpha: component(String(hex.dropFirst(6).prefix(2)))
+            )
+        default:
+            return nil
+        }
+    }
+
+    private static func component(_ hex: String) -> CGFloat {
+        CGFloat(Int(hex, radix: 16) ?? 0) / 255
+    }
+}
+
+private final class RemoteSelectionBadgeLabel: UILabel {
+    override func drawText(in rect: CGRect) {
+        super.drawText(in: rect.inset(by: UIEdgeInsets(top: 0, left: 8, bottom: 0, right: 8)))
+    }
+
+    override var intrinsicContentSize: CGSize {
+        let size = super.intrinsicContentSize
+        return CGSize(width: size.width + 16, height: max(size.height + 8, 22))
+    }
+}
+
+private final class RemoteSelectionOverlayView: UIView {
+    weak var textView: EditorTextView?
+    private var editorId: UInt64 = 0
+    private var selections: [RemoteSelectionDecoration] = []
+
+    override init(frame: CGRect) {
+        super.init(frame: frame)
+        backgroundColor = .clear
+        isUserInteractionEnabled = false
+        clipsToBounds = true
+    }
+
+    required init?(coder: NSCoder) {
+        return nil
+    }
+
+    func bind(textView: EditorTextView) {
+        self.textView = textView
+    }
+
+    func update(selections: [RemoteSelectionDecoration], editorId: UInt64) {
+        self.selections = selections
+        self.editorId = editorId
+        refresh()
+    }
+
+    func refresh() {
+        subviews.forEach { $0.removeFromSuperview() }
+        guard editorId != 0,
+              let textView
+        else {
+            return
+        }
+
+        for selection in selections {
+            let geometry = geometry(for: selection, in: textView)
+            for rect in geometry.selectionRects {
+                let selectionView = UIView(frame: rect.integral)
+                selectionView.backgroundColor = selection.color.withAlphaComponent(0.18)
+                selectionView.layer.cornerRadius = 3
+                addSubview(selectionView)
+            }
+
+            guard selection.isFocused,
+                  let caretRect = geometry.caretRect
+            else {
+                continue
+            }
+
+            let caretView = UIView(frame: CGRect(
+                x: round(caretRect.minX),
+                y: round(caretRect.minY),
+                width: max(2, round(caretRect.width)),
+                height: round(caretRect.height)
+            ))
+            caretView.backgroundColor = selection.color
+            caretView.layer.cornerRadius = caretView.bounds.width / 2
+            addSubview(caretView)
+        }
+    }
+
+    private func geometry(
+        for selection: RemoteSelectionDecoration,
+        in textView: EditorTextView
+    ) -> (selectionRects: [CGRect], caretRect: CGRect?) {
+        let startScalar = editorDocToScalar(
+            id: editorId,
+            docPos: min(selection.anchor, selection.head)
+        )
+        let endScalar = editorDocToScalar(
+            id: editorId,
+            docPos: max(selection.anchor, selection.head)
+        )
+
+        let startPosition = PositionBridge.scalarToTextView(startScalar, in: textView)
+        let endPosition = PositionBridge.scalarToTextView(endScalar, in: textView)
+        let caretRect = resolvedCaretRect(
+            for: endPosition,
+            in: textView
+        )
+
+        if startScalar == endScalar {
+            return ([], caretRect)
+        }
+
+        guard let range = textView.textRange(from: startPosition, to: endPosition) else {
+            return ([], caretRect)
+        }
+
+        let selectionRects = textView.selectionRects(for: range)
+            .map(\.rect)
+            .filter { !$0.isEmpty && $0.width > 0 && $0.height > 0 }
+            .map { textView.convert($0, to: self) }
+
+        return (selectionRects, caretRect)
+    }
+
+    private func resolvedCaretRect(
+        for position: UITextPosition,
+        in textView: EditorTextView
+    ) -> CGRect? {
+        let directRect = textView.convert(textView.caretRect(for: position), to: self)
+        if directRect.height > 0, directRect.width >= 0 {
+            return directRect
+        }
+
+        if let previousPosition = textView.position(from: position, offset: -1),
+           let previousRange = textView.textRange(from: previousPosition, to: position),
+           let previousRect = textView.selectionRects(for: previousRange)
+               .map(\.rect)
+               .last(where: { !$0.isEmpty && $0.height > 0 })
+        {
+            let rect = textView.convert(previousRect, to: self)
+            return CGRect(x: rect.maxX, y: rect.minY, width: 2, height: rect.height)
+        }
+
+        if let nextPosition = textView.position(from: position, offset: 1),
+           let nextRange = textView.textRange(from: position, to: nextPosition),
+           let nextRect = textView.selectionRects(for: nextRange)
+               .map(\.rect)
+               .first(where: { !$0.isEmpty && $0.height > 0 })
+        {
+            let rect = textView.convert(nextRect, to: self)
+            return CGRect(x: rect.minX, y: rect.minY, width: 2, height: rect.height)
+        }
+
+        if directRect.isEmpty {
+            return nil
+        }
+
+        return directRect
+    }
+}
+
+private final class ImageTapOverlayView: UIView {
+    private weak var editorView: RichTextEditorView?
+    private lazy var tapRecognizer: UITapGestureRecognizer = {
+        let recognizer = UITapGestureRecognizer(target: self, action: #selector(handleTap(_:)))
+        recognizer.cancelsTouchesInView = true
+        return recognizer
+    }()
+
+    override init(frame: CGRect) {
+        super.init(frame: frame)
+        backgroundColor = .clear
+        addGestureRecognizer(tapRecognizer)
+    }
+
+    required init?(coder: NSCoder) {
+        return nil
+    }
+
+    func bind(editorView: RichTextEditorView) {
+        self.editorView = editorView
+    }
+
+    override func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
+        guard let editorView else { return false }
+        let pointInTextView = convert(point, to: editorView.textView)
+        return editorView.textView.hasImageAttachment(at: pointInTextView)
+    }
+
+    @objc
+    private func handleTap(_ recognizer: UITapGestureRecognizer) {
+        guard recognizer.state == .ended, let editorView else { return }
+        let pointInTextView = convert(recognizer.location(in: self), to: editorView.textView)
+        _ = editorView.textView.selectImageAttachment(at: pointInTextView)
+    }
+
+    func interceptsPointForTesting(_ point: CGPoint) -> Bool {
+        self.point(inside: point, with: nil)
+    }
+
+    @discardableResult
+    func handleTapForTesting(_ point: CGPoint) -> Bool {
+        guard let editorView else { return false }
+        let pointInTextView = convert(point, to: editorView.textView)
+        return editorView.textView.selectImageAttachment(at: pointInTextView)
+    }
+}
+
+private final class ImageResizeHandleView: UIView {
+    let corner: ImageResizeOverlayView.Corner
+
+    init(corner: ImageResizeOverlayView.Corner) {
+        self.corner = corner
+        super.init(frame: .zero)
+        isUserInteractionEnabled = true
+        backgroundColor = .systemBackground
+        layer.borderColor = UIColor.systemBlue.cgColor
+        layer.borderWidth = 2
+        layer.cornerRadius = 10
+    }
+
+    required init?(coder: NSCoder) {
+        return nil
+    }
+}
+
+private final class ImageResizeOverlayView: UIView {
+    enum Corner: CaseIterable {
+        case topLeft
+        case topRight
+        case bottomLeft
+        case bottomRight
+    }
+
+    private struct DragState {
+        let corner: Corner
+        let originalRect: CGRect
+        let docPos: UInt32
+        let maximumWidth: CGFloat
+    }
+
+    private weak var editorView: RichTextEditorView?
+    private let selectionLayer = CAShapeLayer()
+    private let previewBackdropView = UIView()
+    private let previewImageView = UIImageView()
+    private var handleViews: [Corner: ImageResizeHandleView] = [:]
+    private var currentRect: CGRect?
+    private var currentDocPos: UInt32?
+    private var dragState: DragState?
+    private let handleSize: CGFloat = 20
+    private let minimumImageSize: CGFloat = 48
+
+    override init(frame: CGRect) {
+        super.init(frame: frame)
+        backgroundColor = .clear
+        clipsToBounds = true
+
+        previewBackdropView.isUserInteractionEnabled = false
+        previewBackdropView.isHidden = true
+        previewBackdropView.layer.zPosition = 1
+        addSubview(previewBackdropView)
+
+        previewImageView.isUserInteractionEnabled = false
+        previewImageView.isHidden = true
+        previewImageView.contentMode = .scaleToFill
+        previewImageView.layer.zPosition = 2
+        addSubview(previewImageView)
+
+        selectionLayer.strokeColor = UIColor.systemBlue.cgColor
+        selectionLayer.fillColor = UIColor.clear.cgColor
+        selectionLayer.lineWidth = 2
+        selectionLayer.zPosition = 10
+        layer.addSublayer(selectionLayer)
+
+        for corner in Corner.allCases {
+            let handleView = ImageResizeHandleView(corner: corner)
+            let panGesture = UIPanGestureRecognizer(target: self, action: #selector(handlePan(_:)))
+            handleView.addGestureRecognizer(panGesture)
+            handleView.layer.zPosition = 20
+            addSubview(handleView)
+            handleViews[corner] = handleView
+        }
+
+        isHidden = true
+    }
+
+    required init?(coder: NSCoder) {
+        return nil
+    }
+
+    func bind(editorView: RichTextEditorView) {
+        self.editorView = editorView
+    }
+
+    func refresh() {
+        if dragState != nil {
+            return
+        }
+
+        guard let editorView,
+              let geometry = editorView.selectedImageGeometry()
+        else {
+            hideOverlay()
+            return
+        }
+
+        hidePreviewLayers()
+        applyGeometry(rect: geometry.rect, docPos: geometry.docPos)
+    }
+
+    func simulateResizeForTesting(width: CGFloat, height: CGFloat) {
+        guard let docPos = currentDocPos else { return }
+        editorView?.resizeImage(docPos: docPos, size: CGSize(width: width, height: height))
+    }
+
+    func simulatePreviewResizeForTesting(width: CGFloat, height: CGFloat) {
+        guard beginPreviewResize(from: .bottomRight) else { return }
+        let nextRect = CGRect(
+            origin: dragState?.originalRect.origin ?? .zero,
+            size: editorView?.clampedImageSize(
+                CGSize(width: width, height: height),
+                maximumWidth: dragState?.maximumWidth
+            ) ?? CGSize(width: width, height: height)
+        )
+        updatePreviewRect(nextRect)
+    }
+
+    func commitPreviewResizeForTesting() {
+        finishPreviewResize(commit: true)
+    }
+
+    var visibleRectForTesting: CGRect? {
+        isHidden ? nil : currentRect
+    }
+
+    var previewHasImageForTesting: Bool {
+        !previewImageView.isHidden && previewImageView.image != nil
+    }
+
+    func interceptsPointForTesting(_ location: CGPoint) -> Bool {
+        self.point(inside: location, with: nil)
+    }
+
+    override func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
+        guard !isHidden else { return false }
+        for handleView in handleViews.values where !handleView.isHidden {
+            if handleView.frame.insetBy(dx: -12, dy: -12).contains(point) {
+                return true
+            }
+        }
+        return false
+    }
+
+    private func hideOverlay() {
+        hidePreviewLayers()
+        dragState = nil
+        currentRect = nil
+        currentDocPos = nil
+        selectionLayer.path = nil
+        isHidden = true
+    }
+
+    private func applyGeometry(rect: CGRect, docPos: UInt32) {
+        let integralRect = rect.integral
+        currentRect = integralRect
+        currentDocPos = docPos
+        selectionLayer.path = UIBezierPath(roundedRect: integralRect, cornerRadius: 8).cgPath
+        isHidden = false
+        layoutHandleViews(for: integralRect)
+    }
+
+    private func hidePreviewLayers() {
+        previewBackdropView.isHidden = true
+        previewImageView.isHidden = true
+        previewImageView.image = nil
+    }
+
+    private func showPreview(docPos: UInt32, originalRect: CGRect) {
+        previewBackdropView.backgroundColor = editorView?.imageResizePreviewBackgroundColor() ?? .systemBackground
+        previewBackdropView.frame = originalRect
+        previewBackdropView.isHidden = false
+
+        previewImageView.image = editorView?.imagePreviewForResize(docPos: docPos)
+        previewImageView.frame = originalRect
+        previewImageView.isHidden = previewImageView.image == nil
+    }
+
+    @discardableResult
+    private func beginPreviewResize(from corner: Corner) -> Bool {
+        guard let currentRect, let currentDocPos else { return false }
+        editorView?.setImageResizePreviewActive(true)
+        let maximumWidth = editorView?.maximumImageWidthForResizeGesture() ?? currentRect.width
+        dragState = DragState(
+            corner: corner,
+            originalRect: currentRect,
+            docPos: currentDocPos,
+            maximumWidth: maximumWidth
+        )
+        showPreview(docPos: currentDocPos, originalRect: currentRect)
+        return true
+    }
+
+    private func updatePreviewRect(_ rect: CGRect) {
+        guard let currentDocPos else { return }
+        applyGeometry(rect: rect, docPos: currentDocPos)
+        previewImageView.frame = currentRect ?? rect.integral
+    }
+
+    private func finishPreviewResize(commit: Bool) {
+        guard let dragState else { return }
+        let finalSize = currentRect?.size ?? dragState.originalRect.size
+        self.dragState = nil
+        editorView?.setImageResizePreviewActive(false)
+        if commit {
+            editorView?.resizeImage(docPos: dragState.docPos, size: finalSize)
+        } else {
+            hidePreviewLayers()
+        }
+        DispatchQueue.main.async { [weak self] in
+            self?.refresh()
+        }
+    }
+
+    private func layoutHandleViews(for rect: CGRect) {
+        for (corner, handleView) in handleViews {
+            let center = handleCenter(for: corner, in: rect)
+            handleView.frame = CGRect(
+                x: center.x - (handleSize / 2),
+                y: center.y - (handleSize / 2),
+                width: handleSize,
+                height: handleSize
+            )
+        }
+    }
+
+    private func handleCenter(for corner: Corner, in rect: CGRect) -> CGPoint {
+        switch corner {
+        case .topLeft:
+            return CGPoint(x: rect.minX, y: rect.minY)
+        case .topRight:
+            return CGPoint(x: rect.maxX, y: rect.minY)
+        case .bottomLeft:
+            return CGPoint(x: rect.minX, y: rect.maxY)
+        case .bottomRight:
+            return CGPoint(x: rect.maxX, y: rect.maxY)
+        }
+    }
+
+    private func anchorPoint(for corner: Corner, in rect: CGRect) -> CGPoint {
+        switch corner {
+        case .topLeft:
+            return CGPoint(x: rect.maxX, y: rect.maxY)
+        case .topRight:
+            return CGPoint(x: rect.minX, y: rect.maxY)
+        case .bottomLeft:
+            return CGPoint(x: rect.maxX, y: rect.minY)
+        case .bottomRight:
+            return CGPoint(x: rect.minX, y: rect.minY)
+        }
+    }
+
+    private func resizedRect(
+        from originalRect: CGRect,
+        corner: Corner,
+        translation: CGPoint,
+        maximumWidth: CGFloat?
+    ) -> CGRect {
+        let aspectRatio = max(originalRect.width / max(originalRect.height, 1), 0.1)
+        let signedDx = (corner == .topRight || corner == .bottomRight) ? translation.x : -translation.x
+        let signedDy = (corner == .bottomLeft || corner == .bottomRight) ? translation.y : -translation.y
+        let widthScale = (originalRect.width + signedDx) / max(originalRect.width, 1)
+        let heightScale = (originalRect.height + signedDy) / max(originalRect.height, 1)
+        let scale = max(minimumImageSize / max(originalRect.width, 1), widthScale, heightScale)
+        let unclampedSize = CGSize(
+            width: max(minimumImageSize, originalRect.width * scale),
+            height: max(minimumImageSize / aspectRatio, (max(minimumImageSize, originalRect.width * scale) / aspectRatio))
+        )
+        let clampedSize = editorView?.clampedImageSize(unclampedSize, maximumWidth: maximumWidth) ?? unclampedSize
+        let width = clampedSize.width
+        let height = clampedSize.height
+        let anchor = anchorPoint(for: corner, in: originalRect)
+
+        switch corner {
+        case .topLeft:
+            return CGRect(x: anchor.x - width, y: anchor.y - height, width: width, height: height)
+        case .topRight:
+            return CGRect(x: anchor.x, y: anchor.y - height, width: width, height: height)
+        case .bottomLeft:
+            return CGRect(x: anchor.x - width, y: anchor.y, width: width, height: height)
+        case .bottomRight:
+            return CGRect(x: anchor.x, y: anchor.y, width: width, height: height)
+        }
+    }
+
+    @objc
+    private func handlePan(_ gesture: UIPanGestureRecognizer) {
+        guard let handleView = gesture.view as? ImageResizeHandleView else { return }
+
+        switch gesture.state {
+        case .began:
+            _ = beginPreviewResize(from: handleView.corner)
+        case .changed:
+            guard let dragState else { return }
+            let nextRect = resizedRect(
+                from: dragState.originalRect,
+                corner: dragState.corner,
+                translation: gesture.translation(in: self),
+                maximumWidth: dragState.maximumWidth
+            )
+            updatePreviewRect(nextRect)
+        case .ended:
+            finishPreviewResize(commit: true)
+        case .cancelled, .failed:
+            finishPreviewResize(commit: false)
+        default:
+            finishPreviewResize(commit: false)
+        }
+    }
+}
+
 // MARK: - EditorTextView
 
 /// UITextView subclass that intercepts all text input and routes it through
@@ -52,7 +639,8 @@ enum EditorHeightBehavior: String {
 /// (`editor_insert_text`, `editor_delete_range`, etc.) are synchronous and
 /// fast enough for main-thread use. If profiling shows otherwise, we can
 /// dispatch to a serial queue and batch updates.
-final class EditorTextView: UITextView, UITextViewDelegate {
+final class EditorTextView: UITextView, UITextViewDelegate, UIGestureRecognizerDelegate {
+    private static let emptyBlockPlaceholderScalar = UnicodeScalar(0x200B)
 
     // MARK: - Properties
 
@@ -63,6 +651,10 @@ final class EditorTextView: UITextView, UITextViewDelegate {
     /// Guard flag to prevent re-entrant input interception while we're
     /// applying state from Rust (calling replaceCharacters on the text storage).
     var isApplyingRustState = false
+    private var visibleSelectionTintColor: UIColor = .systemBlue
+    private var hidesNativeSelectionChrome = false
+    private var isPreviewingImageResize = false
+    var allowImageResizing = true
 
     /// The base font used for unstyled text. Configurable from React props.
     var baseFont: UIFont = .systemFont(ofSize: 16)
@@ -89,6 +681,7 @@ final class EditorTextView: UITextView, UITextViewDelegate {
             } else {
                 textContainerInset = baseTextContainerInset
             }
+            setNeedsLayout()
         }
     }
 
@@ -102,6 +695,8 @@ final class EditorTextView: UITextView, UITextViewDelegate {
     }
 
     var onHeightMayChange: (() -> Void)?
+    var onViewportMayChange: (() -> Void)?
+    var onSelectionOrContentMayChange: (() -> Void)?
     private var lastAutoGrowMeasuredHeight: CGFloat = 0
 
     /// Delegate for editor events.
@@ -135,6 +730,14 @@ final class EditorTextView: UITextView, UITextViewDelegate {
 
     /// Tracks whether we're in a composition session (CJK / IME input).
     private var isComposing = false
+    private lazy var imageSelectionTapRecognizer: UITapGestureRecognizer = {
+        let recognizer = UITapGestureRecognizer(target: self, action: #selector(handleImageSelectionTap(_:)))
+        recognizer.cancelsTouchesInView = true
+        recognizer.delaysTouchesBegan = false
+        recognizer.delaysTouchesEnded = false
+        recognizer.delegate = self
+        return recognizer
+    }()
 
     /// Guards against reconciliation firing while we're already intercepting
     /// and replaying a user input operation through Rust, including the
@@ -145,6 +748,8 @@ final class EditorTextView: UITextView, UITextViewDelegate {
     /// Coalesces selection sync until UIKit has finished resolving the
     /// current tap/drag gesture's final caret position.
     private var pendingSelectionSyncGeneration: UInt64 = 0
+    private var pendingDeferredImageSelectionRange: NSRange?
+    private var pendingDeferredImageSelectionGeneration: UInt64 = 0
 
     /// Stores the text that was composed during a marked text session,
     /// captured when `unmarkText` is called.
@@ -164,7 +769,11 @@ final class EditorTextView: UITextView, UITextViewDelegate {
     }()
 
     var placeholder: String = "" {
-        didSet { placeholderLabel.text = placeholder }
+        didSet {
+            placeholderLabel.text = placeholder
+            refreshPlaceholderVisibility()
+            setNeedsLayout()
+        }
     }
 
     // MARK: - Initialization
@@ -187,6 +796,12 @@ final class EditorTextView: UITextView, UITextViewDelegate {
     private func commonInit() {
         textContainer.widthTracksTextView = true
         editorLayoutManager.allowsNonContiguousLayout = false
+        NotificationCenter.default.addObserver(
+            self,
+            selector: #selector(handleImageAttachmentDidLoad(_:)),
+            name: .editorImageAttachmentDidLoad,
+            object: nil
+        )
 
         // Configure the text view as a Rust-controlled editor surface.
         // UIKit smart-edit features mutate text storage outside our transaction
@@ -208,32 +823,318 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         textColor = baseTextColor
         backgroundColor = baseBackgroundColor
         baseTextContainerInset = textContainerInset
+        visibleSelectionTintColor = tintColor
 
         // Register as the text storage delegate so we can detect unauthorized
         // mutations (reconciliation fallback).
         textStorage.delegate = self
         delegate = self
+        addGestureRecognizer(imageSelectionTapRecognizer)
+        installImageSelectionTapDependencies()
 
         addSubview(placeholderLabel)
+        refreshPlaceholderVisibility()
+        refreshNativeSelectionChromeVisibility()
+    }
+
+    override func didMoveToWindow() {
+        super.didMoveToWindow()
+        installImageSelectionTapDependencies()
+    }
+
+    override func didAddSubview(_ subview: UIView) {
+        super.didAddSubview(subview)
+        installImageSelectionTapDependencies()
+    }
+
+    @objc
+    private func handleImageAttachmentDidLoad(_ notification: Notification) {
+        guard notification.object is NSTextAttachment else { return }
+        guard textStorage.length > 0 else { return }
+
+        textStorage.beginEditing()
+        textStorage.edited(.editedAttributes, range: NSRange(location: 0, length: textStorage.length), changeInLength: 0)
+        textStorage.endEditing()
+        setNeedsLayout()
+        invalidateIntrinsicContentSize()
+        onSelectionOrContentMayChange?()
+    }
+
+    override func tintColorDidChange() {
+        super.tintColorDidChange()
+        if !hidesNativeSelectionChrome, tintColor.cgColor.alpha > 0 {
+            visibleSelectionTintColor = tintColor
+        }
+    }
+
+    @objc
+    private func handleImageSelectionTap(_ gesture: UITapGestureRecognizer) {
+        guard gesture.state == .ended, gesture.numberOfTouches == 1 else { return }
+        let location = gesture.location(in: self)
+        guard let range = imageAttachmentRange(at: location) else { return }
+        scheduleDeferredImageSelection(for: range)
+        _ = selectImageAttachment(range: range)
     }
 
     // MARK: - Layout
 
     override func layoutSubviews() {
         super.layoutSubviews()
+        installImageSelectionTapDependencies()
+        let placeholderX = textContainerInset.left + textContainer.lineFragmentPadding
+        let placeholderY = textContainerInset.top
+        let placeholderWidth = max(
+            0,
+            bounds.width - textContainerInset.left - textContainerInset.right - 2 * textContainer.lineFragmentPadding
+        )
+        let maxPlaceholderHeight = max(
+            0,
+            bounds.height - textContainerInset.top - textContainerInset.bottom
+        )
+        let fittedHeight = placeholderLabel.sizeThatFits(
+            CGSize(width: placeholderWidth, height: CGFloat.greatestFiniteMagnitude)
+        ).height
         placeholderLabel.frame = CGRect(
-            x: textContainerInset.left + textContainer.lineFragmentPadding,
-            y: textContainerInset.top,
-            width: bounds.width - textContainerInset.left - textContainerInset.right - 2 * textContainer.lineFragmentPadding,
-            height: bounds.height - textContainerInset.top - textContainerInset.bottom
+            x: placeholderX,
+            y: placeholderY,
+            width: placeholderWidth,
+            height: min(maxPlaceholderHeight, ceil(fittedHeight))
         )
-        if heightBehavior == .autoGrow {
+        if heightBehavior == .autoGrow, !isPreviewingImageResize {
             notifyHeightChangeIfNeeded()
         }
+        if !isPreviewingImageResize {
+            onViewportMayChange?()
+        }
+    }
+
+    deinit {
+        NotificationCenter.default.removeObserver(self)
+    }
+
+    override var contentOffset: CGPoint {
+        didSet {
+            if !isPreviewingImageResize {
+                onViewportMayChange?()
+            }
+        }
+    }
+
+    private func isRenderedContentEmpty() -> Bool {
+        let renderedText = textStorage.string
+        guard !renderedText.isEmpty else { return true }
+
+        for scalar in renderedText.unicodeScalars {
+            switch scalar {
+            case Self.emptyBlockPlaceholderScalar, "\n", "\r":
+                continue
+            default:
+                return false
+            }
+        }
+
+        return true
+    }
+
+    private func refreshPlaceholderVisibility() {
+        placeholderLabel.isHidden = placeholder.isEmpty || !isRenderedContentEmpty()
+    }
+
+    @discardableResult
+    private func selectImageAttachmentIfNeeded(at location: CGPoint) -> Bool {
+        guard let range = imageAttachmentRange(at: location) else { return false }
+        scheduleDeferredImageSelection(for: range)
+        return selectImageAttachment(range: range)
+    }
+
+    @discardableResult
+    func selectImageAttachment(at location: CGPoint) -> Bool {
+        selectImageAttachmentIfNeeded(at: location)
+    }
+
+    func hasImageAttachment(at location: CGPoint) -> Bool {
+        imageAttachmentRange(at: location) != nil
+    }
+
+    @discardableResult
+    private func selectImageAttachment(range: NSRange) -> Bool {
+        guard isSelectable,
+              let start = position(from: beginningOfDocument, offset: range.location),
+              let end = position(from: start, offset: range.length),
+              let textRange = textRange(from: start, to: end)
+        else {
+            return false
+        }
+
+        _ = becomeFirstResponder()
+        selectedTextRange = textRange
+        refreshNativeSelectionChromeVisibility()
+        onSelectionOrContentMayChange?()
+        scheduleSelectionSync()
+        return true
+    }
+
+    private func selectedUtf16Range() -> NSRange? {
+        guard let range = selectedTextRange else { return nil }
+        let location = offset(from: beginningOfDocument, to: range.start)
+        let length = offset(from: range.start, to: range.end)
+        guard location >= 0, length >= 0 else { return nil }
+        return NSRange(location: location, length: length)
+    }
+
+    private func scheduleDeferredImageSelection(for range: NSRange) {
+        pendingDeferredImageSelectionRange = range
+        pendingDeferredImageSelectionGeneration &+= 1
+        let generation = pendingDeferredImageSelectionGeneration
+        DispatchQueue.main.async { [weak self] in
+            self?.applyDeferredImageSelectionIfNeeded(generation: generation)
+        }
+    }
+
+    private func applyDeferredImageSelectionIfNeeded(generation: UInt64) {
+        guard pendingDeferredImageSelectionGeneration == generation,
+              let pendingRange = pendingDeferredImageSelectionRange
+        else {
+            return
+        }
+        pendingDeferredImageSelectionRange = nil
+        guard selectedUtf16Range() != pendingRange else { return }
+        _ = selectImageAttachment(range: pendingRange)
+    }
+
+    private func installImageSelectionTapDependencies() {
+        for view in gestureDependencyViews(startingAt: self) {
+            guard let recognizers = view.gestureRecognizers else { continue }
+            for recognizer in recognizers {
+                guard recognizer !== imageSelectionTapRecognizer,
+                      let tapRecognizer = recognizer as? UITapGestureRecognizer
+                else {
+                    continue
+                }
+                tapRecognizer.require(toFail: imageSelectionTapRecognizer)
+            }
+        }
+    }
+
+    private func gestureDependencyViews(startingAt rootView: UIView) -> [UIView] {
+        var views: [UIView] = [rootView]
+        for subview in rootView.subviews {
+            views.append(contentsOf: gestureDependencyViews(startingAt: subview))
+        }
+        return views
+    }
+
+    private func imageAttachmentRange(at location: CGPoint) -> NSRange? {
+        guard allowImageResizing else { return nil }
+        guard textStorage.length > 0 else { return nil }
+
+        let fullRange = NSRange(location: 0, length: textStorage.length)
+        var resolvedRange: NSRange?
+
+        textStorage.enumerateAttribute(.attachment, in: fullRange) { value, range, stop in
+            guard value is NSTextAttachment, range.length > 0 else { return }
+
+            let attrs = textStorage.attributes(at: range.location, effectiveRange: nil)
+            guard (attrs[RenderBridgeAttributes.voidNodeType] as? String) == "image" else { return }
+
+            let glyphRange = layoutManager.glyphRange(
+                forCharacterRange: range,
+                actualCharacterRange: nil
+            )
+            guard glyphRange.length > 0 else { return }
+
+            var rect = layoutManager.boundingRect(forGlyphRange: glyphRange, in: textContainer)
+            rect.origin.x += textContainerInset.left - contentOffset.x
+            rect.origin.y += textContainerInset.top - contentOffset.y
+
+            if rect.insetBy(dx: -8, dy: -8).contains(location) {
+                resolvedRange = range
+                stop.pointee = true
+            }
+        }
+
+        return resolvedRange
+    }
+
+    func isPlaceholderVisibleForTesting() -> Bool {
+        !placeholderLabel.isHidden
+    }
+
+    func placeholderFrameForTesting() -> CGRect {
+        placeholderLabel.frame
+    }
+
+    func blockquoteStripeRectsForTesting() -> [CGRect] {
+        editorLayoutManager.blockquoteStripeRectsForTesting(in: textStorage)
+    }
+
+    func resetBlockquoteStripeDrawPassesForTesting() {
+        editorLayoutManager.resetBlockquoteStripeDrawPassesForTesting()
+    }
+
+    func blockquoteStripeDrawPassesForTesting() -> [[CGRect]] {
+        editorLayoutManager.blockquoteStripeDrawPassesForTesting
+    }
+
+    @discardableResult
+    func selectImageAttachmentForTesting(at location: CGPoint) -> Bool {
+        selectImageAttachmentIfNeeded(at: location)
+    }
+
+    func imageSelectionTapWouldHandleForTesting(at location: CGPoint) -> Bool {
+        imageAttachmentRange(at: location) != nil
+    }
+
+    func imageSelectionTapCancelsTouchesForTesting() -> Bool {
+        imageSelectionTapRecognizer.cancelsTouchesInView
+    }
+
+    func imageSelectionTapYieldsToDefaultTapForTesting() -> Bool {
+        gestureRecognizer(
+            imageSelectionTapRecognizer,
+            shouldBeRequiredToFailBy: UITapGestureRecognizer()
+        ) || gestureRecognizer(
+            imageSelectionTapRecognizer,
+            shouldRequireFailureOf: UITapGestureRecognizer()
+        )
+    }
+
+    func gestureRecognizer(_ gestureRecognizer: UIGestureRecognizer, shouldReceive touch: UITouch) -> Bool {
+        guard gestureRecognizer === imageSelectionTapRecognizer,
+              touch.tapCount == 1
+        else {
+            return true
+        }
+
+        return imageAttachmentRange(at: touch.location(in: self)) != nil
+    }
+
+    func gestureRecognizer(
+        _ gestureRecognizer: UIGestureRecognizer,
+        shouldRecognizeSimultaneouslyWith otherGestureRecognizer: UIGestureRecognizer
+    ) -> Bool {
+        false
+    }
+
+    func gestureRecognizer(
+        _ gestureRecognizer: UIGestureRecognizer,
+        shouldRequireFailureOf otherGestureRecognizer: UIGestureRecognizer
+    ) -> Bool {
+        false
+    }
+
+    func gestureRecognizer(
+        _ gestureRecognizer: UIGestureRecognizer,
+        shouldBeRequiredToFailBy otherGestureRecognizer: UIGestureRecognizer
+    ) -> Bool {
+        false
     }
 
     override func caretRect(for position: UITextPosition) -> CGRect {
-        let rect = super.caretRect(for: position)
+        if hidesNativeSelectionChrome {
+            return .zero
+        }
+        let rect = resolvedCaretReferenceRect(for: position)
         guard rect.height > 0 else { return rect }
 
         let caretFont = resolvedCaretFont(for: position)
@@ -257,6 +1158,45 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         )
     }
 
+    private func resolvedCaretReferenceRect(for position: UITextPosition) -> CGRect {
+        let directRect = super.caretRect(for: position)
+        guard directRect.height <= 0 || directRect.isEmpty else {
+            return directRect
+        }
+
+        let caretWidth = max(directRect.width, 2)
+
+        if let nextPosition = self.position(from: position, offset: 1),
+           let nextRange = textRange(from: position, to: nextPosition),
+           let nextRect = selectionRects(for: nextRange)
+               .map(\.rect)
+               .first(where: { !$0.isEmpty && $0.width > 0 && $0.height > 0 })
+        {
+            return CGRect(
+                x: nextRect.minX,
+                y: nextRect.minY,
+                width: caretWidth,
+                height: max(directRect.height, nextRect.height)
+            )
+        }
+
+        if let previousPosition = self.position(from: position, offset: -1),
+           let previousRange = textRange(from: previousPosition, to: position),
+           let previousRect = selectionRects(for: previousRange)
+               .map(\.rect)
+               .last(where: { !$0.isEmpty && $0.width > 0 && $0.height > 0 })
+        {
+            return CGRect(
+                x: previousRect.maxX,
+                y: previousRect.minY,
+                width: caretWidth,
+                height: max(directRect.height, previousRect.height)
+            )
+        }
+
+        return directRect
+    }
+
     // MARK: - Editor Binding
 
     /// Bind this text view to a Rust editor instance and apply initial content.
@@ -411,7 +1351,7 @@ final class EditorTextView: UITextView, UITextViewDelegate {
                 return
             }
 
-            if let deleteRange = trailingHorizontalRuleDeleteRangeForBackwardDelete(
+            if let deleteRange = trailingVoidBlockDeleteRangeForBackwardDelete(
                 cursorUtf16Offset: cursorUtf16Offset
             ) {
                 performInterceptedInput {
@@ -462,7 +1402,7 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         return (from: cursorScalar, to: cursorScalar + 1)
     }
 
-    private func trailingHorizontalRuleDeleteRangeForBackwardDelete(
+    private func trailingVoidBlockDeleteRangeForBackwardDelete(
         cursorUtf16Offset: Int
     ) -> (from: UInt32, to: UInt32)? {
         let text = textStorage.string as NSString
@@ -483,19 +1423,34 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         guard text.character(at: paragraphRange.location - 1) == 0x000A else { return nil }
 
         let attachmentIndex = paragraphRange.location - 2
-        let attrs = textStorage.attributes(at: attachmentIndex, effectiveRange: nil)
+        guard
+            let deleteRange = scalarDeleteRangeForVoidAttachment(at: attachmentIndex)
+        else {
+            return nil
+        }
+
+        return deleteRange
+    }
+
+    private func scalarDeleteRangeForVoidAttachment(
+        at utf16Offset: Int
+    ) -> (from: UInt32, to: UInt32)? {
+        guard utf16Offset >= 0, utf16Offset < textStorage.length else {
+            return nil
+        }
+        let attrs = textStorage.attributes(at: utf16Offset, effectiveRange: nil)
         guard attrs[.attachment] is NSTextAttachment,
-              attrs[RenderBridgeAttributes.voidNodeType] as? String == "horizontalRule"
+              attrs[RenderBridgeAttributes.voidNodeType] as? String != nil
         else {
             return nil
         }
 
-        let placeholderEndScalar = PositionBridge.utf16OffsetToScalar(
-            placeholderRange.location + placeholderRange.length,
+        let attachmentEndScalar = PositionBridge.utf16OffsetToScalar(
+            utf16Offset + 1,
             in: self
         )
-        guard placeholderEndScalar > 0 else { return nil }
-        return (from: placeholderEndScalar - 1, to: placeholderEndScalar)
+        guard attachmentEndScalar > 0 else { return nil }
+        return (from: attachmentEndScalar - 1, to: attachmentEndScalar)
     }
 
     private func handleListDepthKeyCommand(outdent: Bool) {
@@ -684,9 +1639,48 @@ final class EditorTextView: UITextView, UITextViewDelegate {
     /// internally during tap handling and word-boundary resolution.
     func textViewDidChangeSelection(_ textView: UITextView) {
         guard textView === self else { return }
+        refreshNativeSelectionChromeVisibility()
+        onSelectionOrContentMayChange?()
         scheduleSelectionSync()
     }
 
+    func textView(
+        _ textView: UITextView,
+        shouldInteractWith URL: URL,
+        in characterRange: NSRange,
+        interaction: UITextItemInteraction
+    ) -> Bool {
+        return false
+    }
+
+    func textView(
+        _ textView: UITextView,
+        shouldInteractWith textAttachment: NSTextAttachment,
+        in characterRange: NSRange,
+        interaction: UITextItemInteraction
+    ) -> Bool {
+        guard textView === self,
+              characterRange.location >= 0,
+              characterRange.location < textStorage.length
+        else {
+            return false
+        }
+
+        let attrs = textStorage.attributes(at: characterRange.location, effectiveRange: nil)
+        guard (attrs[RenderBridgeAttributes.voidNodeType] as? String) == "image",
+              let start = position(from: beginningOfDocument, offset: characterRange.location),
+              let end = position(from: start, offset: characterRange.length)
+        else {
+            return false
+        }
+
+        selectedTextRange = textRange(from: start, to: end)
+        refreshNativeSelectionChromeVisibility()
+        onSelectionOrContentMayChange?()
+        scheduleSelectionSync()
+        return false
+    }
+
     // MARK: - Private: Rust Integration
 
     private var isInterceptingInput: Bool {
@@ -775,6 +1769,25 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         typingAttributes = attrs
     }
 
+    private func setNativeSelectionChromeHidden(_ hidden: Bool) {
+        guard hidesNativeSelectionChrome != hidden else { return }
+        hidesNativeSelectionChrome = hidden
+        super.tintColor = hidden ? .clear : visibleSelectionTintColor
+    }
+
+    private func refreshNativeSelectionChromeVisibility() {
+        let hidden = selectedImageGeometry() != nil
+        if !hidden, tintColor.cgColor.alpha > 0 {
+            visibleSelectionTintColor = tintColor
+        }
+        setNativeSelectionChromeHidden(hidden)
+    }
+
+    func refreshSelectionVisualState() {
+        refreshNativeSelectionChromeVisibility()
+        onSelectionOrContentMayChange?()
+    }
+
     private func scheduleSelectionSync() {
         pendingSelectionSyncGeneration &+= 1
         let generation = pendingSelectionSyncGeneration
@@ -933,6 +1946,11 @@ final class EditorTextView: UITextView, UITextViewDelegate {
 
         let rawOffset = offset(from: beginningOfDocument, to: position)
         let clampedOffset = min(max(rawOffset, 0), textStorage.length)
+
+        if let hardBreakBaselineY = hardBreakBaselineY(after: clampedOffset) {
+            return hardBreakBaselineY
+        }
+
         var candidateCharacters = Set<Int>()
 
         if clampedOffset < textStorage.length {
@@ -974,6 +1992,41 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         return bestMatch?.baselineY
     }
 
+    private func hardBreakBaselineY(after utf16Offset: Int) -> CGFloat? {
+        guard utf16Offset > 0, utf16Offset <= textStorage.length else { return nil }
+        let previousVoidType = textStorage.attribute(
+            RenderBridgeAttributes.voidNodeType,
+            at: utf16Offset - 1,
+            effectiveRange: nil
+        ) as? String
+        guard previousVoidType == "hardBreak" else { return nil }
+
+        let previousGlyphIndex = layoutManager.glyphIndexForCharacter(at: utf16Offset - 1)
+        guard previousGlyphIndex < layoutManager.numberOfGlyphs else { return nil }
+
+        let lineFragmentRect = layoutManager.lineFragmentRect(
+            forGlyphAt: previousGlyphIndex,
+            effectiveRange: nil
+        )
+        let glyphLocation = layoutManager.location(forGlyphAt: previousGlyphIndex)
+        let previousBaselineY = textContainerInset.top + lineFragmentRect.minY + glyphLocation.y
+
+        let paragraphStyle = textStorage.attribute(
+            .paragraphStyle,
+            at: utf16Offset - 1,
+            effectiveRange: nil
+        ) as? NSParagraphStyle
+        let configuredLineHeight = max(
+            paragraphStyle?.minimumLineHeight ?? 0,
+            paragraphStyle?.maximumLineHeight ?? 0
+        )
+        let lineAdvance = configuredLineHeight > 0
+            ? configuredLineHeight
+            : lineFragmentRect.height
+
+        return previousBaselineY + lineAdvance
+    }
+
     private func resolvedCaretFont(for position: UITextPosition) -> UIFont {
         guard textStorage.length > 0 else { return resolvedDefaultFont() }
 
@@ -1027,6 +2080,20 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         }
     }
 
+    func performToolbarToggleBlockquote() {
+        guard editorId != 0 else { return }
+        guard isEditable else { return }
+        guard let selection = currentScalarSelection() else { return }
+        performInterceptedInput {
+            let updateJSON = editorToggleBlockquoteAtSelectionScalar(
+                id: editorId,
+                scalarAnchor: selection.anchor,
+                scalarHead: selection.head
+            )
+            applyUpdateJSON(updateJSON)
+        }
+    }
+
     func performToolbarIndentListItem() {
         guard editorId != 0 else { return }
         guard isEditable else { return }
@@ -1130,6 +2197,104 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         return (anchor: scalarRange.from, head: scalarRange.to)
     }
 
+    func selectedImageGeometry() -> (docPos: UInt32, rect: CGRect)? {
+        guard allowImageResizing else { return nil }
+        guard isFirstResponder else { return nil }
+        guard let selectedRange = selectedTextRange else { return nil }
+
+        let startOffset = offset(from: beginningOfDocument, to: selectedRange.start)
+        let endOffset = offset(from: beginningOfDocument, to: selectedRange.end)
+        guard endOffset == startOffset + 1, startOffset >= 0, startOffset < textStorage.length else {
+            return nil
+        }
+
+        let attrs = textStorage.attributes(at: startOffset, effectiveRange: nil)
+        guard (attrs[RenderBridgeAttributes.voidNodeType] as? String) == "image",
+              attrs[.attachment] is NSTextAttachment
+        else {
+            return nil
+        }
+
+        let docPos: UInt32
+        if let number = attrs[RenderBridgeAttributes.docPos] as? NSNumber {
+            docPos = number.uint32Value
+        } else if let value = attrs[RenderBridgeAttributes.docPos] as? UInt32 {
+            docPos = value
+        } else {
+            return nil
+        }
+
+        let glyphRange = layoutManager.glyphRange(
+            forCharacterRange: NSRange(location: startOffset, length: 1),
+            actualCharacterRange: nil
+        )
+        guard glyphRange.length > 0 else { return nil }
+
+        var rect = layoutManager.boundingRect(forGlyphRange: glyphRange, in: textContainer)
+        rect.origin.x += textContainerInset.left
+        rect.origin.y += textContainerInset.top
+        guard rect.width > 0, rect.height > 0 else { return nil }
+        return (docPos, rect)
+    }
+
+    private func blockImageAttachment(docPos: UInt32) -> (range: NSRange, attachment: BlockImageAttachment)? {
+        let fullRange = NSRange(location: 0, length: textStorage.length)
+        var resolved: (range: NSRange, attachment: BlockImageAttachment)?
+        textStorage.enumerateAttribute(.attachment, in: fullRange) { value, range, stop in
+            guard let attachment = value as? BlockImageAttachment, range.length > 0 else { return }
+            let attrs = textStorage.attributes(at: range.location, effectiveRange: nil)
+            guard (attrs[RenderBridgeAttributes.voidNodeType] as? String) == "image" else { return }
+            let attributeDocPos = (attrs[RenderBridgeAttributes.docPos] as? NSNumber)?.uint32Value
+                ?? (attrs[RenderBridgeAttributes.docPos] as? UInt32)
+            guard attributeDocPos == docPos else { return }
+            resolved = (range, attachment)
+            stop.pointee = true
+        }
+        return resolved
+    }
+
+    func imagePreviewForDocPos(_ docPos: UInt32) -> UIImage? {
+        blockImageAttachment(docPos: docPos)?.attachment.previewImage()
+    }
+
+    func maximumRenderableImageWidth() -> CGFloat {
+        let containerWidth: CGFloat
+        if bounds.width > 0 {
+            containerWidth = bounds.width - textContainerInset.left - textContainerInset.right
+        } else {
+            containerWidth = textContainer.size.width
+        }
+        let linePadding = textContainer.lineFragmentPadding * 2
+        return max(48, containerWidth - linePadding)
+    }
+
+    func resizeImageAtDocPos(_ docPos: UInt32, width: UInt32, height: UInt32) {
+        guard editorId != 0 else { return }
+        performInterceptedInput {
+            let updateJSON = editorResizeImageAtDocPos(
+                id: editorId,
+                docPos: docPos,
+                width: width,
+                height: height
+            )
+            applyUpdateJSON(updateJSON)
+        }
+    }
+
+    func previewResizeImageAtDocPos(_ docPos: UInt32, width: CGFloat, height: CGFloat) {
+        guard let attachmentState = blockImageAttachment(docPos: docPos) else { return }
+        attachmentState.attachment.setPreferredSize(width: width, height: height)
+        layoutManager.invalidateLayout(forCharacterRange: attachmentState.range, actualCharacterRange: nil)
+        layoutManager.invalidateDisplay(forCharacterRange: attachmentState.range)
+        textStorage.beginEditing()
+        textStorage.edited(.editedAttributes, range: attachmentState.range, changeInLength: 0)
+        textStorage.endEditing()
+    }
+
+    func setImageResizePreviewActive(_ active: Bool) {
+        isPreviewingImageResize = active
+    }
+
     /// Handle return key press as a block split operation.
     private func handleReturnKey() {
         // If there's a range selection, atomically delete and split.
@@ -1224,7 +2389,7 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         lastAuthorizedText = textStorage.string
         isApplyingRustState = false
 
-        placeholderLabel.isHidden = !textStorage.string.isEmpty
+        refreshPlaceholderVisibility()
         Self.updateLog.debug(
             "[applyUpdateJSON.rendered] after=\(self.textSnapshotSummary(), privacy: .public)"
         )
@@ -1237,6 +2402,7 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         if heightBehavior == .autoGrow {
             notifyHeightChangeIfNeeded(force: true)
         }
+        onSelectionOrContentMayChange?()
 
         Self.updateLog.debug(
             "[applyUpdateJSON.end] finalSelection=\(self.selectionSummary(), privacy: .public) textState=\(self.textSnapshotSummary(), privacy: .public)"
@@ -1270,11 +2436,12 @@ final class EditorTextView: UITextView, UITextViewDelegate {
         lastAuthorizedText = textStorage.string
         isApplyingRustState = false
 
-        placeholderLabel.isHidden = !textStorage.string.isEmpty
+        refreshPlaceholderVisibility()
         refreshTypingAttributesForSelection()
         if heightBehavior == .autoGrow {
             notifyHeightChangeIfNeeded(force: true)
         }
+        onSelectionOrContentMayChange?()
         Self.updateLog.debug(
             "[applyRenderJSON.end] after=\(self.textSnapshotSummary(), privacy: .public)"
         )
@@ -1306,6 +2473,7 @@ final class EditorTextView: UITextView, UITextViewDelegate {
             let startPos = PositionBridge.scalarToTextView(min(anchorScalar, headScalar), in: self)
             let endPos = PositionBridge.scalarToTextView(max(anchorScalar, headScalar), in: self)
             selectedTextRange = textRange(from: startPos, to: endPos)
+            refreshNativeSelectionChromeVisibility()
             Self.selectionLog.debug(
                 "[applySelectionFromJSON.text] doc=\(anchorNum.uint32Value)-\(headNum.uint32Value) scalar=\(anchorScalar)-\(headScalar) final=\(self.selectionSummary(), privacy: .public)"
             )
@@ -1320,12 +2488,14 @@ final class EditorTextView: UITextView, UITextViewDelegate {
             if let endPos = position(from: startPos, offset: 1) {
                 selectedTextRange = textRange(from: startPos, to: endPos)
             }
+            refreshNativeSelectionChromeVisibility()
             Self.selectionLog.debug(
                 "[applySelectionFromJSON.node] doc=\(posNum.uint32Value) scalar=\(posScalar) final=\(self.selectionSummary(), privacy: .public)"
             )
 
         case "all":
             selectedTextRange = textRange(from: beginningOfDocument, to: endOfDocument)
+            refreshNativeSelectionChromeVisibility()
             Self.selectionLog.debug(
                 "[applySelectionFromJSON.all] final=\(self.selectionSummary(), privacy: .public)"
             )
@@ -1334,6 +2504,7 @@ final class EditorTextView: UITextView, UITextViewDelegate {
             break
         }
     }
+
 }
 
 // MARK: - EditorTextView + NSTextStorageDelegate (Reconciliation Fallback)
@@ -1423,8 +2594,21 @@ final class RichTextEditorView: UIView {
 
     /// The editor text view that handles input interception.
     let textView: EditorTextView
+    private let remoteSelectionOverlayView = RemoteSelectionOverlayView()
+    private let imageTapOverlayView = ImageTapOverlayView()
+    private let imageResizeOverlayView = ImageResizeOverlayView()
     var onHeightMayChange: (() -> Void)?
     private var lastAutoGrowWidth: CGFloat = 0
+    private var remoteSelections: [RemoteSelectionDecoration] = []
+    var allowImageResizing = true {
+        didSet {
+            guard oldValue != allowImageResizing else { return }
+            textView.allowImageResizing = allowImageResizing
+            textView.refreshSelectionVisualState()
+            imageTapOverlayView.isHidden = editorId == 0 || !allowImageResizing
+            imageResizeOverlayView.refresh()
+        }
+    }
 
     var heightBehavior: EditorHeightBehavior = .fixed {
         didSet {
@@ -1433,6 +2617,8 @@ final class RichTextEditorView: UIView {
             invalidateIntrinsicContentSize()
             setNeedsLayout()
             onHeightMayChange?()
+            remoteSelectionOverlayView.refresh()
+            imageResizeOverlayView.refresh()
         }
     }
 
@@ -1444,6 +2630,12 @@ final class RichTextEditorView: UIView {
             } else {
                 textView.unbindEditor()
             }
+            remoteSelectionOverlayView.update(
+                selections: remoteSelections,
+                editorId: editorId
+            )
+            imageTapOverlayView.isHidden = editorId == 0 || !allowImageResizing
+            imageResizeOverlayView.refresh()
         }
     }
 
@@ -1464,19 +2656,48 @@ final class RichTextEditorView: UIView {
     private func setupView() {
         // Add the text view as a subview.
         textView.translatesAutoresizingMaskIntoConstraints = false
+        remoteSelectionOverlayView.translatesAutoresizingMaskIntoConstraints = false
+        imageTapOverlayView.translatesAutoresizingMaskIntoConstraints = false
+        imageResizeOverlayView.translatesAutoresizingMaskIntoConstraints = false
+        remoteSelectionOverlayView.bind(textView: textView)
+        imageTapOverlayView.bind(editorView: self)
+        imageResizeOverlayView.bind(editorView: self)
+        textView.allowImageResizing = allowImageResizing
+        imageTapOverlayView.isHidden = editorId == 0 || !allowImageResizing
         textView.onHeightMayChange = { [weak self] in
             guard let self, self.heightBehavior == .autoGrow else { return }
             self.invalidateIntrinsicContentSize()
             self.superview?.setNeedsLayout()
             self.onHeightMayChange?()
         }
+        textView.onViewportMayChange = { [weak self] in
+            self?.refreshOverlays()
+        }
+        textView.onSelectionOrContentMayChange = { [weak self] in
+            self?.refreshOverlays()
+        }
         addSubview(textView)
+        addSubview(remoteSelectionOverlayView)
+        addSubview(imageTapOverlayView)
+        addSubview(imageResizeOverlayView)
 
         NSLayoutConstraint.activate([
             textView.topAnchor.constraint(equalTo: topAnchor),
             textView.leadingAnchor.constraint(equalTo: leadingAnchor),
             textView.trailingAnchor.constraint(equalTo: trailingAnchor),
             textView.bottomAnchor.constraint(equalTo: bottomAnchor),
+            remoteSelectionOverlayView.topAnchor.constraint(equalTo: topAnchor),
+            remoteSelectionOverlayView.leadingAnchor.constraint(equalTo: leadingAnchor),
+            remoteSelectionOverlayView.trailingAnchor.constraint(equalTo: trailingAnchor),
+            remoteSelectionOverlayView.bottomAnchor.constraint(equalTo: bottomAnchor),
+            imageTapOverlayView.topAnchor.constraint(equalTo: topAnchor),
+            imageTapOverlayView.leadingAnchor.constraint(equalTo: leadingAnchor),
+            imageTapOverlayView.trailingAnchor.constraint(equalTo: trailingAnchor),
+            imageTapOverlayView.bottomAnchor.constraint(equalTo: bottomAnchor),
+            imageResizeOverlayView.topAnchor.constraint(equalTo: topAnchor),
+            imageResizeOverlayView.leadingAnchor.constraint(equalTo: leadingAnchor),
+            imageResizeOverlayView.trailingAnchor.constraint(equalTo: trailingAnchor),
+            imageResizeOverlayView.bottomAnchor.constraint(equalTo: bottomAnchor),
         ])
     }
 
@@ -1494,6 +2715,7 @@ final class RichTextEditorView: UIView {
 
     override func layoutSubviews() {
         super.layoutSubviews()
+        refreshOverlays()
         guard heightBehavior == .autoGrow else { return }
         let currentWidth = bounds.width.rounded(.towardZero)
         guard currentWidth != lastAutoGrowWidth else { return }
@@ -1527,6 +2749,64 @@ final class RichTextEditorView: UIView {
         let cornerRadius = theme?.borderRadius ?? 0
         layer.cornerRadius = cornerRadius
         clipsToBounds = cornerRadius > 0
+        refreshOverlays()
+    }
+
+    func setRemoteSelections(_ selections: [RemoteSelectionDecoration]) {
+        remoteSelections = selections
+        remoteSelectionOverlayView.update(
+            selections: selections,
+            editorId: editorId
+        )
+    }
+
+    func refreshRemoteSelections() {
+        remoteSelectionOverlayView.refresh()
+    }
+
+    func remoteSelectionOverlaySubviewsForTesting() -> [UIView] {
+        remoteSelectionOverlayView.subviews
+    }
+
+    func imageResizeOverlayRectForTesting() -> CGRect? {
+        imageResizeOverlayView.visibleRectForTesting
+    }
+
+    func imageTapOverlayInterceptsPointForTesting(_ point: CGPoint) -> Bool {
+        imageTapOverlayView.interceptsPointForTesting(convert(point, to: imageTapOverlayView))
+    }
+
+    @discardableResult
+    func tapImageOverlayForTesting(at point: CGPoint) -> Bool {
+        imageTapOverlayView.handleTapForTesting(convert(point, to: imageTapOverlayView))
+    }
+
+    func imageResizePreviewHasImageForTesting() -> Bool {
+        imageResizeOverlayView.previewHasImageForTesting
+    }
+
+    func refreshSelectionVisualStateForTesting() {
+        textView.refreshSelectionVisualState()
+    }
+
+    func imageResizeOverlayInterceptsPointForTesting(_ point: CGPoint) -> Bool {
+        imageResizeOverlayView.interceptsPointForTesting(convert(point, to: imageResizeOverlayView))
+    }
+
+    func maximumImageWidthForTesting() -> CGFloat {
+        textView.maximumRenderableImageWidth()
+    }
+
+    func resizeSelectedImageForTesting(width: CGFloat, height: CGFloat) {
+        imageResizeOverlayView.simulateResizeForTesting(width: width, height: height)
+    }
+
+    func previewResizeSelectedImageForTesting(width: CGFloat, height: CGFloat) {
+        imageResizeOverlayView.simulatePreviewResizeForTesting(width: width, height: height)
+    }
+
+    func commitPreviewResizeForTesting() {
+        imageResizeOverlayView.commitPreviewResizeForTesting()
     }
 
     /// Set initial content from HTML.
@@ -1567,6 +2847,50 @@ final class RichTextEditorView: UIView {
         return UIScreen.main.bounds.width
     }
 
+    fileprivate func selectedImageGeometry() -> (docPos: UInt32, rect: CGRect)? {
+        guard let geometry = textView.selectedImageGeometry() else { return nil }
+        return (
+            docPos: geometry.docPos,
+            rect: textView.convert(geometry.rect, to: imageResizeOverlayView)
+        )
+    }
+
+    fileprivate func setImageResizePreviewActive(_ active: Bool) {
+        textView.setImageResizePreviewActive(active)
+    }
+
+    fileprivate func imagePreviewForResize(docPos: UInt32) -> UIImage? {
+        textView.imagePreviewForDocPos(docPos)
+    }
+
+    fileprivate func imageResizePreviewBackgroundColor() -> UIColor {
+        textView.backgroundColor ?? .systemBackground
+    }
+
+    fileprivate func maximumImageWidthForResizeGesture() -> CGFloat {
+        textView.maximumRenderableImageWidth()
+    }
+
+    fileprivate func clampedImageSize(_ size: CGSize, maximumWidth: CGFloat? = nil) -> CGSize {
+        let aspectRatio = max(size.width / max(size.height, 1), 0.1)
+        let maxWidth = max(48, maximumWidth ?? textView.maximumRenderableImageWidth())
+        let clampedWidth = min(maxWidth, max(48, size.width))
+        let clampedHeight = max(48, clampedWidth / aspectRatio)
+        return CGSize(width: clampedWidth, height: clampedHeight)
+    }
+
+    fileprivate func resizeImage(docPos: UInt32, size: CGSize) {
+        let clampedSize = clampedImageSize(size)
+        let width = max(48, Int(clampedSize.width.rounded()))
+        let height = max(48, Int(clampedSize.height.rounded()))
+        textView.resizeImageAtDocPos(docPos, width: UInt32(width), height: UInt32(height))
+    }
+
+    private func refreshOverlays() {
+        remoteSelectionOverlayView.refresh()
+        imageResizeOverlayView.refresh()
+    }
+
     // MARK: - Cleanup
 
     deinit {