Switch to AlphaGov Accessible Autocomplete to fix tabbing

[iandunn]

Fixes #70

[iandunn]

This seems to be working well initially, but I still wanna play around w/ some of the API options. After that it'll need styling and cleanup.

[iandunn]

Getting the basics working was pretty easy, but I've been struggling to shoehorn it into the design. I've considered switching to the latest version of Select2, since it might have fixed the bug, and wouldn't need any design changes. I'm guessing it still has a wide range of a11y issues that SelectWoo has fixed, though. We could try another modern a11y-first select library, but we might run into similar issues there. We could also try porting the fix from Select2 to SelectWoo, but that could also be a rabbit hole since they've diverged so much.

@adamwoodnz Your CSS skills are better than mine, do you mind taking a look at this branch and letting me know if you have any ideas to get the style working? It's hard to describe specific problems because there are so many, and they change depending on what approach I take. I'm wondering if you start from scratch, do you see a way to get just the fundamentals working with the design? If so, I could pick that up and polish all the little details.

[iandunn]

start from scratch

If you see a better way, feel free. Starting from scratch was just what made sense to me.

[iandunn]

I just remembered that Learn has a switcher too, and @coreymckrill had a really good idea there:

The switcher uses WP/Gutenberg's native Combobox component for selecting the locale, rather than the select2 JavaScript library (or the selectWoo variant). The hope is that this will be both more accessible and more maintainable, since the future of development for select2/selectWoo is uncertain.

That's been on Learn for two years without any reports of problems.

It might also be difficult to work that into the current design, but if we're going to have trouble no matter what, then it seems like a better solution to me. It seems like the markup might be a closer fit to what the WP20 nav menu uses, though, where there's button to toggle it and that's a separate element tree from the list itself.

@adamwoodnz what are your thoughts on that, and the current styles? If you think Combobox would be better I could try that out in a new PR.

[adamwoodnz]

If you think Combobox would be better I could try that out in a new PR.

Using WP/Gutenberg does seem like a good call. I reckon give it a try.

I'll also push my branch for the AlphaGov switcher, as I've got the styles pretty close. We can then compare.

[adamwoodnz]

I'll also push my branch for the AlphaGov switcher, as I've got the styles pretty close.

My PR is here, give it a whirl.

[iandunn]

That's looking really good, great work 🎉

Since it's so close, IMO it's best to to stick with that. If we ever have a need for major changes, we can try testing out ComboboxControl. I'll push some commits to #93 to clean up some of drafted code, and I think we'll have something that's good to go 👍🏻

[iandunn]

Closing in favor of #93