react-native-enriched-markdown 0.1.0 → 0.1.1

package/android/src/main/java/com/swmansion/enriched/markdown/EnrichedMarkdownTextPackage.kt

@@ -0,0 +1,17 @@
+package com.swmansion.enriched.markdown
+
+import com.facebook.react.ReactPackage
+import com.facebook.react.bridge.NativeModule
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.uimanager.ViewManager
+import java.util.ArrayList
+
+class EnrichedMarkdownTextPackage : ReactPackage {
+  override fun createViewManagers(reactContext: ReactApplicationContext): List<ViewManager<*, *>> {
+    val viewManagers: MutableList<ViewManager<*, *>> = ArrayList()
+    viewManagers.add(EnrichedMarkdownTextManager())
+    return viewManagers
+  }
+
+  override fun createNativeModules(reactContext: ReactApplicationContext): List<NativeModule> = emptyList()
+}

package/android/src/main/java/com/swmansion/enriched/markdown/MeasurementStore.kt

@@ -0,0 +1,165 @@
+package com.swmansion.enriched.markdown
+
+import android.content.Context
+import android.graphics.Typeface
+import android.graphics.text.LineBreaker
+import android.os.Build
+import android.text.StaticLayout
+import android.text.TextPaint
+import com.facebook.react.bridge.ReadableMap
+import com.facebook.react.uimanager.PixelUtil
+import com.facebook.yoga.YogaMeasureMode
+import com.facebook.yoga.YogaMeasureOutput
+import java.util.concurrent.ConcurrentHashMap
+import kotlin.math.ceil
+
+/**
+ * Manages text measurements for ShadowNode layout.
+ * Initial estimate uses raw markdown; accurate measurement after rendering via store().
+ */
+object MeasurementStore {
+  private data class PaintParams(
+    val typeface: Typeface,
+    val fontSize: Float,
+  )
+
+  private data class MeasurementParams(
+    val cachedWidth: Float,
+    val cachedSize: Long,
+    val spannable: CharSequence?,
+    val paintParams: PaintParams,
+  )
+
+  private val data = ConcurrentHashMap<Int, MeasurementParams>()
+
+  private val measurePaint = TextPaint()
+
+  /** Updates measurement with rendered Spannable. Returns true if height changed. */
+  fun store(
+    id: Int,
+    spannable: CharSequence?,
+    paint: TextPaint,
+  ): Boolean {
+    val cached = data[id]
+    val width = cached?.cachedWidth ?: 0f
+    val oldSize = cached?.cachedSize ?: 0L
+    val paintParams = PaintParams(paint.typeface ?: Typeface.DEFAULT, paint.textSize)
+
+    val newSize = measure(width, spannable, paint)
+    data[id] = MeasurementParams(width, newSize, spannable, paintParams)
+    return oldSize != newSize
+  }
+
+  fun release(id: Int) {
+    data.remove(id)
+  }
+
+  /** Main entry point for ShadowNode measurement. */
+  fun getMeasureById(
+    context: Context,
+    id: Int?,
+    width: Float,
+    height: Float,
+    heightMode: YogaMeasureMode?,
+    props: ReadableMap?,
+  ): Long {
+    val size = getMeasureByIdInternal(id, width, props)
+    val resultHeight = YogaMeasureOutput.getHeight(size)
+
+    if (heightMode === YogaMeasureMode.AT_MOST) {
+      val maxHeight = PixelUtil.toDIPFromPixel(height)
+      val finalHeight = resultHeight.coerceAtMost(maxHeight)
+      return YogaMeasureOutput.make(
+        YogaMeasureOutput.getWidth(size),
+        finalHeight,
+      )
+    }
+
+    return size
+  }
+
+  private fun getMeasureByIdInternal(
+    id: Int?,
+    width: Float,
+    props: ReadableMap?,
+  ): Long {
+    val safeId = id ?: return initialMeasure(null, width, props)
+    val cached = data[safeId] ?: return initialMeasure(safeId, width, props)
+
+    // Width changed or not yet measured - re-measure with cached content
+    if (cached.cachedWidth != width || cached.cachedSize == 0L) {
+      val newSize = measure(width, cached.spannable, cached.paintParams)
+      data[safeId] = MeasurementParams(width, newSize, cached.spannable, cached.paintParams)
+      return newSize
+    }
+
+    return cached.cachedSize
+  }
+
+  /** Fast estimate using raw markdown text. */
+  private fun initialMeasure(
+    id: Int?,
+    width: Float,
+    props: ReadableMap?,
+  ): Long {
+    val markdown = props?.getString("markdown")?.ifEmpty { "I" } ?: "I"
+    val fontSize = getInitialFontSize(props)
+    val paintParams = PaintParams(Typeface.DEFAULT, fontSize)
+
+    val size = measure(width, markdown, paintParams)
+
+    if (id != null) {
+      data[id] = MeasurementParams(width, size, markdown, paintParams)
+    }
+
+    return size
+  }
+
+  private fun getInitialFontSize(props: ReadableMap?): Float {
+    val styleMap = props?.getMap("markdownStyle")
+    val fontSize = styleMap?.getMap("paragraph")?.getDouble("fontSize")?.toFloat() ?: 16f
+    return ceil(PixelUtil.toPixelFromSP(fontSize))
+  }
+
+  private fun measure(
+    maxWidth: Float,
+    text: CharSequence?,
+    paintParams: PaintParams,
+  ): Long {
+    measurePaint.reset()
+    measurePaint.typeface = paintParams.typeface
+    measurePaint.textSize = paintParams.fontSize
+    return measure(maxWidth, text, measurePaint)
+  }
+
+  private fun measure(
+    maxWidth: Float,
+    text: CharSequence?,
+    paint: TextPaint,
+  ): Long {
+    val content = text ?: ""
+    val safeWidth = ceil(maxWidth).toInt().coerceAtLeast(1)
+
+    val builder =
+      StaticLayout.Builder
+        .obtain(content, 0, content.length, paint, safeWidth)
+        .setIncludePad(false)
+        .setLineSpacing(0f, 1f)
+
+    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+      builder.setBreakStrategy(LineBreaker.BREAK_STRATEGY_HIGH_QUALITY)
+    }
+
+    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.P) {
+      builder.setUseLineSpacingFromFallbacks(true)
+    }
+
+    val layout = builder.build()
+    val measuredHeight = layout.height.toFloat()
+
+    return YogaMeasureOutput.make(
+      PixelUtil.toDIPFromPixel(maxWidth),
+      PixelUtil.toDIPFromPixel(measuredHeight),
+    )
+  }
+}

