react-checkbox-tree - npm Package Compare versions

Comparing version 0.4.1 to 0.4.2

CHANGELOG.md

 # CHANGELOG
 
-## [v0.4.1](https://github.com/jakezatecky/react-dual-listbox/compare/v0.4.0...v0.4.1) (2017-02-15)
+## [v0.4.2](https://github.com/jakezatecky/react-checkbox-tree/compare/v0.4.1...v0.4.) (2016-02-27)
 
+## Bug Fixes
+
+* [#22]: Remove expand-like behavior on nodes without children
+* [#23]: Fix issue where property validation was not occurring on node items
+
+## [v0.4.1](https://github.com/jakezatecky/react-checkbox-tree/compare/v0.4.0...v0.4.1) (2017-02-15)
+
 ### Deprecations
@@ -13,3 +20,3 @@
 
-## [v0.4.0](https://github.com/jakezatecky/react-dual-listbox/compare/v0.3.0...v0.4.0) (2017-01-27)
+## [v0.4.0](https://github.com/jakezatecky/react-checkbox-tree/compare/v0.3.0...v0.4.0) (2017-01-27)
 
@@ -16,0 +23,0 @@ ### Bug Fixes

gulpfile.js

@@ -10,3 +10,2 @@ const gulp = require('gulp');
 const autoprefixer = require('gulp-autoprefixer');
-const babel = require('babel-core/register');
 const pkg = require('./package.json');
@@ -19,3 +18,3 @@ const browserSync = require('browser-sync').create();
 
-gulp.task('test-script-format', () =>
+gulp.task('test-script-format', () => (
 	gulp.src(['./src/js/**/*.js'])
@@ -25,10 +24,10 @@ .pipe(eslint())
 		.pipe(eslint.failOnError())
-);
+));
 
-gulp.task('test-mocha', ['test-script-format'], () =>
+gulp.task('test-mocha', ['test-script-format'], () => (
 	gulp.src(['./test/**/*.js'])
 		.pipe(mocha({
-			compilers: {
-				js: babel,
-			},
+			compilers: [
+				'js:babel-core/register',
+			],
 			require: [
@@ -38,7 +37,7 @@ './test/setup.js',
 		}))
-);
+));
 
 gulp.task('test', ['test-script-format', 'test-mocha']);
 
-gulp.task('build-script', ['test'], () =>
+gulp.task('build-script', ['test'], () => (
 	gulp.src(['./src/index.js'])
@@ -48,5 +47,5 @@ .pipe(webpackStream(webpackConfig, webpack))
 		.pipe(gulp.dest('./lib/'))
-);
+));
 
-gulp.task('build-style', () =>
+gulp.task('build-style', () => (
 	gulp.src('./src/sass/**/*.scss')
@@ -62,7 +61,7 @@ .pipe(scsslint())
 		.pipe(gulp.dest('./lib'))
-);
+));
 
 gulp.task('build', ['build-script', 'build-style']);
 
-gulp.task('build-examples-style', () =>
+gulp.task('build-examples-style', () => (
 	gulp.src('./examples/src/**/*.scss')
@@ -79,5 +78,5 @@ .pipe(scsslint())
 		.pipe(browserSync.stream())
-);
+));
 
-gulp.task('build-examples-script', () =>
+gulp.task('build-examples-script', () => (
 	gulp.src(['./examples/src/index.js'])
@@ -87,9 +86,9 @@ .pipe(webpackStream(testWebpackConfig, webpack))
 		.pipe(browserSync.stream())
-);
+));
 
-gulp.task('build-examples-html', () =>
+gulp.task('build-examples-html', () => (
 	gulp.src('./examples/src/index.html')
 		.pipe(gulp.dest('./examples/dist/'))
 		.pipe(browserSync.stream())
-);
+));
 
@@ -96,0 +95,0 @@ gulp.task('examples', ['build-examples-style', 'build-examples-script', 'build-examples-html'], () => {

lib/index.js

@@ -1,2 +0,2 @@
-/*! react-checkbox-tree - v0.4.1 | 2017 */
+/*! react-checkbox-tree - v0.4.2 | 2017 */
 (function webpackUniversalModuleDefinition(root, factory) {
@@ -11,3 +11,3 @@ if(typeof exports === 'object' && typeof module === 'object')
 		root["ReactCheckboxTree"] = factory(root["React"]);
-})(this, function(__WEBPACK_EXTERNAL_MODULE_0__) {
+})(this, function(__WEBPACK_EXTERNAL_MODULE_1__) {
 return /******/ (function(modules) { // webpackBootstrap
@@ -78,3 +78,3 @@ /******/ 	// The module cache
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 5);
+/******/ 	return __webpack_require__(__webpack_require__.s = 13);
 /******/ })
@@ -84,8 +84,113 @@ /************************************************************************/
 /* 0 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var randomFromSeed = __webpack_require__(11);
+
+var ORIGINAL = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ_-';
+var alphabet;
+var previousSeed;
+
+var shuffled;
+
+function reset() {
+    shuffled = false;
+}
+
+function setCharacters(_alphabet_) {
+    if (!_alphabet_) {
+        if (alphabet !== ORIGINAL) {
+            alphabet = ORIGINAL;
+            reset();
+        }
+        return;
+    }
+
+    if (_alphabet_ === alphabet) {
+        return;
+    }
+
+    if (_alphabet_.length !== ORIGINAL.length) {
+        throw new Error('Custom alphabet for shortid must be ' + ORIGINAL.length + ' unique characters. You submitted ' + _alphabet_.length + ' characters: ' + _alphabet_);
+    }
+
+    var unique = _alphabet_.split('').filter(function(item, ind, arr){
+       return ind !== arr.lastIndexOf(item);
+    });
+
+    if (unique.length) {
+        throw new Error('Custom alphabet for shortid must be ' + ORIGINAL.length + ' unique characters. These characters were not unique: ' + unique.join(', '));
+    }
+
+    alphabet = _alphabet_;
+    reset();
+}
+
+function characters(_alphabet_) {
+    setCharacters(_alphabet_);
+    return alphabet;
+}
+
+function setSeed(seed) {
+    randomFromSeed.seed(seed);
+    if (previousSeed !== seed) {
+        reset();
+        previousSeed = seed;
+    }
+}
+
+function shuffle() {
+    if (!alphabet) {
+        setCharacters(ORIGINAL);
+    }
+
+    var sourceArray = alphabet.split('');
+    var targetArray = [];
+    var r = randomFromSeed.nextValue();
+    var characterIndex;
+
+    while (sourceArray.length > 0) {
+        r = randomFromSeed.nextValue();
+        characterIndex = Math.floor(r * sourceArray.length);
+        targetArray.push(sourceArray.splice(characterIndex, 1)[0]);
+    }
+    return targetArray.join('');
+}
+
+function getShuffled() {
+    if (shuffled) {
+        return shuffled;
+    }
+    shuffled = shuffle();
+    return shuffled;
+}
+
+/**
+ * lookup shuffled letter
+ * @param index
+ * @returns {string}
+ */
+function lookup(index) {
+    var alphabetShuffled = getShuffled();
+    return alphabetShuffled[index];
+}
+
+module.exports = {
+    characters: characters,
+    seed: setSeed,
+    lookup: lookup,
+    shuffled: getShuffled
+};
+
+
+/***/ }),
+/* 1 */
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_0__;
+module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
 
 /***/ }),
-/* 1 */
+/* 2 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -100,4 +205,6 @@
 
-var _react = __webpack_require__(0);
+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 _react = __webpack_require__(1);
+
 var _react2 = _interopRequireDefault(_react);
@@ -107,9 +214,22 @@
 
-exports.default = {
-	value: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.string, _react2.default.PropTypes.number]),
-	title: _react2.default.PropTypes.string
+var nodeShape = {
+	value: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.string, _react2.default.PropTypes.number]).isRequired,
+	label: _react2.default.PropTypes.string.isRequired
 };
 
+var legacyShape = {
+	value: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.string, _react2.default.PropTypes.number]).isRequired,
+	title: _react2.default.PropTypes.string.isRequired
+};
+
+var nodeShapeWithChildren = _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.shape(nodeShape), _react2.default.PropTypes.shape(legacyShape), _react2.default.PropTypes.shape(_extends({}, nodeShape, {
+	children: _react2.default.PropTypes.arrayOf(nodeShape).isRequired
+})), _react2.default.PropTypes.shape(_extends({}, legacyShape, {
+	children: _react2.default.PropTypes.arrayOf(nodeShape).isRequired
+}))]);
+
+exports.default = nodeShapeWithChildren;
+
 /***/ }),
