Skip to content

Fix TextInput outline collapsing below theme default padding (#59372) - #59372

Closed
mehulg-meta wants to merge 1 commit into
react:mainfrom
mehulg-meta:export-D126540563
Closed

mehulg-meta wants to merge 1 commit into
react:mainfrom
mehulg-meta:export-D126540563

Conversation

@mehulg-meta

@mehulg-meta mehulg-meta commented Oct 22, 2026 •

Copy link
Copy Markdown
Contributor

Summary:

TextInput keeps the theme's default EditText background but applies the style's padding. That background is an inset around underline nine-patches, so its outline is the view bounds minus the insets, which only the theme padding covers. With less padding, such as padding: 0, the outline collapses to a strip through the text, which breaks elevation shadows and anything else that reads the view outline.

ReactEditText now uses its bounds as the outline in that case, and refreshes the outline when its padding changes, since Android only does so on size and background changes. Any other background, including the ones React Native creates for border and background styles, keeps its normal outline.

Changelog:
[Android][Fixed] - Fix TextInput outline collapsing when its padding is below the theme default

Reviewed By: christophpurrer

Differential Revision: D126540563

@meta-cla meta-cla Bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Oct 22, 2026
@meta-codesync

meta-codesync Bot commented Oct 22, 2026

Copy link
Copy Markdown

@mehulg-meta has exported this pull request. If you are a Meta employee, you can view the originating Diff in D126540563.

@github-actions

github-actions Bot commented Oct 22, 2026 •

Copy link
Copy Markdown

Visual regression

1 visual difference(s) at c0d355540bec. Visual differences need maintainer approval. Review the report, then apply visual-change-approved.

ios: no capture

android transform/string/default: Changed, 1 px (0.000%)

diff

Expected and Captured
Expected Captured
expected captured

…9372)

Summary:
Pull Request resolved: react#59372

TextInput keeps the theme's default EditText background but applies the style's padding. That background is an inset around underline nine-patches, so its outline is the view bounds minus the insets, which only the theme padding covers. With less padding, such as `padding: 0`, the outline collapses to a strip through the text, which breaks elevation shadows and anything else that reads the view outline.

`ReactEditText` now uses its bounds as the outline in that case, and refreshes the outline when its padding changes, since Android only does so on size and background changes. Any other background, including the ones React Native creates for border and background styles, keeps its normal outline.

Changelog:
[Android][Fixed] - Fix `TextInput` outline collapsing when its padding is below the theme default

Reviewed By: christophpurrer

Differential Revision: D126540563
@meta-codesync meta-codesync Bot changed the title Fix TextInput outline collapsing below theme default padding Fix TextInput outline collapsing below theme default padding (#59372) Oct 23, 2026
@meta-codesync meta-codesync Bot closed this in da42db9 Oct 23, 2026
@react-native-bot react-native-bot added the Merged This PR has been merged. label Oct 23, 2026
@react-native-bot

Copy link
Copy Markdown
Collaborator

This pull request was successfully merged by @mehulg-meta in da42db9

When will my fix make it into a release? | How to file a pick request?

@meta-codesync

meta-codesync Bot commented Oct 23, 2026

Copy link
Copy Markdown

This pull request has been merged in da42db9.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Merged This PR has been merged. meta-exported p: Facebook Partner: Facebook Partner

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants