innov
/
bee-tree
1
0
Fork 0
Code Issues Pull Requests 2 Projects Releases Wiki Activity

merge

This commit is contained in:
izbz wh 2019-07-13 11:03:31 +08:00
parent 7f8d67854d c5fe2f5e73
commit 9c969e56a6
14 changed files with 402 additions and 367 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
CHANGELOG.md
View File

@ -1,5 +1,10 @@
<a name="2.0.15"></a>
## [2.0.15](https://github.com/tinper-bee/bee-tree/compare/v2.0.14...v2.0.15) (2019-07-04)
<a name="2.0.16"></a>
## [2.0.16](https://github.com/tinper-bee/bee-tree/compare/v2.0.15-new...v2.0.16) (2019-07-05)
<a name="2.0.15-new"></a>
## [2.0.15-new](https://github.com/tinper-bee/bee-tree/compare/v2.0.15...v2.0.15-new) (2019-07-04)
### Bug Fixes
@ -14,7 +19,7 @@
<a name="2.0.13"></a>
## [2.0.13](https://github.com/tinper-bee/bee-tree/compare/v2.0.12...v2.0.13) (2019-05-24)
## [2.0.13](https://github.com/tinper-bee/bee-tree/compare/v2.0.11...v2.0.13) (2019-05-24)
### Features
@ -24,7 +29,7 @@
<a name="2.0.12"></a>
## [2.0.12](https://github.com/tinper-bee/bee-tree/compare/v2.0.11...v2.0.12) (2019-05-17)
## 2.0.12 (2019-05-17)
### Bug Fixes
@ -75,7 +80,7 @@
<a name="2.0.2"></a>
## [2.0.2](https://github.com/tinper-bee/bee-tree/compare/2.0.2...v2.0.2) (2019-03-02)
## [2.0.2](https://github.com/tinper-bee/bee-tree/compare/v1.1.16...v2.0.2) (2019-03-02)
@ -225,34 +230,14 @@
<a name="1.0.5"></a>
## [1.0.5](https://github.com/tinper-bee/bee-tree/compare/v11.0.3...v1.0.5) (2018-01-25)
### Bug Fixes
* children 为0时不显示图标 ([5481ec6](https://github.com/tinper-bee/bee-tree/commit/5481ec6))
### Features
* 含有[3~[B[3~heckStrictly复选框tree ([932b9fa](https://github.com/tinper-bee/bee-tree/commit/932b9fa))
* **子节节点children为空数组时，不显示扩展图图标:** 子节点children属性为空数组时，不显示扩展图标 ([3536f71](https://github.com/tinper-bee/bee-tree/commit/3536f71))
### BREAKING CHANGES
* 示例文档描述优化
<a name="11.0.3"></a>
## [11.0.3](https://github.com/tinper-bee/bee-tree/compare/v1.0.3...v11.0.3) (2018-01-24)
## [1.0.5](https://github.com/tinper-bee/bee-tree/compare/v1.0.3...v1.0.5) (2018-01-25)
### Bug Fixes
* **解决配置冲突:** 解决配置冲突 ([fb15e37](https://github.com/tinper-bee/bee-tree/commit/fb15e37))
* checkStrictly ([5fa28b2](https://github.com/tinper-bee/bee-tree/commit/5fa28b2))
* children 为0时不显示图标 ([5481ec6](https://github.com/tinper-bee/bee-tree/commit/5481ec6))
* 修改示例 ([6770417](https://github.com/tinper-bee/bee-tree/commit/6770417))
@ -274,8 +259,15 @@
* **文档补充:** 文档补充 ([c123353](https://github.com/tinper-bee/bee-tree/commit/c123353))
### Features
* 含有[3~[B[3~heckStrictly复选框tree ([932b9fa](https://github.com/tinper-bee/bee-tree/commit/932b9fa))
* **子节节点children为空数组时，不显示扩展图图标:** 子节点children属性为空数组时，不显示扩展图标 ([3536f71](https://github.com/tinper-bee/bee-tree/commit/3536f71))
### BREAKING CHANGES
* 示例文档描述优化
* **依赖修改、object-assign修改:** 依赖修改、object-assign修改
* **依赖组件修改:** y
* **组件依赖指向具体版本修改:** 组件依赖指向具体版本修改

2
build/Tree.css
View File

@ -135,6 +135,8 @@
background-color: rgb(255, 247, 231); }
.u-tree li a.u-tree-node-selected .u-tree-title {
color: rgb(245, 60, 50); }
.u-tree li.u-tree-treenode-focused > a {
background-color: rgb(235, 236, 240); }
.u-tree li span.u-checkbox {
margin: 2px 4px 0 0; }
.u-tree li span.u-tree-switcher,

17
build/Tree.js
View File

@ -57,7 +57,8 @@ var Tree = function (_React$Component) {
selectedKeys: _this.getDefaultSelectedKeys(props),
dragNodesKeys: '',
dragOverNodeKey: '',
dropNodeKey: ''
dropNodeKey: '',
focusKey: '' //上下箭头选择树节点时，用于标识focus状态
};
return _this;
}
@ -486,7 +487,11 @@ var Tree = function (_React$Component) {
var parentEle = (0, _util.closest)(e.target, ".u-tree");
var focusEle = parentEle ? parentEle.querySelector(queryInfo) : null;
focusEle && focusEle.focus();
this.onSelect(nextTreeNode);
var eventKey = nextTreeNode.props.eventKey || nextTreeNode.key;
this.setState({
focusKey: eventKey
});
// this.onSelect(nextTreeNode);
}
};
@ -535,7 +540,11 @@ var Tree = function (_React$Component) {
}
}
preElement && preElement.focus();
this.onSelect(prevTreeNode);
var eventKey = prevTreeNode.props.eventKey || prevTreeNode.key;
this.setState({
focusKey: eventKey
});
// this.onSelect(prevTreeNode);
};
// all keyboard events callbacks run from here at first
@ -558,6 +567,7 @@ var Tree = function (_React$Component) {
// 展开树节点
this.onExpand(treeNode, 'right');
} else if (e.keyCode == _tinperBeeCore.KeyCode.SPACE && props.checkable) {
this.onSelect(treeNode);
// 如果是多选tree则进行选中或者反选该节点
this.onCheck(treeNode);
} else if (e.keyCode == _tinperBeeCore.KeyCode.ENTER) {
@ -789,6 +799,7 @@ var Tree = function (_React$Component) {
_dropTrigger: this._dropTrigger,
expanded: state.expandedKeys.indexOf(key) !== -1,
selected: state.selectedKeys.indexOf(key) !== -1,
focused: state.focusKey === key,
openTransitionName: this.getOpenTransitionName(),
openAnimation: props.openAnimation,
filterTreeNode: this.filterTreeNode.bind(this),

3
build/TreeNode.js
View File

@ -532,10 +532,11 @@ var TreeNode = function (_React$Component) {
return _react2["default"].createElement('span', { className: (0, _classnames2["default"])(cls) });
};
var selectedCls = props.selected ? prefixCls + '-treenode-selected' : '';
var focusedCls = props.focused ? prefixCls + '-treenode-focused' : '';
return _react2["default"].createElement(
'li',
_extends({}, liProps, { style: props.style,
className: (0, _classnames2["default"])(props.className, disabledCls, dragOverCls, filterCls, selectedCls)
className: (0, _classnames2["default"])(props.className, disabledCls, dragOverCls, filterCls, selectedCls, focusedCls)
}),
canRenderSwitcher ? this.renderSwitcher(props, expandedState) : noopSwitcher(),
props.checkable ? this.renderCheckbox(props) : null,

2
dist/demo.css vendored
View File

@ -123,6 +123,8 @@
background-color: rgb(255, 247, 231); }
.u-tree li a.u-tree-node-selected .u-tree-title {
color: rgb(245, 60, 50); }
.u-tree li.u-tree-treenode-focused > a {
background-color: rgb(235, 236, 240); }
.u-tree li span.u-checkbox {
margin: 2px 4px 0 0; }
.u-tree li span.u-tree-switcher,

2
dist/demo.css.map vendored
View File

File diff suppressed because one or more lines are too long

20
dist/demo.js vendored
View File

@ -34248,7 +34248,8 @@
selectedKeys: _this.getDefaultSelectedKeys(props),
dragNodesKeys: '',
dragOverNodeKey: '',
dropNodeKey: ''
dropNodeKey: '',
focusKey: '' //上下箭头选择树节点时，用于标识focus状态
};
return _this;
}
@ -34677,7 +34678,11 @@
var parentEle = (0, _util.closest)(e.target, ".u-tree");
var focusEle = parentEle ? parentEle.querySelector(queryInfo) : null;
focusEle && focusEle.focus();
this.onSelect(nextTreeNode);
var eventKey = nextTreeNode.props.eventKey || nextTreeNode.key;
this.setState({
focusKey: eventKey
});
// this.onSelect(nextTreeNode);
}
};
@ -34726,7 +34731,11 @@
}
}
preElement && preElement.focus();
this.onSelect(prevTreeNode);
var eventKey = prevTreeNode.props.eventKey || prevTreeNode.key;
this.setState({
focusKey: eventKey
});
// this.onSelect(prevTreeNode);
};
// all keyboard events callbacks run from here at first
@ -34749,6 +34758,7 @@
// 展开树节点
this.onExpand(treeNode, 'right');
} else if (e.keyCode == _tinperBeeCore.KeyCode.SPACE && props.checkable) {
this.onSelect(treeNode);
// 如果是多选tree则进行选中或者反选该节点
this.onCheck(treeNode);
} else if (e.keyCode == _tinperBeeCore.KeyCode.ENTER) {
@ -34980,6 +34990,7 @@
_dropTrigger: this._dropTrigger,
expanded: state.expandedKeys.indexOf(key) !== -1,
selected: state.selectedKeys.indexOf(key) !== -1,
focused: state.focusKey === key,
openTransitionName: this.getOpenTransitionName(),
openAnimation: props.openAnimation,
filterTreeNode: this.filterTreeNode.bind(this),
@ -36078,10 +36089,11 @@
return _react2['default'].createElement('span', { className: (0, _classnames2['default'])(cls) });
};
var selectedCls = props.selected ? prefixCls + '-treenode-selected' : '';
var focusedCls = props.focused ? prefixCls + '-treenode-focused' : '';
return _react2['default'].createElement(
'li',
_extends({}, liProps, { style: props.style,
className: (0, _classnames2['default'])(props.className, disabledCls, dragOverCls, filterCls, selectedCls)
className: (0, _classnames2['default'])(props.className, disabledCls, dragOverCls, filterCls, selectedCls, focusedCls)
}),
canRenderSwitcher ? this.renderSwitcher(props, expandedState) : noopSwitcher(),
props.checkable ? this.renderCheckbox(props) : null,

2
dist/demo.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
docs/api.md
View File

@ -76,7 +76,7 @@ import 'bee-tree/build/Tree.css';
| 快捷键 | 类型 |快捷键说明 |
| --- | :---: | --- |
| focusable | function | 是否开启快捷键 |
| focusable | bool | 是否开启快捷键 |
| tab | - | tab 进入焦点，且选中第一行。|
| ↑、↓ | - | ↑(上箭)、↓(下箭) 选中上一行、选中下一行。 |
| ←、→ | - | ←(左箭)、→(右箭) 收起、展开。 |

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "bee-tree",
"version": "2.0.16-beta.1",
"version": "2.0.16",
"description": "Tree ui component for react",
"keywords": [
"react",

15
src/Tree.js
View File

@ -34,6 +34,7 @@ class Tree extends React.Component {
dragNodesKeys: '',
dragOverNodeKey: '',
dropNodeKey: '',
focusKey: '', //上下箭头选择树节点时，用于标识focus状态
};
}
@ -461,7 +462,11 @@ onExpand(treeNode,keyType) {
const parentEle = closest(e.target,".u-tree")
const focusEle = parentEle?parentEle.querySelector(queryInfo):null;
focusEle && focusEle.focus()
this.onSelect(nextTreeNode);
const eventKey = nextTreeNode.props.eventKey || nextTreeNode.key;
this.setState({
focusKey: eventKey
})
// this.onSelect(nextTreeNode);
}
}
@ -511,7 +516,11 @@ onExpand(treeNode,keyType) {
}
preElement && preElement.focus();
this.onSelect(prevTreeNode);
const eventKey = prevTreeNode.props.eventKey || prevTreeNode.key;
this.setState({
focusKey: eventKey
})
// this.onSelect(prevTreeNode);
}
// all keyboard events callbacks run from here at first
onKeyDown(e,treeNode) {
@ -532,6 +541,7 @@ onExpand(treeNode,keyType) {
// 展开树节点
this.onExpand(treeNode,'right');
}else if (e.keyCode == KeyCode.SPACE && props.checkable){
this.onSelect(treeNode);
// 如果是多选tree则进行选中或者反选该节点
this.onCheck(treeNode);
}else if(e.keyCode == KeyCode.ENTER){
@ -763,6 +773,7 @@ onExpand(treeNode,keyType) {
_dropTrigger: this._dropTrigger,
expanded: state.expandedKeys.indexOf(key) !== -1,
selected: state.selectedKeys.indexOf(key) !== -1,
focused: state.focusKey === key,
openTransitionName: this.getOpenTransitionName(),
openAnimation: props.openAnimation,
filterTreeNode: this.filterTreeNode.bind(this),

3
src/Tree.scss
View File

@ -184,6 +184,9 @@ $treePrefixCls : "u-tree";
color: $brand-primary;
}
}
li.u-tree-treenode-focused>a{
background-color: $tree-node-bg-color;
}
li span.u-checkbox {
margin: 2px 4px 0 0;
}

3
src/TreeNode.js
View File

@ -492,9 +492,10 @@ class TreeNode extends React.Component {
return <span className={classNames(cls)}></span>;
};
const selectedCls = props.selected?`${prefixCls}-treenode-selected`:'';
const focusedCls = props.focused ? `${prefixCls}-treenode-focused` : '';
return (
<li {...liProps} style={props.style}
className={classNames(props.className, disabledCls, dragOverCls, filterCls,selectedCls) }
className={classNames(props.className, disabledCls, dragOverCls, filterCls,selectedCls,focusedCls) }
>
{canRenderSwitcher ? this.renderSwitcher(props, expandedState) : noopSwitcher()}
{props.checkable ? this.renderCheckbox(props) : null}