feat(*): Allow React functional components

[pavloko]

Rational

The release of Hooks allows to avoid classes completely, so it might be reasonable to allow functions to be used as top level components.

Changes

I've added a check to make sure cmp is a function and since Angular's directives and components are passed as strings it should be safe to attribute that component to React.

React does similar check internally and ui-router's heuristic with these changes included would be similar.

@christopherthielen I'd appreciate your feedback on this.

[pahen]

This would be awesome to support.

[christopherthielen]

since Angular's directives and components are passed as strings it should be safe to attribute that component to React.

👍 I'm honestly surprised this hasn't come up before! I thought we already supported functional components. Thanks a bunch 😄

I believe that in my codebase I'm using component: FnComponent, $type: 'react'

[pahen]

This works for functional React components but it breaks if the component is using React.memo since it will be an object then and not a function. Using $type: 'react' works though 👍

[pavloko]

@pahen Do you think ui-router should handle it somehow?

[pahen]

Yes, since using React.memo in functional components is very common and it's included in React. So I think it would be very nice if ui-router could support it out of the box @pavloko

[pavloko]

Sounds good! I'll try to experiment with it sometime in the next 2 weeks.