import React, { useEffect, useRef, useState } from 'react'; export default function App() { const inputRef = useRef(null); const [value, setValue] = useState(''); useEffect(() => { if (inputRef.current) inputRef.current.focus(); }, []); return ( <div style={{ padding: 16, width: 520 }}> <h2 style={{ marginTop: 0 }}>meetcode quick search</h2> <input ref={inputRef} value={value} onChange={(e) => setValue(e.target.value)} placeholder='Start typing...' style={{ width: '100%', padding: '10px 12px', borderRadius: 12, border: '1px solid #bbb' }} /> <div style={{ marginTop: 10, color: '#555' }}>Value: {value || '...'}</div> </div> ); }