-/* 2 */
+/* 3 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -128,18 +248,18 @@
 
-var _react = __webpack_require__(0);
+var _react = __webpack_require__(1);
 
 var _react2 = _interopRequireDefault(_react);
 
-var _TreeNode = __webpack_require__(3);
+var _shortid = __webpack_require__(5);
 
+var _shortid2 = _interopRequireDefault(_shortid);
+
+var _TreeNode = __webpack_require__(4);
+
 var _TreeNode2 = _interopRequireDefault(_TreeNode);
 
-var _nodeShape = __webpack_require__(1);
+var _nodeShape = __webpack_require__(2);
 
 var _nodeShape2 = _interopRequireDefault(_nodeShape);
 
-var _uniqueDomId = __webpack_require__(4);
-
-var _uniqueDomId2 = _interopRequireDefault(_uniqueDomId);
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -166,3 +286,3 @@
 
-		_this.id = (0, _uniqueDomId2.default)('rct');
+		_this.id = 'rct-' + _shortid2.default.generate();
 		return _this;
@@ -202,3 +322,3 @@ }
 			return nodes.map(function (node) {
-				var formatted = Object.create(node);
+				var formatted = _extends({}, node);
 
@@ -383,5 +503,3 @@ formatted.checked = checked.indexOf(node.value) > -1;
 Tree.propTypes = {
-	nodes: _react2.default.PropTypes.arrayOf(_react2.default.PropTypes.oneOfType([_react2.default.PropTypes.shape(_nodeShape2.default), _react2.default.PropTypes.shape(_extends({}, _nodeShape2.default, {
-		children: _react2.default.PropTypes.arrayOf(_nodeShape2.default)
-	}))])).isRequired,
+	nodes: _react2.default.PropTypes.arrayOf(_nodeShape2.default).isRequired,
 
@@ -409,3 +527,3 @@ checked: _react2.default.PropTypes.arrayOf(_react2.default.PropTypes.string),
 /***/ }),
