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

package/android/src/main/java/com/renderrichtext/spans/CodeBlockSpan.kt

@@ -0,0 +1,216 @@
+package com.renderrichtext.spans
+
+import android.content.Context
+import android.graphics.Canvas
+import android.graphics.Paint
+import android.graphics.Path
+import android.graphics.RectF
+import android.text.Layout
+import android.text.Spanned
+import android.text.TextPaint
+import android.text.style.LeadingMarginSpan
+import android.text.style.LineBackgroundSpan
+import android.text.style.MetricAffectingSpan
+import androidx.core.graphics.withSave
+import com.renderrichtext.renderer.SpanStyleCache
+import com.renderrichtext.styles.CodeBlockStyle
+import com.renderrichtext.utils.text.extensions.applyCodeBlockTextStyle
+import com.renderrichtext.utils.text.extensions.applyColorPreserving
+
+/**
+ * Draws the commonmark-flavor code block box as per-line strips. The visual
+ * conventions (half-stroke border inset, radius reduced by that inset) must
+ * stay in sync with the whole-rect box the github flavor draws in
+ * CodeBlockContainerView.
+ */
+class CodeBlockSpan(
+  private val codeBlockStyle: CodeBlockStyle,
+  private val context: Context,
+  private val styleCache: SpanStyleCache,
+  private val leadingIndent: Int = 0,
+  // Recovered by a tap on this span for onCodeBlockPress; unused by drawing.
+  val code: String = "",
+  val language: String = "",
+) : MetricAffectingSpan(),
+  LineBackgroundSpan,
+  LeadingMarginSpan {
+  private val path = Path()
+  private val rect = RectF()
+  private val arcRect = RectF()
+  private val radiiArray = FloatArray(8)
+
+  companion object {
+    private val sharedBackgroundPaint = Paint(Paint.ANTI_ALIAS_FLAG).apply { style = Paint.Style.FILL }
+    private val sharedBorderPaint =
+      Paint(Paint.ANTI_ALIAS_FLAG).apply {
+        style = Paint.Style.STROKE
+        strokeCap = Paint.Cap.BUTT
+        strokeJoin = Paint.Join.ROUND
+      }
+  }
+
+  private fun configureBackgroundPaint(): Paint =
+    sharedBackgroundPaint.apply {
+      color = codeBlockStyle.backgroundColor
+    }
+
+  private fun configureBorderPaint(): Paint =
+    sharedBorderPaint.apply {
+      strokeWidth = codeBlockStyle.borderWidth
+      color = codeBlockStyle.borderColor
+    }
+
+  override fun getLeadingMargin(first: Boolean): Int = codeBlockStyle.padding.toInt() + leadingIndent
+
+  override fun drawLeadingMargin(
+    c: Canvas?,
+    p: Paint?,
+    x: Int,
+    dir: Int,
+    top: Int,
+    baseline: Int,
+    bottom: Int,
+    text: CharSequence?,
+    start: Int,
+    end: Int,
+    first: Boolean,
+    layout: Layout?,
+  ) { /* Leading margin is handled by getLeadingMargin */ }
+
+  override fun updateMeasureState(tp: TextPaint) = applyTextStyle(tp)
+
+  override fun updateDrawState(tp: TextPaint) = applyTextStyle(tp)
+
+  override fun drawBackground(
+    canvas: Canvas,
+    p: Paint,
+    left: Int,
+    right: Int,
+    top: Int,
+    baseline: Int,
+    bottom: Int,
+    text: CharSequence,
+    start: Int,
+    end: Int,
+    lineNum: Int,
+  ) {
+    if (text !is Spanned) return
+
+    val spanStart = text.getSpanStart(this)
+    val spanEnd = text.getSpanEnd(this)
+    if (spanStart !in 0 until spanEnd) return
+
+    val isFirstLine = start == spanStart
+    val isLastLine = isLastDrawnLine(text, end, spanEnd)
+
+    val inset = codeBlockStyle.borderWidth / 2f
+
+    rect.set(
+      left.toFloat() + leadingIndent + inset,
+      top.toFloat() + (if (isFirstLine) inset else 0f),
+      right.toFloat() - inset,
+      bottom.toFloat() - (if (isLastLine) inset else 0f),
+    )
+    if (rect.left >= rect.right) return
+
+    val radius = codeBlockStyle.borderRadius
+    val adjRadius = if (radius > inset) radius - inset else radius
+
+    // Reset and fill radii array based on boundary state
+    radiiArray.fill(0f)
+    if (isFirstLine) {
+      radiiArray[0] = adjRadius
+      radiiArray[1] = adjRadius // Top-Left
+      radiiArray[2] = adjRadius
+      radiiArray[3] = adjRadius // Top-Right
+    }
+    if (isLastLine) {
+      radiiArray[4] = adjRadius
+      radiiArray[5] = adjRadius // Bottom-Right
+      radiiArray[6] = adjRadius
+      radiiArray[7] = adjRadius // Bottom-Left
+    }
+
+    path.reset()
+    path.addRoundRect(rect, radiiArray, Path.Direction.CW)
+
+    val backgroundPaint = configureBackgroundPaint()
+    val borderPaint = configureBorderPaint()
+
+    canvas.withSave {
+      drawPath(path, backgroundPaint)
+
+      if (codeBlockStyle.borderWidth > 0) {
+        val bLeft = rect.left
+        val bRight = rect.right
+        val bTop = rect.top
+        val bBottom = rect.bottom
+
+        when {
+          // Case: Single-line code block
+          isFirstLine && isLastLine -> {
+            drawPath(path, borderPaint)
+          }
+
+          // Case: Top of a multi-line block
+          isFirstLine -> {
+            drawLine(bLeft + adjRadius, bTop, bRight - adjRadius, bTop, borderPaint)
+            drawLine(bLeft, bTop + adjRadius, bLeft, bBottom, borderPaint)
+            drawLine(bRight, bTop + adjRadius, bRight, bBottom, borderPaint)
+
+            arcRect.set(bLeft, bTop, bLeft + 2 * adjRadius, bTop + 2 * adjRadius)
+            drawArc(arcRect, 180f, 90f, false, borderPaint)
+
+            arcRect.set(bRight - 2 * adjRadius, bTop, bRight, bTop + 2 * adjRadius)
+            drawArc(arcRect, 270f, 90f, false, borderPaint)
+          }
+
+          // Case: Bottom of a multi-line block
+          isLastLine -> {
+            drawLine(bLeft + adjRadius, bBottom, bRight - adjRadius, bBottom, borderPaint)
+            drawLine(bLeft, bTop, bLeft, bBottom - adjRadius, borderPaint)
+            drawLine(bRight, bTop, bRight, bBottom - adjRadius, borderPaint)
+
+            arcRect.set(bLeft, bBottom - 2 * adjRadius, bLeft + 2 * adjRadius, bBottom)
+            drawArc(arcRect, 90f, 90f, false, borderPaint)
+
+            arcRect.set(bRight - 2 * adjRadius, bBottom - 2 * adjRadius, bRight, bBottom)
+            drawArc(arcRect, 0f, 90f, false, borderPaint)
+          }
+
+          // Case: Middle lines only need vertical sides
+          else -> {
+            drawLine(bLeft, bTop, bLeft, bBottom, borderPaint)
+            drawLine(bRight, bTop, bRight, bBottom, borderPaint)
+          }
+        }
+      }
+    }
+  }
+
+  private fun applyTextStyle(tp: TextPaint) {
+    tp.applyCodeBlockTextStyle(codeBlockStyle, context)
+
+    tp.applyColorPreserving(codeBlockStyle.color, *styleCache.colorsToPreserve)
+  }
+}
+
+/**
+ * True when [lineEnd] is the last drawn line of a span ending at [spanEnd].
+ *
+ * The span range can include a trailing '\n' that belongs to the last content
+ * line rather than forming a line of its own, and the margin newline after the
+ * span can push the line end past getSpanEnd. Compare against the end of the
+ * visible content, same as [BlockquoteSpan]'s last-line check.
+ */
+internal fun isLastDrawnLine(
+  text: CharSequence,
+  lineEnd: Int,
+  spanEnd: Int,
+): Boolean {
+  var visibleEnd = spanEnd.coerceAtMost(text.length)
+  while (visibleEnd > 0 && text[visibleEnd - 1] == '\n') {
+    visibleEnd--
+  }
+  return lineEnd >= visibleEnd
+}

