TextInput keyboard type matches the expected input

A TextInput for email without keyboardType="email-address" hides the @ under a long-press, forcing users to tap-and-hold on every signup. A phone field with the default keyboard hides the numeric pad entirely. These mismatches slow data entry by several seconds per field and inflate typos, which show up as invalid-format errors and failed signup conversions. It also breaks autofill integration with autoComplete hints.

Set keyboardType on every specialized input and pair it with autoComplete hints so iOS and Android autofill work correctly:

<TextInput placeholder="Email" keyboardType="email-address" autoCapitalize="none" autoComplete="email" textContentType="emailAddress" />
<TextInput placeholder="Phone" keyboardType="phone-pad" autoComplete="tel" />
<TextInput placeholder="PIN" keyboardType="numeric" secureTextEntry />
<TextInput placeholder="Price" keyboardType="decimal-pad" />

Use decimal-pad for money and numeric for integer-only values.

• ID: mobile-ux-patterns.keyboard-input.keyboard-type

• Severity: medium

• What to look for: Count every TextInput in the app. For each, classify the expected input type (email, phone, number, URL, text) and check whether the keyboardType prop matches: email-address for emails, phone-pad for phone numbers, numeric for numbers, decimal-pad for decimals, url for URLs. Report: "X of Y TextInputs have correct keyboardType."

• Pass criteria: At least 100% of TextInput fields that accept specialized input (email, phone, number, URL) have the correct keyboardType set. Only truly free-text inputs may use the default keyboard type.

• Fail criteria: Any TextInput for specialized input (email, phone, number) uses the default keyboard type, or incorrect keyboard types are set (e.g., numeric on an email field).

• Skip (N/A) when: App has no text input fields or all inputs are free-text with no specialized format.

• Detail on fail: Quote the actual prop (or lack thereof). "Email input uses default keyboard instead of email-address — no @ symbol readily available." or "Phone number input uses default keyboard instead of phone-pad."

• Remediation: Set appropriate keyboardType on TextInput:

  <TextInput
    placeholder="Email"
    keyboardType="email-address"
    autoCapitalize="none"
    autoComplete="email"
  />
  
  <TextInput
    placeholder="Phone"
    keyboardType="phone-pad"
    autoComplete="tel"
  />
  
  <TextInput
    placeholder="PIN"
    keyboardType="numeric"
    secureTextEntry
  />
  
  <TextInput
    placeholder="Price"
    keyboardType="decimal-pad"
  />