TabItem
TabItem is the data record used by Tabs.
Each item defines one labeled tab and the content that should appear when that tab is active. The parent Tabs widget chooses which item's content is actually rendered by comparing its index to active_index.
Example
use fission::prelude::*;
let item = TabItem {
title: "Security".into(),
content: security_panel_node,
on_press: Some(select_security_tab_action),
};
Field table
| | | |
|---|
| | Visible label for the tab button. | |
| | Panel content for this tab. | Required. Only the active tab's content is shown. |
| | Action fired when the tab is chosen. | Defaults to None. Usually sets the active index in state. |
Specific advice
Keep tab titles short and parallel. Tabs work best when users can compare section names at a glance.
Production checklist
For TabItem, review the fields that change behavior before treating the widget as finished: title, content, on_press. The goal is to make the product rule visible in state and actions, not hidden inside ad-hoc construction code.
Bind on_press to explicit reducer actions and test that the reducer handles unavailable, duplicate, or invalid input safely.
When child widgets are generated from data, give reordered or filtered rows an explicit WidgetId so retained local state and scroll behavior do not drift between items.
Check the semantics tree for the user-facing label or role that makes this widget understandable without relying only on pixels.
Add at least one component or harness test that confirms the visible text, semantic role, action dispatch, and layout constraint that matter for this widget in context.
If a screen starts repeating the same TabItem setup, extract a named component around this widget. That keeps the reference API small while making product code easier to read and safer for generated code to copy.
Tabs, Accordion, Button, and Text.