Card- consider refactoring markup for clickable cards

[jessiehuff]

Describe the problem
When tabbing through the clickable cards, it almost appears as if the second card doesn't receive focus. It looks like the clickable card is performing the action on focus AND on click. It seems like it's clicking the link on focus which is why focus shifts off it so fast. This would be worth some investigation.

How do you reproduce the problem?
Go to clickable card example, use your keyboard to tab through and try to perform all actions.

Expected behavior
To be able to use Tab to navigate cards and enter to click them.

[thatblindgeye]

Jessie and I briefly discussed this during a meet, and this may be due to clickable cards currently utilizing visually hidden radio inputs to create the "fully clickable card" effect. Native radio inputs allow tabbing between inputs when no option is selected, but require arrow keys to traverse/select another radio once a selection has been made. If you Tab to the first clickable card in the example linked above, pressing Down Arrow should navigate to (then trigger) the second card.

[thatblindgeye]

Updating this issue to be more of a spike regarding refactoring the markup and API of the selectable/card implementations. This would also require updates made in Core.

[thatblindgeye]

Closed by 10859