rc-tree - npm Package Compare versions

Comparing version 0.14.3 to 0.14.4

lib/Tree.js

@@ -15,2 +15,4 @@ 'use strict';
 
+function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) arr2[i] = arr[i]; return arr2; } else { return Array.from(arr); } }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
@@ -49,3 +51,3 @@
     _get(Object.getPrototypeOf(Tree.prototype), 'constructor', this).call(this, props);
-    ['handleKeyDown', 'handleChecked'].forEach(function (m) {
+    ['handleKeyDown', 'handleCheck'].forEach(function (m) {
       _this[m] = _this[m].bind(_this);
@@ -56,5 +58,7 @@ });
     this.defaultExpandAll = props.defaultExpandAll;
+    var selectedKeys = props.multiple ? [].concat(_toConsumableArray(props.defaultSelectedKeys)) : [props.defaultSelectedKeys[0]];
     this.state = {
       expandedKeys: expandedKeys,
-      checkedKeys: checkedKeys
+      checkedKeys: checkedKeys,
+      selectedKeys: selectedKeys
     };
@@ -100,2 +104,3 @@ }
         expanded: this.defaultExpandAll || state.expandedKeys.indexOf(key) !== -1,
+        selected: state.selectedKeys.indexOf(key) !== -1,
         checked: this.checkedKeys.indexOf(key) !== -1,
@@ -221,4 +226,4 @@ checkPart: this.checkPartKeys.indexOf(key) !== -1
   }, {
-    key: 'handleChecked',
-    value: function handleChecked(treeNode) {
+    key: 'handleCheck',
+    value: function handleCheck(treeNode) {
       var _this4 = this;
@@ -247,8 +252,43 @@
       if (this.props.onCheck) {
-        this.props.onCheck(checked, treeNode, checkKeys.checkedKeys);
+        this.props.onCheck({
+          event: 'check',
+          checked: checked,
+          node: treeNode,
+          checkedKeys: checkKeys.checkedKeys
+        });
       }
     }
   }, {
-    key: 'handleExpanded',
-    value: function handleExpanded(treeNode) {
+    key: 'handleSelect',
+    value: function handleSelect(treeNode) {
+      var props = this.props;
+      var selectedKeys = [].concat(_toConsumableArray(this.state.selectedKeys));
+      var eventKey = treeNode.props.eventKey;
+      var index = selectedKeys.indexOf(eventKey);
+      var selected = undefined;
+      if (index !== -1) {
+        selected = false;
+        selectedKeys.splice(index, 1);
+      } else {
+        selected = true;
+        if (!props.multiple) {
+          selectedKeys.length = 0;
+        }
+        selectedKeys.push(eventKey);
+      }
+      this.setState({
+        selectedKeys: selectedKeys
+      });
+      if (props.onSelect) {
+        props.onSelect({
+          event: 'select',
+          selected: selected,
+          node: treeNode,
+          selectedKeys: selectedKeys
+        });
+      }
+    }
+  }, {
+    key: 'handleExpand',
+    value: function handleExpand(treeNode) {
       var thisProps = this.props;
@@ -299,3 +339,5 @@ var tnProps = treeNode.props;
   defaultCheckedKeys: _react2['default'].PropTypes.arrayOf(_react2['default'].PropTypes.string),
-  onCheck: _react2['default'].PropTypes.func
+  defaultSelectedKeys: _react2['default'].PropTypes.arrayOf(_react2['default'].PropTypes.string),
+  onCheck: _react2['default'].PropTypes.func,
+  onSelect: _react2['default'].PropTypes.func
 };
@@ -305,2 +347,3 @@
   prefixCls: 'rc-tree',
+  multiple: false,
   checkable: false,
@@ -311,3 +354,4 @@ showLine: false,
   defaultExpandedKeys: [],
-  defaultCheckedKeys: []
+  defaultCheckedKeys: [],
+  defaultSelectedKeys: []
 };
@@ -314,0 +358,0 @@

lib/TreeNode.js

@@ -36,3 +36,3 @@ 'use strict';
     _get(Object.getPrototypeOf(TreeNode.prototype), 'constructor', this).call(this, props);
-    ['handleExpanded', 'handleChecked'].forEach(function (m) {
+    ['handleExpand', 'handleCheck'].forEach(function (m) {
       _this[m] = _this[m].bind(_this);
@@ -82,3 +82,3 @@ });
       }
-      return _react2['default'].createElement('span', { className: (0, _rcUtil.classSet)(switcherCls), onClick: this.handleExpanded });
+      return _react2['default'].createElement('span', { className: (0, _rcUtil.classSet)(switcherCls), onClick: this.handleExpand });
     }
@@ -90,8 +90,2 @@ }, {
       var checkboxCls = _defineProperty({}, prefixCls + '-checkbox', true);
-      if (!props.checkable) {
-        return null;
-      }
-      if (props.disabled) {
-        checkboxCls[prefixCls + '-checkbox-disabled'] = true;
-      }
       if (props.checkPart) {
@@ -103,8 +97,16 @@ checkboxCls[prefixCls + '-checkbox-indeterminate'] = true;
       var customEle = null;
-      if (props.checkable && typeof props.checkable !== 'boolean') {
+      if (typeof props.checkable !== 'boolean') {
         customEle = props.checkable;
       }
+      if (props.disabled) {
+        checkboxCls[prefixCls + '-checkbox-disabled'] = true;
+        return _react2['default'].createElement(
+          'span',
+          { ref: 'checkbox', className: (0, _rcUtil.classSet)(checkboxCls) },
+          customEle
+        );
+      }
       return _react2['default'].createElement(
         'span',
-        { ref: 'checkbox', className: (0, _rcUtil.classSet)(checkboxCls) },
+        { ref: 'checkbox', className: (0, _rcUtil.classSet)(checkboxCls), onClick: this.handleCheck },
         customEle
@@ -167,4 +169,12 @@ );
         var domProps = {};
-        if (!props.disabled && props.checkable) {
-          domProps.onClick = _this2.handleChecked;
+        if (!props.disabled) {
+          if (props.selected) {
+            domProps.className = prefixCls + '-selected';
+          }
+          domProps.onClick = function () {
+            _this2.handleSelect();
+            if (props.checkable) {
+              _this2.handleCheck();
+            }
+          };
         }
@@ -174,3 +184,2 @@ return _react2['default'].createElement(
           _extends({ ref: 'selectHandle', title: content }, domProps),
-          _this2.renderCheckbox(props),
           icon,
@@ -185,2 +194,3 @@ title
         this.renderSwitcher(props, expandedState),
+        props.checkable ? this.renderCheckbox(props) : null,
         selectHandle(),
@@ -191,11 +201,16 @@ newChildren
   }, {
-    key: 'handleExpanded',
-    value: function handleExpanded() {
-      this.props.root.handleExpanded(this);
+    key: 'handleCheck',
+    value: function handleCheck() {
+      this.props.root.handleCheck(this);
     }
   }, {
-    key: 'handleChecked',
-    value: function handleChecked() {
-      this.props.root.handleChecked(this);
+    key: 'handleSelect',
+    value: function handleSelect() {
+      this.props.root.handleSelect(this);
     }
+  }, {
+    key: 'handleExpand',
+    value: function handleExpand() {
+      this.props.root.handleExpand(this);
+    }
 
@@ -202,0 +217,0 @@ // keyboard event support

package.json

 {
   "name": "rc-tree",
-  "version": "0.14.3",
+  "version": "0.14.4",
   "description": "tree ui component for react",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -73,2 +73,3 @@ # rc-tree
 |showIcon | whether show icon | bool | true |
+|multiple | whether multiple select | bool | false |
 |checkable | whether support checked | bool/React Node | false |
@@ -78,3 +79,5 @@ |defaultExpandAll | expand all treeNodes | bool | false |
 |defaultCheckedKeys | default checked treeNodes | String[] | [] |
+|defaultSelectedKeys | default selected treeNodes | String[] | [] |
 |onCheck | click the treeNode to fire | function(e:{checked:bool,node,checkedKeys}) | - |
+|onSelect | click the treeNode to fire | function(e:{checked:bool,node,checkedKeys}) | - |
 
@@ -81,0 +84,0 @@ ### TreeNode props

No alert changes

Improved metrics

Total package byte prevSize

30344

increased by7.79%

Lines of code

659

increased by9.65%

Number of lines in readme file

110

increased by2.8%

No dependency changes