|
|
@ -27,7 +27,6 @@ const SearchInput: React.FC = () => {
|
|
|
|
className="block w-full py-2 pl-10 text-white placeholder-gray-300 bg-gray-900 border border-gray-600 rounded-full bg-opacity-80 focus:bg-opacity-100 focus:border-gray-500 hover:border-gray-500 focus:outline-none focus:ring-0 focus:placeholder-gray-400 sm:text-base"
|
|
|
|
className="block w-full py-2 pl-10 text-white placeholder-gray-300 bg-gray-900 border border-gray-600 rounded-full bg-opacity-80 focus:bg-opacity-100 focus:border-gray-500 hover:border-gray-500 focus:outline-none focus:ring-0 focus:placeholder-gray-400 sm:text-base"
|
|
|
|
placeholder={intl.formatMessage(messages.searchPlaceholder)}
|
|
|
|
placeholder={intl.formatMessage(messages.searchPlaceholder)}
|
|
|
|
type="search"
|
|
|
|
type="search"
|
|
|
|
inputMode="search"
|
|
|
|
|
|
|
|
value={searchValue}
|
|
|
|
value={searchValue}
|
|
|
|
onChange={(e) => setSearchValue(e.target.value)}
|
|
|
|
onChange={(e) => setSearchValue(e.target.value)}
|
|
|
|
onFocus={() => setIsOpen(true)}
|
|
|
|
onFocus={() => setIsOpen(true)}
|
|
|
@ -36,6 +35,12 @@ const SearchInput: React.FC = () => {
|
|
|
|
setIsOpen(false);
|
|
|
|
setIsOpen(false);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}}
|
|
|
|
}}
|
|
|
|
|
|
|
|
onKeyUp={(e) => {
|
|
|
|
|
|
|
|
if (e.key === 'Enter') {
|
|
|
|
|
|
|
|
e.preventDefault();
|
|
|
|
|
|
|
|
(e.target as HTMLInputElement).blur();
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
{searchValue.length > 0 && (
|
|
|
|
{searchValue.length > 0 && (
|
|
|
|
<button
|
|
|
|
<button
|
|
|
|