react-checkbox-tree icon indicating copy to clipboard operation
react-checkbox-tree copied to clipboard

Allow `expandOnClick` to work without having to define onClick

Open GuyPaddock opened this issue 6 years ago • 2 comments

At the moment, it would appear that defining expandOnClick={true} has no effect unless onClick is also defined. The doc examples indicate this as well.

In our system, we are using the checkbox tree to present files and folders, and only files are selectable. We'd like it if users could click on folders to expand them. But, to do that right now, we'd have to implement onClick. If we set onClick to a no-op func, then folders expand when clicked but we lose the default check-off behavior when users click on files. Really what we want is the default onClick behavior, with the ability for users to click on folders to expand them.

GuyPaddock avatar Oct 23 '19 20:10 GuyPaddock

For now, I'm using this workaround but it feels like a kludge because it's basically re-implementing the built-in logic of the component:

  render() {
    return (
      <CheckboxTree
        expandOnClick={true}
        nodes={nodes}
        onClick={
          // Begin kludge
          (clickedNode) => {
            if (clickedNode.showCheckbox && !clickedNode.disabled) {
              let newCheckedList;
              
              if (clickedNode.checked) {
                newCheckedList = this.state.checked.filter(
                  (currentValue) => (currentValue !== clickedNode.value)
                );
              }
              else {
                newCheckedList = [...this.state.checked, clickedNode.value];
              }

              this.setState({checked: newCheckedList});
            }
          }
          // End kludge
        }
        onCheck={(checked) => this.setState({checked})}
        onExpand={(expanded) => this.setState({expanded})}
      />
    );
  }

GuyPaddock avatar Oct 23 '19 21:10 GuyPaddock

used onClick={() => null} hack to make it work. But should be fixed IMHO

syabro avatar Apr 06 '21 16:04 syabro