Support "names"

[srph]

So instead of a simple outside-click to an element, if we click outside of both element A and element B (e.g., click(a) /* $b's callback doesn't get called /; click(b) / $a's callback doesn't get called /; click(c) / the callback gets called */). Not necessarily 2 elements, but any element with the same "name".

Best example is an autocomplete input.

Initial Idea

<ClickOutside name="x" onClickOutside={this.handle} />
<ClickOutside name="x" onClickOutside={this.handle} />

Another Idea

<ClickOutsideOf of="x" onClickOutside={this.handle}>
  <ClickOutside name="x"><button /></ClickOutside>
  <ClickOutside name="x"><button /></ClickOutside>
</ClickOutside

• I don't have a better API yet. Posting this up maybe someone could come up with one.
• If it's outside the scope of this project (yea it does complicate things a bit), umm feel free to close haha 👌 . Thanks.