Fixed merge conflicts with master

Author: rohan-deshpande

.gitignore

@@ -93,3 +93,5 @@ node_modules
 
 # Linux trash folder which might appear on any partition or disk
 .Trash-*
+
+.idea

CHANGELOG.md

@@ -1,132 +1,143 @@
-# Release Notes
+# Changelog
+
+## (2019-01-02) `v2.0.0`
+
+### Added
+
+- `DatFolder` now accepts a `closed` boolean prop to determine if the folder should be closed or open by default
+
+### Changed
+
+- React v16.0.0 is now required as a peer dependency
+- README updated with more docs, included a note about the React v16 peer dependency
 
 ## (2017-12-09) `v1.0.3`
 
 ### Added
 
-* Section on React version to README
-* Point regarding animations for `DatFolder` to Roadmap
-* License section to README
+- Section on React version to README
+- Point regarding animations for `DatFolder` to Roadmap
+- License section to README
 
 ## (2017-10-09) `v1.0.2`
 
 ### Changed
 
-* Minor code formatting updates
-* Installation guidelines
+- Minor code formatting updates
+- Installation guidelines
 
 ## (2017-10-09) `v1.0.1`
 
 ### Changed
 
-* ES7 property initializers are now used to set initial state in all components rather than `componentWillMount`
+- ES7 property initializers are now used to set initial state in all components rather than `componentWillMount`
 
 ## (2017-10-09) `v1.0.0`
 
 ### Added
 
-* A lot of documentation to the README
-* Deploy script to `./example` app which deploys to github pages
+- A lot of documentation to the README
+- Deploy script to `./example` app which deploys to github pages
 
 ### Changed
 
-* Changed default export from `Dat` to `DatGui`
+- Changed default export from `Dat` to `DatGui`
 
 ## (2017-10-08) `v0.0.21`
 
 ### Changed
 
-* Removed custom check box styling from `DatBoolean` component
-* Ensured sliders are the same height as number inputs
-* Minor style changes for consistency
+- Removed custom check box styling from `DatBoolean` component
+- Ensured sliders are the same height as number inputs
+- Minor style changes for consistency
 
 ## (2017-10-08) `v0.0.20`
 
-### Changed  
+### Changed
 
-* Housekeeping in preparation for `v1.0.0`
+- Housekeeping in preparation for `v1.0.0`
 
 ## (2017-10-06) `v0.0.19`
 
 ### Added
 
-* `DatPresets` component - this allows you to set presets for your DatGUI component and switch between them easily
+- `DatPresets` component - this allows you to set presets for your DatGUI component and switch between them easily
 
 ### Changed
 
-* Removed final reference to `reactcss`, this can be completely removed from dependencies now
-* Removed unnecessary arrow functions in some `setState` callbacks
-* Fixed bug where `DatNumber` input updates weren't updating sliders
+- Removed final reference to `reactcss`, this can be completely removed from dependencies now
+- Removed unnecessary arrow functions in some `setState` callbacks
+- Fixed bug where `DatNumber` input updates weren't updating sliders
 
 ## (2017-10-05) `v0.0.18`
 
-### Added  
+### Added
 
-* `DatColor` component - this allows color pickers, powered by `react-color` to be rendered for mutating colors
-* Added `example:promote` script for pushing development code up from `example/src/dev` into `src`
+- `DatColor` component - this allows color pickers, powered by `react-color` to be rendered for mutating colors
+- Added `example:promote` script for pushing development code up from `example/src/dev` into `src`
 
 ### Changed
 
-* Example updated with `DatColor` included
+- Example updated with `DatColor` included
 
 ## (2017-10-04) `v0.0.17`
 
 ### Added
 
-* `DatSelect` component
+- `DatSelect` component
 
 ### Changed
 
-* Example updated with `DatSelect` included
+- Example updated with `DatSelect` included
 
 ## (2017-10-03) `v0.0.16`
 
 ### Added
 
