Portal

[hatpick]

Do you have any plans for supporting portals?

[ooade]

Hi there! Apologies for just replying.

I'm not sure what you mean but it works in a Portal. Here's an example.

Maybe you can share what you really want to achieve and I'll be able to answer appropriately.

[hatpick]

@ooade Thanks for the reply.

The code snippet you have above is having the ClickAway component within the Modal. I'm talking about a case such as this:

<ClickAway>
   ...stuff...
   <Portal>...</Portal>
</ClickAway>

Your library currently supports clicking away from "stuff" part, but it wont handle clicking away from a Portal wrapped in your component.

[ooade]

Oh. I'm not sure we are going to support that.

[hatpick]

You should be able to achieve that via React synthetic events, Portal bubbles up click events to the parent component in React.

[ooade]

We can actually support it. I didn't just think a lot of people would need it. I'll implement it later today 🙏

[ooade]

I just published a beta package that supports it @hatpick. Can you try it out and give feedback?

Install:

yarn add react-click-away-listener@beta

[hatpick]

https://codesandbox.io/s/pedantic-nightingale-k20jp
Start typing = in the textbox to get a portal context menu, each sub menu is a new portal.
(check console for "away" messages)

It seems like it's working even without isPortal props.

[ooade]

Yeah, it'll work but not work as expected if not passed.

[ooade]

Hi @hatpick Does it work at expected? If it doesn't, what's the expected behaviour?

[hatpick]

In my demo, I was using material core clickaway listener, I replaced it with yours and it seems identical, so I can only assume that it works as expected. :) good job.

[ooade]

Good to know. Thanks a lot! 🕺

[oliviertassinari]

I was using material core clickaway listener, I replaced it with yours

@hatpick Why? :)