diff --git a/patches/react-native/details.md b/patches/react-native/details.md index 7e5822d2e2b4..997af61cceb4 100644 --- a/patches/react-native/details.md +++ b/patches/react-native/details.md @@ -170,16 +170,9 @@ - E/App issue: šŸ›‘ - PR Introducing Patch: https://github.com/Expensify/App/pull/59738 -### [react-native+0.79.2+024+restore-old-line-height-algorithm.patch](react-native+0.79.2+024+restore-old-line-height-algorithm.patch) - -- Reason: This patch fixes line height calculation issues in Android text rendering by replacing the web-based CSS implementation with a priority-based approach that properly handles cases where font metrics exceed the specified line height, ensuring better text display consistency and preventing text clipping -- Upstream PR/issue: šŸ›‘ -- E/App issue: šŸ›‘ -- PR Introducing Patch: https://github.com/Expensify/App/pull/60421 - -### [react-native+0.79.2+025+fix-display-contents-not-updating-nodes.patch](react-native+0.79.2+025+fix-display-contents-not-updating-nodes.patch) +### [react-native+0.79.2+024+fix-display-contents-not-updating-nodes.patch](react-native+0.79.2+024+fix-display-contents-not-updating-nodes.patch) - Reason: This patch updates Yoga to correctly update the subtrees of `display: contents` nodes so that they are in sync with their React Native counterparts. - Upstream PR/issue: https://github.com/facebook/react-native/pull/52530 - E/App issue: https://github.com/Expensify/App/issues/65268 -- PR introducing patch: [#65925](https://github.com/Expensify/App/pull/65925) \ No newline at end of file +- PR introducing patch: [#65925](https://github.com/Expensify/App/pull/65925) diff --git a/patches/react-native/react-native+0.79.2+025+fix-display-contents-not-updating-nodes.patch b/patches/react-native/react-native+0.79.2+024+fix-display-contents-not-updating-nodes.patch similarity index 100% rename from patches/react-native/react-native+0.79.2+025+fix-display-contents-not-updating-nodes.patch rename to patches/react-native/react-native+0.79.2+024+fix-display-contents-not-updating-nodes.patch diff --git a/patches/react-native/react-native+0.79.2+024+restore-old-line-height-algorithm.patch b/patches/react-native/react-native+0.79.2+024+restore-old-line-height-algorithm.patch deleted file mode 100644 index 0048c7b4a3cd..000000000000 --- a/patches/react-native/react-native+0.79.2+024+restore-old-line-height-algorithm.patch +++ /dev/null @@ -1,77 +0,0 @@ -diff --git a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/views/text/internal/span/CustomLineHeightSpan.kt b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/views/text/internal/span/CustomLineHeightSpan.kt -index c73d42f..11b70e1 100644 ---- a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/views/text/internal/span/CustomLineHeightSpan.kt -+++ b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/views/text/internal/span/CustomLineHeightSpan.kt -@@ -11,6 +11,7 @@ import android.graphics.Paint.FontMetricsInt - import android.text.style.LineHeightSpan - import kotlin.math.ceil - import kotlin.math.floor -+import kotlin.math.min - - /** - * Implements a [LineHeightSpan] which follows web-like behavior for line height, unlike -@@ -28,29 +29,42 @@ public class CustomLineHeightSpan(height: Float) : LineHeightSpan, ReactSpan { - v: Int, - fm: FontMetricsInt, - ) { -- // https://www.w3.org/TR/css-inline-3/#inline-height -- // When its computed line-height is not normal, its layout bounds are derived solely from -- // metrics of its first available font (ignoring glyphs from other fonts), and leading is used -- // to adjust the effective A and D to add up to the used line-height. Calculate the leading L as -- // L = line-height - (A + D). Half the leading (its half-leading) is added above A of the first -- // available font, and the other half below D of the first available font, giving an effective -- // ascent above the baseline of A′ = A + L/2, and an effective descent of D′ = D + L/2. However, -- // if line-fit-edge is not leading and this is not the root inline box, if the half-leading is -- // positive, treat it as zero. The layout bounds exactly encloses this effective A′ and D′. -+ // This is more complicated that I wanted it to be. You can find a good explanation of what the -+ // FontMetrics mean here: http://stackoverflow.com/questions/27631736. -+ // The general solution is that if there's not enough height to show the full line height, we -+ // will prioritize in this order: descent, ascent, bottom, top - -- val leading = lineHeight - ((-fm.ascent) + fm.descent) -- fm.ascent -= ceil(leading / 2.0f).toInt() -- fm.descent += floor(leading / 2.0f).toInt() -+ if (fm.descent > lineHeight) { -+ // Show as much descent as possible -+ fm.descent = min(lineHeight.toDouble(), fm.descent.toDouble()).toInt() -+ fm.bottom = fm.descent -+ fm.ascent = 0 -+ fm.top = fm.ascent -+ } else if (-fm.ascent + fm.descent > lineHeight) { -+ // Show all descent, and as much ascent as possible -+ fm.bottom = fm.descent -+ fm.ascent = -lineHeight + fm.descent -+ fm.top = fm.ascent -+ } else if (-fm.ascent + fm.bottom > lineHeight) { -+ // Show all ascent, descent, as much bottom as possible -+ fm.top = fm.ascent -+ fm.bottom = fm.ascent + lineHeight -+ } else if (-fm.top + fm.bottom > lineHeight) { -+ // Show all ascent, descent, bottom, as much top as possible -+ fm.top = fm.bottom - lineHeight -+ } else { -+ // Show proportionally additional ascent / top & descent / bottom -+ val additional = lineHeight - (-fm.top + fm.bottom) - -- // The top of the first line, and the bottom of the last line, may influence bounds of the -- // paragraph, so we match them to the text ascent/descent. It is otherwise desirable to allow -- // line boxes to overlap (to allow too large glyphs to be drawn outside them), so we do not -- // adjust the top/bottom of interior line-boxes. -- if (start == 0) { -- fm.top = fm.ascent -- } -- if (end == text.length) { -- fm.bottom = fm.descent -- } -+ // Round up for the negative values and down for the positive values (arbitrary choice) -+ // So that bottom - top equals additional even if it's an odd number. -+ val top = (fm.top - ceil(additional / 2.0f)).toInt() -+ val bottom = (fm.bottom + floor(additional / 2.0f)).toInt() -+ -+ fm.top = top -+ fm.ascent = top -+ fm.descent = bottom -+ fm.bottom = bottom -+ } - } - } diff --git a/src/styles/index.ts b/src/styles/index.ts index d4cb7375a057..e2a46a5bc40b 100644 --- a/src/styles/index.ts +++ b/src/styles/index.ts @@ -3209,7 +3209,6 @@ const styles = (theme: ThemeColors) => ...headlineFont, fontSize: variables.iouAmountTextSize, color: theme.heading, - lineHeight: variables.inputHeight, }, iouAmountTextInput: addOutlineWidth(