uxcore-tree-select component for uxcore.
npm install uxcore-tree-select[![NPM version][npm-image]][npm-url]
[![build status][travis-image]][travis-url]
[![Test Coverage][coveralls-image]][coveralls-url]
[![Dependency Status][dep-image]][dep-url]
[![devDependency Status][devdep-image]][devdep-url]
[![NPM downloads][downloads-image]][npm-url]
[![Sauce Test Status][sauce-image]][sauce-url]
[npm-image]: http://img.shields.io/npm/v/uxcore-tree-select.svg?style=flat-square
[npm-url]: http://npmjs.org/package/uxcore-tree-select
[travis-image]: https://img.shields.io/travis/uxcore/uxcore-tree-select.svg?style=flat-square
[travis-url]: https://travis-ci.org/uxcore/uxcore-tree-select
[coveralls-image]: https://img.shields.io/coveralls/uxcore/uxcore-tree-select.svg?style=flat-square
[coveralls-url]: https://coveralls.io/r/uxcore/uxcore-tree-select?branch=master
[dep-image]: http://img.shields.io/david/uxcore/uxcore-tree-select.svg?style=flat-square
[dep-url]: https://david-dm.org/uxcore/uxcore-tree-select
[devdep-image]: http://img.shields.io/david/dev/uxcore/uxcore-tree-select.svg?style=flat-square
[devdep-url]: https://david-dm.org/uxcore/uxcore-tree-select#info=devDependencies
[downloads-image]: https://img.shields.io/npm/dm/uxcore-tree-select.svg
[sauce-image]: https://saucelabs.com/browser-matrix/uxcore-tree-select.svg
[sauce-url]: https://saucelabs.com/u/uxcore-tree-select
uxcore-tree-select ui component for react
#### setup develop environment
``sh`
$ git clone https://github.com/uxcore/uxcore-tree-select
$ cd uxcore-tree-select
$ npm install
$ npm run server
| name | description | type | default | since Ver. |
|----------|----------------|----------|--------------|--------------|
|className | additional css class of root dom node | String | '' |
|prefixCls | prefix class | String | 'uxcore-tree-select' |
|animation | dropdown animation name. only support slide-up now | String | '' |
|transitionName | dropdown css animation name | String | '' |
|choiceTransitionName | css animation name for selected items at multiple mode | String | '' |
|dropdownMatchSelectWidth | whether dropdown's with is same with select | bool | false |
|dropdownClassName | additional className applied to dropdown | String | - |
|dropdownStyle | additional style applied to dropdown | Object | {} |
|dropdownPopupAlign | specify alignment for dropdown | Object | - |
|notFoundContent | specify content to show when no result matches. | String | 'Not Found' |
|showSearch | whether show search input in single mode | bool | false |
|allowClear | whether allowClear | bool | false |
|maxTagTextLength | max tag text length to show | number | - |
|multiple | whether multiple select (true when enable treeCheckable) | bool | false |
|disabled | whether disabled select | bool | false |
|inputValue | if enable search, you can set default input's value, if set to null, auto clear input value when finish select/unselect operation | string/null | '' |
|defaultValue | initial selected treeNode(s) | same as value type | - |
|value | current selected treeNode(s). | normal: String/Array
|labelInValue| whether to embed label in value, see above value type | Bool | false |
|onChange | called when select treeNode or input value change | function(value, label(null), extra) | - |
|onSelect | called when select treeNode | function(value, node, extra) | - |
|onSearch | called when input changed | function | - |
|onAllClear | called when click all clear | function | - |
|showCheckedStrategy | TreeSelect.SHOW_ALL: show all checked treeNodes (Include parent treeNode). TreeSelect.SHOW_PARENT: show checked treeNodes (Just show parent treeNode). Default just show child. | enum{TreeSelect.SHOW_ALL, TreeSelect.SHOW_PARENT, TreeSelect.SHOW_CHILD } | TreeSelect.SHOW_CHILD |pId
|treeIcon | show tree icon | bool | false |
|treeLine | show tree line | bool | false |
|treeDefaultExpandAll | default expand all treeNode | bool | false |
|treeCheckable | whether tree show checkbox (select callback will not fire) | bool | false |
|treeCheckStrictly | check node precisely, parent and children nodes are not associated| bool | false |
|filterTreeNode | whether filter treeNodes by input value. default filter by treeNode's treeNodeFilterProp prop's value | bool/Function(inputValue:string, treeNode:TreeNode) | Function |
|treeNodeFilterProp | which prop value of treeNode will be used for filter if filterTreeNode return true | String | 'title' |
|treeNodeLabelProp | which prop value of treeNode will render as content of select | String | 'title' |
|treeData | treeNodes data Array, if set it then you need not to construct children TreeNode. (value should be unique across the whole array) | array<{value,label,children, [disabled]}> | [] |
|treeDataSimpleMode | enable simple mode of treeData.(treeData should be like this: [{"id":1, "pId":0, "label":"test1"},...], is parent node's id) | bool/object{id:'id', pId:'pId', rootPId:null} | false |'en-us'
|loadData | load data asynchronously | function(node) | - |
| resultsPanelAllClearBtn | 在下拉框右半部分中是否显示清除按钮 | bool | true | 0.2.0 |
| resultsPanelTitle | 在下拉框右半部分中显示标题/说明 | string | '' | 0.2.0 |
| resultsPanelTitleStyle | 下拉框右半部分中的标题/说明的样式 | object | {} | 0.2.0 |
| filterResultsPanel | 下拉框右半部分中的结果是否受inputValue影响，如果为true，则右边树形结果也会根据inputValue过滤 | bool | true | 0.2.0 |
| locale | 国际化，枚举值 'zh-cn' | string | 'zh-cn' | 0.2.2 |'large'
| size | 尺寸 'middle' 'small' | string | 'large' | 0.4.15 |
| name | description | type | default |
|----------|----------------|----------|--------------|
|disabled | disable treeNode | bool | false |
|key | it's value must be unique across the tree's all TreeNode, you must set it | String | - |
|value | default as treeNodeFilterProp (be unique across the tree's all TreeNode) | String | '' |
|title | tree/subTree's title | String/element | '---' |
|isLeaf | whether it's leaf node | bool | false |