-/* 3 */
+/* 4 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -422,7 +540,7 @@
 
-var _react = __webpack_require__(0);
+var _react = __webpack_require__(1);
 
 var _react2 = _interopRequireDefault(_react);
 
-var _nodeShape = __webpack_require__(1);
+var _nodeShape = __webpack_require__(2);
 
@@ -484,6 +602,2 @@ var _nodeShape2 = _interopRequireDefault(_nodeShape);
 		value: function renderCollapseIcon() {
-			if (this.props.rawChildren === null) {
-				return _react2.default.createElement('i', { className: 'fa' });
-			}
-
 			if (!this.props.expanded) {
@@ -496,2 +610,19 @@ return _react2.default.createElement('i', { className: 'fa fa-chevron-right' });
 	}, {
+		key: 'renderCollapseButton',
+		value: function renderCollapseButton() {
+			if (this.props.rawChildren === null) {
+				return _react2.default.createElement(
+					'span',
+					{ className: 'rct-collapse' },
+					_react2.default.createElement('i', { className: 'fa' })
+				);
+			}
+
+			return _react2.default.createElement(
+				'button',
+				{ 'aria-label': 'Toggle', className: 'rct-collapse rct-collapse-btn', title: 'Toggle', onClick: this.onExpand },
+				this.renderCollapseIcon()
+			);
+		}
+	}, {
 		key: 'renderCheckboxIcon',
@@ -512,11 +643,11 @@ value: function renderCheckboxIcon() {
 		value: function renderNodeIcon() {
-			if (this.props.rawChildren !== null) {
-				if (!this.props.expanded) {
-					return _react2.default.createElement('i', { className: 'fa fa-folder-o' });
-				}
+			if (this.props.rawChildren === null) {
+				return _react2.default.createElement('i', { className: 'fa fa-file-o' });
+			}
 
-				return _react2.default.createElement('i', { className: 'fa fa-folder-open-o' });
+			if (!this.props.expanded) {
+				return _react2.default.createElement('i', { className: 'fa fa-folder-o' });
 			}
 
-			return _react2.default.createElement('i', { className: 'fa fa-file-o' });
+			return _react2.default.createElement('i', { className: 'fa fa-folder-open-o' });
 		}
@@ -549,8 +680,4 @@ }, {
 					{ className: 'rct-text' },
+					this.renderCollapseButton(),
 					_react2.default.createElement(
-						'button',
-						{ 'aria-label': 'Toggle', className: 'rct-collapse', title: 'Toggle', onClick: this.onExpand },
-						this.renderCollapseIcon()
-					),
-					_react2.default.createElement(
 						'label',
@@ -595,3 +722,3 @@ { htmlFor: inputId },
 	children: _react2.default.PropTypes.node,
-	rawChildren: _react2.default.PropTypes.arrayOf(_react2.default.PropTypes.shape(_nodeShape2.default))
+	rawChildren: _react2.default.PropTypes.arrayOf(_nodeShape2.default)
 };
@@ -605,3 +732,3 @@ TreeNode.defaultProps = {
 /***/ }),