package/android/src/main/java/com/renderrichtext/spans/CodeSpan.kt

@@ -0,0 +1,32 @@
+package com.renderrichtext.spans
+
+import android.graphics.Typeface
+import android.text.TextPaint
+import android.text.style.MetricAffectingSpan
+import com.renderrichtext.renderer.BlockStyle
+import com.renderrichtext.renderer.SpanStyleCache
+
+class CodeSpan(
+  private val styleCache: SpanStyleCache,
+  private val blockStyle: BlockStyle,
+) : MetricAffectingSpan() {
+  override fun updateDrawState(tp: TextPaint) {
+    applyMonospacedFont(tp)
+    tp.color = styleCache.codeColor
+  }
+
+  override fun updateMeasureState(tp: TextPaint) {
+    applyMonospacedFont(tp)
+  }
+
+  private fun applyMonospacedFont(paint: TextPaint) {
+    paint.textSize = if (styleCache.codeFontSize > 0) styleCache.codeFontSize else blockStyle.fontSize
+    val preservedStyle = (paint.typeface?.style ?: 0) and (Typeface.BOLD or Typeface.ITALIC)
+    paint.typeface =
+      if (styleCache.codeFontFamily.isNotEmpty()) {
+        styleCache.getTypeface(styleCache.codeFontFamily, preservedStyle)
+      } else {
+        SpanStyleCache.getMonospaceTypeface(preservedStyle)
+      }
+  }
+}

