How to change the class of an element on click outside of an element in React?

Question

React

In codesandbox, I have a clickoutside hook that allows you to change the state on a click past the block, and it works. The block appears and disappears as it should. Now he just renders it, which does not suit me. I need the is-open class to be removed on click outside the block and I hide it using css (the styles in the example are already ready). I can't seem to get it to work the way it should. Thank you in advance.

https://codesandbox.io/s/quiet-cdn-judrq?file=/src...

Answer 1

Forgot to add ref={ref}the element you are going to hide.
Well, you would also decide how exactly the element should be displayed / hidden - through conditional rendering, or styling. Why use both methods at the same time - I have no idea.