@mathers101/react-native-render-rich-text 0.0.0-stage → 0.1.10

package/android/src/main/java/com/renderrichtext/renderer/BlockStyleContext.kt

@@ -0,0 +1,181 @@
+package com.renderrichtext.renderer
+
+import com.renderrichtext.styles.BaseBlockStyle
+import com.renderrichtext.styles.BlockquoteStyle
+import com.renderrichtext.styles.CodeBlockStyle
+import com.renderrichtext.styles.HeadingStyle
+import com.renderrichtext.styles.ListStyle
+import com.renderrichtext.styles.ParagraphStyle
+
+enum class BlockType {
+  NONE,
+  PARAGRAPH,
+  HEADING,
+  BLOCKQUOTE,
+  UNORDERED_LIST,
+  ORDERED_LIST,
+  CODE_BLOCK,
+}
+
+data class BlockStyle(
+  val fontSize: Float,
+  val fontFamily: String,
+  val fontWeight: String,
+  val color: Int,
+)
+
+private data class BlockStyleEntry(
+  val blockType: BlockType,
+  val blockStyle: BlockStyle,
+  val headingLevel: Int,
+)
+
+class BlockStyleContext {
+  var currentBlockType = BlockType.NONE
+    private set
+
+  private var currentHeadingLevel = 0
+  private val blockStyleStack = ArrayDeque<BlockStyleEntry>()
+
+  var blockquoteDepth = 0
+  var listDepth = 0
+  var listType: ListType? = null
+  var listItemNumber = 0
+  var listMarkerExtra = 0f
+  var ancestorMarkerOffset = 0f
+  var listItemMarkerExtra = 0f
+  var listItemMarkerWidth: Float? = null
+  var taskItemCount = 0
+  var accumulatedIndent = 0
+
+  val listItemStarts = mutableListOf<Int>()
+
+  private val orderedListItemNumbers = ArrayDeque<Int>()
+
+  enum class ListType { UNORDERED, ORDERED }
+
+  private fun pushBlockStyle(
+    type: BlockType,
+    style: BaseBlockStyle,
+    headingLevel: Int = 0,
+  ) {
+    val entry =
+      BlockStyleEntry(
+        blockType = type,
+        blockStyle = BlockStyle(style.fontSize, style.fontFamily, style.fontWeight, style.color),
+        headingLevel = headingLevel,
+      )
+
+    blockStyleStack.addLast(entry)
+    currentBlockType = type
+    currentHeadingLevel = headingLevel
+  }
+
+  fun popBlockStyle() {
+    if (blockStyleStack.isNotEmpty()) {
+      blockStyleStack.removeLast()
+    }
+
+    val parentStyle = blockStyleStack.lastOrNull()
+    if (parentStyle != null) {
+      currentBlockType = parentStyle.blockType
+      currentHeadingLevel = parentStyle.headingLevel
+    } else {
+      currentBlockType = BlockType.NONE
+      currentHeadingLevel = 0
+    }
+  }
+
+  fun setParagraphStyle(style: ParagraphStyle) = pushBlockStyle(BlockType.PARAGRAPH, style)
+
+  fun setHeadingStyle(
+    style: HeadingStyle,
+    level: Int,
+  ) = pushBlockStyle(BlockType.HEADING, style, level)
+
+  fun setBlockquoteStyle(style: BlockquoteStyle) = pushBlockStyle(BlockType.BLOCKQUOTE, style)
+
+  fun setUnorderedListStyle(style: ListStyle) {
+    listType = ListType.UNORDERED
+    pushBlockStyle(BlockType.UNORDERED_LIST, style)
+  }
+
+  fun setOrderedListStyle(style: ListStyle) {
+    listType = ListType.ORDERED
+    pushBlockStyle(BlockType.ORDERED_LIST, style)
+  }
+
+  fun setCodeBlockStyle(style: CodeBlockStyle) = pushBlockStyle(BlockType.CODE_BLOCK, style)
+
+  fun incrementListItemNumber() {
+    listItemNumber++
+  }
+
+  fun resetListItemNumber(startNumber: Int = 1) {
+    // ListItemRenderer pre-increments, so the counter starts one below the
+    // first rendered number.
+    listItemNumber = startNumber - 1
+  }
+
+  fun pushOrderedListItemNumber() {
+    orderedListItemNumbers.addLast(listItemNumber)
+  }
+
+  fun popOrderedListItemNumber() {
+    if (orderedListItemNumbers.isNotEmpty()) {
+      listItemNumber = orderedListItemNumbers.removeLast()
+    }
+  }
+
+  fun clearListStyle() {
+    popBlockStyle()
+
+    if (listDepth == 0) {
+      listType = null
+      listItemNumber = 0
+      orderedListItemNumbers.clear()
+    }
+  }
+
+  /** Same font as the current block, with [color] as the base text color for nested inline nodes. */
+  fun pushInlineColor(color: Int) {
+    val current =
+      blockStyleStack.lastOrNull()
+        ?: throw IllegalStateException(
+          "BlockStyle is null. Inline renderers must be used within a block context.",
+        )
+    blockStyleStack.addLast(current.copy(blockStyle = current.blockStyle.copy(color = color)))
+  }
+
+  fun popInlineColor() {
+    popBlockStyle()
+  }
+
+  fun requireBlockStyle(): BlockStyle {
+    val entry = blockStyleStack.lastOrNull()
+    return entry?.blockStyle
+      ?: throw IllegalStateException(
+        "BlockStyle is null. Inline renderers must be used within a block context.",
+      )
+  }
+
+  fun currentBlockStyleOrNull(): BlockStyle? = blockStyleStack.lastOrNull()?.blockStyle
+
+  fun resetForNewRender() {
+    blockStyleStack.clear()
+    currentBlockType = BlockType.NONE
+    currentHeadingLevel = 0
+    blockquoteDepth = 0
+    listDepth = 0
+    listType = null
+    listItemNumber = 0
+    listMarkerExtra = 0f
+    ancestorMarkerOffset = 0f
+    listItemMarkerExtra = 0f
+    listItemMarkerWidth = null
+    taskItemCount = 0
+    accumulatedIndent = 0
+    listItemStarts.clear()
+    orderedListItemNumbers.clear()
+  }
+}