package/android/src/main/java/com/swmansion/enriched/markdown/events/LinkPressEvent.kt

@@ -0,0 +1,23 @@
+package com.swmansion.enriched.markdown.events
+
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.bridge.WritableMap
+import com.facebook.react.uimanager.events.Event
+
+class LinkPressEvent(
+  surfaceId: Int,
+  viewId: Int,
+  private val url: String,
+) : Event<LinkPressEvent>(surfaceId, viewId) {
+  override fun getEventName(): String = EVENT_NAME
+
+  override fun getEventData(): WritableMap {
+    val eventData: WritableMap = Arguments.createMap()
+    eventData.putString("url", url)
+    return eventData
+  }
+
+  companion object {
+    const val EVENT_NAME: String = "onLinkPress"
+  }
+}

package/android/src/main/java/com/swmansion/enriched/markdown/parser/MarkdownASTNode.kt

@@ -0,0 +1,29 @@
+package com.swmansion.enriched.markdown.parser
+
+data class MarkdownASTNode(
+  val type: NodeType,
+  val content: String = "",
+  val attributes: Map<String, String> = emptyMap(),
+  val children: List<MarkdownASTNode> = emptyList(),
+) {
+  enum class NodeType {
+    Document,
+    Paragraph,
+    Text,
+    Link,
+    Heading,
+    LineBreak,
+    Strong,
+    Emphasis,
+    Code,
+    Image,
+    Blockquote,
+    UnorderedList,
+    OrderedList,
+    ListItem,
+    CodeBlock,
+    ThematicBreak,
+  }
+
+  fun getAttribute(key: String): String? = attributes[key]
+}

package/android/src/main/java/com/swmansion/enriched/markdown/parser/Parser.kt

