|
| 1 | +# React Tress |
| 2 | + |
| 3 | +[](https://travis-ci.org/kenshoo/react-tree) |
| 4 | +[](https://codeclimate.com/github/kenshoo/react-tree/test_coverage) |
| 5 | + |
| 6 | +Code usage: |
| 7 | + |
| 8 | + |
| 9 | + <!-- example --> |
| 10 | + |
| 11 | +```jsx |
| 12 | +import ReactTree from "@kenshooui/react-tree"; |
| 13 | + |
| 14 | +const structure = [ |
| 15 | + ["Profiles", "Performance", "Clicks"], |
| 16 | + ["Profiles", "Performance", "Imp"], |
| 17 | + ["Profiles", "Attribute", "Agency"], |
| 18 | + ["Profiles", "Attribute", "Progress"], |
| 19 | + ["Profiles", "Attribute", "Create Date"], |
| 20 | + ["Campaigns", "Performance", "Clicks"], |
| 21 | + ["Campaigns", "Performance", "Cost"], |
| 22 | + ["Campaigns", "Performance", "CTR"], |
| 23 | + ["Campaigns", "Attribute", "campaign name"], |
| 24 | + ["Ad Groups", "Attribute", "Ad Group Name"] |
| 25 | +]; |
| 26 | + |
| 27 | +<ReactTree |
| 28 | + structure={structure} |
| 29 | + title={"Add filter criteria"} |
| 30 | + onSelect={() => {}} |
| 31 | +/>; |
| 32 | +``` |
| 33 | + |
| 34 | +## Props |
| 35 | + |
| 36 | +| Name | Type | Default | Description | |
| 37 | +| :------------------ | :-------- | :--------------------- | :-------------------------------------------------------------- | |
| 38 | +| `structure` | `Array` | `[]` | `Component input - array of leaves along with their ancestors` | |
| 39 | +| `title` | `String` | `` | `Title to be displayed on root mode` | |
| 40 | +| `onSelect` | `Func` | `` | `callback when clicking a leaf` | |
| 41 | +| `NoResultsRenderer` | `` | `no_matching_items.js` | `renderer when having no results on searching` | |
0 commit comments