Header

Properties

parent

A reference to the Stack this header belongs to.

layoutManager

A reference to the owning LayoutManager instance.

tabs

An array of active Tab controls displayed in this header.

element

The native HTMLElement DOM wrapper for the header bar.

tabsContainerElement

The HTMLElement containing the draggable tab elements.

controlsContainerElement

The HTMLElement containing the action buttons. Custom action buttons can be injected directly into this container.

side

The current side orientation: 'top' | 'left' | 'right' | 'bottom'.

show

Whether this header is currently visible.

positionHeader( side )

argument	type	optional	default	description
side	Side ('top' | 'left' | 'right' | 'bottom')	false	-	New position of the header tab strip relative to panel content.

Adding Custom Action Buttons

You can append custom controls to any stack header by accessing its controlsContainerElement:

const btn = document.createElement('button');
btn.className = 'custom-header-btn';
btn.title = 'Refresh Component Data';
btn.textContent = '🔄';
btn.onclick = () => refreshActiveData();

stack.header.controlsContainerElement.prepend(btn);