title: How can I attach a ref to a component that i am copying using React.cloneElement
body: <p>hey all I want to pass in a ref into my component this way I can access the variables on said compenent like state. only issue is i can't seem to get it to work. It needs to be able to work for both classes and functional </p>
  
  <p>what I am receiving back from the console.log is null every time
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>  const testRef = createRef();
    console.log(testRef)
    const elementToCopy = singleScreenState.screen.peek().element;
    const Element = React.cloneElement(elementToCopy as ReactElement, { ...elementToCopy?.props, forwardRef: testRef })</code></pre>
  </div>
  </div>
  </p>