[appbar] allow override of the style props in AppCanvas

src/app-bar.jsx

@@ -18,12 +18,13 @@ let AppBar = React.createClass({
     onLeftIconButtonTouchTap: React.PropTypes.func,
     onRightIconButtonTouchTap: React.PropTypes.func,
     showMenuIconButton: React.PropTypes.bool,
+    style: React.PropTypes.object,
     iconClassNameLeft: React.PropTypes.string,
     iconClassNameRight: React.PropTypes.string,
     iconElementLeft: React.PropTypes.element,
     iconElementRight: React.PropTypes.element,
     iconStyleRight: React.PropTypes.object,
-    title : React.PropTypes.node,
+    title: React.PropTypes.node,
     zDepth: React.PropTypes.number,
   },
 
@@ -32,7 +33,7 @@ let AppBar = React.createClass({
       showMenuIconButton: true,
       title: '',
       zDepth: 1
-    }
+    };
   },
 
   componentDidMount: function() {

src/app-canvas.jsx

@@ -1,7 +1,10 @@
 let React = require('react');
+let StylePropable = require('./mixins/style-propable');
 
 let AppCanvas = React.createClass({
 
+  mixins: [StylePropable],
+
   contextTypes: {
     muiTheme: React.PropTypes.object
   },
@@ -16,15 +19,15 @@ let AppCanvas = React.createClass({
 
     let newChildren = React.Children.map(this.props.children, function(currentChild) {
       if (!currentChild) { // If undefined, skip it
-        return;
+        return null;
       }
 
       switch (currentChild.type.displayName) {
         case 'AppBar' :
           return React.cloneElement(currentChild, {
-            style: {
+            style: this.mergeStyles({
               position: 'fixed',
-            }
+            }, currentChild.props.style)
           });
         default:
           return currentChild;

src/mixins/style-propable.js

@@ -17,7 +17,9 @@ module.exports = {
     let args = Array.prototype.slice.call(arguments, 0);
     let base = args[0];
     for (let i = 1; i < args.length; i++) {
-      if (args[i]) base = Extend(base, args[i]);
+      if (args[i]) {
+        base = Extend(base, args[i]);
+      }
     }
     return base;
   },
@@ -30,4 +32,4 @@ module.exports = {
     let mergedStyles = this.mergeStyles.apply(this, arguments);
     return AutoPrefix.all(mergedStyles);
   },
-}
+};