package/android/src/main/java/com/renderrichtext/renderer/BlockquoteRenderer.kt

@@ -0,0 +1,243 @@
+package com.renderrichtext.renderer
+
+import android.graphics.Paint
+import android.text.SpannableStringBuilder
+import android.text.Spanned
+import android.text.style.LineHeightSpan
+import com.renderrichtext.parser.TiptapASTNode
+import com.renderrichtext.spans.BlockquoteSpan
+import com.renderrichtext.spans.MarginBottomSpan
+import com.renderrichtext.utils.text.span.SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE
+import com.renderrichtext.utils.text.span.SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE_PRIORITY
+import com.renderrichtext.utils.text.span.SPAN_FLAGS_LINE_HEIGHT_PRIORITY
+import com.renderrichtext.utils.text.span.applyLineHeightSkippingImages
+import com.renderrichtext.utils.text.span.applyMarginBottom
+import com.renderrichtext.utils.text.span.applyMarginTop
+
+class BlockquoteRenderer(
+  private val config: RendererConfig,
+) : NodeRenderer {
+  override fun render(
+    node: TiptapASTNode,
+    builder: SpannableStringBuilder,
+    onLinkPress: ((String) -> Unit)?,
+    onLinkLongPress: ((String) -> Unit)?,
+    onFactoidPress: ((String) -> Unit)?,
+    factory: RendererFactory,
+  ) {
+    if (builder.isNotEmpty() && builder.last() != '\n') {
+      builder.append("\n")
+    }
+
+    val start = builder.length
+    val style = config.style.blockquoteStyle
+    val context = factory.blockStyleContext
+    val depth = context.blockquoteDepth
+
+    // Track depth to handle nested indentation levels
+    context.blockquoteDepth = depth + 1
+    context.setBlockquoteStyle(style)
+
+    try {
+      factory.renderChildren(node, builder, onLinkPress, onLinkLongPress, onFactoidPress)
+    } finally {
+      context.popBlockStyle()
+      context.blockquoteDepth = depth
+    }
+
+    if (builder.length == start) return
+    // The last child's margin sits on its terminating newline, so the extra
+    // descent is part of the last content line and the quote background paints
+    // it. That reads as a large gap under the text. Lift it off the box.
+    var end = detachTrailingContentMargin(builder, start, depth)
+    if (end == start) return
+    if (depth == 0 && end == builder.length && builder[end - 1] != '\n') {
+      builder.append('\n')
+      end = builder.length
+    }
+    val padding = style.padding.toInt()
+
+    var contentStart = start
+    if (padding > 0) {
+      builder.insert(start, "\n")
+      factory.shiftDeferredSpans(start, 1)
+      builder.setSpan(
+        BlockquotePaddingSpacerSpan(padding),
+        start,
+        start + 1,
+        SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+      )
+      contentStart = start + 1
+      end += 1
+    }
+
+    // Find immediately nested quotes to exclude them from this level's line-height/margins
+    val nestedRanges =
+      builder
+        .getSpans(contentStart, end, BlockquoteSpan::class.java)
+        .filter { it.depth == depth + 1 }
+        .map { builder.getSpanStart(it) to builder.getSpanEnd(it) }
+        .sortedBy { it.first }
+
+    // The accent bar / background span covers the full box, incl. the top spacer.
+    // Top priority draws it first, so inline pill/chip backgrounds paint on top of its fill.
+    builder.setSpan(
+      BlockquoteSpan(style, depth, factory.context, factory.styleCache),
+      start,
+      end,
+      SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE_PRIORITY,
+    )
+
+    applyLineHeightExcludingNested(builder, nestedRanges, contentStart, end, style.lineHeight)
+
+    if (padding > 0) {
+      builder.setSpan(
+        BlockquoteBoundaryPaddingSpan(padding),
+        contentStart,
+        end,
+        SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+      )
+    }
+
+    // Margins are only applied by the outermost (root) quote
+    if (depth == 0) {
+      applyMarginTop(builder, start, style.marginTop)
+      applyMarginBottom(builder, style.marginBottom)
+    }
+  }
+
+  /**
+   * The last block inside the quote ends with a [MarginBottomSpan] on its
+   * terminating newline. That span adds its margin to the content line's descent,
+   * and the quote background fills the whole line, so the margin shows up as
+   * extra space under the text.
+   *
+   * A root quote drops that margin and keeps a bare newline, so the quote's own
+   * margin (applied after the box) is a separate spacer line outside the
+   * background. A nested quote keeps the margin, but on a following spacer line
+   * the box does not cover, so the parent still gets a gap before the next sibling.
+   *
+   * Returns the exclusive end index the quote box should use.
+   */
+  private fun detachTrailingContentMargin(
+    builder: SpannableStringBuilder,
+    start: Int,
+    depth: Int,
+  ): Int {
+    val end = builder.length
+    if (end <= start || builder[end - 1] != '\n') return end
+
+    val newline = end - 1
+    val marginSpans =
+      builder.getSpans(newline, end, MarginBottomSpan::class.java).filter {
+        builder.getSpanStart(it) == newline && builder.getSpanEnd(it) == end
+      }
+    if (marginSpans.isEmpty()) return end
+
+    val margin = marginSpans.maxOf { it.marginBottom }
+    val spacerLine = newline == start || builder[newline - 1] == '\n'
+
+    if (spacerLine) {
+      if (depth == 0) {
+        marginSpans.forEach { builder.removeSpan(it) }
+        builder.delete(newline, end)
+        return newline
+      }
+      return newline
+    }
+
+    marginSpans.forEach { builder.removeSpan(it) }
+    if (depth > 0 && margin > 0f) {
+      val spacer = builder.length
+      builder.append('\n')
+      builder.setSpan(
+        MarginBottomSpan(margin),
+        spacer,
+        builder.length,
+        SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+      )
+      return end
+    }
+    return builder.length
+  }
+
+  /**
+   * A blockquote's top padding, rendered as a standalone spacer line of exactly
+   * [padding] px.
+   *
+   * Top padding cannot be added by growing the first content line's ascent:
+   * StaticLayout reuses one FontMetricsInt across a paragraph's soft-wrapped lines,
+   * so the inflated first-line metrics leak into the wrapped continuation line, where
+   * the line-height clamp then skews them into overlapping baselines. A spacer sits in
+   * its own paragraph, and setting absolute metrics keeps it fixed regardless of that
+   * reuse.
+   */
+  private class BlockquotePaddingSpacerSpan(
+    private val padding: Int,
+  ) : LineHeightSpan {
+    override fun chooseHeight(
+      text: CharSequence,
+      startLine: Int,
+      endLine: Int,
+      spanstartv: Int,
+      v: Int,
+      fm: Paint.FontMetricsInt,
+    ) {
+      fm.top = 0
+      fm.ascent = 0
+      fm.descent = padding
+      fm.bottom = padding
+    }
+  }
+
+  /**
+   * A blockquote's bottom padding, grown onto the last content line's descent (safe
+   * because no later line inherits its metrics; top padding uses
+   * [BlockquotePaddingSpacerSpan]).
+   *
+   * The span range can include trailing '\n'(s) that form no visible line, so the last
+   * drawn line ends before getSpanEnd; the comparison uses the visible content end.
+   */
+  private class BlockquoteBoundaryPaddingSpan(
+    private val padding: Int,
+  ) : LineHeightSpan {
+    override fun chooseHeight(
+      text: CharSequence,
+      startLine: Int,
+      endLine: Int,
+      spanstartv: Int,
+      v: Int,
+      fm: Paint.FontMetricsInt,
+    ) {
+      if (text !is Spanned) return
+
+      var contentEnd = text.getSpanEnd(this)
+      while (contentEnd > 0 && text[contentEnd - 1] == '\n') {
+        contentEnd--
+      }
+      if (endLine >= contentEnd) {
+        fm.descent += padding
+        fm.bottom += padding
+      }
+    }
+  }
+
+  private fun applyLineHeightExcludingNested(
+    builder: SpannableStringBuilder,
+    nestedRanges: List<Pair<Int, Int>>,
+    start: Int,
+    end: Int,
+    lineHeight: Float,
+  ) {
+    var currentPos = start
+    for ((nestedStart, nestedEnd) in nestedRanges) {
+      if (currentPos < nestedStart) {
+        applyLineHeightSkippingImages(builder, currentPos, nestedStart, lineHeight, SPAN_FLAGS_LINE_HEIGHT_PRIORITY)
+      }
+      currentPos = nestedEnd
+    }
+    if (currentPos < end) {
+      applyLineHeightSkippingImages(builder, currentPos, end, lineHeight, SPAN_FLAGS_LINE_HEIGHT_PRIORITY)
+    }
+  }
+}

