title: Pass functional component to Animated.createAnimatedComponent
body: <p>If you try to pass functional (non react class) component to <code>Animated.createAnimatedComponent</code> it throws an error that says</p>
  
  <blockquote>
    <p>Stateless functional components are invalid as children of createAnimatedComponent</p>
  </blockquote>
  
  <p>Coming from an app that uses react hooks, basically all of my component are functional.</p>
  
  <p>Is there a way / helper that can allow to pass these to <code>createAnimatedComponent</code> without wrapping them in <code>Animated.View</code> or even just <code>View</code>?</p>
  
  <p>Here is an example of component that I want to make animatable</p>
  
  <pre class="lang-js prettyprint-override"><code>function MyComponent({ someProp }) {
    const [counter, setCounter] = useState(0);
  
    return (
      &lt;View&gt;
        &lt;Text&gt;{counter}&lt;/Text&gt;
      &lt;/View&gt;
    );
  
  }
  </code></pre>