commit 0a4da354308651035268d1e28373f1bd8a2ad7ab
parent 083e93abf696c4ca0c4f78fc775c70027aadb1ed
Author: Konstantin Tarkus <hello@tarkus.me>
Date: Wed, 29 Oct 2014 12:14:29 +0300
Update to React v0.12
Diffstat:
9 files changed, 23 insertions(+), 46 deletions(-)
diff --git a/config/preprocessor.js b/config/preprocessor.js
@@ -4,8 +4,6 @@ var ReactTools = require('react-tools');
module.exports = {
process: function(src, path) {
- return ReactTools.transform(
- path.match(/\.jsx$/) ? '/**@jsx React.DOM*/' + src : src,
- {harmony: true});
+ return ReactTools.transform(src, {harmony: true});
}
};
diff --git a/package.json b/package.json
@@ -9,12 +9,13 @@
"bootstrap": "^3.2.0",
"director": "^1.2.3",
"flux": "^2.0.1",
- "react": "^0.11.2"
+ "lodash": "^2.4.1",
+ "react": "^0.12.0"
},
"devDependencies": {
- "browser-sync": "^1.5.8",
+ "browser-sync": "^1.6.1",
"del": "^0.1.3",
- "gulp": "^3.8.8",
+ "gulp": "^3.8.9",
"gulp-autoprefixer": "^1.0.1",
"gulp-cache": "^0.2.4",
"gulp-changed": "^1.0.0",
@@ -22,31 +23,31 @@
"gulp-gh-pages": "^0.4.0",
"gulp-htmlmin": "^0.2.0",
"gulp-if": "^1.2.5",
- "gulp-imagemin": "^1.1.0",
+ "gulp-imagemin": "^1.2.1",
"gulp-jsbeautifier": "^0.0.3",
- "gulp-jshint": "^1.8.5",
+ "gulp-jshint": "^1.8.6",
"gulp-less": "^1.3.6",
"gulp-load-plugins": "^0.7.0",
"gulp-minify-css": "^0.3.11",
"gulp-plumber": "^0.6.6",
- "gulp-render": "^0.0.4",
+ "gulp-render": "^0.1.1",
"gulp-replace": "^0.4.0",
"gulp-size": "^1.1.0",
"gulp-uglify": "^1.0.1",
"gulp-util": "^3.0.1",
"jest-cli": "^0.1.18",
- "jshint": "^2.5.6",
+ "jshint": "^2.5.7",
"jshint-loader": "^0.8.0",
"jshint-stylish": "^1.0.0",
- "jsx-loader": "^0.11.2",
+ "jsx-loader": "^0.12.0",
"merge-stream": "^0.1.6",
"minimist": "^1.1.0",
"protractor": "^1.3.1",
"psi": "^0.1.4",
- "react-tools": "^0.11.2",
+ "react": "^0.12.0",
"run-sequence": "^1.0.1",
"url-loader": "^0.5.5",
- "webpack": "^1.4.8",
+ "webpack": "^1.4.9",
"webpack-dev-server": "^1.6.5"
},
"jest": {
diff --git a/src/AppDispatcher.js b/src/AppDispatcher.js
@@ -5,11 +5,11 @@
'use strict';
+var _ = require('lodash');
var {Dispatcher} = require('flux');
var PayloadSources = require('./constants/PayloadSources');
-var copyProperties = require('react/lib/copyProperties');
-var AppDispatcher = copyProperties(new Dispatcher(), {
+var AppDispatcher = _.extend(new Dispatcher(), {
/**
* @param {object} action The details of the action, including the action's
diff --git a/src/app.js b/src/app.js
@@ -5,8 +5,8 @@
'use strict';
+var _ = require('lodash');
var React = require('react');
-var copyProperties = require('react/lib/copyProperties');
var {Router} = require('director');
var AppDispatcher = require('./AppDispatcher');
var ActionTypes = require('./constants/ActionTypes');
@@ -19,13 +19,13 @@ var ActionTypes = require('./constants/ActionTypes');
* into the specified layout, then mount to document.body.
*/
function render(page) {
- var child, props = {};
- while (page.defaultProps.layout) {
- child = page(props, child);
- copyProperties(props, page.defaultProps);
+ var child = null, props = {};
+ while (page.defaultProps && page.defaultProps.layout) {
+ child = React.createElement(page, props, child);
+ _.extend(props, page.defaultProps);
page = page.defaultProps.layout;
}
- React.renderComponent(page(props, child), document.body);
+ React.render(React.createElement(page, props, child), document.body);
document.title = props.title;
}
diff --git a/src/components/Link.jsx b/src/components/Link.jsx
@@ -1,7 +1,3 @@
-/**
- * @jsx React.DOM
- */
-
'use strict';
var React = require('react');
@@ -16,9 +12,7 @@ var Link = React.createClass({
this.props.to && this.props.to.lastIndexOf('/', 0) === 0 ?
this.props.to : '/' + this.props.to;
- return this.transferPropsTo(
- <a onClick={this.handleClick}>{this.props.children}</a>
- );
+ return <a onClick={this.handleClick} {...this.props}>{this.props.children}</a>;
},
handleClick(e) {
e.preventDefault();
diff --git a/src/components/Navbar.jsx b/src/components/Navbar.jsx
@@ -1,7 +1,3 @@
-/**
- * @jsx React.DOM
- */
-
'use strict';
var React = require('react');
@@ -10,7 +6,7 @@ var Link = require('./Link.jsx');
var Navbar = React.createClass({
render() {
return (
- <div className="navbar-top">
+ <div className="navbar-top" role="navigation">
<div className="container">
<Link className="navbar-brand row" to="/">
<img src="/images/logo-small.png" width="38" height="38" alt="React" />
diff --git a/src/layouts/DefaultLayout.jsx b/src/layouts/DefaultLayout.jsx
@@ -1,7 +1,3 @@
-/**
- * @jsx React.DOM
- */
-
'use strict';
var React = require('react');
@@ -11,7 +7,7 @@ var Navbar = require('../components/Navbar.jsx');
var DefaultLayout = React.createClass({
propTypes: {
title: React.PropTypes.string,
- breadcrumb: React.PropTypes.component
+ breadcrumb: React.PropTypes.element
},
getDefaultProps() {
return {
diff --git a/src/pages/Index.jsx b/src/pages/Index.jsx
@@ -1,7 +1,3 @@
-/**
- * @jsx React.DOM
- */
-
'use strict';
var React = require('react');
diff --git a/src/pages/Privacy.jsx b/src/pages/Privacy.jsx
@@ -1,7 +1,3 @@
-/**
- * @jsx React.DOM
- */
-
'use strict';
var React = require('react');
