The idx.oneui.Header widget provides a single straight-forward interface to produce all the possible permutations of header elements that are provided for in the IBM One UI design specification.
The idx.oneui.Header widget is commonly used declaratively, in HTML mark-up, but can also be instantiated programmatically if required. It performs all creation and layout of DOM components at start-up, and has no dynamic layout overhead. The required elements of the header are all configured via arguments passed to the widget on startup. There are quite a few of these, reflecting the many permutations and features of the One UI header design, making the idx.oneui.Header appear quite a complex widget. However, it's function and use are actually quite straightforward.
At its simplest, an idx.oneui.Header can simply be created with just a primary title, producing an extremely basic header as shown here:
More complex examples can be found on the Demo page, and the Detailed examples page contains a considerable range of header permutations, complete with source code in HTML or JavaScript, so that you can quickly get started with an example that most closely matches your particular header requirements.