title: pass both props and a state object and let child component move parent component
body: <p>The button is a child component of Form1. My Form1:</p>
  <pre><code>export default function Form1(props, {transform}){
    return (
      &lt;div id='Form1' style={{transform: transform}}&gt;
                
               //Lots of html code..
  
                {props.children}
      &lt;/div&gt;   
    )
  }
  </code></pre>
  <p>In my App.js i have the following:</p>
  <pre><code>const [activeStep, setActiveStep] = React.useState(0);
        function handleNext(){
            setActiveStep(activeStep+1);
          };
  
    const [transform, transformit] = React.useState(&quot;TranslateX(0px)&quot;);
    
    function fram() {  
      transformit(&quot;TranslateX(-740px)&quot;);
    };
   &lt;Form1 transform={transform}&gt;
                 
     &lt;Button onClick={() =&gt; {handleNext();fram();}}&gt;NEXT&lt;/Button&gt; 
                  
   &lt;/Form1&gt;
  </code></pre>
  <p>The problem is that i'm passing both <strong>props</strong> and <strong>{transform}</strong> into Form1 which in turn does not allow the <strong>{transform}</strong> object to manipulate style of Form1.</p>
  <p>I have been stuck here for a while now, Is there any way possible to pass both into form1?</p>