-/* 4 */
+/* 5 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -611,38 +738,190 @@
 
+module.exports = __webpack_require__(8);
 
-Object.defineProperty(exports, "__esModule", {
-	value: true
-});
-var autoId = 0;
 
+/***/ }),
+/* 6 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+var alphabet = __webpack_require__(0);
+
 /**
- * Return a unique DOM ID for an element on the document.
+ * Decode the id to get the version and worker
+ * Mainly for debugging and testing.
+ * @param id - the shortid-generated id.
+ */
+function decode(id) {
+    var characters = alphabet.shuffled();
+    return {
+        version: characters.indexOf(id.substr(0, 1)) & 0x0f,
+        worker: characters.indexOf(id.substr(1, 1)) & 0x0f
+    };
+}
+
+module.exports = decode;
+
+
+/***/ }),
+/* 7 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var randomByte = __webpack_require__(10);
+
+function encode(lookup, number) {
+    var loopCounter = 0;
+    var done;
+
+    var str = '';
+
+    while (!done) {
+        str = str + lookup( ( (number >> (4 * loopCounter)) & 0x0f ) | randomByte() );
+        done = number < (Math.pow(16, loopCounter + 1 ) );
+        loopCounter++;
+    }
+    return str;
+}
+
+module.exports = encode;
+
+
+/***/ }),
+/* 8 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var alphabet = __webpack_require__(0);
+var encode = __webpack_require__(7);
+var decode = __webpack_require__(6);
+var isValid = __webpack_require__(9);
+
+// Ignore all milliseconds before a certain time to reduce the size of the date entropy without sacrificing uniqueness.
+// This number should be updated every year or so to keep the generated id short.
+// To regenerate `new Date() - 0` and bump the version. Always bump the version!
+var REDUCE_TIME = 1459707606518;
+
+// don't change unless we change the algos or REDUCE_TIME
+// must be an integer and less than 16
+var version = 6;
+
+// if you are using cluster or multiple servers use this to make each instance
+// has a unique value for worker
+// Note: I don't know if this is automatically set when using third
+// party cluster solutions such as pm2.
+var clusterWorkerId = __webpack_require__(12) || 0;
+
+// Counter is used when shortid is called multiple times in one second.
+var counter;
+
+// Remember the last time shortid was called in case counter is needed.
+var previousSeconds;
+
+/**
+ * Generate unique id
+ * Returns string id
+ */
+function generate() {
+
+    var str = '';
+
+    var seconds = Math.floor((Date.now() - REDUCE_TIME) * 0.001);
+
+    if (seconds === previousSeconds) {
+        counter++;
+    } else {
+        counter = 0;
+        previousSeconds = seconds;
+    }
+
+    str = str + encode(alphabet.lookup, version);
+    str = str + encode(alphabet.lookup, clusterWorkerId);
+    if (counter > 0) {
+        str = str + encode(alphabet.lookup, counter);
+    }
+    str = str + encode(alphabet.lookup, seconds);
+
+    return str;
+}
+
+
+/**
+ * Set the seed.
+ * Highly recommended if you don't want people to try to figure out your id schema.
+ * exposed as shortid.seed(int)
+ * @param seed Integer value to seed the random alphabet.  ALWAYS USE THE SAME SEED or you might get overlaps.
+ */
+function seed(seedValue) {
+    alphabet.seed(seedValue);
+    return module.exports;
+}
+
+/**
+ * Set the cluster worker or machine id
+ * exposed as shortid.worker(int)
+ * @param workerId worker must be positive integer.  Number less than 16 is recommended.
+ * returns shortid module so it can be chained.
+ */
+function worker(workerId) {
+    clusterWorkerId = workerId;
+    return module.exports;
+}
+
+/**
  *
- * @param {string} prefix
- *
- * @return {string}
+ * sets new characters to use in the alphabet
+ * returns the shuffled alphabet
  */
