move textInput element to a separate component

I have a screen where I use this :

const [searchText, setSearchText] = useState('');<Item rounded style={styles.inputItem}><Icon              name="search"              size={moderateScale(18)}              color="#bdbdbd"              style={styles.icon}            /><Input              autoFocus={true}              autoCapitalize="none"              style={styles.inputField}              placeholder="Friend Search"              keyboardType="default"              onChangeText={(text: string) => {                setSearchText(text);              }}            /></Item>

Instead of using the Input element on my current screen, I want to turn it into a reusable component. Something like this:

type SearchInputProps = {  handleChange?: any;};export const SearchInput: React.FunctionComponent<SearchInputProps> = (handleChange) => {  return (<Item rounded style={styles.inputItem}><Icon name='search' size={moderateScale(18)} color="#bdbdbd" style={styles.icon}/><Input        autoFocus={true}        autoCapitalize="none"        style={styles.inputField}        placeholder="Friend Search"        onChangeText={()=>handleChange}      /></Item>  );};

However, I am unable to figure out how to make the onChangeText work such that the const [searchText, setSearchText] = useState(''); value from the main screen can be set over there. Is it even possible?

I tried to create a snack expo here but I am unable to install native base https://snack.expo.io/@nhammad/curious-bubblegum

Edit:Managed to resolve the type error but still don't know how to pass setSearchText while calling the component.

type SearchInputProps = React.PropsWithRef<{  handleChange?: any;}>;export const FieldInput = React.forwardRef<Input, SearchInputProps>(  ({ handleChange }) => {    return (<Item rounded style={styles.inputItem}><Icon          name="search"          size={moderateScale(18)}          color="#bdbdbd"          style={styles.icon}        /><Input          autoFocus={true}          autoCapitalize="none"          style={styles.inputField}          placeholder="Friend Search"          keyboardType="default"          onChangeText={handleChange}        /></Item>    );  },);