@@ -0,0 +1,48 @@
+package com.swmansion.enriched.markdown.parser
+
+import android.util.Log
+
+class Parser {
+  companion object {
+    init {
+      try {
+        // Library name must follow react_codegen_<ComponentName> convention
+        // required by React Native Fabric's CMake build system.
+        // md4c parser is bundled in the same shared library to avoid
+        // multiple library loading and complex linking dependencies.
+        System.loadLibrary("react_codegen_EnrichedMarkdownTextSpec")
+      } catch (e: UnsatisfiedLinkError) {
+        Log.e("MarkdownParser", "Failed to load native library", e)
+      }
+    }
+
+    @JvmStatic
+    private external fun nativeParseMarkdown(markdown: String): MarkdownASTNode?
+
+    /**
+     * Shared parser instance. Parser is stateless and thread-safe, so it can be reused
+     * across all EnrichedMarkdownText instances to avoid unnecessary allocations.
+     */
+    val shared: Parser = Parser()
+  }
+
+  fun parseMarkdown(markdown: String): MarkdownASTNode? {
+    if (markdown.isBlank()) {
+      return null
+    }
+
+    try {
+      val ast = nativeParseMarkdown(markdown)
+
+      if (ast != null) {
+        return ast
+      } else {
+        Log.w("MarkdownParser", "Native parser returned null")
+        return null
+      }
+    } catch (e: Exception) {
+      Log.e("MarkdownParser", "MD4C parsing failed: ${e.message}", e)
+      return null
+    }
+  }
+}

package/android/src/main/java/com/swmansion/enriched/markdown/renderer/BlockStyleContext.kt

@@ -0,0 +1,166 @@
+package com.swmansion.enriched.markdown.renderer
+
+import com.swmansion.enriched.markdown.styles.BaseBlockStyle
+import com.swmansion.enriched.markdown.styles.BlockquoteStyle
+import com.swmansion.enriched.markdown.styles.CodeBlockStyle
+import com.swmansion.enriched.markdown.styles.HeadingStyle
+import com.swmansion.enriched.markdown.styles.ListStyle
+import com.swmansion.enriched.markdown.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 class MutableBlockStyle {
+  var fontSize: Float = 0f
+  var fontFamily: String = ""
+  var fontWeight: String = ""
+  var color: Int = 0
+  var isDirty: Boolean = false
+
+  fun updateFrom(style: BaseBlockStyle) {
+    fontSize = style.fontSize
+    fontFamily = style.fontFamily
+    fontWeight = style.fontWeight
+    color = style.color
+    isDirty = true
+  }
+
+  fun toImmutable(): BlockStyle = BlockStyle(fontSize, fontFamily, fontWeight, color)
+
+  fun clear() {
+    isDirty = false
+  }
+}
+
+class BlockStyleContext {
+  var currentBlockType = BlockType.NONE
+    private set
+
+  private val mutableBlockStyle = MutableBlockStyle()
+  private var cachedBlockStyle: BlockStyle? = null
+  private var currentHeadingLevel = 0
+
+  var blockquoteDepth = 0
+  var listDepth = 0
+  var listType: ListType? = null
+  var listItemNumber = 0
+
+  // Optimization: ArrayDeque is more efficient for stack operations than MutableList
+  private val orderedListItemNumbers = ArrayDeque<Int>()
+
+  enum class ListType { UNORDERED, ORDERED }
+
+  private fun updateBlockStyle(
+    type: BlockType,
+    style: BaseBlockStyle,
+    headingLevel: Int = 0,
+  ) {
+    currentBlockType = type
+    currentHeadingLevel = headingLevel
+    // Update mutable style in place - no allocation here
+    mutableBlockStyle.updateFrom(style)
+    // Invalidate cached immutable copy
+    cachedBlockStyle = null
+  }
+
+  // Unified Setters
+  fun setParagraphStyle(style: ParagraphStyle) = updateBlockStyle(BlockType.PARAGRAPH, style)
+
+  fun setHeadingStyle(
+    style: HeadingStyle,
+    level: Int,
+  ) = updateBlockStyle(BlockType.HEADING, style, level)
+
+  fun setBlockquoteStyle(style: BlockquoteStyle) = updateBlockStyle(BlockType.BLOCKQUOTE, style)
+
+  fun setUnorderedListStyle(style: ListStyle) {
+    listType = ListType.UNORDERED
+    updateBlockStyle(BlockType.UNORDERED_LIST, style)
+  }
+
+  fun setOrderedListStyle(style: ListStyle) {
+    listType = ListType.ORDERED
+    updateBlockStyle(BlockType.ORDERED_LIST, style)
+  }
+
+  fun setCodeBlockStyle(style: CodeBlockStyle) = updateBlockStyle(BlockType.CODE_BLOCK, style)
+
+  // List State Management
+  fun isInsideBlockElement(): Boolean = blockquoteDepth > 0 || listDepth > 0
+
+  fun incrementListItemNumber() {
+    listItemNumber++
+  }
+
+  fun resetListItemNumber() {
+    listItemNumber = 0
+  }
+
+  // Using ArrayDeque methods for clarity: addLast/removeLast
+  fun pushOrderedListItemNumber() {
+    orderedListItemNumbers.addLast(listItemNumber)
+  }
+
+  fun popOrderedListItemNumber() {
+    if (orderedListItemNumbers.isNotEmpty()) {
+      listItemNumber = orderedListItemNumbers.removeLast()
+    }
+  }
+
+  fun clearListStyle() {
+    // Only trigger full reset when we have completely exited all nested lists
+    if (listDepth == 0) {
+      reset()
+    }
+  }
+
+  private fun reset() {
+    clearBlockStyle()
+    listType = null
+    listItemNumber = 0
+    orderedListItemNumbers.clear()
+  }
+
+  fun requireBlockStyle(): BlockStyle {
+    if (!mutableBlockStyle.isDirty) {
+      throw IllegalStateException(
+        "BlockStyle is null. Inline renderers must be used within a block context.",
+      )
+    }
+    // Create immutable copy only when needed, cache for reuse within same block
+    return cachedBlockStyle ?: mutableBlockStyle.toImmutable().also { cachedBlockStyle = it }
+  }
+
+  fun clearBlockStyle() {
+    currentBlockType = BlockType.NONE
+    mutableBlockStyle.clear()
+    cachedBlockStyle = null
+    currentHeadingLevel = 0
+  }
+
+  fun resetForNewRender() {
+    currentBlockType = BlockType.NONE
+    mutableBlockStyle.clear()
+    cachedBlockStyle = null
+    currentHeadingLevel = 0
+    blockquoteDepth = 0
+    listDepth = 0
+    listType = null
+    listItemNumber = 0
+    orderedListItemNumbers.clear()
+  }
+}