package/android/src/main/java/com/renderrichtext/spans/EmphasisSpan.kt

@@ -0,0 +1,42 @@
+package com.renderrichtext.spans
+
+import android.graphics.Typeface
+import android.text.TextPaint
+import android.text.style.MetricAffectingSpan
+import com.renderrichtext.renderer.BlockStyle
+import com.renderrichtext.renderer.SpanStyleCache
+import com.renderrichtext.utils.text.extensions.applyColorPreserving
+
+class EmphasisSpan(
+  private val styleCache: SpanStyleCache,
+  private val blockStyle: BlockStyle,
+) : MetricAffectingSpan() {
+  override fun updateDrawState(tp: TextPaint) {
+    applyEmphasisStyle(tp)
+    applyEmphasisColor(tp)
+  }
+
+  override fun updateMeasureState(tp: TextPaint) {
+    applyEmphasisStyle(tp)
+  }
+
+  private fun applyEmphasisStyle(tp: TextPaint) {
+    val currentTypeface = tp.typeface ?: Typeface.DEFAULT
+    val isBold = (currentTypeface.style) and Typeface.BOLD != 0
+    val style = if (isBold) Typeface.BOLD_ITALIC else Typeface.ITALIC
+    tp.typeface =
+      if (styleCache.emphasisFontFamily.isNotEmpty()) {
+        val resolvedStyle = if (styleCache.emphasisFontStyle == "normal") Typeface.NORMAL else style
+        styleCache.getTypeface(styleCache.emphasisFontFamily, resolvedStyle)
+      } else if (styleCache.emphasisFontStyle == "normal") {
+        currentTypeface
+      } else {
+        Typeface.create(currentTypeface, style)
+      }
+  }
+
+  private fun applyEmphasisColor(tp: TextPaint) {
+    val colorToUse = styleCache.getEmphasisColorFor(blockStyle.color, tp.color)
+    tp.applyColorPreserving(colorToUse, *styleCache.colorsToPreserve)
+  }
+}

package/android/src/main/java/com/renderrichtext/spans/FactoidBackgroundSpan.kt

