How to close dock by clicking on non-dock area

[andyafter]

As the picture shows, when a dock is opened, I want to be able to close it by clicking on the grey area. How do I do that?

[Gidgidonihah]

Simple answer:

Pass a function to onVisibleChange

Pseudo code answer:

export default class MyDock extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      isVisible: true,
    }
  }
  toggleVisibility = () => {
    this.setState({ isVisible: !this.state.isVisible })
  }
  render() {
    return (
      <Dock
        isVisible={this.state.isVisible}
        onVisibleChange={this.toggleVisibility}
      >
        Contents of the dock
      </Dock>
    )
  }
}