-* Support for nested folders via `DatFolder`
+- Support for nested folders via `DatFolder`
 
-### Changed  
+### Changed
 
-* Example `App.js` has been updated to include a nested folder example
+- Example `App.js` has been updated to include a nested folder example
 
 ## (2017-10-02) `v0.0.15`
 
 ### Changed
 
-* SCSS is now broken up into partials which align with the various components
+- SCSS is now broken up into partials which align with the various components
 
 ### Added
 
-* Added `DatFolder` component
-* Added this to the example
+- Added `DatFolder` component
+- Added this to the example
 
 ## (2017-10-02) `v0.0.14`
 
 ### Changed
 
-* Updated component files to use `.js` file extension rather than `.jsx`
-* Removed `examples` directory and created single `example` directory which is now powered by `create-react-app`
-* Rewrote `webpack.config.js` so that it is compatible with Webpack v2
-* Updated a bunch of dependencies in `package.json`
-* Separated out `Slider` component from `DatNumber` and also added `utils` file
-* Switched all event handlers in components to ES7 syntax
-* Some code formatting
-* Changed `build` directory to `dist`
+- Updated component files to use `.js` file extension rather than `.jsx`
+- Removed `examples` directory and created single `example` directory which is now powered by `create-react-app`
+- Rewrote `webpack.config.js` so that it is compatible with Webpack v2
+- Updated a bunch of dependencies in `package.json`
+- Separated out `Slider` component from `DatNumber` and also added `utils` file
+- Switched all event handlers in components to ES7 syntax
+- Some code formatting
+- Changed `build` directory to `dist`
 
 ### Added
 
-* `example` directory
-* `src/components/Slider.js`
-* `src/components/utils.js`
-* `src/style` directory
-* `.editorconfig` file
-* `.eslintrc.json` file
-* `.babelrc` file
-* `scripts` directory
-* A number of `npm` scripts to `package.json`
-* This change log!
+- `example` directory
+- `src/components/Slider.js`
+- `src/components/utils.js`
+- `src/style` directory
+- `.editorconfig` file
+- `.eslintrc.json` file
+- `.babelrc` file
+- `scripts` directory
+- A number of `npm` scripts to `package.json`
+- This change log!
 
 ### Removed
 
-* The build no longer creates minified files, can add these back if required but I think it's better for the user to perform this step in their own build pipeline
-* ES5 examples, don't think many people are coding with React and ES5 nowadays
+- The build no longer creates minified files, can add these back if required but I think it's better for the user to perform this step in their own build pipeline
+- ES5 examples, don't think many people are coding with React and ES5 nowadays

README.md

@@ -165,6 +165,10 @@ Component which wraps other components to render them within an expandable/colla
  * `title: string` - The folder title eg., `<DatFolder title='MyAwesomeFolder' />`
  * `children: array` - The child components to render
 
+###### optional
+
+ * `closed: boolean` - Whether the initial state of the folder is closed, defaults to `true`
+
 #### `DatNumber`
 
 A number component for updating numeric values. Will render a slider if `min`, `max` and `step` props are supplied.

build/react-dat-gui.js

@@ -6626,8 +6626,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
 var _react = __webpack_require__(0);
@@ -6644,8 +6642,6 @@ var _classnames2 = _interopRequireDefault(_classnames);
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
@@ -6667,7 +6663,7 @@ var DatFolder = function (_Component) {
     }
 
     return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = DatFolder.__proto__ || Object.getPrototypeOf(DatFolder)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
