diff --git a/apps/mobile/app.config.ts b/apps/mobile/app.config.ts index 097f8b92a7bd..11fb377145e3 100644 --- a/apps/mobile/app.config.ts +++ b/apps/mobile/app.config.ts @@ -422,6 +422,7 @@ const config: ExpoConfig = { "./plugins/withIosSceneLifecycle.cjs", "./plugins/withAndroidCleartextTraffic.cjs", "./plugins/withAndroidGradleHeap.cjs", + "./plugins/withAndroidInputBackground.cjs", "./plugins/withAndroidModernPopupMenu.cjs", "./plugins/withAndroidModernAlertDialog.cjs", "./plugins/withAndroidPredictiveBackCompat.cjs", diff --git a/apps/mobile/plugins/withAndroidInputBackground.cjs b/apps/mobile/plugins/withAndroidInputBackground.cjs new file mode 100644 index 000000000000..6b984f72309a --- /dev/null +++ b/apps/mobile/plugins/withAndroidInputBackground.cjs @@ -0,0 +1,27 @@ +const { withAndroidStyles } = require("expo/config-plugins"); + +module.exports = function withAndroidInputBackground(config) { + return withAndroidStyles(config, (config) => { + const appTheme = config.modResults.resources.style?.find( + (style) => style.$?.name === "AppTheme", + ); + if (!appTheme) { + throw new Error("withAndroidInputBackground: AppTheme is missing from styles.xml."); + } + + // Inputs draw their own backgrounds and borders. Remove the native underline + // drawable so it cannot peek out beneath rounded corners or return on focus. + // Set both attributes for AppCompat and framework EditText implementations. + appTheme.item ??= []; + for (const name of ["editTextBackground", "android:editTextBackground"]) { + const existing = appTheme.item.find((item) => item.$?.name === name); + if (existing) { + existing._ = "@null"; + } else { + appTheme.item.push({ $: { name }, _: "@null" }); + } + } + + return config; + }); +};