Distinguish first source in a component tree with nested sources

[sseppola]

Hi, I have multiple nested react-aim sources in a component tree and I'm trying to pass an "over = true" prop to the first react-aim source under the cursor. By first I mean the element deepest in the DOM.

I'm not sure if this is currently possible, although I'm still wrapping my head around the code. Is there a simple way to accomplish this?

[gabrielbull]

It is not possible to do without making changes to the library.

[sseppola]

Thank you. Is a feature like this something that is in the scope of this module?

[gabrielbull]

Yes, it sounds like a good idea to have.

[sseppola]

Cool. I'll have a look at how I'd extend this library to accomplish it. As the author, do you consider this a straightforward task to write?

[gabrielbull]

It shouldn't be too hard. What needs more thinking is how would you expose the API to the user. Currently, we use this type of API:

@source(
  {
    mouseEnter: (props, component) => {
      component.setState({ over: true });
    },
    mouseLeave: (props, component) => {
      component.setState({ over: false });
    }
  }
)

Which I'm not a fan of because it rely on having a state for the component. If it was mapping props to the component that would be better and could be used with stateless components as well.

[sseppola]

I agree and will keep it in mind as I go, however my first goal is to reach parity with the current api.