constantin-p / cp-react-tree-table

A fast, efficient tree table component for ReactJS.

Home Page:https://constantin.software/cp-react-tree-table

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Scroll to specific node Highlighting

praveennetcity opened this issue · comments

I have implemented a search functionality, by using scroll to specific node option by the below example
https://jsfiddle.net/constantin_p/bksfxe61/11/?utm_source=website&utm_medium=embed&utm_campaign=bksfxe61

is there any parameter/option for highlighting the specific node (row) in the table when using scroll to specific node.

The library defers the job of rendering cells to the consumer code - you can provide a custom flag property in the tree data and use it in the cell renderer to dictate whether they should apply style/layout changes to highlight the corresponding row.

const MOCK_DATA = [
  ...
  {
    data: { name: 'Company I', expenses: '105,000' },
    children: [
      { 
        data: { name: 'Department 1', expenses: '75,000', isHighlighted: true },
      },
      ...
    ]
  },
  ...
];
<TreeTable
  value={treeValue}
  onChange={this.handleOnChange}>

  <TreeTable.Column
    renderCell={(row) => <span className={row.data.isHighlighted ? "highlight" : ""}>{row.data.name}</span>}
    renderHeaderCell={() => <span>Name</span>}/>
  ...
</TreeTable>