Function tabs 

pub fn tabs() -> TabsBuilder

tabs

Renders a Material tab row.

Usage

Show a row of related destinations and render the selected page outside the tab row.

Parameters

• modifier — modifier chain applied to the tabs subtree.
• variant — visual variant of the tab row.
• activation_mode — manual activation by default, or selection with arrows.
• selected — caller-owned state holding the active tab index. When omitted, the row keeps an internal selection slot and drive is not observable to the caller.
• indicator_color — optional override for the active indicator color.
• container_color — optional override for the tab row background color.
• active_content_color — optional override for active tab content color.
• inactive_content_color — optional override for inactive tab content color.
• indicator_height — optional override for the indicator height.
• indicator_min_width — optional override for the minimum indicator width.
• indicator_max_width — optional override for the maximum indicator width.
• min_tab_height — optional override for the minimum tab height.
• tab_padding — optional override for the per-tab horizontal padding.
• enabled — whether the tab row is interactive.
• disabled_content_color — optional override for disabled tab content color.
• divider_color — optional override for the divider color.
• scrollable — use content widths and horizontal scrolling; narrow fixed rows also scroll when equal tabs cannot retain 48dp targets.
• edge_padding — optional override for scrollable edge padding.
• min_scrollable_tab_width — optional override for minimum scrollable tab width.
• content — tab declarations rendered inside the tab row.

Examples

use tessera_components::{
    tabs::{tab, tabs},
    text::text,
};
use tessera_ui::{remember, tessera};

#[tessera]
fn demo() {
    let selected = remember(|| 1usize);
    let active_tab = selected.get();

    tabs().selected(selected).content(move |row| {
        tab(row)
            .label("Flights")
            .selected(selected.get() == 0)
            .on_click(move || selected.set(0));
        tab(row)
            .label("Hotel")
            .selected(selected.get() == 1)
            .on_click(move || selected.set(1));
    });

    if active_tab == 0 {
        text("Content for Flights");
    } else {
        text("Content for Hotel");
    }
}