@@ -0,0 +1,265 @@
+package com.renderrichtext.spans
+
+import android.graphics.Canvas
+import android.graphics.Color
+import android.graphics.Paint
+import android.graphics.Path
+import android.graphics.RectF
+import android.text.Spanned
+import android.text.style.LineBackgroundSpan
+import com.renderrichtext.spoiler.isConcealedBySpoiler
+import com.renderrichtext.styles.StyleConfig
+import kotlin.math.max
+import kotlin.math.min
+
+class FactoidBackgroundSpan(
+  private val styleConfig: StyleConfig,
+  private val backgroundColorOverride: Int? = null,
+  private val borderColorOverride: Int? = null,
+) : LineBackgroundSpan {
+  companion object {
+    private const val CORNER_RADIUS = 10.0f
+    private const val BORDER_WIDTH = 1.0f
+    private const val PRESSED_DARKEN = 0.82f
+
+    private val sharedBackgroundPaint = Paint(Paint.ANTI_ALIAS_FLAG).apply { style = Paint.Style.FILL }
+    private val sharedBorderPaint =
+      Paint(Paint.ANTI_ALIAS_FLAG).apply {
+        style = Paint.Style.STROKE
+        strokeWidth = BORDER_WIDTH
+        strokeJoin = Paint.Join.ROUND
+        strokeCap = Paint.Cap.ROUND
+      }
+  }
+
+  // Reusable drawing objects per instance
+  private val rect = RectF()
+  private val path = Path()
+
+  override fun drawBackground(
+    canvas: Canvas,
+    p: Paint,
+    left: Int,
+    right: Int,
+    top: Int,
+    baseline: Int,
+    bottom: Int,
+    text: CharSequence,
+    start: Int,
+    end: Int,
+    lineNum: Int,
+  ) {
+    if (text !is Spanned) return
+
+    val spanStart = text.getSpanStart(this)
+    val spanEnd = text.getSpanEnd(this)
+    if (spanStart !in 0 until spanEnd) return
+
+    // The spoiler overlay only covers the text's glyph box, so a background drawn to the line's bounds
+    // would outline the hidden text around it.
+    if (text.isConcealedBySpoiler(maxOf(spanStart, start), minOf(spanEnd, end))) return
+
+    // Keep this span intact for semantic extraction. Draw only portions outside replacement pills,
+    // including a factoid surrounding a partially covered run.
+    fun drawUncoveredRange(
+      rangeStart: Int,
+      rangeEnd: Int,
+    ) {
+      if (max(rangeStart, start) >= min(rangeEnd, end)) return
+      // A padding mark that the line breaker left behind has no glyphs. Drawing it paints a
+      // chip on the previous line after the word has wrapped.
+      val inkStart = firstInk(text, rangeStart, rangeEnd)
+      val inkEnd = lastInk(text, rangeStart, rangeEnd)
+      if (max(inkStart, start) >= min(inkEnd, end)) return
+      val isFirst = inkStart in start until end
+      val isLast = inkEnd > start && inkEnd <= end
+
+      val finalBottom = adjustBottomForMargin(text, end, bottom)
+      val leadingMargin = InlineBackgroundGeometry.leadingMarginAt(text, start)
+      val origin = if (rangeStart >= start) rangeStart else inkStart.coerceAtLeast(start)
+      val startX =
+        if (isFirst) {
+          InlineBackgroundGeometry.horizontalOffset(text, start, end, origin, p, leadingMargin) + left
+        } else {
+          left.toFloat() + leadingMargin
+        }
+      // A line break used to run the background out to the line's right edge. Stop at the last glyph.
+      // When the edge mark is still on this line, measure through it so the gap stays inside the chip.
+      val glyphEnd = if (isLast && rangeEnd <= end) rangeEnd else lastGlyphOffset(text, start, end)
+      val endX = InlineBackgroundGeometry.horizontalOffset(text, start, end, glyphEnd, p, leadingMargin) + left
+
+      rect.set(min(startX, endX), top.toFloat(), max(startX, endX), finalBottom.toFloat())
+      // The stroke is centered on the path. Flush with the line edge, its outer half is clipped.
+      if (isFirst) {
+        val contentLeft = left + leadingMargin.toFloat()
+        if (rect.left <= contentLeft) rect.left = contentLeft + BORDER_WIDTH  / 2f
+      }
+
+      val factoidStyle = styleConfig.factoidStyle
+      var fill = backgroundColorOverride ?: factoidStyle.backgroundColor
+      if (isPressed(text)) fill = darken(fill)
+      sharedBackgroundPaint.color = fill
+      sharedBorderPaint.color = borderColorOverride ?: factoidStyle.borderColor
+      drawShapes(canvas, isFirst, isLast)
+    }
+
+    // Runs per factoid span, per line, per draw: only query for pills if the style can produce any.
+    val pills =
+      if (styleConfig.hasLinkPills) text.getSpans(spanStart, spanEnd, LinkPillSpan::class.java) else emptyArray()
+    if (pills.isEmpty()) {
+      drawUncoveredRange(spanStart, spanEnd)
+      return
+    }
+    if (pills.size > 1) pills.sortBy { text.getSpanStart(it) }
+    var cursor = spanStart
+    for (pill in pills) {
+      val coveredStart = max(spanStart, text.getSpanStart(pill))
+      val coveredEnd = min(spanEnd, text.getSpanEnd(pill))
+      if (coveredStart >= coveredEnd) continue
+      if (cursor < coveredStart) drawUncoveredRange(cursor, coveredStart)
+      cursor = max(cursor, coveredEnd)
+    }
+    drawUncoveredRange(cursor, spanEnd)
+  }
+
+  private fun drawShapes(
+    canvas: Canvas,
+    isFirst: Boolean,
+    isLast: Boolean,
+  ) {
+    path.reset()
+    path.addRoundRect(rect, createRadii(isFirst, isLast), Path.Direction.CW)
+    canvas.drawPath(path, sharedBackgroundPaint)
+    if (isFirst && isLast) {
+      canvas.drawPath(path, sharedBorderPaint)
+    } else {
+      drawOpenBorders(canvas, isFirst, isLast)
+    }
+  }
+
+  private fun drawOpenBorders(
+    canvas: Canvas,
+    isFirst: Boolean,
+    isLast: Boolean,
+  ) {
+    val r = CORNER_RADIUS
+    path.reset()
+
+    if (isFirst) {
+      path.moveTo(rect.right, rect.top)
+      path.lineTo(rect.left + r, rect.top)
+      path.quadTo(rect.left, rect.top, rect.left, rect.top + r)
+      path.lineTo(rect.left, rect.bottom - r)
+      path.quadTo(rect.left, rect.bottom, rect.left + r, rect.bottom)
+      path.lineTo(rect.right, rect.bottom)
+    } else if (isLast) {
+      path.moveTo(rect.left, rect.top)
+      path.lineTo(rect.right - r, rect.top)
+      path.quadTo(rect.right, rect.top, rect.right, rect.top + r)
+      path.lineTo(rect.right, rect.bottom - r)
+      path.quadTo(rect.right, rect.bottom, rect.right - r, rect.bottom)
+      path.lineTo(rect.left, rect.bottom)
+    } else {
+      path.moveTo(rect.left, rect.top)
+      path.lineTo(rect.right, rect.top)
+      path.moveTo(rect.left, rect.bottom)
+      path.lineTo(rect.right, rect.bottom)
+    }
+    canvas.drawPath(path, sharedBorderPaint)
+  }
+
+  private fun createRadii(
+    isFirst: Boolean,
+    isLast: Boolean,
+  ) = when {
+    isFirst && isLast -> {
+      floatArrayOf(
+        CORNER_RADIUS,
+        CORNER_RADIUS,
+        CORNER_RADIUS,
+        CORNER_RADIUS,
+        CORNER_RADIUS,
+        CORNER_RADIUS,
+        CORNER_RADIUS,
+        CORNER_RADIUS,
+      )
+    }
+
+    isFirst -> {
+      floatArrayOf(CORNER_RADIUS, CORNER_RADIUS, 0f, 0f, 0f, 0f, CORNER_RADIUS, CORNER_RADIUS)
+    }
+
+    isLast -> {
+      floatArrayOf(0f, 0f, CORNER_RADIUS, CORNER_RADIUS, CORNER_RADIUS, CORNER_RADIUS, 0f, 0f)
+    }
+
+    else -> {
+      floatArrayOf(0f, 0f, 0f, 0f, 0f, 0f, 0f, 0f)
+    }
+  }
+
+  private fun isPressed(text: Spanned): Boolean {
+    val spanStart = text.getSpanStart(this)
+    val spanEnd = text.getSpanEnd(this)
+    return text.getSpans(spanStart, spanEnd, FactoidSpan::class.java).any { span ->
+      span.pressed && text.getSpanStart(span) == spanStart && text.getSpanEnd(span) == spanEnd
+    }
+  }
+
+  private fun darken(color: Int): Int =
+    Color.argb(
+      Color.alpha(color),
+      (Color.red(color) * PRESSED_DARKEN).toInt(),
+      (Color.green(color) * PRESSED_DARKEN).toInt(),
+      (Color.blue(color) * PRESSED_DARKEN).toInt(),
+    )
+
+  /** First factoid character in [from, to) that is not a padding mark or whitespace. */
+  private fun firstInk(
+    text: CharSequence,
+    from: Int,
+    to: Int,
+  ): Int {
+    var index = from
+    while (index < to && isPaddingOrSpace(text[index])) index++
+    return index
+  }
+
+  /** Exclusive end of the last factoid character in [from, to) that is not a padding mark or whitespace. */
+  private fun lastInk(
+    text: CharSequence,
+    from: Int,
+    to: Int,
+  ): Int {
+    var index = to
+    while (index > from && isPaddingOrSpace(text[index - 1])) index--
+    return index
+  }
+
+  private fun isPaddingOrSpace(c: Char): Boolean = c == FactoidPaddingSpan.MARK || c.isWhitespace()
+
+  /** End of the visible glyphs on this line, before the break and any trailing space. */
+  private fun lastGlyphOffset(
+    text: CharSequence,
+    lineStart: Int,
+    lineEnd: Int,
+  ): Int {
+    var offset = lineEnd
+    while (offset > lineStart && text[offset - 1].isWhitespace()) offset--
+    return offset
+  }
+
+  private fun adjustBottomForMargin(
+    text: Spanned,
+    lineEnd: Int,
+    bottom: Int,
+  ): Int {
+    if (lineEnd <= 0 || lineEnd > text.length || text[lineEnd - 1] != '\n') return bottom
+    val marginSpans = text.getSpans(lineEnd - 1, lineEnd, MarginBottomSpan::class.java)
+    var adjusted = bottom
+    for (span in marginSpans) {
+      if (text.getSpanEnd(span) == lineEnd) adjusted -= span.marginBottom.toInt()
+    }
+    return adjusted
+  }
+}