package/android/src/main/java/com/swmansion/enriched/markdown/renderer/BlockquoteRenderer.kt

@@ -0,0 +1,89 @@
+package com.swmansion.enriched.markdown.renderer
+
+import android.text.SpannableStringBuilder
+import com.swmansion.enriched.markdown.parser.MarkdownASTNode
+import com.swmansion.enriched.markdown.spans.BlockquoteSpan
+import com.swmansion.enriched.markdown.spans.MarginBottomSpan
+import com.swmansion.enriched.markdown.utils.SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE
+import com.swmansion.enriched.markdown.utils.createLineHeightSpan
+
+class BlockquoteRenderer(
+  private val config: RendererConfig,
+) : NodeRenderer {
+  override fun render(
+    node: MarkdownASTNode,
+    builder: SpannableStringBuilder,
+    onLinkPress: ((String) -> Unit)?,
+    factory: RendererFactory,
+  ) {
+    val start = builder.length
+    val style = config.style.blockquoteStyle
+    val context = factory.blockStyleContext
+    val depth = context.blockquoteDepth
+
+    // 1. Context management
+    context.blockquoteDepth = depth + 1
+    context.setBlockquoteStyle(style)
+
+    try {
+      factory.renderChildren(node, builder, onLinkPress)
+    } finally {
+      context.clearBlockStyle()
+      context.blockquoteDepth = depth
+    }
+
+    if (builder.length == start) return
+    val end = builder.length
+
+    // 2. Identify Nested Ranges (Essential for excluding them from parent-level styles)
+    val nestedRanges =
+      builder
+        .getSpans(start, end, BlockquoteSpan::class.java)
+        .filter { it.depth == depth + 1 }
+        .map { builder.getSpanStart(it) to builder.getSpanEnd(it) }
+        .sortedBy { it.first }
+
+    // 3. Apply the Accent Bar Span (Must cover the full range for continuity)
+    builder.setSpan(
+      BlockquoteSpan(style, depth, factory.context, factory.styleCache),
+      start,
+      end,
+      SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+    )
+
+    // 4. Fragmented Styling Logic
+    // We apply line height and margin specifically to the segments that are NOT nested quotes.
+    applySpansExcludingNested(builder, nestedRanges, start, end, createLineHeightSpan(style.lineHeight))
+
+    // 5. Root-level Spacing
+    if (depth == 0 && style.marginBottom > 0) {
+      val spacerLocation = builder.length
+      builder.append("\n") // Physical break
+      builder.setSpan(
+        MarginBottomSpan(style.marginBottom),
+        spacerLocation,
+        builder.length,
+        SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+      )
+    }
+  }
+
+  private fun applySpansExcludingNested(
+    builder: SpannableStringBuilder,
+    nestedRanges: List<Pair<Int, Int>>,
+    start: Int,
+    end: Int,
+    span: Any, // Changed to Any to handle both LineHeight and MarginBottom spans
+  ) {
+    var currentPos = start
+    for ((nestedStart, nestedEnd) in nestedRanges) {
+      if (currentPos < nestedStart) {
+        builder.setSpan(span, currentPos, nestedStart, SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE)
+      }
+      currentPos = nestedEnd
+    }
+    if (currentPos < end) {
+      builder.setSpan(span, currentPos, end, SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE)
+    }
+  }
+}

