TermUI.Widgets.Tabs (TermUI v0.2.0)

View Source

Tabs widget for organizing content into switchable panels.

Tabs display a tab bar with labels and switch between content panels when tabs are selected.

Usage

Tabs.new(
  tabs: [
    %{id: :home, label: "Home", content: home_content()},
    %{id: :settings, label: "Settings", content: settings_content()},
    %{id: :about, label: "About", content: about_content(), disabled: true}
  ],
  on_change: fn tab_id -> IO.puts("Selected: #{tab_id}") end
)

Tab Options

  • :id - Unique identifier for the tab (required)
  • :label - Display text in tab bar (required)
  • :content - Content to display when selected (render node)
  • :disabled - Whether tab can be selected (default: false)
  • :closeable - Whether tab shows close button (default: false)

Keyboard Navigation

  • Left/Right: Move between tabs
  • Enter/Space: Select focused tab
  • Home/End: Jump to first/last tab

Summary

Functions

Adds a new tab.

Gets the currently selected tab ID.

Creates new Tabs widget props.

Removes a tab by ID.

Selects a tab by ID.

Returns the number of tabs.

Functions

add_tab(state, tab)

@spec add_tab(map(), map()) :: map()

Adds a new tab.

get_selected(state)

@spec get_selected(map()) :: term()

Gets the currently selected tab ID.

new(opts)

@spec new(keyword()) :: map()

Creates new Tabs widget props.

Options

  • :tabs - List of tab definitions (required)
  • :selected - Initially selected tab ID
  • :on_change - Callback when selection changes
  • :on_close - Callback when tab is closed
  • :tab_style - Style for inactive tabs
  • :selected_style - Style for selected tab
  • :disabled_style - Style for disabled tabs

remove_tab(state, tab_id)

@spec remove_tab(map(), term()) :: map()

Removes a tab by ID.

select(state, tab_id)

@spec select(map(), term()) :: map()

Selects a tab by ID.

tab_count(state)

@spec tab_count(map()) :: non_neg_integer()

Returns the number of tabs.