Keyboard Support

[bealbrown]

Hello,

I see on the npm page that keyboard support is included?

I want to capture the enter key, i.e., user types verbatim search value and wants to trigger onchange by hitting enter

I don't see any documentation, but i do see in the .ts src:

onKeyDown:(event:KeyboardEvent) => void

which doesn't look promising.

Is there a sanctioned way to do this? Thanks.

[bealbrown]

I tried overriding onKeyDown, without any luck

  const keyDown = function (key) {
    console.log(key);
  };

return (
<SelectSearch
        options={matchingStocks}
        onChange={handleSelect}
        onKeyDown={keyDown}
        getOptions={(query) => {
          return new Promise((resolve, reject) => {
            resolve(getOptions(query));
          });
        }}
        search
        autoComplete="false"
        placeholder="Search..."
      />

[tbleckert]

Hi! Keyboard support refers to being able to use the component with a keyboard (up/down to navigate options, enter to select, esc to close).

The keyboard event handlers are attached to value and option components through valueProps and optionProps. You can patch those by using custom renderers.

[bealbrown]

Thanks for your quick response! I'll get it going this way. Much appreciated!

[tbleckert]

@bealbrown No problem! Let me know if you bump into more problems or questions