package/android/src/main/java/com/renderrichtext/renderer/BlockquoteTextRenderer.kt

@@ -0,0 +1,56 @@
+package com.renderrichtext.renderer
+
+import android.text.SpannableStringBuilder
+import com.renderrichtext.parser.TiptapASTNode
+import com.renderrichtext.styles.BlockquoteStyle
+import com.renderrichtext.utils.text.span.SPAN_FLAGS_LINE_HEIGHT_PRIORITY
+import com.renderrichtext.utils.text.span.applyLineHeightSkippingImages
+
+/**
+ * Renders a GFM blockquote's own prose content - the nodes left after nested
+ * quotes, code blocks and other block segments have been split out - into a
+ * standalone buffer styled as blockquote text.
+ *
+ * It decorates a generic [Renderer.renderContent] pass rather than owning the
+ * render envelope itself: [push] enters the blockquote block style so text picks
+ * up the quote's font/color while still emitting block margins between children,
+ * matching the commonmark BlockquoteRenderer; [postProcess] applies the quote's
+ * line height once the builder is complete. It draws no border/background/padding
+ * - the BlockquoteContainerView draws the box.
+ */
+class BlockquoteTextRenderer(
+  private val style: BlockquoteStyle,
+) {
+  fun render(
+    renderer: Renderer,
+    nodes: List<TiptapASTNode>,
+    onLinkPress: ((String) -> Unit)?,
+    onLinkLongPress: ((String) -> Unit)?,
+    onFactoidPress: ((String) -> Unit)?,
+  ): SpannableStringBuilder = renderer.renderContent(nodes, onLinkPress, onLinkLongPress, onFactoidPress, block = this)
+
+  fun push(context: BlockStyleContext) {
+    context.blockquoteDepth += 1
+    context.setBlockquoteStyle(style)
+  }
+
+  fun pop(context: BlockStyleContext) {
+    context.popBlockStyle()
+    context.blockquoteDepth -= 1
+  }
+
+  fun postProcess(builder: SpannableStringBuilder) {
+    if (builder.isNotEmpty()) {
+      // Priority flag so this block-wide line height iterates before the per-block
+      // MarginBottomSpans, which then add their gap on top instead of being
+      // normalized away (see SPAN_FLAGS_LINE_HEIGHT_PRIORITY).
+      applyLineHeightSkippingImages(
+        builder,
+        0,
+        builder.length,
+        style.lineHeight,
+        SPAN_FLAGS_LINE_HEIGHT_PRIORITY,
+      )
+    }
+  }
+}

