Tab Panel #

tag: <hpcc-tabpanel>

Attributes #

add_button_enabled #

Whether the button to add new tabs is enabled

Type: boolean

Default Value: false

tab_placement #

The placement of the tab bar relative to the content

Type: "top" | "left" | "right" | "bottom"

Default Value: "top"

tabs_movable #

Whether the tabs are movable by the user

Type: boolean

Default Value: false

Child Element data-??? attributes #

data-label #

The tabbed panel will display this text as the tab label

Type: string

Default Value: Will first revert to the id of the child element and then the element tag if no id.

Events #

fit-request #

Emitted when a child component should recalculate its size constraints to fit the space requirements of its child widgets, and to update their position and size. Typically when a child elements visibility state changes.

update-request #

Emitted whenever the split panel contents should be updated, typically when split pane has been resized.

More Examples #

Movable Tabs #

tag: <hpcc-tabpanel tabsMovable>

Credits #

Lumino #

Lumino is a set of JavaScript packages, written in TypeScript, that provide a rich toolkit of widgets, layouts, events, and data structures. These enable developers to construct extensible high-performance desktop-like web applications, such as JupyterLab. Lumino was formerly known as PhosphorJS.

• Home Page
• GitHub