react variable not changing

in my react app i have got two files and, when value of (number) is changing in file App.js
in Form.js is still the same. What am i doing wrong?

App.js

import * as React from "react";
import { Form } from "./Components/Form";

function App() {
  
  let number = 0;
  const onInputChange = e => number = e.target.value;
    // number is changing every time i type something in
  return (
    <>
      <input onChange={onInputChange}></input>
      <Form number={number} />
    </>
  );
}

export default App;

Form.js

import React from "react";

export const Form =({number}) =>
{
    return(
        <h1>{number}</h1>
    )
}