vue3-simple-typeahead icon indicating copy to clipboard operation
vue3-simple-typeahead copied to clipboard

Accessibility: Focus Stuck when SelectOnTab is True

Open ewalpole opened this issue 2 years ago • 0 comments

When using the component, if selectOnTab is True, I am unable to tab out of the component during keyboard navigation. Is this intended/known?

Additionally, when I set selectOnTab to false, when the search list is not visible it still gains focus, does it need a tabindex="-1" set so that it's taken out of tab order when not visible?

Here's how I am using the component

<SimpleTypeahead
        :id="inputId"
        @keyup.enter="submit"
        @onFocus="inputFocused"
        :selectOnTab="false"
        :class="[$style.autoSuggestItem, { [$style.fullWidthInput]: isFullWidth }]"
        :items="suggestions"
        :minInputLength="1"
        :itemProjection="
          (item) => {
            return item.name;
          }
        "
        @selectItem="setSelectedItem"
        @onInput="inputChanged"
        :placeholder="showItemPlaceholder ? itemPlaceholder : ''"
      ></SimpleTypeahead>

Thanks!

ewalpole avatar Nov 14 '22 02:11 ewalpole