State.init({ search: "", }); const handleChange = (e) => { State.update({ search: e.target.value }); }; return ( <div class="w-screen flex flex-col items-center"> <div class="flex gap-4 flex-row justify-center items-center"> <input class="rounded border px-3 py-1 w-10vw" placeholder={props.placeHolder} value={state.search} onChange={handleChange} ></input> <button class="rounded bg-transparent border border-gray-300 text-gray-600 px-2 py-1 hover:bg-gray-100 hover:text-gray-800"> Search </button> </div> </div> );