Create New TabGroup KComponent

[marcellamaki]

Product

Kolibri

Specifically, this issue is blocking: learningequality/kolibri#9849

Desired behavior

We should create a new TabGroup component for proper accessible handling of tab that are used at the top of many components and pages. Currently, although our tabs are configured successfully to be keyboard navigable, they do not follow WCAG criteria for creating a coherent experience, especially for the screen-reader user. Tab groups should have the relevant information so context is carried over throughout navigation, and they are still experienced as a "group" in the same way they can be perceived visually.

This can be used across Kolibri for accessibility remediation, and can be used to more quickly build accessible pages in the future.

The component should essentially be a Vue implementation of the HTML pattern explained in this example from W3C.

The component should have a header, a customizable number of tabs, and any content for the active tab that can be set through a slot. Proper aria-labelledby and aria-selected should be implemented.

Any questions or concerns during planning, please consult with @radinamatic and @marcellamaki

[MisRob]

Resolved #420