Merge pull request facebookarchive#189 from zpao/docs-update

Update Website

Author: zpao

website/core/H2.js

@@ -8,9 +8,7 @@ var Header = require('Header');
 
 var H2 = React.createClass({
   render: function() {
-    return this.transferPropsTo(
-      <Header level={2}>{this.props.children}</Header>
-    );
+    return <Header {...this.props} level={2}>{this.props.children}</Header>
   }
 });
 

website/core/Header.js

@@ -38,10 +38,10 @@ var Header = React.createClass({
 
   render: function() {
     var slug = this.slug(this.props.toSlug || this.props.children);
-    var Heading = React.DOM['h' + this.props.level];
+    var Heading = 'h' + this.props.level;
 
-    return this.transferPropsTo(
-      <Heading>
+    return (
+      <Heading {...this.props}>
         <a className="anchor" name={slug}></a>
         {this.props.children}
         {' '}<a className="hash-link" href={'#' + slug}>#</a>

website/core/Marked.js

@@ -812,13 +812,14 @@ Parser.prototype.tok = function() {
       return React.DOM.hr(null, null);
     }
     case 'heading': {
-      return Header(
-        {level: this.token.depth, toSlug: this.token.text},
-        this.inline.output(this.token.text)
+      return (
+        <Header level={this.token.depth} toSlug={this.token.text}>
+          {this.inline.output(this.token.text)}
+        </Header>
       );
     }
     case 'code': {
-      return Prism(null, this.token.text);
+      return <Prism>{this.token.text}</Prism>;
     }
     case 'table': {
       var table = []
@@ -1087,7 +1088,7 @@ marked.parse = marked;
 
 var Marked = React.createClass({
   render: function() {
-    return React.DOM.div(null, marked(this.props.children, this.props));
+    return <div>{marked(this.props.children, this.props)}</div>;
   }
 });
 

website/core/Site.js

@@ -31,7 +31,7 @@ var Site = React.createClass({
             <div className="nav-main">
               <div className="wrap">
                 <a className="nav-home" href="/flux/">
-                  <img class="nav-logo" src="/flux/img/flux_logo.svg" width="50" height="50" />
+                  <img className="nav-logo" src="/flux/img/flux_logo.svg" width="50" height="50" />
                   Flux
                 </a>
                 <HeaderLinks section={this.props.section} />

website/core/center.js

@@ -5,10 +5,15 @@
 
 var React = require('React');
 
+var assign = require('object-assign');
+
 var center = React.createClass({
   render: function() {
-    return this.transferPropsTo(
-      <div style={{textAlign: 'center'}}>{this.props.children}</div>
+    var {style, ...props} = this.props;
+    style = assign({}, style, {textAlign: 'center'});
+
+    return (
+      <div {...props} style={style}>{this.props.children}</div>
     );
   }
 });

website/package.json

@@ -3,18 +3,19 @@
     "start": "node server/server.js"
   },
   "dependencies": {
-    "react": "~0.12.0",
-    "optimist": "0.6.0",
-    "react-page-middleware": "git://github.com/facebook/react-page-middleware.git",
-    "connect": "3.3.3",
     "compression": "1.2.2",
+    "connect": "3.3.3",
     "errorhandler": "1.3.0",
-    "morgan": "1.5.0",
-    "serve-favicon": "2.2.0",
-    "serve-static": "1.7.1",
+    "fs.extra": "*",
     "glob": "*",
     "mkdirp": "*",
+    "morgan": "1.5.0",
+    "object-assign": "^2.0.0",
+    "optimist": "0.6.0",
+    "react": "^0.13.1",
+    "react-page-middleware": "git://github.com/facebookarchive/react-page-middleware.git",
     "request": "*",
-    "fs.extra": "*"
+    "serve-favicon": "2.2.0",
+    "serve-static": "1.7.1"
   }
 }

website/server/convert.js

@@ -72,18 +72,18 @@ function execute() {
         var content = (
           '/**\n' +
           ' * @generated\n' +
-          ' * @jsx React.DOM\n' +
           ' */\n' +
           'var React = require("React");\n' +
-          'var layout = require("' + layout + '");\n' +
+          'var Layout = require("' + layout + '");\n' +
           'var content = ' + backtickify(both.content) + '\n' +
           'var Post = React.createClass({\n' +
+          '  statics: {\n' +
+          '    content: content\n' +
+          '  },\n' +
           '  render: function() {\n' +
-          '    return layout({metadata: ' + JSON.stringify(metadata) + '}, content);\n' +
+          '    return <Layout metadata={' + JSON.stringify(metadata) + '}>{content}</Layout>;\n' +
           '  }\n' +
           '});\n' +
-          // TODO: Use React statics after upgrading React
-          'Post.content = content;\n' +
           'module.exports = Post;\n'
         );