Hercules React Native to XRE - Text layout and stylesheet enhancements

This challenge is part of a new project involving React Native.  The eventual goal is to have a way to build React Native apps for Hercule's embedded devices that communicate with the device over websockets, using the proprietary XRE messaging protocol.  They would like to see if we can build a React Native translator that sits on a server and communicates with clients, sending them XRE messages to draw the React Native components.

Basically, we are going to stream apps to a client and update the client based on actions that raise events from the client to the server.

This challenge will implement better stylesheet support, Text layout (example below), and better mapping to the XRE HTMLText object

Requirements:

React Native can do a lot with embedded layouts and font styling, like this:

      <Image source={{uri:'http://wallpaperswide.com/download/sunset_clouds_guam-wallpaper-1280x720.jpg', width:1280, height:720}}>
        <Clock />
        <Text style={{top: 200}}>
          Here is some text that
          <Text style={{fontWeight: 'bold'}}> is nested </Text>
          as a test.
        </Text>
        <Text style={{top: 200}}>
          Here is some text that
          <Text style={{fontWeight: 'bold'}}> has <Image source={{uri: 'https://www.iconfinder.com/icons/132352/download/png/24', width: 24, height: 24}}></Image> nested </Text>
          as a test.
        </Text>      
      </Image>

XRE has an HTMLText object that can handle a lot of styling and more "HTML-ish" functionality like stylesheets and other things.

The client has specifically mentioned:

* Inline bold
* Italics
* Different font sizes
* Different font colors
* Inline images (like in the example above)

Sample app

You must provide a relatively robust sample app that demos different text styling and options.  Note that the text layout is still pending, but the other stuff is possible for this challenge.

The client provided this as a starting point, but the sample included with this challenge should take that and expand on it quite a bit to show different scenarios and options:

https://rnplay.org/apps/Mudfew

Note that any sample must be navigable by the keyboard.  Right now we have support for these keys:

* left
* right
* up 
* down
* enter
* escape


Native validation

To prove out the solution, we need to ensure that a native mobile build of an app matches what is displayed in XRE.  Please provide documentation on how to compile each example and run it in Android or iOS, and please also provide this information as part of your submission video.

Background

The server side "screens" will be implemented in React Native, using React classes. 
The goal is to make sure the React Native definition is generic, not custom to XRE.  The normal React Native development process will apply on the server.
 

Final Submission Guidelines

Please see above