Skip to main content

TabRegion API

The <TabRegion> component is region included in the default window title bar that displays a tab for each window in the given window's stack. Each tab displays the corresponding window's title. Users may click these tabs to activate the corresponding window, or drag the tab into different stacks.

If tabbing is disabled for the given window, the <TabRegion> component will only display the window's title.

Props​

<TabRegion> accepts the following props:

children (optional)​

Type: ReactNode

You can use the children prop to pass a React component or JSX code to create a custom control or button. For example, add a button to summon a custom menu. Finsemble renders it to the right of the last tab in the TabRegion.

Usage​

Here's how the <TabRegion> component is used in the default window title bar.

<WindowTitleBarShell>
    ...
    <div className="fsbl-header-center">
        <TabRegion>
            {/* Your custom UI component goes here */}
            <CustomTabRegionControlComponent />
        </TabRegion>
    </div>
    ...
</WindowTitleBarShell>