Security News
Highlights from the 2024 Rails Community Survey
A record 2,709 developers participated in the 2024 Ruby on Rails Community Survey, revealing key tools, practices, and trends shaping the Rails ecosystem.
simple-tree-utils
Advanced tools
Simple Tree Utils is the library to convert and manipulate with tree-like structures.
Simple Tree Utils is the library to convert and manipulate with tree-like structures. Library provides converter from an array of objects to trees like structure and vice versa, and also methods to manipulate that tree and/or search in that tree.
It is created because I needed to convert the array of objects into a tree to visualize in Angular tree component. Surely there are plenty of similar libraries, but I think all of them work with their own models/classes, I needed to use my own data without no extra instantiating, or adding extra methods/properties into the working model.
Install library using npm npm install simple-tree-utils --save
and import main class
into your code base import {TreeUtils} from 'simple-tree-utils';
.
For more details and complete documentation check: https://simple-tree-utils.netlify.app/
First instantiate class with config, or without config.
const treeUtils = new TreeUtils(); // without config, default values are used (id as idProp, parentId as parentIdProp, children as childrenProp)
const treeUtils2 = new TreeUtils({
idProp: 'id', // the key of a unique identifier for an object (source object)
parentIdProp: 'parentId', // the key of a unique parent identifier (source object)
childrenProp: 'children', // the key, where child nodes are stored (destination object tree)
});
After instantiation, you can use tree utils. You can convert the array of the following objects into a tree using list2Tree
method as following
const items = [
{id: 1, parentId: null, name: 'Node 1'},
{id: 2, parentId: null, name: 'Node 2'},
{id: 3, parentId: 1, name: 'Node 3'},
{id: 4, parentId: 1, name: 'Node 4'},
{id: 5, parentId: 2, name: 'Node 5'},
{id: 6, parentId: 3, name: 'Node 6'},
];
const output = treeUtils.list2Tree(items);
then the output of lift2Tree will be
const tree = [
{
id: 1, parentId: null, name: 'Node 1', children: [
{
id: 3, parentId: 1, name: 'Node 3', children: [
{id: 6, parentId: 3, name: 'Node 6', children: []},
]
},
{id: 4, parentId: 1, name: 'Node 4', children: []},
]
},
{
id: 2, parentId: null, name: 'Node 2', children: [
{id: 5, parentId: 2, name: 'Node 5', children: []},
]
},
];
When you got a structure like the above, you can use all the following methods:
Name | Desription | Signature |
---|---|---|
addNode | Method to add new node to tree (mutable operation!) | addNode(tree: any[], parentId: any, childData: any): void |
deleteNode | Method to delete node in tree by given id (mutable operation!) | deleteNode(tree: any[], id: any): any |
editNode | Method to update node by id with given data in tree (mutable operation!) | editNode(tree: any[], id: any, data: any): void |
findAllChildrenNodes | Method to find all children nodes of given node in tree structure | findAllChildrenNodes(tree: any[], id: any): any[] |
findAllParentNodes | Method to find all parents of given node in tree structure | findAllParentNodes(tree: any[], id: any): any[] |
findAllTreeNodes | Method to find all nodes in tree structure by given callback function | findAllTreeNodes(tree: any[], fn: ((item: any) => boolean)): any |
findNodeParent | Method to find parent of given node in tree structure | findNodeParent(tree: any[], id: any, parent?: any): any |
findTreeNode | Method to find node in tree structure by given callback function | findTreeNode(tree: any[], fn: ((item: any) => boolean)): any |
findTreeNodeById | Method to find node in tree structure by given id | findTreeNodeById(tree: any[], id: any): any |
For example, we can find node by giving callback
const node = treeUtils.findTreeNode(tree, item => item.id === 2);
If you need a list again, you can convert the tree back to a list using treeUtils.tree2List
method
treeUtils.tree2List(tree);
You can also use this library in the browser without compiling using jsDelivr.
Import script into HTML file, and you can access classes through the global treeUtils
object.
<script src="https://cdn.jsdelivr.net/npm/simple-tree-utils@1/dist/browser-bundle.min.js"></script>
<script>
const utils = new treeUtils.TreeUtils();
const tree = utils.list2Tree(items);
</script>
MIT
FAQs
Simple Tree Utils is the library to convert and manipulate with tree-like structures.
The npm package simple-tree-utils receives a total of 2,386 weekly downloads. As such, simple-tree-utils popularity was classified as popular.
We found that simple-tree-utils demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
A record 2,709 developers participated in the 2024 Ruby on Rails Community Survey, revealing key tools, practices, and trends shaping the Rails ecosystem.
Security News
In 2023, data breaches surged 78% from zero-day and supply chain attacks, but developers are still buried under alerts that are unable to prevent these threats.
Security News
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.