phosphor-icons / homepage

The homepage of Phosphor Icons, a flexible icon family for everyone
https://phosphoricons.com
MIT License
3.9k stars 93 forks source link

Refocus on search input after clicking "X" #429

Open akdeb opened 4 months ago

akdeb commented 4 months ago

https://github.com/phosphor-icons/homepage/blob/e6b05451944d27fdf99be351894eb660d14e40b1/src/components/SearchInput/SearchInput.tsx#L71C1-L76C5

I noticed this was something I'd like when I was using the website. Perhaps its a good idea to refocus on the search bar once the SeacrchInput's "X" button is clicked.

This would end up looking like:

  const handleCancelSearch = () => {
    setValue("");
    inputRef.current?.focus();
    // Should cancel pending debounce timeouts and immediately clear query
    // without causing lag!
    // setQuery("");
  };
rektdeckard commented 4 months ago

@akdeb solid point, I'll fix this!