Can the shortcut keys be modified through configuration?

[Red-Asuka]

Describe the problem

My website uses Algolia search and it works well. I also use an AI assistant on the website, and I found that when users input '/', it opens the Algolia search box. It seems to be a shortcut key conflict. Is there any way to disable the '/' shortcut key or can I assign it to another shortcut key?

Describe the solution

Provide a configuration that can modify shortcut keys, such as openShortcutKey: '/'.

Alternatives you've considered

Or, it can control the validity of shortcut keys through coding, and in some cases, it can temporarily disable shortcut keys.

[randombeeper]

DocSearch depends on Autocomplete which cannot be changed unless you create a custom renderer: https://www.algolia.com/doc/ui-libraries/autocomplete/guides/creating-a-renderer/.

[gpbl]

We run into this issue as well. Any progress @Red-Asuka ?

DocSearch depends on Autocomplete which cannot be changed unless you create a custom renderer: algolia.com/doc/ui-libraries/autocomplete/guides/creating-a-renderer.

@randombeeper how does the Autocomplete relate to this problem and why the proposed fix has been rejected?

[randombeeper]

@gpbl I was just stating above that the out of the box DocSearch UI is based on Autocomplete and that if the person wanted to do it themselves that could potentially be a way.

As for the proposed fix that you referenced, that may be a possible fix, but it seems it was closed by the submitter before we could evaluate it.

Having said all that, I'm aware of a few cases of this scenario now and will mark it for review with engineering.

[Red-Asuka]

@gpbl I resolved this issue by preventing the propagation of keyboard events for other dialogs. Here’s the code snippet I used:

aiDialog.addEventListener('keydown', (event) => {
  // Check if cmd/ctrl + k or / is pressed
  if(((event.metaKey || event.ctrlKey) && event.key === 'k')  || event.key === '/') { 
    event.stopPropagation();
  }
});

[gpbl]

Thanks @randombeeper for your response! I am using the search in a Docusaurus project and I was expecting to configure this behavior from the settings passed to Algolia there.

My use case is an input field in the page https://daypicker.dev/guides/input-fields - when a user types /, it triggers the search dialog.

[randombeeper]

Is it possible that this PR has fixed either of your issues? #2212

[gpbl]

Is it possible that this PR has fixed either of your issues? #2212

It could be as I'm in the same case of a Shadow DOM. Being a nested dependency from Docusaurus, not sure when I will see this on my website: I could fix it preventing the event to bubble when typing into the field. Thanks for the support!