package/android/src/main/java/com/renderrichtext/renderer/CodeBlockRenderer.kt

@@ -0,0 +1,135 @@
+package com.renderrichtext.renderer
+
+import android.graphics.Paint
+import android.text.SpannableStringBuilder
+import android.text.Spanned
+import android.text.style.LineHeightSpan
+import com.renderrichtext.parser.TiptapASTNode
+import com.renderrichtext.spans.CodeBlockSpan
+import com.renderrichtext.spans.MarginBottomSpan
+import com.renderrichtext.spans.isLastDrawnLine
+import com.renderrichtext.utils.common.CodeBlockHighlighter
+import com.renderrichtext.utils.common.CodeBlockNode
+import com.renderrichtext.utils.text.span.SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE
+import com.renderrichtext.utils.text.span.applyMarginTop
+
+class CodeBlockRenderer(
+  private val config: RendererConfig,
+) : NodeRenderer {
+  override fun render(
+    node: TiptapASTNode,
+    builder: SpannableStringBuilder,
+    onLinkPress: ((String) -> Unit)?,
+    onLinkLongPress: ((String) -> Unit)?,
+    onFactoidPress: ((String) -> Unit)?,
+    factory: RendererFactory,
+  ) {
+    if (builder.isNotEmpty() && builder.last() != '\n') {
+      builder.append("\n")
+    }
+
+    val start = builder.length
+    val style = config.style.codeBlockStyle
+    val context = factory.blockStyleContext
+
+    applyMarginTop(builder, start, style.marginTop)
+
+    // Content starts after the potential 1-character marginTop spacer
+    val contentStart = start + (if (style.marginTop > 0) 1 else 0)
+
+    context.setCodeBlockStyle(style)
+
+    try {
+      factory.renderChildren(node, builder, onLinkPress, onLinkLongPress, onFactoidPress)
+    } finally {
+      context.popBlockStyle()
+    }
+
+    if (builder.length == contentStart) return
+
+    CodeBlockHighlighter.highlight(
+      builder,
+      CodeBlockNode.extractCode(node),
+      CodeBlockNode.language(node),
+      style,
+      contentStart,
+    )
+
+    // Terminate the content so the margin newline below is its own line. Sharing
+    // the last code line makes that line's descent grow by marginBottom, and the
+    // background paints the whole line — the bottom edge is then the margin, and
+    // it is not recognized as the last line, so the bottom corners stay square.
+    if (builder.last() != '\n') {
+      builder.append('\n')
+    }
+
+    val end = builder.length
+    val padding = style.padding.toInt()
+
+    // Apply background, borders, and horizontal padding to content only
+    builder.setSpan(
+      CodeBlockSpan(
+        style,
+        factory.context,
+        factory.styleCache,
+        context.accumulatedIndent,
+        CodeBlockNode.extractCode(node),
+        CodeBlockNode.language(node) ?: "",
+      ),
+      contentStart,
+      end,
+      SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+    )
+
+    // Apply vertical padding via line height manipulation
+    builder.setSpan(
+      CodeBlockBoundaryPaddingSpan(padding),
+      contentStart,
+      end,
+      SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+    )
+
+    val marginStart = builder.length
+    builder.append("\n")
+    builder.setSpan(
+      MarginBottomSpan(style.marginBottom),
+      marginStart,
+      builder.length,
+      SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+    )
+  }
+
+  /**
+   * Internal span to handle top/bottom padding by modifying font metrics.
+   */
+  private class CodeBlockBoundaryPaddingSpan(
+    private val padding: Int,
+  ) : LineHeightSpan {
+    override fun chooseHeight(
+      text: CharSequence,
+      startLine: Int,
+      endLine: Int,
+      spanstartv: Int,
+      v: Int,
+      fm: Paint.FontMetricsInt,
+    ) {
+      if (text !is Spanned) return
+
+      val spanStart = text.getSpanStart(this)
+      val spanEnd = text.getSpanEnd(this)
+
+      // Adjust ascent/top for the first line to create internal top padding
+      if (startLine == spanStart) {
+        fm.ascent -= padding
+        fm.top -= padding
+      }
+
+      // Same last-line test as CodeBlockSpan, so the bottom padding lands on the
+      // line that draws the bottom corners.
+      if (isLastDrawnLine(text, endLine, spanEnd)) {
+        fm.descent += padding
+        fm.bottom += padding
+      }
+    }
+  }
+}