package/android/src/main/java/com/swmansion/enriched/markdown/renderer/CodeBlockRenderer.kt

@@ -0,0 +1,105 @@
+package com.swmansion.enriched.markdown.renderer
+
+import android.graphics.Paint
+import android.text.SpannableStringBuilder
+import android.text.Spanned
+import android.text.style.LineHeightSpan
+import com.swmansion.enriched.markdown.parser.MarkdownASTNode
+import com.swmansion.enriched.markdown.spans.CodeBlockSpan
+import com.swmansion.enriched.markdown.spans.MarginBottomSpan
+import com.swmansion.enriched.markdown.utils.SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE
+
+class CodeBlockRenderer(
+  private val config: RendererConfig,
+) : NodeRenderer {
+  override fun render(
+    node: MarkdownASTNode,
+    builder: SpannableStringBuilder,
+    onLinkPress: ((String) -> Unit)?,
+    factory: RendererFactory,
+  ) {
+    val start = builder.length
+    val style = config.style.codeBlockStyle
+    val context = factory.blockStyleContext
+
+    // Set code block style in context for children to inherit
+    context.setCodeBlockStyle(style)
+
+    try {
+      // Render children (code content)
+      factory.renderChildren(node, builder, onLinkPress)
+    } finally {
+      context.clearBlockStyle()
+    }
+
+    // Safety check for empty code blocks
+    if (builder.length == start) return
+
+    val end = builder.length
+    val padding = style.padding.toInt()
+
+    // 1. Apply CodeBlockSpan (Handles Background, Borders, and Horizontal Padding)
+    // Matches the logic in the updated CodeBlockSpan for full-width support
+    builder.setSpan(
+      CodeBlockSpan(style, factory.context, factory.styleCache),
+      start,
+      end,
+      SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+    )
+
+    // 2. Apply Boundary Vertical Padding
+    builder.setSpan(
+      CodeBlockBoundaryPaddingSpan(padding),
+      start,
+      end,
+      SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE,
+    )
+
+    // 3. Apply External Margin Bottom
+    if (style.marginBottom > 0) {
+      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)
+
+      // Apply top vertical padding to the first line fragment
+      if (startLine == spanStart) {
+        fm.ascent -= padding
+        fm.top -= padding
+      }
+
+      // Apply bottom vertical padding to the last line fragment
+      // Checks for both character index and trailing newlines to ensure a tight fit
+      val isLastLine = endLine == spanEnd || (spanEnd <= endLine && text[spanEnd - 1] == '\n')
+      if (isLastLine) {
+        fm.descent += padding
+        fm.bottom += padding
+      }
+    }
+  }
+}

package/android/src/main/java/com/swmansion/enriched/markdown/renderer/CodeRenderer.kt

@@ -0,0 +1,35 @@
+package com.swmansion.enriched.markdown.renderer
+
+import android.text.SpannableStringBuilder
+import com.swmansion.enriched.markdown.parser.MarkdownASTNode
+import com.swmansion.enriched.markdown.spans.CodeBackgroundSpan
+import com.swmansion.enriched.markdown.spans.CodeSpan
+import com.swmansion.enriched.markdown.utils.SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE
+
+class CodeRenderer(
+  private val config: RendererConfig,
+) : NodeRenderer {
+  override fun render(
+    node: MarkdownASTNode,
+    builder: SpannableStringBuilder,
+    onLinkPress: ((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/swmansion/enriched/markdown/renderer/DocumentRenderer.kt

@@ -0,0 +1,15 @@
+package com.swmansion.enriched.markdown.renderer
+
+import android.text.SpannableStringBuilder
+import com.swmansion.enriched.markdown.parser.MarkdownASTNode
+
+class DocumentRenderer : NodeRenderer {
+  override fun render(
+    node: MarkdownASTNode,
+    builder: SpannableStringBuilder,
+    onLinkPress: ((String) -> Unit)?,
+    factory: RendererFactory,
+  ) {
+    factory.renderChildren(node, builder, onLinkPress)
+  }
+}