title: React FC with forwardedRef
body: <p>Im facing issue with ref - I need to ref to function component and pass props to it. So far I got my Parent component and Child Component. In my parent component I need to use ref to my child. I need to work with projectSectionItem inside my parent component.</p>
  
  <p><strong>Parent:</strong></p>
  
  <pre><code>const projectSectionItem = useRef&lt;HTMLDivElement&gt;(null);
  
          return i.showOnHP === 1 ?
              &lt;Project key={index}
                  url={`${URL}${i.button_image.image}`}
                  client={i.client_name}
                  project={i.project.en}
                  btn_color={"#000"}
                  btn_text={i.button_text}
                  href={`/cases/${i.slug}`}
                  ref={projectSectionItem}
              &gt;
                  {index === 0 ?
                      &lt;ScrollList&gt;
                          {data.map((i, index) =&gt; { return &lt;ScrollListItem data-index={index} key={index} ref={projectIndicator} onClick={(e: React.MouseEvent&lt;HTMLLIElement&gt;) =&gt; scrollToNextProject(e)} /&gt; })}
                      &lt;/ScrollList&gt;
                      : null}
              &lt;/Project&gt;
                  : null;
          })}
  </code></pre>
  
  <p><strong>Child:</strong></p>
  
  <pre><code>type APIProps = {
      url?: string,
      client?: string,
      project?: string,
      btn_text?: string,
      btn_color?: string,
      href?: string,
  }
  
  type HWWProps = {
      order_client?: number,
      order_project?: number,
      className?: string
      ref?: React.MutableRefObject&lt;HTMLDivElement&gt;
  }
  
  type ProjectProps = APIProps &amp; HWWProps;
  
  export const Project: React.FC&lt;ProjectProps&gt; = props =&gt; {
      return (
          &lt;StyledProject className={props.className}&gt;
              &lt;ProjectContainer&gt;
                  &lt;ProjectImage src={props.url} alt={props.client} /&gt;
                  &lt;ProjectTextWrapper&gt;
                      &lt;ProjectBrand order_client={props.order_client}&gt;{props.client}&lt;/ProjectBrand&gt;
                      &lt;ProjectName order_project={props.order_project}&gt;{props.project}&lt;/ProjectName&gt;
                      &lt;ButtonExtend as={Button} color={props.btn_color}&gt;&lt;Link to={props.href}&gt;{props.btn_text}&lt;/Link&gt;&lt;/ButtonExtend&gt;
                  &lt;/ProjectTextWrapper&gt;
              &lt;/ProjectContainer&gt;
              {props.children}
          &lt;/StyledProject&gt;
      )
  }
  </code></pre>