Bottom navigation with icons: invalid props tintColor

Issue type

I’m submitting a … (check one with “x”)

• bug report?
• feature request

Issue description

Current behavior: When I add any icons to bottom tab navigation (e.g. @expo/vector-icons) it shows me Warning: Failed prop type: Invalid props.style key tintColor supplied to Text.

Expected behavior: no warnings.

Steps to reproduce: I’ve basically copy-pasted “With React Navigation API and usage example” from Bottom Navigation documentation and added few icons from @expo/vector-icons to the tabs.

Related code:

import { MaterialIcons } from '@expo/vector-icons';

const WalletIcon = ({ tintColor }) => 
  <MaterialIcons color={tintColor} name="compare-arrows" size={24} />

<BottomNavigationTab title='Accounts' icon={WalletIcon} />

Other information:

OS, device, package version

WIN10, Android Emulator API 29

[deveshrawat]

it still not fixed i am facing the same issue .

[artyorsh]

There are two options for you now:

• Configure YellowBox to ignore this type of warning
• Use any other icons library that renders SVG (e.g Eva Icons), or simply use an Image component

Again, the fix will be available in the next release 😃