package/android/src/main/java/com/renderrichtext/renderer/CodeRenderer.kt

@@ -0,0 +1,37 @@
+package com.renderrichtext.renderer
+
+import android.text.SpannableStringBuilder
+import com.renderrichtext.parser.TiptapASTNode
+import com.renderrichtext.spans.CodeBackgroundSpan
+import com.renderrichtext.spans.CodeSpan
+import com.renderrichtext.utils.text.span.SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE
+
+class CodeRenderer(
+  private val config: RendererConfig,
+) : NodeRenderer {
+  override fun render(
+    node: TiptapASTNode,
+    builder: SpannableStringBuilder,
+    onLinkPress: ((String) -> Unit)?,
+    onLinkLongPress: ((String) -> Unit)?,
+    onFactoidPress: ((String) -> Unit)?,
+    factory: RendererFactory,
+  ) {
+    if (node.children.isEmpty() || node.children.all { it.content.isEmpty() }) return
+
+    factory.renderWithSpan(builder, { node.children.forEach { builder.append(it.content) } }) { start, end, blockStyle ->
+      builder.setSpan(
+        CodeSpan(factory.styleCache, blockStyle),
+        start,
+        end,
+        SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+      )
+      builder.setSpan(
+        CodeBackgroundSpan(config.style),
+        start,
+        end,
+        SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+      )
+    }
+  }
+}

package/android/src/main/java/com/renderrichtext/renderer/EmphasisRenderer.kt

@@ -0,0 +1,28 @@
+package com.renderrichtext.renderer
+
+import android.text.SpannableStringBuilder
+import com.renderrichtext.parser.TiptapASTNode
+import com.renderrichtext.spans.EmphasisSpan
+import com.renderrichtext.utils.text.span.SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE
+
+class EmphasisRenderer(
+  private val config: RendererConfig,
+) : NodeRenderer {
+  override fun render(
+    node: TiptapASTNode,
+    builder: SpannableStringBuilder,
+    onLinkPress: ((String) -> Unit)?,
+    onLinkLongPress: ((String) -> Unit)?,
+    onFactoidPress: ((String) -> Unit)?,
+    factory: RendererFactory,
+  ) {
+    factory.renderWithSpan(builder, { factory.renderChildren(node, builder, onLinkPress, onLinkLongPress, onFactoidPress) }) { start, end, blockStyle ->
+      builder.setSpan(
+        EmphasisSpan(factory.styleCache, blockStyle),
+        start,
+        end,
+        SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+      )
+    }
+  }
+}