NavigatorIOS System Icon Support

Summary:
Continuation on #3959 (started by cancan101). Rebased to latest master, adds support for left system icon, fixes issues mentioned in previous PR.

<img width="432" alt="screen shot 2016-09-05 at 13 54 41" src="https://cloud.githubusercontent.com/assets/7275322/18248478/5b7aa25c-7370-11e6-8c51-01a2b7fd1030.png">
Closes https://github.com/facebook/react-native/pull/9742

Differential Revision: D3836850

Pulled By: javache

fbshipit-source-id: ef9f6e42211ed18bf5f3dc1eb7a8b1318d939674

Libraries/Components/Navigation/NavigatorIOS.ios.js

@@ -25,6 +25,8 @@ var invariant = require('fbjs/lib/invariant');
 var logError = require('logError');
 var requireNativeComponent = require('requireNativeComponent');
 
+const keyMirror = require('fbjs/lib/keyMirror');
+
 var TRANSITIONER_REF = 'transitionerRef';
 
 var PropTypes = React.PropTypes;
@@ -50,6 +52,34 @@ class NavigatorTransitionerIOS extends React.Component {
   }
 }
 
+const SystemIconLabels = {
+  done: true,
+  cancel: true,
+  edit: true,
+  save: true,
+  add: true,
+  compose: true,
+  reply: true,
+  action: true,
+  organize: true,
+  bookmarks: true,
+  search: true,
+  refresh: true,
+  stop: true,
+  camera: true,
+  trash: true,
+  play: true,
+  pause: true,
+  rewind: true,
+  'fast-forward': true,
+  undo: true,
+  redo: true,
+  'page-curl': true,
+};
+const SystemIcons = keyMirror(SystemIconLabels);
+
+type SystemButtonType = $Enum<typeof SystemIconLabels>;
+
 type Route = {
   component: Function,
   title: string,
@@ -59,9 +89,11 @@ type Route = {
   backButtonIcon?: Object,
   leftButtonTitle?: string,
   leftButtonIcon?: Object,
+  leftButtonSystemIcon?: SystemButtonType;
   onLeftButtonPress?: Function,
   rightButtonTitle?: string,
   rightButtonIcon?: Object,
+  rightButtonSystemIcon?: SystemButtonType;
   onRightButtonPress?: Function,
   wrapperStyle?: any,
 };
@@ -336,6 +368,16 @@ var NavigatorIOS = React.createClass({
        */
       leftButtonTitle: PropTypes.string,
 
+      /**
+       * If set, the left header button will appear with this system icon
+       *
+       * Supported icons are `done`, `cancel`, `edit`, `save`, `add`,
+       * `compose`, `reply`, `action`, `organize`, `bookmarks`, `search`,
+       * `refresh`, `stop`, `camera`, `trash`, `play`, `pause`, `rewind`,
+       * `fast-forward`, `undo`, `redo`, and `page-curl`
+       */
+      leftButtonSystemIcon: PropTypes.oneOf(Object.keys(SystemIcons)),
+
       /**
        * This function will be invoked when the left navigation bar item is
        * pressed.
@@ -353,6 +395,13 @@ var NavigatorIOS = React.createClass({
        */
       rightButtonTitle: PropTypes.string,
 
+      /**
+       * If set, the right header button will appear with this system icon
+       *
+       * See leftButtonSystemIcon for supported icons
+       */
+      rightButtonSystemIcon: PropTypes.oneOf(Object.keys(SystemIcons)),
+
       /**
        * This function will be invoked when the right navigation bar item is
        * pressed.