Fix textTransform when used with other text styles on Android (#22670)

Summary:
On Android `textTransform` breaks other styles applied to the text. It seems related to the usage of `ReplacementSpan` which allows drawing the text manually but seems to throw away some changes made by other span applied to the text.

To fix it I removed the usage of `ReplacementSpan` and simply transform the text before appending it to the `Spannable` string. To make sure textTransform is inherited correctly I added it to TextAttributes which handles this.
Pull Request resolved: facebook/react-native#22670

Differential Revision: D13494819

Pulled By: cpojer

fbshipit-source-id: 1c69591084aa906c2d3b10153b354d39c0936340

js/TextExample.android.js

@@ -8,6 +8,8 @@
  * @flow
  */
 
+/* eslint-disable react-native/no-inline-styles */
+
 'use strict';
 
 const React = require('react');
@@ -600,6 +602,18 @@ class TextExample extends React.Component<{}> {
               '.aa\tbb\t\tcc  dd EE \r\nZZ I like to eat apples. \n中文éé 我喜欢吃苹果。awdawd   '
             }
           </Text>
+          <Text
+            style={{
+              textTransform: 'uppercase',
+              fontSize: 16,
+              color: 'turquoise',
+              backgroundColor: 'blue',
+              lineHeight: 32,
+              letterSpacing: 2,
+              alignSelf: 'flex-start',
+            }}>
+            Works with other text styles
+          </Text>
         </RNTesterBlock>
       </RNTesterPage>
     );