The differences between Comp() and <Comp /> in case of functional stateless components.

(Robert) #1

Right now I have a problem which makes me have a functional component call in the form Component(). <Component /> version generates a bug.

I use material UI Popover. In the case of passing the component as a <Component />, Popover is finding the right anchorEl although renders the content incorrectly(Popover goes to the top left corner). In case of passing the component as Component() Popover works fine(under the element clicked).

Now the problem is that I need to use the component I am trying to create in the general case. I need to pass the child component in a <Component /> format in order to keep this reusable in all cases.(Maybe the passed element in some cases is a class and not a stateless functional component)

I guess it’s some context problem coming from the difference of Component() and <Component />. Can anyone help me with this? Anyone encountered a similar problem?

P.S. Here is a sample code in the form of a gist. The main line to look at is line 100