-      closed: true
+      closed: _this.props.closed
     }, _this.handleClick = function () {
       var closed = !_this.state.closed;
 
@@ -6676,24 +6672,12 @@ var DatFolder = function (_Component) {
   }
 
   _createClass(DatFolder, [{
-    key: 'renderChildren',
-    value: function renderChildren() {
-      // Disable this rule to take title out of the props so nested folders can have unique titles.
-      // eslint-disable-next-line no-unused-vars
-      var _props = this.props,
-          children = _props.children,
-          title = _props.title,
-          rest = _objectWithoutProperties(_props, ['children', 'title']);
-
-      return _react2.default.Children.map(children, function (child) {
-        return (0, _react.cloneElement)(child, _extends({}, rest));
-      });
-    }
-  }, {
     key: 'render',
     value: function render() {
       var closed = this.state.closed;
-      var title = this.props.title;
+      var _props = this.props,
+          title = _props.title,
+          children = _props.children;
 
 
       return _react2.default.createElement(
@@ -6710,7 +6694,7 @@ var DatFolder = function (_Component) {
           _react2.default.createElement(
             'ul',
             null,
-            this.renderChildren()
+            children
           )
         )
       );
@@ -6724,7 +6708,8 @@ DatFolder.propTypes = {
   title: _propTypes2.default.string.isRequired
 };
 DatFolder.defaultProps = {
-  title: 'Folder'
+  title: 'Folder',
+  closed: true
 };
 exports.default = DatFolder;
 module.exports = exports['default'];

build/react-dat-gui.js.map

@@ -1,11 +1,11 @@
-import React, { Component, cloneElement } from 'react';
+import React, { Component } from 'react';
 
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 
 export default class DatFolder extends Component {
   state = {
-    closed: true,
+    closed: this.props.closed,
   }
 
   static propTypes = {
@@ -14,6 +14,7 @@ export default class DatFolder extends Component {
 
   static defaultProps = {
     title: 'Folder',
+    closed: true
   }
 
   handleClick = () => {
@@ -22,17 +23,9 @@ export default class DatFolder extends Component {
     this.setState({ closed });
   }
 
-  renderChildren() {
-    // Disable this rule to take title out of the props so nested folders can have unique titles.
-    // eslint-disable-next-line no-unused-vars
-    const { children, title, ...rest } = this.props;
-
-    return React.Children.map(children, child => cloneElement(child, {...rest}));
-  }
-
   render() {
     const { closed } = this.state;
-    const { title } = this.props;
+    const { title, children } = this.props;
 
     return (
       <li className={cx('folder', { 'closed': closed })}>
@@ -41,7 +34,7 @@ export default class DatFolder extends Component {
             {title}
           </div>
           <ul>
-            {this.renderChildren()}
+            {children}
           </ul>
         </div>
       </li>

dev/src/react-dat-gui/components/DatFolder.js

@@ -1,6 +1,6 @@
 {
   "name": "react-dat-gui",
-  "version": "1.0.3",
+  "version": "2.0.0",
   "description": "dat.GUI reimagined for React",
   "main": "build/react-dat-gui.js",
   "style": "build/react-dat-gui.css",

package.json

@@ -1,11 +1,11 @@
-import React, { Component, cloneElement } from 'react';
+import React, { Component } from 'react';
 
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 
 export default class DatFolder extends Component {
   state = {
-    closed: true,
+    closed: this.props.closed,
   }
 
   static propTypes = {
@@ -14,6 +14,7 @@ export default class DatFolder extends Component {
 
   static defaultProps = {
     title: 'Folder',
+    closed: true
   }
 
   handleClick = () => {
@@ -22,17 +23,9 @@ export default class DatFolder extends Component {
     this.setState({ closed });
   }
 
-  renderChildren() {
-    // Disable this rule to take title out of the props so nested folders can have unique titles.
-    // eslint-disable-next-line no-unused-vars
-    const { children, title, ...rest } = this.props;
-
-    return React.Children.map(children, child => cloneElement(child, {...rest}));
-  }
-
   render() {
     const { closed } = this.state;
-    const { title } = this.props;
+    const { title, children } = this.props;
 
     return (
       <li className={cx('folder', { 'closed': closed })}>
@@ -41,7 +34,7 @@ export default class DatFolder extends Component {
             {title}
           </div>
           <ul>
-            {this.renderChildren()}
+            {children}
           </ul>
         </div>
       </li>