@depup/react-native 0.86.2-depup.0 → 0.87.1-depup.0

package/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTextView.java

@@ -46,6 +46,7 @@ import com.facebook.react.uimanager.style.BorderRadiusProp;
 import com.facebook.react.uimanager.style.BorderStyle;
 import com.facebook.react.uimanager.style.LogicalEdge;
 import com.facebook.react.uimanager.style.Overflow;
+import com.facebook.react.views.text.internal.span.CanvasEffectSpan;
 import com.facebook.react.views.text.internal.span.ReactFragmentIndexSpan;
 import com.facebook.react.views.text.internal.span.ReactTagSpan;
 import com.facebook.yoga.YogaMeasureMode;
@@ -212,8 +213,97 @@ public class ReactTextView extends AppCompatTextView implements ReactCompoundVie
         BackgroundStyleApplicator.clipToPaddingBox(this, canvas);
       }
 
-      super.onDraw(canvas);
+      if (spanned != null) {
+        Layout layout = getLayout();
+        if (layout != null) {
+          CanvasEffectSpan[] drawSpans =
+              spanned.getSpans(0, spanned.length(), CanvasEffectSpan.class);
+          if (shouldDrawLayoutWithoutTextViewClip()) {
+            drawLayoutWithoutTextViewClip(canvas, spanned, layout, drawSpans);
+          } else {
+            if (drawSpans.length > 0) {
+              drawTextEffects(canvas, spanned, layout, drawSpans, true, false);
+              super.onDraw(canvas);
+              drawTextEffects(canvas, spanned, layout, drawSpans, false, false);
+            } else {
+              super.onDraw(canvas);
+            }
+          }
+        } else {
+          super.onDraw(canvas);
+        }
+      } else {
+        super.onDraw(canvas);
+      }
+    }
+  }
+
+  private boolean shouldDrawLayoutWithoutTextViewClip() {
+    return mOverflow == Overflow.VISIBLE && !mTextIsSelectable && getMovementMethod() == null;
+  }
+
+  private void drawLayoutWithoutTextViewClip(
+      Canvas canvas, Spannable spanned, Layout layout, CanvasEffectSpan[] drawSpans) {
+    getPaint().setColor(getCurrentTextColor());
+    getPaint().drawableState = getDrawableState();
+
+    drawTextEffects(canvas, spanned, layout, drawSpans, true, true);
+
+    canvas.save();
+    canvas.translate(
+        getCompoundPaddingLeft(), getExtendedPaddingTop() + getVerticalGravityOffset(layout));
+    layout.draw(canvas);
+    canvas.restore();
+
+    drawTextEffects(canvas, spanned, layout, drawSpans, false, true);
+  }
+
+  private void drawTextEffects(
+      Canvas canvas,
+      Spannable spanned,
+      Layout layout,
+      CanvasEffectSpan[] drawSpans,
+      boolean beforeText,
+      boolean includeVerticalGravityOffset) {
+    if (drawSpans.length == 0) {
+      return;
+    }
+
+    canvas.save();
+    canvas.translate(
+        getCompoundPaddingLeft(),
+        getExtendedPaddingTop()
+            + (includeVerticalGravityOffset ? getVerticalGravityOffset(layout) : 0));
+    for (CanvasEffectSpan span : drawSpans) {
+      int start = spanned.getSpanStart(span);
+      int end = spanned.getSpanEnd(span);
+      if (beforeText) {
+        span.onPreDraw(start, end, canvas, layout);
+      } else {
+        span.onDraw(start, end, canvas, layout);
+      }
+    }
+    canvas.restore();
+  }
+
+  private int getVerticalGravityOffset(Layout layout) {
+    int availableVerticalSpace = getAvailableVerticalSpace();
+    if (layout.getHeight() >= availableVerticalSpace) {
+      return 0;
+    }
+
+    int verticalGravity = getGravity() & Gravity.VERTICAL_GRAVITY_MASK;
+    if (verticalGravity == Gravity.BOTTOM) {
+      return availableVerticalSpace - layout.getHeight();
+    } else if (verticalGravity == Gravity.CENTER_VERTICAL) {
+      return (availableVerticalSpace - layout.getHeight()) / 2;
     }
+
+    return 0;
+  }
+
+  private int getAvailableVerticalSpace() {
+    return getHeight() - getExtendedPaddingTop() - getExtendedPaddingBottom();
   }
 
   @Override
