bkrem / react-d3-tree

:deciduous_tree: React component to create interactive D3 tree graphs
https://bkrem.github.io/react-d3-tree
MIT License
1.09k stars 270 forks source link

LeafNode still not targeted correctly #478

Open Parya-Jafari opened 1 year ago

Parya-Jafari commented 1 year ago

Are you reporting a bug, or opening a feature request?

I am reporting a bug.

What is the actual behavior/output?

Setting leafNodeClassName on Tree should attach the provided className to leaf nodes on the dom.

What is the behavior/output you expect?

When a node's children is an empty array [] it is not properly identified as a leaf node.

Can you consistently reproduce the issue?

Yes

What version of react-d3-tree are you using?

3.6.1

Please find more information on my comment on an existing Closed Issue

cabbagetom commented 1 year ago

@Parya-Jafari - was doing some checking in the index file. You are indeed correct that an empty array ([]) is neither null nor undefined as per the ternary operator test in index.tsx file. You are right it might be useful to change the expression to also check for empty array. If in your JSON object etc. you remove the child object entirely class name will change to node__leaf

getNodeClassName = (parent: HierarchyPointNode<TreeNodeDatum>, nodeDatum: TreeNodeDatum) => { const { rootNodeClassName, branchNodeClassName, leafNodeClassName } = this.props; const hasParent = parent !== null && parent !== undefined; if (hasParent) { return nodeDatum.children ? branchNodeClassName : leafNodeClassName; } else { return rootNodeClassName; } };