fix(types): cross platform autoComplete for TextInput (#36931)

Summary:
Since v0.71 the autoComplete prop on TextInput is available on iOS ([release notes](https://reactnative.dev/blog/2023/01/12/version-071#component-specific-behavior)). However, this change is not reflected in the types.

Original types PR here - https://github.com/DefinitelyTyped/DefinitelyTyped/pull/65144 by chwallen

## Changelog:

[GENERAL] [FIXED] - Fix autoComplete type for TextInput

Pull Request resolved: https://github.com/facebook/react-native/pull/36931

Test Plan: Setting the autoComplete prop on TextInput to `nickname`, `organization`, `organization-title`, or `url` should not result in typescript errors.

Reviewed By: NickGerleman

Differential Revision: D45052350

Pulled By: javache

fbshipit-source-id: 40993833b4ed14f91e3bf3521a264ea93517a0c9
This commit is contained in:
Kyle Roach
2023-04-18 10:11:53 -07:00
committed by Facebook GitHub Bot
parent eb30a80c81
commit 94356e14ec
3 changed files with 363 additions and 356 deletions
@@ -289,92 +289,6 @@ export interface TextInputIOSProps {
* @see https://reactnative.dev/docs/textinput#props
*/
export interface TextInputAndroidProps {
/**
* Specifies autocomplete hints for the system, so it can provide autofill. On Android, the system will always attempt to offer autofill by using heuristics to identify the type of content.
* To disable autocomplete, set `autoComplete` to `off`.
*
* *Android Only*
*
* Possible values for `autoComplete` are:
*
* - `birthdate-day`
* - `birthdate-full`
* - `birthdate-month`
* - `birthdate-year`
* - `cc-csc`
* - `cc-exp`
* - `cc-exp-day`
* - `cc-exp-month`
* - `cc-exp-year`
* - `cc-number`
* - `email`
* - `gender`
* - `name`
* - `name-family`
* - `name-given`
* - `name-middle`
* - `name-middle-initial`
* - `name-prefix`
* - `name-suffix`
* - `password`
* - `password-new`
* - `postal-address`
* - `postal-address-country`
* - `postal-address-extended`
* - `postal-address-extended-postal-code`
* - `postal-address-locality`
* - `postal-address-region`
* - `postal-code`
* - `street-address`
* - `sms-otp`
* - `tel`
* - `tel-country-code`
* - `tel-national`
* - `tel-device`
* - `username`
* - `username-new`
* - `off`
*/
autoComplete?:
| 'birthdate-day'
| 'birthdate-full'
| 'birthdate-month'
| 'birthdate-year'
| 'cc-csc'
| 'cc-exp'
| 'cc-exp-day'
| 'cc-exp-month'
| 'cc-exp-year'
| 'cc-number'
| 'email'
| 'gender'
| 'name'
| 'name-family'
| 'name-given'
| 'name-middle'
| 'name-middle-initial'
| 'name-prefix'
| 'name-suffix'
| 'password'
| 'password-new'
| 'postal-address'
| 'postal-address-country'
| 'postal-address-extended'
| 'postal-address-extended-postal-code'
| 'postal-address-locality'
| 'postal-address-region'
| 'postal-code'
| 'street-address'
| 'sms-otp'
| 'tel'
| 'tel-country-code'
| 'tel-national'
| 'tel-device'
| 'username'
| 'username-new'
| 'off'
| undefined;
/**
* When provided it will set the color of the cursor (or "caret") in the component.
* Unlike the behavior of `selectionColor` the cursor color will be set independently
@@ -558,6 +472,127 @@ export interface TextInputProps
*/
autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters' | undefined;
/**
* Specifies autocomplete hints for the system, so it can provide autofill.
* On Android, the system will always attempt to offer autofill by using heuristics to identify the type of content.
* To disable autocomplete, set autoComplete to off.
*
* The following values work across platforms:
*
* - `additional-name`
* - `address-line1`
* - `address-line2`
* - `cc-number`
* - `country`
* - `current-password`
* - `email`
* - `family-name`
* - `given-name`
* - `honorific-prefix`
* - `honorific-suffix`
* - `name`
* - `new-password`
* - `off`
* - `one-time-code`
* - `postal-code`
* - `street-address`
* - `tel`
* - `username`
*
* The following values work on iOS only:
*
* - `nickname`
* - `organization`
* - `organization-title`
* - `url`
*
* The following values work on Android only:
*
* - `birthdate-day`
* - `birthdate-full`
* - `birthdate-month`
* - `birthdate-year`
* - `cc-csc`
* - `cc-exp`
* - `cc-exp-day`
* - `cc-exp-month`
* - `cc-exp-year`
* - `gender`
* - `name-family`
* - `name-given`
* - `name-middle`
* - `name-middle-initial`
* - `name-prefix`
* - `name-suffix`
* - `password`
* - `password-new`
* - `postal-address`
* - `postal-address-country`
* - `postal-address-extended`
* - `postal-address-extended-postal-code`
* - `postal-address-locality`
* - `postal-address-region`
* - `sms-otp`
* - `tel-country-code`
* - `tel-national`
* - `tel-device`
* - `username-new`
*/
autoComplete?:
| 'additional-name'
| 'address-line1'
| 'address-line2'
| 'birthdate-day'
| 'birthdate-full'
| 'birthdate-month'
| 'birthdate-year'
| 'cc-csc'
| 'cc-exp'
| 'cc-exp-day'
| 'cc-exp-month'
| 'cc-exp-year'
| 'cc-number'
| 'country'
| 'current-password'
| 'email'
| 'family-name'
| 'gender'
| 'given-name'
| 'honorific-prefix'
| 'honorific-suffix'
| 'name'
| 'name-family'
| 'name-given'
| 'name-middle'
| 'name-middle-initial'
| 'name-prefix'
| 'name-suffix'
| 'new-password'
| 'nickname'
| 'one-time-code'
| 'organization'
| 'organization-title'
| 'password'
| 'password-new'
| 'postal-address'
| 'postal-address-country'
| 'postal-address-extended'
| 'postal-address-extended-postal-code'
| 'postal-address-locality'
| 'postal-address-region'
| 'postal-code'
| 'street-address'
| 'sms-otp'
| 'tel'
| 'tel-country-code'
| 'tel-national'
| 'tel-device'
| 'url'
| 'username'
| 'username-new'
| 'off'
| undefined;
/**
* If false, disables auto-correct.
* The default value is true.
@@ -196,36 +196,6 @@ export type enterKeyHintType =
type PasswordRules = string;
type IOSProps = $ReadOnly<{|
/**
* Give the keyboard and the system information about the
* expected semantic meaning for the content that users enter.
* @platform ios
*/
autoComplete?: ?(
| 'address-line1'
| 'address-line2'
| 'cc-number'
| 'current-password'
| 'country'
| 'email'
| 'name'
| 'additional-name'
| 'family-name'
| 'given-name'
| 'nickname'
| 'honorific-prefix'
| 'honorific-suffix'
| 'new-password'
| 'off'
| 'one-time-code'
| 'organization'
| 'organization-title'
| 'postal-code'
| 'street-address'
| 'tel'
| 'url'
| 'username'
),
/**
* When the clear button should appear on the right side of the text view.
* This property is supported only for single-line TextInput component.
@@ -328,111 +298,6 @@ type IOSProps = $ReadOnly<{|
|}>;
type AndroidProps = $ReadOnly<{|
/**
* Specifies autocomplete hints for the system, so it can provide autofill. On Android, the system will always attempt to offer autofill by using heuristics to identify the type of content.
* To disable autocomplete, set `autoComplete` to `off`.
*
* *Android Only*
*
* Possible values for `autoComplete` are:
*
* - `birthdate-day`
* - `birthdate-full`
* - `birthdate-month`
* - `birthdate-year`
* - `cc-csc`
* - `cc-exp`
* - `cc-exp-day`
* - `cc-exp-month`
* - `cc-exp-year`
* - `cc-number`
* - `email`
* - `gender`
* - `name`
* - `name-family`
* - `name-given`
* - `name-middle`
* - `name-middle-initial`
* - `name-prefix`
* - `name-suffix`
* - `password`
* - `password-new`
* - `postal-address`
* - `postal-address-country`
* - `postal-address-extended`
* - `postal-address-extended-postal-code`
* - `postal-address-locality`
* - `postal-address-region`
* - `postal-code`
* - `street-address`
* - `sms-otp`
* - `tel`
* - `tel-country-code`
* - `tel-national`
* - `tel-device`
* - `username`
* - `username-new`
* - `off`
*
* @platform android
*/
autoComplete?: ?(
| 'birthdate-day'
| 'birthdate-full'
| 'birthdate-month'
| 'birthdate-year'
| 'cc-csc'
| 'cc-exp'
| 'cc-exp-day'
| 'cc-exp-month'
| 'cc-exp-year'
| 'cc-number'
| 'email'
| 'gender'
| 'name'
| 'name-family'
| 'name-given'
| 'name-middle'
| 'name-middle-initial'
| 'name-prefix'
| 'name-suffix'
| 'password'
| 'password-new'
| 'postal-address'
| 'postal-address-country'
| 'postal-address-extended'
| 'postal-address-extended-postal-code'
| 'postal-address-locality'
| 'postal-address-region'
| 'postal-code'
| 'street-address'
| 'sms-otp'
| 'tel'
| 'tel-country-code'
| 'tel-national'
| 'tel-device'
| 'username'
| 'username-new'
| 'off'
// additional HTML autocomplete values
| 'address-line1'
| 'address-line2'
| 'bday'
| 'bday-day'
| 'bday-month'
| 'bday-year'
| 'country'
| 'current-password'
| 'honorific-prefix'
| 'honorific-suffix'
| 'additional-name'
| 'family-name'
| 'given-name'
| 'new-password'
| 'one-time-code'
| 'sex'
),
/**
* When provided it will set the color of the cursor (or "caret") in the component.
* Unlike the behavior of `selectionColor` the cursor color will be set independently
@@ -533,6 +398,127 @@ export type Props = $ReadOnly<{|
*/
autoCapitalize?: ?AutoCapitalize,
/**
* Specifies autocomplete hints for the system, so it can provide autofill.
* On Android, the system will always attempt to offer autofill by using heuristics to identify the type of content.
* To disable autocomplete, set autoComplete to off.
*
* The following values work across platforms:
*
* - `additional-name`
* - `address-line1`
* - `address-line2`
* - `cc-number`
* - `country`
* - `current-password`
* - `email`
* - `family-name`
* - `given-name`
* - `honorific-prefix`
* - `honorific-suffix`
* - `name`
* - `new-password`
* - `off`
* - `one-time-code`
* - `postal-code`
* - `street-address`
* - `tel`
* - `username`
*
* The following values work on iOS only:
*
* - `nickname`
* - `organization`
* - `organization-title`
* - `url`
*
* The following values work on Android only:
*
* - `birthdate-day`
* - `birthdate-full`
* - `birthdate-month`
* - `birthdate-year`
* - `cc-csc`
* - `cc-exp`
* - `cc-exp-day`
* - `cc-exp-month`
* - `cc-exp-year`
* - `gender`
* - `name-family`
* - `name-given`
* - `name-middle`
* - `name-middle-initial`
* - `name-prefix`
* - `name-suffix`
* - `password`
* - `password-new`
* - `postal-address`
* - `postal-address-country`
* - `postal-address-extended`
* - `postal-address-extended-postal-code`
* - `postal-address-locality`
* - `postal-address-region`
* - `sms-otp`
* - `tel-country-code`
* - `tel-national`
* - `tel-device`
* - `username-new`
*/
autoComplete?: ?(
| 'additional-name'
| 'address-line1'
| 'address-line2'
| 'birthdate-day'
| 'birthdate-full'
| 'birthdate-month'
| 'birthdate-year'
| 'cc-csc'
| 'cc-exp'
| 'cc-exp-day'
| 'cc-exp-month'
| 'cc-exp-year'
| 'cc-number'
| 'country'
| 'current-password'
| 'email'
| 'family-name'
| 'gender'
| 'given-name'
| 'honorific-prefix'
| 'honorific-suffix'
| 'name'
| 'name-family'
| 'name-given'
| 'name-middle'
| 'name-middle-initial'
| 'name-prefix'
| 'name-suffix'
| 'new-password'
| 'nickname'
| 'one-time-code'
| 'organization'
| 'organization-title'
| 'password'
| 'password-new'
| 'postal-address'
| 'postal-address-country'
| 'postal-address-extended'
| 'postal-address-extended-postal-code'
| 'postal-address-locality'
| 'postal-address-region'
| 'postal-code'
| 'street-address'
| 'sms-otp'
| 'tel'
| 'tel-country-code'
| 'tel-national'
| 'tel-device'
| 'url'
| 'username'
| 'username-new'
| 'off'
),
/**
* If `false`, disables auto-correct. The default value is `true`.
*/
@@ -234,36 +234,6 @@ export type enterKeyHintType =
type PasswordRules = string;
type IOSProps = $ReadOnly<{|
/**
* Give the keyboard and the system information about the
* expected semantic meaning for the content that users enter.
* @platform ios
*/
autoComplete?: ?(
| 'address-line1'
| 'address-line2'
| 'cc-number'
| 'current-password'
| 'country'
| 'email'
| 'name'
| 'additional-name'
| 'family-name'
| 'given-name'
| 'nickname'
| 'honorific-prefix'
| 'honorific-suffix'
| 'new-password'
| 'off'
| 'one-time-code'
| 'organization'
| 'organization-title'
| 'postal-code'
| 'street-address'
| 'tel'
| 'url'
| 'username'
),
/**
* When the clear button should appear on the right side of the text view.
* This property is supported only for single-line TextInput component.
@@ -369,111 +339,6 @@ type IOSProps = $ReadOnly<{|
|}>;
type AndroidProps = $ReadOnly<{|
/**
* Specifies autocomplete hints for the system, so it can provide autofill. On Android, the system will always attempt to offer autofill by using heuristics to identify the type of content.
* To disable autocomplete, set `autoComplete` to `off`.
*
* *Android Only*
*
* Possible values for `autoComplete` are:
*
* - `birthdate-day`
* - `birthdate-full`
* - `birthdate-month`
* - `birthdate-year`
* - `cc-csc`
* - `cc-exp`
* - `cc-exp-day`
* - `cc-exp-month`
* - `cc-exp-year`
* - `cc-number`
* - `email`
* - `gender`
* - `name`
* - `name-family`
* - `name-given`
* - `name-middle`
* - `name-middle-initial`
* - `name-prefix`
* - `name-suffix`
* - `password`
* - `password-new`
* - `postal-address`
* - `postal-address-country`
* - `postal-address-extended`
* - `postal-address-extended-postal-code`
* - `postal-address-locality`
* - `postal-address-region`
* - `postal-code`
* - `street-address`
* - `sms-otp`
* - `tel`
* - `tel-country-code`
* - `tel-national`
* - `tel-device`
* - `username`
* - `username-new`
* - `off`
*
* @platform android
*/
autoComplete?: ?(
| 'birthdate-day'
| 'birthdate-full'
| 'birthdate-month'
| 'birthdate-year'
| 'cc-csc'
| 'cc-exp'
| 'cc-exp-day'
| 'cc-exp-month'
| 'cc-exp-year'
| 'cc-number'
| 'email'
| 'gender'
| 'name'
| 'name-family'
| 'name-given'
| 'name-middle'
| 'name-middle-initial'
| 'name-prefix'
| 'name-suffix'
| 'password'
| 'password-new'
| 'postal-address'
| 'postal-address-country'
| 'postal-address-extended'
| 'postal-address-extended-postal-code'
| 'postal-address-locality'
| 'postal-address-region'
| 'postal-code'
| 'street-address'
| 'sms-otp'
| 'tel'
| 'tel-country-code'
| 'tel-national'
| 'tel-device'
| 'username'
| 'username-new'
| 'off'
// additional HTML autocomplete values
| 'address-line1'
| 'address-line2'
| 'bday'
| 'bday-day'
| 'bday-month'
| 'bday-year'
| 'country'
| 'current-password'
| 'honorific-prefix'
| 'honorific-suffix'
| 'additional-name'
| 'family-name'
| 'given-name'
| 'new-password'
| 'one-time-code'
| 'sex'
),
/**
* When provided it will set the color of the cursor (or "caret") in the component.
* Unlike the behavior of `selectionColor` the cursor color will be set independently
@@ -574,6 +439,127 @@ export type Props = $ReadOnly<{|
*/
autoCapitalize?: ?AutoCapitalize,
/**
* Specifies autocomplete hints for the system, so it can provide autofill.
* On Android, the system will always attempt to offer autofill by using heuristics to identify the type of content.
* To disable autocomplete, set autoComplete to off.
*
* The following values work across platforms:
*
* - `additional-name`
* - `address-line1`
* - `address-line2`
* - `cc-number`
* - `country`
* - `current-password`
* - `email`
* - `family-name`
* - `given-name`
* - `honorific-prefix`
* - `honorific-suffix`
* - `name`
* - `new-password`
* - `off`
* - `one-time-code`
* - `postal-code`
* - `street-address`
* - `tel`
* - `username`
*
* The following values work on iOS only:
*
* - `nickname`
* - `organization`
* - `organization-title`
* - `url`
*
* The following values work on Android only:
*
* - `birthdate-day`
* - `birthdate-full`
* - `birthdate-month`
* - `birthdate-year`
* - `cc-csc`
* - `cc-exp`
* - `cc-exp-day`
* - `cc-exp-month`
* - `cc-exp-year`
* - `gender`
* - `name-family`
* - `name-given`
* - `name-middle`
* - `name-middle-initial`
* - `name-prefix`
* - `name-suffix`
* - `password`
* - `password-new`
* - `postal-address`
* - `postal-address-country`
* - `postal-address-extended`
* - `postal-address-extended-postal-code`
* - `postal-address-locality`
* - `postal-address-region`
* - `sms-otp`
* - `tel-country-code`
* - `tel-national`
* - `tel-device`
* - `username-new`
*/
autoComplete?: ?(
| 'additional-name'
| 'address-line1'
| 'address-line2'
| 'birthdate-day'
| 'birthdate-full'
| 'birthdate-month'
| 'birthdate-year'
| 'cc-csc'
| 'cc-exp'
| 'cc-exp-day'
| 'cc-exp-month'
| 'cc-exp-year'
| 'cc-number'
| 'country'
| 'current-password'
| 'email'
| 'family-name'
| 'gender'
| 'given-name'
| 'honorific-prefix'
| 'honorific-suffix'
| 'name'
| 'name-family'
| 'name-given'
| 'name-middle'
| 'name-middle-initial'
| 'name-prefix'
| 'name-suffix'
| 'new-password'
| 'nickname'
| 'one-time-code'
| 'organization'
| 'organization-title'
| 'password'
| 'password-new'
| 'postal-address'
| 'postal-address-country'
| 'postal-address-extended'
| 'postal-address-extended-postal-code'
| 'postal-address-locality'
| 'postal-address-region'
| 'postal-code'
| 'street-address'
| 'sms-otp'
| 'tel'
| 'tel-country-code'
| 'tel-national'
| 'tel-device'
| 'url'
| 'username'
| 'username-new'
| 'off'
),
/**
* If `false`, disables auto-correct. The default value is `true`.
*/