Add an "as" prop to customize the returned element

[mikeriley131]

Thanks for building this!
What do you think about being able to customize the returned element via something like an as prop?
I want to use this package within unordered lists to stagger the display of the list items, but wrapping the list items in the package's returned <div> creates invalid HTML.

I was thinking an as prop would be nice so you could maintain the proper markup in this situation.

Example:

<AnimationOnScroll
  animateIn="animate__fadeIn"
  as="li"
  duration={2}
  delay={index * 1000}
  animateOnce
>

You then add the as prop to the component:

as: Component

Default it to "div":

as = "div"

and then you change the component's return value to:

<Component
  ref={node}
  className={classNameProps ? `${classNameProps} ${classes}` : classes}
  style={Object.assign({}, style, styleProps)}
>
  {children}
</Component>

What do you think?