-function uniqueDomId() {
-	var prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'unique';
+function characters(newCharacters) {
+    if (newCharacters !== undefined) {
+        alphabet.characters(newCharacters);
+    }
 
-	var findingId = true;
-	var id = '';
+    return alphabet.shuffled();
+}
 
-	while (findingId) {
-		id = prefix + '-' + autoId;
 
-		if (document.getElementById(id) === null) {
-			findingId = false;
-		}
+// Export all other functions as properties of the generate function
+module.exports = generate;
+module.exports.generate = generate;
+module.exports.seed = seed;
+module.exports.worker = worker;
+module.exports.characters = characters;
+module.exports.decode = decode;
+module.exports.isValid = isValid;
 
-		autoId += 1;
-	}
 
-	return id;
+/***/ }),
+/* 9 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+var alphabet = __webpack_require__(0);
+
+function isShortId(id) {
+    if (!id || typeof id !== 'string' || id.length < 6 ) {
+        return false;
+    }
+
+    var characters = alphabet.characters();
+    var len = id.length;
+    for(var i = 0; i < len;i++) {
+        if (characters.indexOf(id[i]) === -1) {
+            return false;
+        }
+    }
+    return true;
 }
 
-exports.default = uniqueDomId;
+module.exports = isShortId;
 
+
 /***/ }),
-/* 5 */
+/* 10 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -653,4 +932,67 @@
 
+var crypto = typeof window === 'object' && (window.crypto || window.msCrypto); // IE 11 uses window.msCrypto
+
+function randomByte() {
+    if (!crypto || !crypto.getRandomValues) {
+        return Math.floor(Math.random() * 256) & 0x30;
+    }
+    var dest = new Uint8Array(1);
+    crypto.getRandomValues(dest);
+    return dest[0] & 0x30;
+}
+
+module.exports = randomByte;
+
+
+/***/ }),
+/* 11 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+// Found this seed-based random generator somewhere
+// Based on The Central Randomizer 1.3 (C) 1997 by Paul Houle ([e-mail])
+
+var seed = 1;
+
+/**
+ * return a random number based on a seed
+ * @param seed
+ * @returns {number}
+ */
+function getNextValue() {
+    seed = (seed * 9301 + 49297) % 233280;
+    return seed/(233280.0);
+}
+
+function setSeed(_seed_) {
+    seed = _seed_;
+}
+
+module.exports = {
+    nextValue: getNextValue,
+    seed: setSeed
+};
+
+
+/***/ }),
+/* 12 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+module.exports = 0;
+
+
+/***/ }),
+/* 13 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
 // Export default to provide support for non-ES6 solutions
-module.exports = __webpack_require__(2).default;
+module.exports = __webpack_require__(3).default;
 
@@ -657,0 +999,0 @@ /***/ })

package.json

 {
   "name": "react-checkbox-tree",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "React component for checkbox trees.",
@@ -16,2 +16,3 @@ "author": "Jake Zatecky",
   },
+  "homepage": "https://jakezatecky.github.io/react-checkbox-tree",
   "bugs": "https://github.com/jakezatecky/react-checkbox-tree/issues",
@@ -46,3 +47,3 @@ "main": "lib/index.js",
     "gulp-header": "^1.8.8",
-    "gulp-mocha": "^3.0.1",
+    "gulp-mocha": "^4.0.1",
     "gulp-sass": "^3.0.0",
@@ -57,3 +58,6 @@ "gulp-scss-lint": "^0.4.0",
     "webpack-stream": "^3.2.0"
+  },
+  "dependencies": {
+    "shortid": "^2.2.6"
   }
 }

src/js/nodeShape.js

 import React from 'react';
 
-export default {
+const nodeShape = {
 	value: React.PropTypes.oneOfType([
 		React.PropTypes.string,
 		React.PropTypes.number,
-	]),
-	title: React.PropTypes.string,
+	]).isRequired,
+	label: React.PropTypes.string.isRequired,
 };
