RNMobile: Ensure text is always visible within Contact Info block (#3…

…3873)

Fixes an issue with the Contact Info block within the app, in which typed text can sometimes be invisible.

The issue occurs when a block based theme is active with a background colour that contrasts with the device's light/dark mode. For example, if a theme's background is light while the device has dark mode enabled, the text will be white on white.

projects/plugins/jetpack/changelog/rnmobile-ensure-contact-info-text-visibility

@@ -0,0 +1,4 @@
+Significance: patch
+Type: bugfix
+
+RNMobile: Ensure text is always visible in Contact Info block.

projects/plugins/jetpack/extensions/blocks/contact-info/address/edit.native.js

@@ -22,6 +22,7 @@ const AddressEdit = props => {
 		isSelected,
 		setAttributes,
 		onFocus,
+		style: { baseColors: { color: editorColors = {} } = {} } = {},
 	} = props;
 
 	const textData = [
@@ -98,10 +99,10 @@ const AddressEdit = props => {
 		styles.placeholder,
 		styles.placeholderDark
 	);
-	const textColors = usePreferredColorSchemeStyle(
-		styles.blockEditorPlainText,
-		styles.blockEditorPlainTextDark
-	);
+	const textColors = {
+		...usePreferredColorSchemeStyle( styles.blockEditorPlainText, styles.blockEditorPlainTextDark ),
+		...( editorColors?.text && { color: editorColors.text } ),
+	};
 
 	const onFocusTextInput = index => () => {
 		if ( index < textInputsSelected.length ) {

projects/plugins/jetpack/extensions/blocks/contact-info/common.native.js

@@ -3,16 +3,24 @@ import simpleInput from '../../shared/simple-input';
 import styles from './style.scss';
 
 const CommonChildEdit = props => {
-	const { setAttributes, getStylesFromColorScheme, type, keyboardType, save, label, attributeKey } =
-		props;
+	const {
+		setAttributes,
+		getStylesFromColorScheme,
+		type,
+		keyboardType,
+		save,
+		label,
+		attributeKey,
+		style: { baseColors: { color: editorColors = {} } = {} } = {},
+	} = props;
 	const { color: placeholderTextColor } = getStylesFromColorScheme(
 		styles.placeholder,
 		styles.placeholderDark
 	);
-	const textColors = getStylesFromColorScheme(
-		styles.blockEditorPlainText,
-		styles.blockEditorPlainTextDark
-	);
+	const textColors = {
+		...getStylesFromColorScheme( styles.blockEditorPlainText, styles.blockEditorPlainTextDark ),
+		...( editorColors?.text && { color: editorColors.text } ),
+	};
 	const nativeProps = {
 		keyboardType,
 		style: textColors,