Skip to main content

Switch Components

The Switch component allows the display of one element out of a list of several elements. Users can cycle through the different children of the Switch tag by clicking on the currently displayed one.


  • active | boolean: controls whether the switch is active or not. Default: true.
  • tooltip | string: tooltip displayed when hovering over the switch element. Default: none.
  • tooltipPos | string: placement of the tooltip (either top, left, right, or bottom). Default: 'top'.
  • className | string: class name for the enclosing span element. Default: ''.
  • style | object: CSS inline styles. Default: {}.
  • onChange | function: callback invoked when elements are switched. Receives as its first argument the index of the currently displayed child. Default: onChange() {}.


Live Editor
ReferenceError: Provider is not defined