inut value reset to empty when select

[tarun1081998]

Describe the bug
When we are using the getOptions function, it is returning correct dropdown data, but when we select any option, it set the input filed value to right option and then sets it to empty

To Reproduce
Steps to reproduce the behavior:

1. use getOptions function to call api on query change
2. on UI editing the input field, it shows the corect dropdown items
3. select any item
4. the input field will show it's name and then empties the input field.

Expected behavior
Selected item should be visible in input field

Screenshots

Desktop (please complete the following information):

• OS: windows 11
• Browser chrome

Additional context
Below is my getOptions function
function getOptions(query) { if(query === ''){ return [{name:'',value:''}] } return new Promise((resolve, reject) => { fetch(https://www.alphavantage.co/query?function=SYMBOL_SEARCH&keywords=${query}&apikey={myapikey}`)
.then(response => response.json())
.then((resp) => {
var stocks = resp?.bestMatches?.filter(x=>x["4. region"]==="India/Bombay")
if(stocks)
resolve(stocks?.map(s=>{return {name:s["2. name"],value:s["1. symbol"]}}))
else
resolve([{name:'',value:''}])
})
.catch(reject);
});
}`
bug-compressed.zip