react-native-enriched-markdown-scaffold 0.7.4-scaffold.6 → 0.7.4-scaffold.8

package/android/generated/jni/react/renderer/components/EnrichedMarkdownTextSpec/Props.h

@@ -1534,6 +1534,7 @@ struct EnrichedMarkdownMarkdownStyleMathStruct {
   Float marginTop{0.0};
   Float marginBottom{0.0};
   std::string textAlign{};
+  std::string fontWeight{};
 
 
 #ifdef RN_SERIALIZABLE_STATE
@@ -1548,6 +1549,7 @@ struct EnrichedMarkdownMarkdownStyleMathStruct {
     result["marginTop"] = marginTop;
     result["marginBottom"] = marginBottom;
     result["textAlign"] = textAlign;
+    result["fontWeight"] = fontWeight;
     return result;
   }
 #endif
@@ -1584,6 +1586,10 @@ static inline void fromRawValue(const PropsParserContext& context, const RawValu
   if (tmp_textAlign != map.end()) {
     fromRawValue(context, tmp_textAlign->second, result.textAlign);
   }
+  auto tmp_fontWeight = map.find("fontWeight");
+  if (tmp_fontWeight != map.end()) {
+    fromRawValue(context, tmp_fontWeight->second, result.fontWeight);
+  }
 }
 
 static inline std::string toString(const EnrichedMarkdownMarkdownStyleMathStruct &value) {
@@ -1598,6 +1604,8 @@ static inline folly::dynamic toDynamic(const EnrichedMarkdownMarkdownStyleMathSt
 
 struct EnrichedMarkdownMarkdownStyleInlineMathStruct {
   SharedColor color{};
+  Float paddingVertical{0.0};
+  std::string fontWeight{};
 
 
 #ifdef RN_SERIALIZABLE_STATE
@@ -1606,6 +1614,8 @@ struct EnrichedMarkdownMarkdownStyleInlineMathStruct {
   folly::dynamic toDynamic() const {
     folly::dynamic result = folly::dynamic::object();
     result["color"] = ::facebook::react::toDynamic(color);
+    result["paddingVertical"] = paddingVertical;
+    result["fontWeight"] = fontWeight;
     return result;
   }
 #endif
@@ -1618,6 +1628,14 @@ static inline void fromRawValue(const PropsParserContext& context, const RawValu
   if (tmp_color != map.end()) {
     fromRawValue(context, tmp_color->second, result.color);
   }
+  auto tmp_paddingVertical = map.find("paddingVertical");
+  if (tmp_paddingVertical != map.end()) {
+    fromRawValue(context, tmp_paddingVertical->second, result.paddingVertical);
+  }
+  auto tmp_fontWeight = map.find("fontWeight");
+  if (tmp_fontWeight != map.end()) {
+    fromRawValue(context, tmp_fontWeight->second, result.fontWeight);
+  }
 }
 
 static inline std::string toString(const EnrichedMarkdownMarkdownStyleInlineMathStruct &value) {
@@ -2804,6 +2822,7 @@ struct EnrichedMarkdownTextInputMarkdownStyleMathStruct {
   Float paddingVertical{0.0};
   SharedColor selectedBackgroundColor{};
   SharedColor selectedBorderColor{};
+  std::string fontWeight{};
 
 
 #ifdef RN_SERIALIZABLE_STATE
@@ -2821,6 +2840,7 @@ struct EnrichedMarkdownTextInputMarkdownStyleMathStruct {
     result["paddingVertical"] = paddingVertical;
     result["selectedBackgroundColor"] = ::facebook::react::toDynamic(selectedBackgroundColor);
     result["selectedBorderColor"] = ::facebook::react::toDynamic(selectedBorderColor);
+    result["fontWeight"] = fontWeight;
     return result;
   }
 #endif
@@ -2869,6 +2889,10 @@ static inline void fromRawValue(const PropsParserContext& context, const RawValu
   if (tmp_selectedBorderColor != map.end()) {
     fromRawValue(context, tmp_selectedBorderColor->second, result.selectedBorderColor);
   }
+  auto tmp_fontWeight = map.find("fontWeight");
+  if (tmp_fontWeight != map.end()) {
+    fromRawValue(context, tmp_fontWeight->second, result.fontWeight);
+  }
 }
 
 static inline std::string toString(const EnrichedMarkdownTextInputMarkdownStyleMathStruct &value) {
@@ -2892,6 +2916,7 @@ struct EnrichedMarkdownTextInputMarkdownStyleMathBlockStruct {
   Float paddingVertical{0.0};
   SharedColor selectedBackgroundColor{};
   SharedColor selectedBorderColor{};
+  std::string fontWeight{};
   Float marginTop{0.0};
   Float marginBottom{0.0};
   std::string alignment{};
@@ -2912,6 +2937,7 @@ struct EnrichedMarkdownTextInputMarkdownStyleMathBlockStruct {
     result["paddingVertical"] = paddingVertical;
     result["selectedBackgroundColor"] = ::facebook::react::toDynamic(selectedBackgroundColor);
     result["selectedBorderColor"] = ::facebook::react::toDynamic(selectedBorderColor);
+    result["fontWeight"] = fontWeight;
     result["marginTop"] = marginTop;
     result["marginBottom"] = marginBottom;
     result["alignment"] = alignment;
@@ -2963,6 +2989,10 @@ static inline void fromRawValue(const PropsParserContext& context, const RawValu
   if (tmp_selectedBorderColor != map.end()) {
     fromRawValue(context, tmp_selectedBorderColor->second, result.selectedBorderColor);
   }
+  auto tmp_fontWeight = map.find("fontWeight");
+  if (tmp_fontWeight != map.end()) {
+    fromRawValue(context, tmp_fontWeight->second, result.fontWeight);
+  }
   auto tmp_marginTop = map.find("marginTop");
   if (tmp_marginTop != map.end()) {
     fromRawValue(context, tmp_marginTop->second, result.marginTop);
@@ -4872,6 +4902,7 @@ struct EnrichedMarkdownTextMarkdownStyleMathStruct {
   Float marginTop{0.0};
   Float marginBottom{0.0};
   std::string textAlign{};
+  std::string fontWeight{};
 
 
 #ifdef RN_SERIALIZABLE_STATE
@@ -4886,6 +4917,7 @@ struct EnrichedMarkdownTextMarkdownStyleMathStruct {
     result["marginTop"] = marginTop;
     result["marginBottom"] = marginBottom;
     result["textAlign"] = textAlign;
+    result["fontWeight"] = fontWeight;
     return result;
   }
 #endif
@@ -4922,6 +4954,10 @@ static inline void fromRawValue(const PropsParserContext& context, const RawValu
   if (tmp_textAlign != map.end()) {
     fromRawValue(context, tmp_textAlign->second, result.textAlign);
   }
+  auto tmp_fontWeight = map.find("fontWeight");
+  if (tmp_fontWeight != map.end()) {
+    fromRawValue(context, tmp_fontWeight->second, result.fontWeight);
+  }
 }
 
 static inline std::string toString(const EnrichedMarkdownTextMarkdownStyleMathStruct &value) {
@@ -4936,6 +4972,8 @@ static inline folly::dynamic toDynamic(const EnrichedMarkdownTextMarkdownStyleMa
 
 struct EnrichedMarkdownTextMarkdownStyleInlineMathStruct {
   SharedColor color{};
+  Float paddingVertical{0.0};
+  std::string fontWeight{};
 
 
 #ifdef RN_SERIALIZABLE_STATE
@@ -4944,6 +4982,8 @@ struct EnrichedMarkdownTextMarkdownStyleInlineMathStruct {
   folly::dynamic toDynamic() const {
     folly::dynamic result = folly::dynamic::object();
     result["color"] = ::facebook::react::toDynamic(color);
+    result["paddingVertical"] = paddingVertical;
+    result["fontWeight"] = fontWeight;
     return result;
   }
 #endif
@@ -4956,6 +4996,14 @@ static inline void fromRawValue(const PropsParserContext& context, const RawValu
   if (tmp_color != map.end()) {
     fromRawValue(context, tmp_color->second, result.color);
   }
+  auto tmp_paddingVertical = map.find("paddingVertical");
+  if (tmp_paddingVertical != map.end()) {
+    fromRawValue(context, tmp_paddingVertical->second, result.paddingVertical);
+  }
+  auto tmp_fontWeight = map.find("fontWeight");
+  if (tmp_fontWeight != map.end()) {
+    fromRawValue(context, tmp_fontWeight->second, result.fontWeight);
+  }
 }
 
 static inline std::string toString(const EnrichedMarkdownTextMarkdownStyleInlineMathStruct &value) {

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

@@ -299,7 +299,6 @@ object MeasurementStore {
 
     // 2. Render & Measure
     val spannable = tryRenderMarkdown(markdown, styleMap, context, md4cFlags, allowFontScaling, maxFontSizeMultiplier)
-    spannable?.replaceMathSpansWithPlaceholders(context)
     val textToMeasure = spannable ?: markdown
     val (size, _) = measureWithLayout(width, textToMeasure, measurePaint, id)
 
@@ -420,7 +419,7 @@ object MeasurementStore {
 
         when (segment) {
           is RenderedSegment.Text -> {
-            segment.styledText.replaceMathSpansWithPlaceholders(context)
+            segment.styledText.replaceMathSpansWithPlaceholders(context, style.inlineMathStyle.paddingVertical)
 
             val layout = createStaticLayout(segment.styledText, fontSize, widthPx, id)
             totalHeightPx += layout.height
@@ -503,7 +502,9 @@ object MeasurementStore {
       val ast = Parser.shared.parseMarkdown(markdown, md4cFlags) ?: return null
       val style = StyleConfig(styleMap, context, allowFontScaling, maxFontSizeMultiplier)
       measureRenderer.configure(style, context)
-      measureRenderer.renderDocument(ast, null)
+      measureRenderer.renderDocument(ast, null).apply {
+        replaceMathSpansWithPlaceholders(context, style.inlineMathStyle.paddingVertical)
+      }
     } catch (e: Exception) {
       Log.w(TAG, "Failed to render markdown for measurement, falling back to raw text", e)
       null

package/android/src/main/java/com/swmansion/enriched/markdown/input/model/MathChipStyle.kt

@@ -13,6 +13,7 @@ open class MathChipStyle(
   val paddingVertical: Float,
   val selectedBackgroundColor: Int?,
   val selectedBorderColor: Int?,
+  val fontWeight: String = "normal",
 ) {
   open fun isBlock(): Boolean = false
 }
@@ -28,6 +29,7 @@ class MathBlockStyle(
   paddingVertical: Float,
   selectedBackgroundColor: Int?,
   selectedBorderColor: Int?,
+  fontWeight: String = "normal",
   val marginTop: Float,
   val marginBottom: Float,
   val alignment: Layout.Alignment,
@@ -42,6 +44,7 @@ class MathBlockStyle(
     paddingVertical,
     selectedBackgroundColor,
     selectedBorderColor,
+    fontWeight,
   ) {
   override fun isBlock(): Boolean = true
 }

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

@@ -4,6 +4,8 @@ import com.facebook.react.bridge.ReadableMap
 
 data class InlineMathStyle(
   val color: Int,
+  val paddingVertical: Float,
+  val fontWeight: String,
 ) {
   companion object {
     fun fromReadableMap(
@@ -11,7 +13,9 @@ data class InlineMathStyle(
       parser: StyleParser,
     ): InlineMathStyle {
       val color = parser.parseColor(map, "color")
-      return InlineMathStyle(color)
+      val paddingVertical = parser.toPixelFromDIP(map.getDouble("paddingVertical").toFloat())
+      val fontWeight = parser.parseString(map, "fontWeight", "normal")
+      return InlineMathStyle(color, paddingVertical, fontWeight)
     }
   }
 }

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

@@ -0,0 +1,25 @@
+package com.swmansion.enriched.markdown.styles
+
+/**
+ * Weight a formula can actually be typeset at.
+ *
+ * The style model keeps `fontWeight` as a [String], the way every other
+ * `fontWeight` prop in the codebase does, so a value like `"600"` survives as
+ * far as the renderer. This enum is the narrowing step at that last hop — see
+ * `ratexTypefaceLoader`, the only caller — so adding a third weight is a
+ * compile error at the draw site rather than a value that silently falls back
+ * to regular. Mirrors ENRMMathFontWeight.h on iOS.
+ */
+enum class MathFontWeight {
+  NORMAL,
+  BOLD,
+  ;
+
+  companion object {
+    fun fromString(value: String): MathFontWeight =
+      when (value.lowercase()) {
+        "bold" -> BOLD
+        else -> NORMAL
+      }
+  }
+}

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

@@ -10,6 +10,7 @@ data class MathStyle(
   val marginTop: Float,
   val marginBottom: Float,
   val textAlign: String,
+  val fontWeight: String,
 ) {
   companion object {
     fun fromReadableMap(
@@ -23,7 +24,17 @@ data class MathStyle(
       val marginTop = parser.toPixelFromDIP(map.getDouble("marginTop").toFloat())
       val marginBottom = parser.toPixelFromDIP(map.getDouble("marginBottom").toFloat())
       val textAlign = parser.parseString(map, "textAlign", "center")
-      return MathStyle(fontSize, color, backgroundColor, padding, marginTop, marginBottom, textAlign)
+      val fontWeight = parser.parseString(map, "fontWeight", "normal")
+      return MathStyle(
+        fontSize,
+        color,
+        backgroundColor,
+        padding,
+        marginTop,
+        marginBottom,
+        textAlign,
+        fontWeight,
+      )
     }
   }
 }

package/android/src/main/java/com/swmansion/enriched/markdown/utils/input/MarkdownStyleParser.kt

@@ -76,6 +76,8 @@ object MarkdownStyleParser {
       if (mathMap?.hasKey("selectedBackgroundColor") == true) mathMap.getInt("selectedBackgroundColor") else null
     val selectedBorderColor =
       if (mathMap?.hasKey("selectedBorderColor") == true) mathMap.getInt("selectedBorderColor") else null
+    val fontWeight =
+      (if (mathMap?.hasKey("fontWeight") == true) mathMap.getString("fontWeight") else null) ?: "normal"
 
     return MathChipStyle(
       color = color,
@@ -88,6 +90,7 @@ object MarkdownStyleParser {
       paddingVertical = paddingVertical,
       selectedBackgroundColor = nullIfTransparent(selectedBackgroundColor),
       selectedBorderColor = nullIfTransparent(selectedBorderColor),
+      fontWeight = fontWeight,
     )
   }
 
@@ -143,6 +146,12 @@ object MarkdownStyleParser {
       } else {
         inlineFallback.selectedBorderColor
       }
+    val fontWeight =
+      if (mathBlockMap?.hasKey("fontWeight") == true) {
+        mathBlockMap.getString("fontWeight") ?: "normal"
+      } else {
+        inlineFallback.fontWeight
+      }
     val marginTop =
       PixelUtil.toPixelFromDIP(
         if (mathBlockMap?.hasKey("marginTop") == true) mathBlockMap.getDouble("marginTop").toFloat() else 8f,
@@ -170,6 +179,7 @@ object MarkdownStyleParser {
       paddingVertical = paddingVertical,
       selectedBackgroundColor = nullIfTransparent(selectedBackgroundColor),
       selectedBorderColor = nullIfTransparent(selectedBorderColor),
+      fontWeight = fontWeight,
       marginTop = marginTop,
       marginBottom = marginBottom,
       alignment = alignment,

package/android/src/main/java/com/swmansion/enriched/markdown/utils/text/extensions/SpannableExtensions.kt

@@ -14,8 +14,16 @@ fun SpannableStringBuilder.isInlineImage(): Boolean {
   return lastChar != '\n' && lastChar != '\u200B'
 }
 
-/** Swaps MathInlineSpans for MathInlinePlaceholderSpans safe for background-thread measurement. */
-fun SpannableString.replaceMathSpansWithPlaceholders(context: Context) {
+/**
+ * Swaps MathInlineSpans for MathInlinePlaceholderSpans safe for background-thread measurement.
+ *
+ * [paddingVertical] must be the same `inlineMath.paddingVertical` (in px) the real spans were
+ * built with, or the measured line box won't match the drawn one.
+ */
+fun SpannableString.replaceMathSpansWithPlaceholders(
+  context: Context,
+  paddingVertical: Float,
+) {
   if (!FeatureFlags.IS_MATH_ENABLED) return
 
   try {
@@ -42,7 +50,7 @@ fun SpannableString.replaceMathSpansWithPlaceholders(context: Context) {
     @Suppress("UNCHECKED_CAST")
     val results = measureMethod.invoke(null, context, requests) as? List<MathMetrics> ?: return
 
-    val placeholderCtor = placeholderClass.getConstructor(MathMetrics::class.java)
+    val placeholderCtor = placeholderClass.getConstructor(MathMetrics::class.java, Float::class.javaPrimitiveType)
 
     mathSpans.forEachIndexed { i, oldSpan ->
       val metrics = results.getOrNull(i) ?: return@forEachIndexed
@@ -53,7 +61,7 @@ fun SpannableString.replaceMathSpansWithPlaceholders(context: Context) {
 
       if (start != -1 && end != -1) {
         removeSpan(oldSpan)
-        val newSpan = placeholderCtor.newInstance(metrics)
+        val newSpan = placeholderCtor.newInstance(metrics, paddingVertical)
         setSpan(newSpan, start, end, flags)
       }
     }

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

@@ -456,7 +456,7 @@ class TableContainerView(
                     .apply { configure(config, context) }
                     .renderDocument(MarkdownASTNode(NodeType.Document, children = listOf(paragraph)), null, null)
                 }
-              styledText.replaceMathSpansWithPlaceholders(context)
+              styledText.replaceMathSpansWithPlaceholders(context, config.inlineMathStyle.paddingVertical)
               if (isHeader && styledText.isNotEmpty()) {
                 styledText.setSpan(HeaderTypefaceSpan(headerTypeface), 0, styledText.length, 33)
               }

package/android/src/math/java/com/swmansion/enriched/markdown/renderer/MathInlineRenderer.kt

@@ -35,6 +35,8 @@ class MathInlineRenderer(
         latex = latex,
         fontSize = blockStyle.fontSize,
         textColor = config.style.inlineMathStyle.color,
+        paddingVertical = config.style.inlineMathStyle.paddingVertical,
+        fontWeight = config.style.inlineMathStyle.fontWeight,
       )
 
     builder.setSpan(span, start, end, SPAN_FLAGS_EXCLUSIVE_EXCLUSIVE)

package/android/src/math/java/com/swmansion/enriched/markdown/spans/MathChipSpan.kt

@@ -66,7 +66,7 @@ class MathChipSpan(
           displayMode = displayMode,
           color = style.color,
         )
-      val renderer = RaTeXRenderer(displayList, style.fontSize) { RaTeXFontLoader.getTypeface(it) }
+      val renderer = RaTeXRenderer(displayList, style.fontSize, ratexTypefaceLoader(style.fontWeight))
       formulaWidth = renderer.widthPx
       formulaAscent = renderer.heightPx
       formulaDescent = renderer.depthPx

package/android/src/math/java/com/swmansion/enriched/markdown/spans/MathInlinePlaceholderSpan.kt

@@ -3,11 +3,12 @@ package com.swmansion.enriched.markdown.spans
 import android.graphics.Canvas
 import android.graphics.Paint
 import android.text.style.ReplacementSpan
-import kotlin.math.roundToInt
+import kotlin.math.ceil
 
 /** Holds pre-computed math metrics for background-thread measurement. */
 class MathInlinePlaceholderSpan(
   private val metrics: MathMetrics,
+  private val paddingVertical: Float,
 ) : ReplacementSpan() {
   override fun getSize(
     paint: Paint,
@@ -17,9 +18,12 @@ class MathInlinePlaceholderSpan(
     fm: Paint.FontMetricsInt?,
   ): Int {
     fm?.apply {
-      ascent = -metrics.ascent.roundToInt()
+      // Must stay identical to MathInlineSpan.getSize — this span stands in for it
+      // during ShadowNode measurement, so any divergence shows up as a clipped or
+      // over-tall view. Same ceil, same padding, same expression.
+      ascent = -ceil(metrics.ascent + paddingVertical).toInt()
       top = ascent
-      descent = metrics.descent.roundToInt()
+      descent = ceil(metrics.descent + paddingVertical).toInt()
       bottom = descent
     }
     return metrics.width

package/android/src/math/java/com/swmansion/enriched/markdown/spans/MathInlineSpan.kt

@@ -6,7 +6,6 @@ import android.graphics.Canvas
 import android.graphics.Paint
 import android.text.style.ReplacementSpan
 import io.ratex.RaTeXEngine
-import io.ratex.RaTeXFontLoader
 import io.ratex.RaTeXRenderer
 import kotlin.math.ceil
 
@@ -15,6 +14,8 @@ class MathInlineSpan(
   internal val latex: String,
   internal val fontSize: Float,
   private val textColor: Int,
+  private val paddingVertical: Float,
+  private val fontWeight: String = "normal",
 ) : ReplacementSpan() {
   private var cachedBitmap: Bitmap? = null
   private var cachedWidth = 0
@@ -28,7 +29,7 @@ class MathInlineSpan(
 
     try {
       val displayList = RaTeXEngine.parseBlocking(latex, displayMode = false, color = textColor)
-      val renderer = RaTeXRenderer(displayList, fontSize) { RaTeXFontLoader.getTypeface(it) }
+      val renderer = RaTeXRenderer(displayList, fontSize, ratexTypefaceLoader(fontWeight))
 
       cachedWidth = renderer.widthPx.toInt().coerceAtLeast(1)
       mathAscent = renderer.heightPx
@@ -62,10 +63,12 @@ class MathInlineSpan(
     prepareResources()
 
     fm?.apply {
-      val ascentPx = ceil(mathAscent).toInt()
-      ascent = -ascentPx
+      // Must stay identical to MathInlinePlaceholderSpan.getSize: that span measures
+      // this one off the main thread, and a box that disagrees by even a pixel either
+      // clips the formula or eats the padding this field is here to add.
+      ascent = -ceil(mathAscent + paddingVertical).toInt()
       top = ascent
-      descent = (cachedBitmap?.height ?: ceil(mathAscent + mathDescent).toInt()) - ascentPx
+      descent = ceil(mathDescent + paddingVertical).toInt()
       bottom = descent
     }
 

package/android/src/math/java/com/swmansion/enriched/markdown/spans/MathTypeface.kt

@@ -0,0 +1,30 @@
+package com.swmansion.enriched.markdown.spans
+
+import android.graphics.Typeface
+import com.swmansion.enriched.markdown.styles.MathFontWeight
+import io.ratex.RaTeXFontLoader
+
+/**
+ * Typeface supplier for [io.ratex.RaTeXRenderer]. RaTeX resolves every glyph to
+ * a KaTeX font id and asks us for the face to draw it with.
+ *
+ * Takes the raw `fontWeight` string the style model carries — the same shape
+ * every other `fontWeight` prop keeps — and is the single place on Android that
+ * narrows it to a weight we can draw. Consumers pass the style through; nothing
+ * upstream has to know that only two weights are reachable today.
+ *
+ * Bold is SYNTHETIC: asking for [Typeface.BOLD] on a single-weight asset makes
+ * the platform embolden it, which preserves the advances RaTeX already laid the
+ * glyphs out with. Substituting the bundled KaTeX bold faces instead would not
+ * — their advances run up to 15% wider than the regular ones the layout
+ * reserved, so glyphs would collide. iOS reaches the same result by stroking
+ * the glyph outline; see ENRMRaTeXBridge.
+ */
+internal fun ratexTypefaceLoader(fontWeight: String): (String) -> Typeface? =
+  when (MathFontWeight.fromString(fontWeight)) {
+    MathFontWeight.NORMAL -> { fontId -> RaTeXFontLoader.getTypeface(fontId) }
+
+    MathFontWeight.BOLD -> { fontId ->
+      RaTeXFontLoader.getTypeface(fontId)?.let { Typeface.create(it, Typeface.BOLD) }
+    }
+  }

package/android/src/math/java/com/swmansion/enriched/markdown/views/MathContainerView.kt

@@ -15,6 +15,7 @@ import com.swmansion.enriched.markdown.accessibility.AccessibilityLabels
 import com.swmansion.enriched.markdown.spans.MathMeasureHelper
 import com.swmansion.enriched.markdown.spans.MathMeasureRequest
 import com.swmansion.enriched.markdown.spans.MathRenderMode
+import com.swmansion.enriched.markdown.spans.ratexTypefaceLoader
 import com.swmansion.enriched.markdown.styles.MathStyle
 import com.swmansion.enriched.markdown.styles.StyleConfig
 import io.ratex.RaTeXEngine
@@ -100,7 +101,8 @@ class MathContainerView(
     cachedLatex = latex
     try {
       val displayList = RaTeXEngine.parseBlocking(latex, displayMode = true, color = mathStyle.color)
-      mathView.renderer = RaTeXRenderer(displayList, mathStyle.fontSize) { RaTeXFontLoader.getTypeface(it) }
+      mathView.renderer =
+        RaTeXRenderer(displayList, mathStyle.fontSize, ratexTypefaceLoader(mathStyle.fontWeight))
     } catch (e: Exception) {
       Log.e(TAG, "Failed to render LaTeX", e)
       mathView.renderer = null

package/docs/INPUT.md

@@ -231,3 +231,7 @@ Available style properties:
 - `link.underline` — whether links are underlined (defaults to `true`).
 - `spoiler.color` — text color for spoiler text.
 - `spoiler.backgroundColor` — background color for spoiler text.
+- `math.fontWeight` — `'bold'` | `'normal'` (default `'normal'`); typesets inline formula chips
+  (`$...$`) at bold weight. See [LATEX_MATH.md](./LATEX_MATH.md#bold-formulas).
+- `mathBlock.fontWeight` — same for block formula chips (`$$...$$`); inherits from
+  `math.fontWeight` when unset.

package/docs/LATEX_MATH.md

@@ -27,6 +27,7 @@ Einstein's mass-energy equivalence $E = mc^2$ is one of the most famous equation
     },
     inlineMath: {
       color: '#1F2937',
+      paddingVertical: 4,
     },
   }}
 />
@@ -34,6 +35,62 @@ Einstein's mass-energy equivalence $E = mc^2$ is one of the most famous equation
 
 Block math equations are rendered as standalone display elements with spacing and an optional background. Inline math inherits the surrounding block's typography.
 
+### Spacing around inline formulas
+
+An inline formula reports its own height, and tall constructs such as `\frac` are routinely taller than the
+surrounding text. The block's `lineHeight` cannot loosen those lines: it is applied expand-only, so a value
+below the formula's natural height is ignored rather than compressing the formula out of its box. Two wrapped
+lines that each contain a fraction therefore sit flush against each other.
+
+`inlineMath.paddingVertical` (points, default `4`) adds empty space above and below the formula box, which is
+what pushes those lines apart. It affects only lines that actually contain inline math — prose-only lines keep
+the line height they had. Set it to `0` to get the old flush behaviour back. Block math (`$$...$$`) has its own
+`math.padding` instead.
+
+### Bold formulas
+
+`math.fontWeight` / `inlineMath.fontWeight` (`'normal'` | `'bold'`, default `'normal'`) typeset a
+formula at bold weight. Set it wherever the surrounding text is bold so the formula follows it.
+
+The embolden is **synthetic on every platform** — no real bold face is ever used.
+
+On **iOS and Android** it is a stroke on the glyph outline and the platform's fake-bold
+respectively, rather than a switch to the bundled KaTeX bold faces. That is deliberate. The native
+engine has no weight parameter, and by the time a style applies, glyph positions are already laid
+out: the bold faces' advances run up to 15% wider than the regular ones the layout reserved, so
+swapping them in would make glyphs collide. Stroking and fake-bold both preserve every advance.
+
+Two consequences worth knowing:
+
+- Fraction bars and rules keep their own thickness, so they do not thicken with the glyphs.
+- On iOS the stroke width also applies to the handful of decorations the engine strokes itself
+  (`\cancel`, `\textcircled`, `\corresponds`, `\imageof`). Prefer turning bold on per surface
+  rather than globally.
+
+On **web** the prop is a plain CSS declaration on the KaTeX output — but the library renders in
+[MathML output mode](#web) and loads no KaTeX stylesheet or fonts, so `font-weight` is resolved by
+the browser's own math font (STIX Two Math, Latin Modern Math, Cambria Math). Most of those ship no
+bold face, so the browser synthesizes one there too. Treat web as synthetic as well, not as a
+reference for how heavy bold "should" look.
+
+`EnrichedMarkdownTextInput` honours the same prop for the formula chips typed into the editor, under
+its own style keys — `math.fontWeight` for inline chips (`$...$`) and `mathBlock.fontWeight` for
+block chips (`$$...$$`). `mathBlock` inherits the weight from `math` when it does not set one of its
+own, the way it already inherits `color` and the border props:
+
+```tsx
+<EnrichedMarkdownTextInput
+  markdownStyle={{
+    math: { fontWeight: 'bold' },       // inline chips bold…
+    mathBlock: { fontWeight: 'normal' }, // …block chips opt back out
+  }}
+/>
+```
+
+The caveats above apply unchanged — the embolden is the same synthetic one, and the chip keeps its
+measured width because fake-bold and stroking both preserve the glyph advances. Editor chips are
+iOS + Android only; there is no web or macOS chip surface.
+
 > [!IMPORTANT]
 > LaTeX commands use backslashes (e.g. `\frac`, `\alpha`). In regular JS strings and template literals, backslashes are escape characters. Use `String.raw` or double backslashes (`\\frac`) to preserve them. Block math (`$$...$$`) must be on its own line to render as a display element.
 
@@ -53,6 +110,11 @@ yarn add katex
 
 KaTeX is loaded lazily the first time a LaTeX node is encountered, so it has no impact on pages that do not render math. No stylesheet or `<link>` tag is needed.
 
+If you load `katex/dist/katex.min.css` anyway — some setups do — its `.katex` rule opens with the
+`font` shorthand, which resets `font-weight` and would drop [`fontWeight`](#bold-formulas) on the
+way down to the formula. The library injects `.katex { font-weight: inherit; }` to keep the prop
+working in that case; nothing is required of you.
+
 > [!NOTE]
 > MathML is supported natively in Chrome 109+, Firefox, and Safari. Older browsers will display the raw LaTeX source as a text fallback.
 

package/docs/STYLES.md

@@ -179,9 +179,12 @@ The library provides sensible default styles for all Markdown elements out of th
       padding: 12,
       marginBottom: 16,
       textAlign: 'center',
+      fontWeight: 'normal',
     },
     inlineMath: {
       color: '#1F2937',
+      paddingVertical: 4,
+      fontWeight: 'normal',
     },
     spoiler: {
       color: '#6B7280',

package/ios/attachments/ENRMMathInlineAttachment+macOS.m

@@ -25,7 +25,11 @@
 - (void)renderForMacOS
 {
   RCTUIColor *color = self.mathTextColor ?: [RCTUIColor blackColor];
-  ENRMRaTeXRenderResult *result = [ENRMRaTeXBridge parse:self.latex displayMode:NO fontSize:self.fontSize color:color];
+  ENRMRaTeXRenderResult *result = [ENRMRaTeXBridge parse:self.latex
+                                             displayMode:NO
+                                                fontSize:self.fontSize
+                                                   color:color
+                                                    bold:self.bold];
   if (!result)
     return;
 

package/ios/attachments/ENRMMathInlineAttachment.h

@@ -9,6 +9,9 @@ NS_ASSUME_NONNULL_BEGIN
 @property (nonatomic, assign) CGFloat fontSize;
 @property (nonatomic, strong, nullable) RCTUIColor *mathTextColor;
 
+/// Typeset the glyphs at bold weight (synthetic — see ENRMRaTeXBridge).
+@property (nonatomic, assign) BOOL bold;
+
 /// YES if block math (`$$...$$`), NO for inline (`$...$`).
 @property (nonatomic, assign) BOOL displayMode;
 

package/ios/attachments/ENRMMathInlineAttachment.m

@@ -21,7 +21,8 @@
   ENRMRaTeXRenderResult *result = [ENRMRaTeXBridge parse:self.latex
                                              displayMode:self.displayMode
                                                 fontSize:self.fontSize
-                                                   color:color];
+                                                   color:color
+                                                    bold:self.bold];
   if (!result)
     return;