TreeTable: Node Click Event

[James-Laidlaw]

Describe the feature you would like to see added

Treetable Nodes already internally has a node-click event, which triggers when a node is clicked and is caught by the tree table component. However this event does not propagate past the Treetable component, making it impossible to detect node clicks outside of the tree table to use for custom functionality or behavior. I would like to see this event emitted by the tree table every time it is triggered in addition to the current handling.

Is your feature request related to a problem?

I personally would like this feature as a way to implement row expansion whenever a node is clicked, rather than just the expander button.

Describe the solution you'd like

I would the pre-existing node-click event from TreeTableRow to also be emitted by TreeTable every time the event happens. this can be accomplished by adding this.$emit('node-click', event) to the onNodeClick method of the TreeTable.vue component.

Describe alternatives you have considered

currently I see no easy way to do this, beyond altering the CSS to make the expander's clickable area the size of the row, which comes with a number of potential problems.

Additional context

No response

[James-Laidlaw]

Note I am willing to make this PR myself (including typing the new emit) if I know it is likely to be merged

[James-Laidlaw]

For anyone else with a similar goal: I've made a workaround to achieve my initial goal of having the whole row act as an expansion button, It's a bit of a hack but uses CSS to expand the clickable area of the expansion button on all non-leaf nodes to the size of the full row.

    //this creates a pseudochild of the button the size of the first anscestor with "relative" size
    button.p-treetable-toggler.p-link::before { 
      content: ""; 
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
    }
    //this element originally had "relative" size, overwriting it allow the pseudochild to be sized relative to a later anscestor
    .p-treetable-toggler { 
      position: static;
    }
    // this element contains the full row, by making it relative the pseudochild can size itself based on this
    .p-treetable .p-treetable-tbody > tr {
      position: relative;
    }

[James-Laidlaw]

I've also come to want this feature as a way to implement actions on the double-click of a node.

[andrey-zakharov]

Come here in a searching of node clicks and double-clicks events. Very surprising than such rich library has such small issues.

[JasonLandbridge]

@James-Laidlaw , thank you so much! The fix is great and works as advertised!