Semantic-Org · levithomason · Oct 22, 2015 · Oct 22, 2015 · Oct 22, 2015 · Oct 22, 2015
diff --git a/dist/dependencies.js b/dist/dependencies.js
diff --git a/dist/stardust.js b/dist/stardust.js
@@ -265,6 +265,7 @@ return webpackJsonpstardust([1],{
 	    this.handleAbort = function () {
 	      // Promise is resolved, confirmation is false
 	      _this.deferred.resolve(false);
+	      // TODO: as of React 0.14, refs returns the DOM node, not the component, his may not work anymore
 	      _this.refs.modal.hideModal();
 	    };
 
@@ -1059,7 +1060,7 @@ return webpackJsonpstardust([1],{
 	    _get(Object.getPrototypeOf(Form.prototype), 'constructor', this).apply(this, arguments);
 
 	    this.serializeJson = function () {
-	      var form = _react2['default'].findDOMNode(_this.refs.form);
+	      var form = _this.refs.form;
 	      var json = {};
 
 	      _lodash2['default'].each(['input', 'textarea', 'select'], function (tag) {
@@ -1533,7 +1534,7 @@ return webpackJsonpstardust([1],{
 	  _createClass(Message, [{
 	    key: 'componentDidMount',
 	    value: function componentDidMount() {
-	      this.messageElm = (0, _jquery2['default'])((0, _react.findDOMNode)(this.refs.message));
+	      this.messageElm = (0, _jquery2['default'])(this.refs.message);
 	    }
 	  }, {
 	    key: 'render',
@@ -2798,8 +2799,8 @@ return webpackJsonpstardust([1],{
 	  _createClass(Checkbox, [{
 	    key: 'componentDidMount',
 	    value: function componentDidMount() {
-	      this.container = (0, _jquery2['default'])(_react2['default'].findDOMNode(this.refs.container));
-	      this.input = (0, _jquery2['default'])(_react2['default'].findDOMNode(this.refs.input));
+	      this.container = (0, _jquery2['default'])(this.refs.container);
+	      this.input = (0, _jquery2['default'])(this.refs.input);
 
 	      this.container.checkbox({
 	        onChange: this.props.onChange,
@@ -2942,7 +2943,7 @@ return webpackJsonpstardust([1],{
 	  _createClass(Dropdown, [{
 	    key: 'componentDidMount',
 	    value: function componentDidMount() {
-	      this.element = (0, _jquery2['default'])((0, _react.findDOMNode)(this.refs.select));
+	      this.element = (0, _jquery2['default'])(this.refs.select);
 	      this.element.dropdown();
 	    }
 	  }, {

diff --git a/docs/app/DocsApp.js b/docs/app/DocsApp.js
@@ -1,4 +1,5 @@
-import React, {Component, render} from 'react';
+import React, {Component} from 'react';
+import {render} from 'react-dom';
 import stardust, {Grid, Column} from 'stardust';
 
 import ComponentDoc from 'docs/app/Components/ComponentDoc/ComponentDoc';
@@ -30,4 +31,4 @@ class DocsApp extends Component {
   }
 }
 
-render(<DocsApp />, document.body);
+render(<DocsApp />, document.getElementById('root'));
diff --git a/docs/app/index.html b/docs/app/index.html
@@ -19,6 +19,7 @@
 
 </head>
 <body>
+  <div id="root"></div>
   <script src="vendor.js"></script>
   <script src="app.js"></script>
 </body>

diff --git a/gulp/tasks/watch.js b/gulp/tasks/watch.js
@@ -10,8 +10,8 @@ import paths from '../../paths';
 gulp.task('watch', 'watch and build docs', cb => {
   gulp.watch([paths.src + '/**/*.js'], [
     'build',                // rebuild the library
-    'generate-doc-json',    // rebuild doc info
+    'generate-docs-json',    // rebuild doc info
   ]);
-  gulp.watch([paths.docsRoot + '/**/*.html'], ['build-doc-html']);
+  gulp.watch([paths.docsRoot + '/**/*.html'], ['build-docs-html']);
   cb();
 });
diff --git a/karma.conf.js b/karma.conf.js
@@ -2,6 +2,7 @@ import paths from './paths';
 import statConfig from './webpack-stats';
 import friendlyFormatter from 'eslint-friendly-formatter';
 import exitPlugin from './webpack-exit-plugin';
+import ENV from './ENV';
 
 /**
  * This config is for running tests on the command line and will fail on errors.
@@ -10,11 +11,9 @@ import exitPlugin from './webpack-exit-plugin';
  */
 export default config => {
   config.set({
-    browsers: [
-      'PhantomJS'
-    ],
-    singleRun: true,
-    reporters: ['dots'],
+    browsers: ['PhantomJS'],
+    singleRun: !ENV.isDevelopment(),
+    reporters: ['mocha'],
     files: [
       './node_modules/phantomjs-polyfill/bind-polyfill.js',
       './test/tests.bundle.js'
@@ -66,9 +65,9 @@ export default config => {
           stardust: `${paths.src}/index.js`,
         },
       },
-      plugins: [
-        exitPlugin
-      ],
+      plugins: !ENV.isDevelopment()
+        ? [exitPlugin]
+        : [],
     },
     webpackServer: {
       progress: false,

diff --git a/package.json b/package.json
@@ -27,18 +27,22 @@
     "url": "https://github.com/TechnologyAdvice/stardust/issues"
   },
   "homepage": "https://github.com/TechnologyAdvice/stardust#readme",
+  "engines": {
+    "node": "0.12.7",
+    "npm": "3.3.5"
+  },
   "dependencies": {
-    "bluebird": "^2.10.2",
-    "classnames": "^2.1.5",
-    "jquery": "^2.1.4",
-    "lodash": "^3.10.1",
-    "react": "^0.13.3"
+    "react-hot-loader": "^1.3.0",
+    "watch": "^0.16.0",
+    "webpack-dev-server": "^1.12.0"
   },
   "devDependencies": {
     "babel-core": "^5.8.25",
     "babel-eslint": "^4.1.3",
     "babel-loader": "^5.3.2",
+    "bluebird": "^2.10.2",
     "chai": "^3.3.0",
+    "classnames": "^2.1.5",
     "del": "^2.0.2",
     "doctrine": "^0.7.0",
     "eslint": "^1.5.1",
@@ -57,27 +61,31 @@
     "highlight.js": "^8.9.1",
     "imports-loader": "^0.6.4",
     "json-loader": "^0.5.3",
-    "karma": "^0.13.10",
+    "jquery": "^2.1.4",
+    "karma": "^0.13.13",
+    "karma-cli": "^0.1.1",
     "karma-mocha": "^0.2.0",
+    "karma-mocha-reporter": "^1.1.1",
     "karma-phantomjs-launcher": "^0.2.1",
     "karma-sourcemap-loader": "^0.3.5",
     "karma-webpack": "^1.7.0",
+    "lodash": "^3.10.1",
     "mocha": "^2.3.3",
     "mocha-loader": "^0.7.1",
     "phantomjs": "^1.9.18",
     "phantomjs-polyfill": "0.0.1",
     "pre-commit": "^1.1.2",
     "raw-loader": "^0.5.1",
+    "react": "^0.14.0",
+    "react-addons-test-utils": "^0.14.0",
     "react-docgen": "^2.2.0",
+    "react-dom": "^0.14.0",
     "react-highlight": "^0.5.1",
-    "react-hot-loader": "^1.3.0",
     "require-dir": "^0.3.0",
     "run-sequence": "^1.1.4",
     "sinon": "git://github.com/cjohansen/Sinon.JS#b672042043517b9f84e14ed0fb8265126168778a",
     "sinon-chai": "^2.8.0",
     "through2": "^2.0.0",
-    "watch": "^0.16.0",
-    "webpack": "^1.12.2",
-    "webpack-dev-server": "^1.12.0"
+    "webpack": "^1.12.2"
   }
 }
diff --git a/src/addons/Confirm/Confirm.js b/src/addons/Confirm/Confirm.js
@@ -34,6 +34,7 @@ export default class Confirm extends Component {
   handleAbort = () => {
     // Promise is resolved, confirmation is false
     this.deferred.resolve(false);
+    // TODO: as of React 0.14, refs returns the DOM node, not the component, his may not work anymore
     this.refs.modal.hideModal();
   };
 

diff --git a/src/collections/Form/Form.js b/src/collections/Form/Form.js
@@ -10,7 +10,7 @@ export default class Form extends Component {
   };
 
   serializeJson = () => {
-    const form = React.findDOMNode(this.refs.form);
+    const form = this.refs.form;
     const json = {};
 
     _.each(['input', 'textarea', 'select'], (tag) => {

diff --git a/src/collections/Message/Message.js b/src/collections/Message/Message.js
@@ -1,5 +1,5 @@
 import _ from 'lodash';
-import React, {Component, findDOMNode, PropTypes} from 'react';
+import React, {Component, PropTypes} from 'react';
 import classNames from 'classnames';
 import $ from 'jquery';
 import META from 'src/utils/Meta';
@@ -14,7 +14,7 @@ export default class Message extends Component {
   };
 
   componentDidMount() {
-    this.messageElm = $(findDOMNode(this.refs.message));
+    this.messageElm = $(this.refs.message);
   }
 
   handleDismiss = e => {

diff --git a/src/collections/Table/Table.js b/src/collections/Table/Table.js
@@ -2,9 +2,6 @@ import _ from 'lodash';
 import React, {Children, Component, PropTypes} from 'react';
 import classNames from 'classnames';
 import TableColumn from './TableColumn';
-import TableHeader from './TableHeader';
-import TableRow from './TableRow';
-import TableCell from './TableCell';
 import META from 'src/utils/Meta';
 
 export default class Table extends Component {
@@ -36,7 +33,7 @@ export default class Table extends Component {
         ? column.props.headerRenderer(this.props.data[0])
         : _.startCase(column.props.dataKey);
 
-      return <TableHeader key={column.props.dataKey}>{content}</TableHeader>;
+      return <th className='sd-table-header' key={column.props.dataKey}>{content}</th>;
     });
   }
 
@@ -50,15 +47,15 @@ export default class Table extends Component {
         content = Table.getSafeCellContents(itemContents);
       }
 
-      return <TableCell key={rowIndex + column.props.dataKey}>{content}</TableCell>;
+      return <td key={rowIndex + column.props.dataKey} className={'sd-table-cell'}>{content}</td>;
     });
   }
 
   _getRows() {
     return _.map(this.props.data, (dataItem, rowIndex) => {
       const cells = this._getCells(dataItem, rowIndex);
 
-      return <TableRow key={rowIndex}>{cells}</TableRow>;
+      return <tr className='sd-table-row' key={rowIndex}>{cells}</tr>;
     });
   }
 

diff --git a/src/collections/Table/TableCell.js b/src/collections/Table/TableCell.js
diff --git a/src/collections/Table/TableHeader.js b/src/collections/Table/TableHeader.js
diff --git a/src/collections/Table/TableRow.js b/src/collections/Table/TableRow.js
diff --git a/src/index.js b/src/index.js
@@ -13,9 +13,6 @@ import MenuItem from 'src/collections/Menu/MenuItem';
 import Message from 'src/collections/Message/Message';
 import Table from 'src/collections/Table/Table';
 import TableColumn from 'src/collections/Table/TableColumn';
-import TableCell from 'src/collections/Table/TableCell';
-import TableHeader from 'src/collections/Table/TableHeader';
-import TableRow from 'src/collections/Table/TableRow';
 
 // Elements
 import Button from 'src/elements/Button/Button';
@@ -54,9 +51,6 @@ export default {
   Message,
   Table,
   TableColumn,
-  TableCell,
-  TableHeader,
-  TableRow,
 
   // Elements
   Button,

diff --git a/src/modules/Checkbox/Checkbox.js b/src/modules/Checkbox/Checkbox.js
@@ -29,8 +29,8 @@ export default class Checkbox extends Component {
   };
 
   componentDidMount() {
-    this.container = $(React.findDOMNode(this.refs.container));
-    this.input = $(React.findDOMNode(this.refs.input));
+    this.container = $(this.refs.container);
+    this.input = $(this.refs.input);
 
     this.container.checkbox({
       onChange: this.props.onChange,

diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
@@ -1,7 +1,7 @@
 import _ from 'lodash';
 import $ from 'jquery';
 import classNames from 'classnames';
-import React, {Component, PropTypes, findDOMNode} from 'react';
+import React, {Component, PropTypes} from 'react';
 import META from 'src/utils/Meta';
 
 export default class Dropdown extends Component {
@@ -14,7 +14,7 @@ export default class Dropdown extends Component {
   };
 
   componentDidMount() {
-    this.element = $(findDOMNode(this.refs.select));
+    this.element = $(this.refs.select);
     this.element.dropdown();
   }
 

diff --git a/src/modules/Modal/Modal.js b/src/modules/Modal/Modal.js
@@ -13,7 +13,7 @@ class Modal extends Component {
     ref: 'modal',
   };
 
-  state = {isShown: false}
+  state = {isShown: false};
 
   showModal = () => {
     this.setState({isShown: true});