Version Switcher

It should be possible to show a version switcher on a code snippet. This could be automatically displayed if the component detects more than one version of the example in the markdown/schema used to describe the code snippet. If one example is included, there should be no version switcher control displayed.

States

  • Hidden: The version switcher is not shown if only one code example is present.
  • Visible: The version switcher is shown, and displays the currently selected example title
  • Focused: The control is highlighted using the Vanilla standard focus highlight
  • Opened: The select menu is opened, showing the possible choices
  • Selected: The user has tapped a selection and the relevant code snippet is displayed

Behaviours

A Vanilla standard select menu which allows the user to pick from a list of items. Immediately on selection, the relevant code snippet is displayed.

Anatomy

Version switcher