@@ -227,7 +317,7 @@ public class ReactTextView extends AppCompatTextView implements ReactCompoundVie
     try (SystraceSection s = new SystraceSection("ReactTextView.setText(ReactTextUpdate)")) {
       // Android's TextView crashes when it tries to relayout if LayoutParams are
       // null; explicitly set the LayoutParams to prevent this crash. See:
-      // https://github.com/react/react-native/pull/7011
+      // https://github.com/facebook/react-native/pull/7011
       if (getLayoutParams() == null) {
         setLayoutParams(EMPTY_LAYOUT_PARAMS);
       }

package/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTextViewManager.kt

@@ -43,6 +43,7 @@ import com.facebook.react.uimanager.style.BorderRadiusProp
 import com.facebook.react.uimanager.style.BorderStyle.Companion.fromString
 import com.facebook.react.uimanager.style.LogicalEdge
 import com.facebook.react.views.text.DefaultStyleValuesUtil.getDefaultTextColorHighlight
+import com.facebook.react.views.text.ReactTypefaceUtils.getFontWeightAdjustment
 import java.util.HashMap
 
 /** View manager for `<Text>` nodes. */
@@ -158,8 +159,10 @@ public constructor(
     val spanned: Spannable =
         TextLayoutManager.getOrCreateSpannableForText(
             view.context.assets,
+            getFontWeightAdjustment(view.context),
             attributedString,
             reactTextViewManagerCallback,
+            TextEffectRegistry.current,
         )
     view.setSpanned(spanned)
 

package/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTypefaceUtils.kt

@@ -7,14 +7,23 @@
 
 package com.facebook.react.views.text
 
+import android.content.Context
 import android.content.res.AssetManager
+import android.content.res.Configuration
 import android.graphics.Typeface
+import android.os.Build
 import com.facebook.react.bridge.ReadableArray
 import com.facebook.react.common.ReactConstants
 import com.facebook.react.common.assets.ReactFontManager
+import com.facebook.react.internal.featureflags.ReactNativeFeatureFlags
+import kotlin.math.max
+import kotlin.math.min
 
 public object ReactTypefaceUtils {
 
+  private const val FONT_WEIGHT_MIN = 1
+  private const val FONT_WEIGHT_MAX = 1000
+
   @JvmStatic
   public fun parseFontWeight(fontWeightString: String?): Int =
       when (fontWeightString) {
@@ -110,4 +119,36 @@ public object ReactTypefaceUtils {
       ReactFontManager.getInstance().getTypeface(fontFamilyName, typefaceStyle, assetManager)
     }
   }
+
+  @JvmStatic
+  public fun getFontWeightAdjustment(context: Context): Int =
+      if (
+          Build.VERSION.SDK_INT >= Build.VERSION_CODES.S &&
+              ReactNativeFeatureFlags.enableAndroidFontWeightAdjustment()
+      ) {
+        context.resources.configuration.fontWeightAdjustment
+      } else {
+        0
+      }
+
+  @JvmStatic
+  public fun applyFontWeightAdjustment(
+      typeface: Typeface?,
+      fontWeightAdjustment: Int,
+  ): Typeface? {
+    if (
+        Build.VERSION.SDK_INT < Build.VERSION_CODES.S ||
+            fontWeightAdjustment == 0 ||
+            fontWeightAdjustment == Configuration.FONT_WEIGHT_ADJUSTMENT_UNDEFINED
+    ) {
+      return typeface
+    }
+
+    val baseTypeface = typeface ?: Typeface.DEFAULT
+    val adjustedWeight =
+        min(max(baseTypeface.weight + fontWeightAdjustment, FONT_WEIGHT_MIN), FONT_WEIGHT_MAX)
+    val italic = baseTypeface.style and Typeface.ITALIC != 0
+
+    return Typeface.create(baseTypeface, adjustedWeight, italic)
+  }
 }

package/ReactAndroid/src/main/java/com/facebook/react/views/text/TextAttributeProps.kt

@@ -92,6 +92,21 @@ public class TextAttributeProps private constructor() {
   public var isLineThroughTextDecorationSet: Boolean = false
     private set
 
+  /**
+   * Decoration color for underlines and strikethroughs. `Color.TRANSPARENT` (the default) means
+   * "fall back to the text color" so existing call sites that don't pass a value retain the prior
+   * behavior. Honored by `ReactUnderlineSpan` and `ReactStrikethroughSpan`.
+   */
+  internal var textDecorationColor: Int = android.graphics.Color.TRANSPARENT
+    private set
+
+  /**
+   * CSS `text-decoration-style`. Defaults to `SOLID` so existing call sites retain the prior visual
+   * behavior. Honored by `ReactUnderlineSpan` and `ReactStrikethroughSpan`.
+   */
+  internal var textDecorationStyle: TextDecorationStyle = TextDecorationStyle.SOLID
+    private set
+
   private var includeFontPadding: Boolean = true
 
   public var accessibilityRole: AccessibilityRole? = null
@@ -100,6 +115,11 @@ public class TextAttributeProps private constructor() {
   public var role: ReactAccessibilityDelegate.Role? = null
     private set
 
+  internal data class TextEffectEntry(val name: String, val props: String?)
+
+  internal var textEffects: List<TextEffectEntry> = emptyList()
+    private set
+
   public var fontStyle: Int = ReactConstants.UNSET
     private set
 
@@ -375,6 +395,9 @@ public class TextAttributeProps private constructor() {
     public const val TA_KEY_ROLE: Int = 26
     public const val TA_KEY_TEXT_TRANSFORM: Int = 27
     public const val TA_KEY_MAX_FONT_SIZE_MULTIPLIER: Int = 29
+    public const val TA_KEY_TEXT_EFFECTS: Int = 30
+    private const val TE_KEY_NAME: Int = 0
+    private const val TE_KEY_PROPS: Int = 1
 
     public const val UNSET: Int = -1
 
@@ -415,9 +438,10 @@ public class TextAttributeProps private constructor() {
           TA_KEY_LINE_HEIGHT -> result.lineHeight = entry.doubleValue.toFloat()
           TA_KEY_ALIGNMENT -> {}
           TA_KEY_BEST_WRITING_DIRECTION -> {}
-          TA_KEY_TEXT_DECORATION_COLOR -> {}
+          TA_KEY_TEXT_DECORATION_COLOR -> result.textDecorationColor = entry.intValue
           TA_KEY_TEXT_DECORATION_LINE -> result.setTextDecorationLine(entry.stringValue)
-          TA_KEY_TEXT_DECORATION_STYLE -> {}
+          TA_KEY_TEXT_DECORATION_STYLE ->
+              result.textDecorationStyle = TextDecorationStyle.fromString(entry.stringValue)
           TA_KEY_TEXT_SHADOW_RADIUS -> result.textShadowRadius = entry.doubleValue.toFloat()
           TA_KEY_TEXT_SHADOW_COLOR -> result.textShadowColor = entry.intValue
           TA_KEY_TEXT_SHADOW_OFFSET_DX -> result.textShadowOffsetDx = entry.doubleValue.toFloat()
@@ -429,6 +453,22 @@ public class TextAttributeProps private constructor() {
           TA_KEY_TEXT_TRANSFORM -> result.setTextTransform(entry.stringValue)
           TA_KEY_MAX_FONT_SIZE_MULTIPLIER ->
               result.maxFontSizeMultiplier = entry.doubleValue.toFloat()
+          TA_KEY_TEXT_EFFECTS -> {
+            val effectsMap = entry.mapBufferValue
+            val list = mutableListOf<TextEffectEntry>()
+            for (j in 0 until effectsMap.count) {
+              val effectMap = effectsMap.getMapBuffer(j)
+              list.add(
+                  TextEffectEntry(
+                      name = effectMap.getString(TE_KEY_NAME),
+                      props =
+                          if (effectMap.contains(TE_KEY_PROPS)) effectMap.getString(TE_KEY_PROPS)
+                          else null,
+                  )
+              )
+            }
+            result.textEffects = list
+          }
         }
       }
 
@@ -462,6 +502,10 @@ public class TextAttributeProps private constructor() {
       result.setFontVariant(getArrayProp(props, ViewProps.FONT_VARIANT))
       result.includeFontPadding = getBooleanProp(props, ViewProps.INCLUDE_FONT_PADDING, true)
       result.setTextDecorationLine(getStringProp(props, ViewProps.TEXT_DECORATION_LINE))
+      result.textDecorationColor =
+          getIntProp(props, "textDecorationColor", android.graphics.Color.TRANSPARENT)
+      result.textDecorationStyle =
+          TextDecorationStyle.fromString(getStringProp(props, "textDecorationStyle"))
       result.setTextShadowOffset(
           if (props.hasKey(PROP_SHADOW_OFFSET)) props.getMap(PROP_SHADOW_OFFSET) else null
       )
@@ -483,6 +527,8 @@ public class TextAttributeProps private constructor() {
         "justify" -> Gravity.LEFT
         null,
         "auto" -> Gravity.NO_GRAVITY
+        "start" -> if (isRTL) Gravity.RIGHT else Gravity.LEFT
+        "end" -> if (isRTL) Gravity.LEFT else Gravity.RIGHT
         "left" -> if (isRTL) Gravity.RIGHT else Gravity.LEFT
         "right" -> if (isRTL) Gravity.LEFT else Gravity.RIGHT
         "center" -> Gravity.CENTER_HORIZONTAL

package/ReactAndroid/src/main/java/com/facebook/react/views/text/TextDecorationStyle.kt

@@ -0,0 +1,200 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+package com.facebook.react.views.text
+
+import android.graphics.Canvas
+import android.graphics.Color
+import android.graphics.DashPathEffect
+import android.graphics.Paint
+import android.graphics.Path
+import android.os.Build
+import android.text.Layout
+import android.text.Spanned
+import android.text.style.ForegroundColorSpan
+import kotlin.math.max
+import kotlin.math.min
+import kotlin.math.roundToInt
+
+/**
+ * Styles supported by the CSS `text-decoration-style` property, surfaced end-to-end by Fabric (see
+ * `TextAttributes::textDecorationStyle`).
+ */
+internal enum class TextDecorationStyle {
+  SOLID,
+  DOUBLE,
+  DOTTED,
+  DASHED,
+  WAVY;
+
+  internal companion object {
+    @JvmStatic
+    fun fromString(value: String?): TextDecorationStyle =
+        when (value) {
+          "double" -> DOUBLE
+          "dotted" -> DOTTED
+          "dashed" -> DASHED
+          "wavy" -> WAVY
+          else -> SOLID
+        }
+  }
+}
+
+// Reusable objects to avoid allocations in the draw path (UI thread only).
+private val scratchPath = Path()
+private val decorationPaint = Paint()
+private val dottedEffects =
+    object : LinkedHashMap<Float, DashPathEffect>(4, 0.75f, true) {
+      override fun removeEldestEntry(eldest: MutableMap.MutableEntry<Float, DashPathEffect>?) =
+          size > 4
+    }
+private val dashedEffects =
+    object : LinkedHashMap<Float, DashPathEffect>(4, 0.75f, true) {
+      override fun removeEldestEntry(eldest: MutableMap.MutableEntry<Float, DashPathEffect>?) =
+          size > 4
+    }
+
+/**
+ * Draws a horizontal decoration line between [x1] and [x2] at [y], applying the requested CSS
+ * `text-decoration-style`. [paint] must already be configured (color, strokeWidth, style,
+ * antiAlias). [reusablePath] is reset and reused for styles that need a path, avoiding per-frame
+ * allocations.
+ *
+ * WAVY wavelength and control-point distance follow Chromium/Blink's `decoration_line_painter.cc`.
+ * DOUBLE uses a density-scaled gap (`thickness + 2dp`) to keep both strokes visually distinct with
+ * antialiasing on mobile displays.
+ */
+private fun drawDecorationLine(
+    canvas: Canvas,
+    paint: Paint,
+    x1: Float,
+    x2: Float,
+    y: Float,
+    thickness: Float,
+    density: Float,
+    style: TextDecorationStyle,
+    reusablePath: Path,
+) {
+  when (style) {
+    TextDecorationStyle.SOLID -> canvas.drawLine(x1, y, x2, y, paint)
+    TextDecorationStyle.DOUBLE -> {
+      val gap = thickness + 2f * density
+      canvas.drawLine(x1, y, x2, y, paint)
+      canvas.drawLine(x1, y + gap, x2, y + gap, paint)
+    }
+    TextDecorationStyle.DOTTED,
+    TextDecorationStyle.DASHED -> {
+      reusablePath.reset()
+      reusablePath.moveTo(x1, y)
+      reusablePath.lineTo(x2, y)
+      canvas.drawPath(reusablePath, paint)
+    }
+    TextDecorationStyle.WAVY -> {
+      val clamped = max(1f, thickness)
+      val wavelength = 1f + 2f * (2f * clamped + 0.5f).roundToInt()
+      val cpDistance = 0.5f + (3f * clamped + 0.5f).roundToInt()
+      reusablePath.reset()
+      reusablePath.moveTo(x1, y)
+      var x = x1
+      while (x < x2) {
+        val midX = x + wavelength / 2f
+        val endX = x + wavelength
+        reusablePath.cubicTo(midX, y + cpDistance, midX, y - cpDistance, endX, y)
+        x = endX
+      }
+      canvas.drawPath(reusablePath, paint)
+    }
+  }
+}
+
+/**
+ * Shared decoration drawing entry point used by [ReactUnderlineSpan] and [ReactStrikethroughSpan].
+ * Computes a density-aware stroke thickness, sets up a dedicated paint (to avoid mutating the
+ * shared [Layout.getPaint]), iterates the visible lines of the run, and delegates each line to
+ * [drawDecorationLine]. The caller-supplied [yOffsetForLine] computes the vertical position of the
+ * decoration line on each visible line of text (underline vs strikethrough being the only
+ * difference).
+ */
+internal fun drawSpannedDecoration(
+    start: Int,
+    end: Int,
+    canvas: Canvas,
+    layout: Layout,
+    color: Int,
+    style: TextDecorationStyle,
+    yOffsetForLine: (paint: Paint, baseline: Float, thickness: Float) -> Float,
+) {
+  val textPaint = layout.paint
+  val effectiveColor =
+      if (color != Color.TRANSPARENT) {
+        color
+      } else {
+        // Look up the actual foreground color at the span position. layout.paint
+        // is the base paint whose color may differ from per-span foreground colors
+        // applied via ForegroundColorSpan (e.g., link text, colored text).
+        val spanned = layout.text as? Spanned
+        val fgSpans = spanned?.getSpans(start, start + 1, ForegroundColorSpan::class.java)
+        if (fgSpans != null && fgSpans.isNotEmpty()) fgSpans.last().foregroundColor
+        else textPaint.color
+      }
+  val thickness =
+      if (style == TextDecorationStyle.SOLID || style == TextDecorationStyle.DOUBLE) {
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+          textPaint.underlineThickness
+        } else {
+          textPaint.fontMetrics.descent * 0.1f
+        }
+      } else {
+        val minThickness = 1.5f * textPaint.density
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+          max(textPaint.underlineThickness, minThickness)
+        } else {
+          max(textPaint.fontMetrics.descent * 0.1f, minThickness)
+        }
+      }
+
+  decorationPaint.set(textPaint)
+  decorationPaint.color = effectiveColor
+  decorationPaint.strokeWidth = thickness
+  decorationPaint.style = Paint.Style.STROKE
+  decorationPaint.isAntiAlias = true
+
+  if (style == TextDecorationStyle.DOTTED || style == TextDecorationStyle.DASHED) {
+    val cache = if (style == TextDecorationStyle.DOTTED) dottedEffects else dashedEffects
+    decorationPaint.pathEffect =
+        cache.getOrPut(thickness) {
+          val intervals =
+              if (style == TextDecorationStyle.DOTTED) floatArrayOf(thickness, thickness * 2f)
+              else floatArrayOf(thickness * 4f, thickness * 2f)
+          DashPathEffect(intervals, 0f)
+        }
+  }
+
+  val startLine = layout.getLineForOffset(start)
+  val endLine = layout.getLineForOffset(end)
+  for (line in startLine..endLine) {
+    val baseline = layout.getLineBaseline(line).toFloat()
+    val rawX1 =
+        if (line == startLine) layout.getPrimaryHorizontal(start) else layout.getLineLeft(line)
+    val rawX2 = if (line == endLine) layout.getPrimaryHorizontal(end) else layout.getLineRight(line)
+    // Normalize for RTL text where start may be to the right of end.
+    val x1 = min(rawX1, rawX2)
+    val x2 = max(rawX1, rawX2)
+    val y = yOffsetForLine(decorationPaint, baseline, thickness)
+    drawDecorationLine(
+        canvas,
+        decorationPaint,
+        x1,
+        x2,
+        y,
+        thickness,
+        textPaint.density,
+        style,
+        scratchPath,
+    )
+  }
+}

package/ReactAndroid/src/main/java/com/facebook/react/views/text/TextEffectRegistry.kt

@@ -0,0 +1,45 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+package com.facebook.react.views.text
+
+import com.facebook.common.logging.FLog
+import com.facebook.react.bridge.ReadableMap
+import com.facebook.react.common.annotations.UnstableReactNativeAPI
+import com.facebook.react.views.text.internal.span.TextEffectSpan
+import java.util.concurrent.ConcurrentHashMap
+
+@UnstableReactNativeAPI
+public class TextEffectRegistry {
+  private val factories = ConcurrentHashMap<String, TextEffectSpanFactory>()
+
+  public fun register(name: String, factory: TextEffectSpanFactory) {
+    factories[name] = factory
+    current = this
+  }
+
+  public fun unregister(name: String) {
+    factories.remove(name)
+  }
+
+  internal fun createSpan(name: String, props: ReadableMap?): TextEffectSpan? {
+    val factory = factories[name] ?: return null
+    return try {
+      factory.createSpan(props)
+    } catch (t: Throwable) {
+      // A throwing factory (e.g. invalid color prop) must not break the entire text render path
+      // for an unrelated paragraph or for subsequent renders. Skip this span and keep going.
+      FLog.e(TAG, "TextEffectSpanFactory '$name' threw — skipping span", t)
+      null
+    }
+  }
+
+  public companion object {
+    private const val TAG = "TextEffectRegistry"
+    @JvmField @Volatile public var current: TextEffectRegistry? = null
+  }
+}

package/ReactAndroid/src/main/java/com/facebook/react/views/text/TextEffectSpanFactory.kt

@@ -0,0 +1,17 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+package com.facebook.react.views.text
+
+import com.facebook.react.bridge.ReadableMap
+import com.facebook.react.common.annotations.UnstableReactNativeAPI
+import com.facebook.react.views.text.internal.span.TextEffectSpan
+
+@UnstableReactNativeAPI
+public fun interface TextEffectSpanFactory {
+  public fun createSpan(props: ReadableMap?): TextEffectSpan
+}