+
+const legacyShape = {
+	value: React.PropTypes.oneOfType([
+		React.PropTypes.string,
+		React.PropTypes.number,
+	]).isRequired,
+	title: React.PropTypes.string.isRequired,
+};
+
+const nodeShapeWithChildren = React.PropTypes.oneOfType([
+	React.PropTypes.shape(nodeShape),
+	React.PropTypes.shape(legacyShape),
+	React.PropTypes.shape({
+		...nodeShape,
+		children: React.PropTypes.arrayOf(nodeShape).isRequired,
+	}),
+	React.PropTypes.shape({
+		...legacyShape,
+		children: React.PropTypes.arrayOf(nodeShape).isRequired,
+	}),
+]);
+
+export default nodeShapeWithChildren;

src/js/Tree.js

 import React from 'react';
+import shortid from 'shortid';
 
 import TreeNode from './TreeNode';
 import nodeShape from './nodeShape';
-import uniqueDomId from './uniqueDomId';
 
 class Tree extends React.Component {
 	static propTypes = {
-		nodes: React.PropTypes.arrayOf(
-			React.PropTypes.oneOfType([
-				React.PropTypes.shape(nodeShape),
-				React.PropTypes.shape({
-					...nodeShape,
-					children: React.PropTypes.arrayOf(nodeShape),
-				}),
-			]),
-		).isRequired,
+		nodes: React.PropTypes.arrayOf(nodeShape).isRequired,
 
@@ -45,3 +37,3 @@ checked: React.PropTypes.arrayOf(React.PropTypes.string),
 
-		this.id = uniqueDomId('rct');
+		this.id = `rct-${shortid.generate()}`;
 	}
@@ -65,3 +57,3 @@
 		return nodes.map((node) => {
-			const formatted = Object.create(node);
+			const formatted = { ...node };
 
@@ -68,0 +60,0 @@ formatted.checked = checked.indexOf(node.value) > -1;

src/js/TreeNode.js

@@ -17,3 +17,3 @@ import React from 'react';
 		children: React.PropTypes.node,
-		rawChildren: React.PropTypes.arrayOf(React.PropTypes.shape(nodeShape)),
+		rawChildren: React.PropTypes.arrayOf(nodeShape),
 	};
@@ -61,6 +61,2 @@
 	renderCollapseIcon() {
-		if (this.props.rawChildren === null) {
-			return <i className="fa" />;
-		}
-
 		if (!this.props.expanded) {
@@ -73,2 +69,18 @@ return <i className="fa fa-chevron-right" />;
 
+	renderCollapseButton() {
+		if (this.props.rawChildren === null) {
+			return (
+				<span className="rct-collapse">
+					<i className="fa" />
+				</span>
+			);
+		}
+
+		return (
+			<button aria-label="Toggle" className="rct-collapse rct-collapse-btn" title="Toggle" onClick={this.onExpand}>
+				{this.renderCollapseIcon()}
+			</button>
+		);
+	}
+
 	renderCheckboxIcon() {
@@ -87,11 +99,11 @@ if (this.props.checked === 0) {
 	renderNodeIcon() {
-		if (this.props.rawChildren !== null) {
-			if (!this.props.expanded) {
-				return <i className="fa fa-folder-o" />;
-			}
+		if (this.props.rawChildren === null) {
+			return <i className="fa fa-file-o" />;
+		}
 
-			return <i className="fa fa-folder-open-o" />;
+		if (!this.props.expanded) {
+			return <i className="fa fa-folder-o" />;
 		}
 
-		return <i className="fa fa-file-o" />;
+		return <i className="fa fa-folder-open-o" />;
 	}
@@ -114,5 +126,3 @@
 				<span className="rct-text">
-					<button aria-label="Toggle" className="rct-collapse" title="Toggle" onClick={this.onExpand}>
-						{this.renderCollapseIcon()}
-					</button>
+					{this.renderCollapseButton()}
 					<label htmlFor={inputId}>
@@ -119,0 +129,0 @@ <input checked={checked === 1} id={inputId} type="checkbox" onChange={this.onCheck} />

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

216372

increased by4.2%

Lines of code

1280

increased by25.24%

Number of low quality alerts

1

decreased by-50%

Worsened metrics

Dependency count

2

increased by100%

Number of package files

22

decreased by-4.35%

Dependency changes

• + Addedshortid@^2.2.6

• + Addednanoid@2.1.11(transitive)

• + Addedshortid@2.2.16(transitive)