How to pass parameters from child commponent to parent component in React?

Lets say we have a parent component App

import React from "react";
import { useState, useEffect } from "react";
import Search from "./Search";


const App = () => {
  const [SearchData, SetSearchData] = useState("Enter text");

  const ReceiveText = (txt) => {
    console.log(txt);
    SetSearchData(txt);
  };

  return (
    <div>
      <Search HandleSearch={ReceiveText} />
      <h1> {SearchData}</h1>
    </div>
  );
};

export default App;

and we have a child component Search

const Search = ({ HandleSearch }) => {
  return (
    <div classs="search">
      <label>Search </label>
      <input
        placeholder="Search for movies"
        onChange={(e) => HandleSearch(e.target.value)}

      />
      <br></br>
      <button>Search</button>
    </div>
  );
};

export default Search;

App.js is a simple react component which has a child component Search.js. In app.js I have created a method which take an arguement text and print the text that we will be passing from child. also I have declared a usestate hook searchdata which would have initial text 'enter text' and also we will be setting the state based on the input from child.
In search.js file we are grabbing the method that is passed from App.js.Also it has a simple input tag from where we can input our text. it has an event handler onchange inside which iam calling handlesearch method which would get the text that we are entering from the input element and this text will be passed on to the handlesearch method of the parent component(App.js). As a result Searchdata would be updated which is in the App.js.
And that is how you can pass property from child to parent.
Thank you