commit 6e18aa146c4a02ba8d004ee12ae7392057608ea6
parent 43ecd6bc4f3acfaac511621f0f424642f1f4a622
Author: Konstantin Tarkus <hello@tarkus.me>
Date: Wed, 20 May 2015 20:42:43 +0300
Update references to higher-order components
Diffstat:
15 files changed, 65 insertions(+), 71 deletions(-)
diff --git a/src/components/App/App.js b/src/components/App/App.js
@@ -2,7 +2,8 @@
import React, { PropTypes } from 'react';
import styles from './App.less'; // eslint-disable-line no-unused-vars
-import { withContext, withStyles } from '../decorators'; // eslint-disable-line no-unused-vars
+import withContext from '../decorators/withContext'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
import AppActions from '../../actions/AppActions';
import AppStore from '../../stores/AppStore';
import Header from '../Header';
diff --git a/src/components/ContactPage/ContactPage.js b/src/components/ContactPage/ContactPage.js
@@ -2,7 +2,7 @@
import React, { PropTypes } from 'react'; // eslint-disable-line no-unused-vars
import styles from './ContactPage.less'; // eslint-disable-line no-unused-vars
-import { withStyles } from '../decorators'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
@withStyles(styles)
class ContactPage {
diff --git a/src/components/ContentPage/ContentPage.js b/src/components/ContentPage/ContentPage.js
@@ -2,7 +2,7 @@
import React, { PropTypes } from 'react'; // eslint-disable-line no-unused-vars
import styles from './ContentPage.less'; // eslint-disable-line no-unused-vars
-import { withStyles } from '../decorators'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
@withStyles(styles)
class ContentPage {
diff --git a/src/components/Feedback/Feedback.js b/src/components/Feedback/Feedback.js
@@ -2,7 +2,7 @@
import React from 'react'; // eslint-disable-line no-unused-vars
import styles from './Feedback.less'; // eslint-disable-line no-unused-vars
-import { withStyles } from '../decorators'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
@withStyles(styles)
class Feedback {
diff --git a/src/components/Footer/Footer.js b/src/components/Footer/Footer.js
@@ -2,7 +2,8 @@
import React, { PropTypes } from 'react'; // eslint-disable-line no-unused-vars
import styles from './Footer.less'; // eslint-disable-line no-unused-vars
-import { withStyles, withViewport } from '../decorators'; // eslint-disable-line no-unused-vars
+import withViewport from '../decorators/withViewport'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
import Link from '../../utils/Link';
@withViewport
diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js
@@ -2,7 +2,7 @@
import React from 'react'; // eslint-disable-line no-unused-vars
import styles from './Header.less'; // eslint-disable-line no-unused-vars
-import { withStyles } from '../decorators'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
import Link from '../../utils/Link';
import Navigation from '../Navigation';
diff --git a/src/components/LoginPage/LoginPage.js b/src/components/LoginPage/LoginPage.js
@@ -2,7 +2,7 @@
import React, { PropTypes } from 'react'; // eslint-disable-line no-unused-vars
import styles from './LoginPage.less'; // eslint-disable-line no-unused-vars
-import { withStyles } from '../decorators'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
@withStyles(styles)
class LoginPage {
diff --git a/src/components/Navigation/Navigation.js b/src/components/Navigation/Navigation.js
@@ -3,7 +3,7 @@
import React from 'react'; // eslint-disable-line no-unused-vars
import classNames from 'classnames';
import styles from './Navigation.less'; // eslint-disable-line no-unused-vars
-import { withStyles } from '../decorators'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
import Link from '../../utils/Link';
@withStyles(styles)
diff --git a/src/components/NotFoundPage/NotFoundPage.js b/src/components/NotFoundPage/NotFoundPage.js
@@ -1,7 +1,7 @@
/*! React Starter Kit | MIT License | http://www.reactstarterkit.com/ */
import React, { PropTypes } from 'react'; // eslint-disable-line no-unused-vars
-import { withStyles } from '../decorators'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
import styles from './NotFoundPage.less'; // eslint-disable-line no-unused-vars
@withStyles(styles)
diff --git a/src/components/RegisterPage/RegisterPage.js b/src/components/RegisterPage/RegisterPage.js
@@ -1,7 +1,7 @@
/*! React Starter Kit | MIT License | http://www.reactstarterkit.com/ */
import React, { PropTypes } from 'react'; // eslint-disable-line no-unused-vars
-import { withStyles } from '../decorators'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
import styles from './RegisterPage.less'; // eslint-disable-line no-unused-vars
@withStyles(styles)
diff --git a/src/components/TextBox/TextBox.js b/src/components/TextBox/TextBox.js
@@ -1,7 +1,7 @@
/*! React Starter Kit | MIT License | http://www.reactstarterkit.com/ */
import React, { PropTypes } from 'react'; // eslint-disable-line no-unused-vars
-import { withStyles } from '../decorators'; // eslint-disable-line no-unused-vars
+import withStyles from '../decorators/withStyles'; // eslint-disable-line no-unused-vars
import styles from './TextBox.less'; // eslint-disable-line no-unused-vars
@withStyles(styles)
diff --git a/src/components/decorators/index.js b/src/components/decorators/index.js
@@ -1,5 +0,0 @@
-/*! React Starter Kit | MIT License | http://www.reactstarterkit.com/ */
-
-export { withContext } from './withContext';
-export { withStyles } from './withStyles';
-export { withViewport } from './withViewport';
diff --git a/src/components/decorators/withContext.js b/src/components/decorators/withContext.js
@@ -40,4 +40,4 @@ function withContext(ComposedComponent) {
};
}
-export default { withContext };
+export default withContext;
diff --git a/src/components/decorators/withStyles.js b/src/components/decorators/withStyles.js
@@ -7,74 +7,71 @@ import { canUseDOM } from 'react/lib/ExecutionEnvironment';
let count = 0;
function withStyles(styles) {
- return function (ComposedComponent) {
+ return (ComposedComponent) => class WithStyles {
- return class WithStyles {
-
- static contextTypes = {
- onInsertCss: PropTypes.func
- };
+ static contextTypes = {
+ onInsertCss: PropTypes.func
+ };
- constructor() {
- this.refCount = 0;
- ComposedComponent.prototype.renderCss = function (css) {
- let style;
- if (canUseDOM) {
- if (this.styleId && (style = document.getElementById(this.styleId))) {
- if ('textContent' in style) {
- style.textContent = css;
- } else {
- style.styleSheet.cssText = css;
- }
+ constructor() {
+ this.refCount = 0;
+ ComposedComponent.prototype.renderCss = function (css) {
+ let style;
+ if (canUseDOM) {
+ if (this.styleId && (style = document.getElementById(this.styleId))) {
+ if ('textContent' in style) {
+ style.textContent = css;
} else {
- this.styleId = `dynamic-css-${count++}`;
- style = document.createElement('style');
- style.setAttribute('id', this.styleId);
- style.setAttribute('type', 'text/css');
-
- if ('textContent' in style) {
- style.textContent = css;
- } else {
- style.styleSheet.cssText = css;
- }
-
- document.getElementsByTagName('head')[0].appendChild(style);
- this.refCount++;
+ style.styleSheet.cssText = css;
}
} else {
- this.context.onInsertCss(css);
- }
- }.bind(this);
- }
+ this.styleId = `dynamic-css-${count++}`;
+ style = document.createElement('style');
+ style.setAttribute('id', this.styleId);
+ style.setAttribute('type', 'text/css');
- componentWillMount() {
- if (canUseDOM) {
- invariant(styles.use, `The style-loader must be configured with reference-counted API.`);
- styles.use();
+ if ('textContent' in style) {
+ style.textContent = css;
+ } else {
+ style.styleSheet.cssText = css;
+ }
+
+ document.getElementsByTagName('head')[0].appendChild(style);
+ this.refCount++;
+ }
} else {
- this.context.onInsertCss(styles.toString());
+ this.context.onInsertCss(css);
}
+ }.bind(this);
+ }
+
+ componentWillMount() {
+ if (canUseDOM) {
+ invariant(styles.use, `The style-loader must be configured with reference-counted API.`);
+ styles.use();
+ } else {
+ this.context.onInsertCss(styles.toString());
}
+ }
- componentWillUnmount() {
- styles.unuse();
- if (this.styleId) {
- this.refCount--;
- if (this.refCount < 1) {
- let style = document.getElementById(this.styleId);
- if (style) {
- style.parentNode.removeChild(style);
- }
+ componentWillUnmount() {
+ styles.unuse();
+ if (this.styleId) {
+ this.refCount--;
+ if (this.refCount < 1) {
+ let style = document.getElementById(this.styleId);
+ if (style) {
+ style.parentNode.removeChild(style);
}
}
}
+ }
- render() {
- return <ComposedComponent {...this.props} />;
- }
+ render() {
+ return <ComposedComponent {...this.props} />;
+ }
- };
};
}
-export default { withStyles };
+export default withStyles;
diff --git a/src/components/decorators/withViewport.js b/src/components/decorators/withViewport.js
@@ -59,4 +59,4 @@ function withViewport(ComposedComponent) {
};
}
-export default { withViewport };
+export default withViewport;
