https://github.com/ckotzbauer/simple-tree-component
A simple to use ui-tree javascript component
https://github.com/ckotzbauer/simple-tree-component
component html input javascript tree tree-component ui-tree
Last synced: 3 months ago
JSON representation
A simple to use ui-tree javascript component
- Host: GitHub
- URL: https://github.com/ckotzbauer/simple-tree-component
- Owner: ckotzbauer
- License: mit
- Created: 2020-02-21T09:54:03.000Z (over 6 years ago)
- Default Branch: main
- Last Pushed: 2026-04-04T01:49:12.000Z (3 months ago)
- Last Synced: 2026-04-04T03:31:10.161Z (3 months ago)
- Topics: component, html, input, javascript, tree, tree-component, ui-tree
- Language: TypeScript
- Homepage: https://www.ckotzbauer.de/simple-tree-component
- Size: 9.6 MB
- Stars: 5
- Watchers: 2
- Forks: 3
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Simple Tree Component
[](https://codecov.io/gh/ckotzbauer/simple-tree-component)
[](https://www.npmjs.com/package/simple-tree-component)
> This pure JavaScript component comes without any dependencies and is targeted to modern browsers. Full TypeScript support is available.
## Installation
Install with NPM:
```
npm install simple-tree-component
```
TypeScript definitions are included in the npm package.
## Usage
```js
import simpleTree from "simple-tree-component";
const instance = simpleTree(".root-1", "singleSelectDropdown", {
nodes: [
{
label: "Parent 1",
value: "p1",
children: [
{
label: "Parent 1 - Child 1",
value: "p1c1"
},
{
label: "Parent 1 - Child 2",
value: "p1c2"
}
]
}
]
});
instance.setReadOnly(true);
```
You can find more documentation [here](https://www.ckotzbauer.de/simple-tree-component).
[License](https://github.com/ckotzbauer/simple-tree-component/blob/main/LICENSE)
--------
[Changelog](https://github.com/ckotzbauer/simple-tree-component/blob/main/CHANGELOG.md)
--------
### Blog post
https://dev.to/ckotzbauer/announcing-the-simple-tree-component-46nd
## Contributing
Please refer to the [Contribution guildelines](https://github.com/ckotzbauer/.github/blob/main/CONTRIBUTING.md).
## Code of conduct
Please refer to the [Conduct guildelines](https://github.com/ckotzbauer/.github/blob/main/CODE_OF_CONDUCT.md).
## Security
Please refer to the [Security process](https://github.com/ckotzbauer/.github/blob/main/SECURITY.md).