diff --git a/projects/plugins/jetpack/changelog/rnmobile-ensure-contact-info-text-visibility b/projects/plugins/jetpack/changelog/rnmobile-ensure-contact-info-text-visibility new file mode 100644 index 0000000000000..fcddf81b5ffa3 --- /dev/null +++ b/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. diff --git a/projects/plugins/jetpack/extensions/blocks/contact-info/address/edit.native.js b/projects/plugins/jetpack/extensions/blocks/contact-info/address/edit.native.js index 94ca9a34b0807..da6e767bc77be 100644 --- a/projects/plugins/jetpack/extensions/blocks/contact-info/address/edit.native.js +++ b/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 ) { diff --git a/projects/plugins/jetpack/extensions/blocks/contact-info/common.native.js b/projects/plugins/jetpack/extensions/blocks/contact-info/common.native.js index 2316fe4089cef..be76950eb370e 100644 --- a/projects/plugins/jetpack/extensions/blocks/contact-info/common.native.js +++ b/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,