UNPKG

deni-react-treeview-amir

Version:

A modern, themable and configurable treeview for React.

106 lines (85 loc) 2.1 kB
# deni-react-treeview-amir A modern, themable and configurable treeview for React, Which support RTL [site](https://denimar.github.io/deni-react-treeview/), [examples](https://denimar.github.io/deni-react-treeview/examples) ![alt text](https://denimar.github.io/deni-react-treeview/images/deni-react-treeview.png) TODO: In the future I will implement the tests, Cloud CI. ## Installing with NPM ``` npm install deni-react-treeview-amir --save (React 16) ``` ## Usage Added to your react component ```html <TreeView url="https://denifakedata.herokuapp.com/tree/countries" rtl={true}/> ``` For more details: [examples](https://denimar.github.io/deni-react-treeview/examples) ## API [documentation](https://denimar.github.io/deni-react-treeview/api.html) ## Features * Cross-Browser. * Binding to a JSON (locally, remotely and lazy-load) * Predefined Themes * Theme Customization * Events * Checkboxes * And so on... ## Properties * autoLoad ```(boolean)``` * lazyLoad ```(boolean)``` * marginItems ```(integer)``` * selectRow ```(boolean)``` * showCheckbox ```(boolean)``` * showIcon ```(boolean)``` * showRoot ```(boolean)``` * theme ```(string)``` * rtl ```(boolean)``` ## Events * OnRenderItem * onBeforeLoad * onAfterLoad * onSelectItem * onExpanded * onColapsed * onLazyLoad * onCheckItem #### json example ```javascript [ { id: 100, text: 'Fruits', children: [ { id: 101, text: 'Orange', isLeaf: true }, { id: 102, text: 'Banana', isLeaf: true } ] }, { id: 200, text: 'Vegetables', children: [ { id: 201, text: 'Carrot', isLeaf: true }, { id: 202, text: 'Tomato', isLeaf: true } ] } ] ``` ## License [MIT.](https://raw.githubusercontent.com/denimar/deni-react-treeview/master/LICENSE-MIT) ## Author [Amirreza Sharifi](https://github.com/amir-ashy) (sharifi.amirreza92@gmail.com)