Back to all examples

Show version number

ReactAngularWeb Components
<GoabMicrositeHeader
      type="alpha"
      version={
          <span>Slotted <b>version text</b>.</span>
          <span>v1.23</span>
      }
    />

Display version information in the microsite header using the version slot, allowing custom formatting and styling of version text.

When to use

Use this pattern when:

  • You need to display a version number or status in the header
  • The service is in alpha or beta phase
  • You want to include formatted version information

Considerations

  • Use the version slot for custom version content with formatting
  • Keep version text concise and clear
  • Combine with header type (alpha, beta, live) to indicate service maturity
  • Version information should be easily scannable