diff --git a/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js b/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js index a335dc62b055c0..bcab27be7d7eb2 100644 --- a/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js +++ b/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js @@ -163,6 +163,14 @@ export type NativeProps = $ReadOnly<{| 'off', >, + /** + * String to be read by screenreaders to indicate an error state. If this value is + * not null, an error will be announced. You can use onChangeText or onBlur to + * detect an error and set this prop. Once the error is gone, set this to null + * to clear the error + */ + errorMessageAndroid?: ?Stringish, + /** * Sets the return key to the label. Use it instead of `returnKeyType`. * @platform android @@ -698,7 +706,7 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig = { inlineImageLeft: true, editable: true, fontVariant: true, - android_errorMessage: true, + errorMessageAndroid: true, borderBottomRightRadius: true, borderBottomColor: {process: require('../../StyleSheet/processColor')}, borderRadius: true, diff --git a/Libraries/Components/TextInput/TextInput.js b/Libraries/Components/TextInput/TextInput.js index bc3efcec4f46fa..3bb2519bdb4de0 100644 --- a/Libraries/Components/TextInput/TextInput.js +++ b/Libraries/Components/TextInput/TextInput.js @@ -408,7 +408,7 @@ type AndroidProps = $ReadOnly<{| * detect an error and set this prop. Once the error is gone, set this to null * to clear the error */ - android_errorMessage?: ?Stringish, + errorMessageAndroid?: ?Stringish, importantForAutofill?: ?( | 'auto' diff --git a/ReactAndroid/src/main/java/com/facebook/react/uimanager/ViewProps.java b/ReactAndroid/src/main/java/com/facebook/react/uimanager/ViewProps.java index 58b88fa02ee1f1..661c3466dde96f 100644 --- a/ReactAndroid/src/main/java/com/facebook/react/uimanager/ViewProps.java +++ b/ReactAndroid/src/main/java/com/facebook/react/uimanager/ViewProps.java @@ -84,7 +84,6 @@ public class ViewProps { public static final String BACKGROUND_COLOR = "backgroundColor"; public static final String FOREGROUND_COLOR = "foregroundColor"; public static final String COLOR = "color"; - public static final String ANDROID_ERROR_MESSAGE = "android_errorMessage"; public static final String FONT_SIZE = "fontSize"; public static final String FONT_WEIGHT = "fontWeight"; public static final String FONT_STYLE = "fontStyle"; diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java b/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java index 2e58e038b64dff..66fac702f09f15 100644 --- a/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java +++ b/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java @@ -373,8 +373,8 @@ public void updateExtraData(ReactEditText view, Object extraData) { } } - @ReactProp(name = ViewProps.ANDROID_ERROR_MESSAGE) - public void setErrorMessage(ReactEditText view, String error) { + @ReactProp(name = "errorMessageAndroid") + public void setErrorMessage(ReactEditText view, @Nullable String error) { view.setError(error); } @@ -1328,9 +1328,7 @@ public Object updateState( @Nullable String errorMessage = - props.hasKey(ViewProps.ANDROID_ERROR_MESSAGE) - ? props.getString(ViewProps.ANDROID_ERROR_MESSAGE) - : null; + props.hasKey("errorMessageAndroid") ? props.getString("errorMessageAndroid") : null; return ReactTextUpdate.buildReactTextUpdateFromState( spanned, diff --git a/packages/rn-tester/js/examples/TextInput/TextInputSharedExamples.js b/packages/rn-tester/js/examples/TextInput/TextInputSharedExamples.js index 3ba638d1eeac7d..e68078eff00324 100644 --- a/packages/rn-tester/js/examples/TextInput/TextInputSharedExamples.js +++ b/packages/rn-tester/js/examples/TextInput/TextInputSharedExamples.js @@ -483,7 +483,7 @@ function ErrorExample(): React.Node { Type error in the below TextInput to display an error message. setError('onBlur')} onEndEditing={() => setError('onEndEditing')} onChangeText={newText => {