Skip to main content

Component

Trait Component 

Source
pub trait Component: Sized {
    type State;
    type Message;
    type Output;

    // Required methods
    fn init() -> Self::State;
    fn update(
        state: &mut Self::State,
        msg: Self::Message,
    ) -> Option<Self::Output>;
    fn view(state: &Self::State, ctx: &mut RenderContext<'_, '_>);

    // Provided methods
    fn traced_view(state: &Self::State, ctx: &mut RenderContext<'_, '_>) { ... }
    fn handle_event(
        state: &Self::State,
        event: &Event,
        ctx: &EventContext,
    ) -> Option<Self::Message> { ... }
    fn dispatch_event(
        state: &mut Self::State,
        event: &Event,
        ctx: &EventContext,
    ) -> Option<Self::Output> { ... }
}
Expand description

A composable UI component with its own state and message handling.

Components are the building blocks of complex TUI applications. Each component manages its own state, handles its own messages, and renders to a specific area of the screen.

§Associated Types

  • State: The component’s internal state. Derive Clone if you need snapshots.
  • Message: Messages the component can receive from its parent or from user interaction.
  • Output: Messages the component emits to communicate with its parent. Use () if the component doesn’t need to communicate outward.

§Design Pattern

Components follow the same TEA pattern as App, but at a smaller scale:

  1. Parent sends Message to component
  2. Component updates its State
  3. Component optionally emits Output to parent
  4. Component renders itself to its designated area

Required Associated Types§

Source

type State

The component’s internal state type.

This should contain all data needed to render the component. Deriving Clone is recommended but not required.

Source

type Message

Messages this component can receive.

These typically come from user input or parent components.

Source

type Output

Messages this component can emit to its parent.

Use () if the component doesn’t need to communicate upward. This enables child-to-parent communication without tight coupling.

Required Methods§

Source

fn init() -> Self::State

Initialize the component state.

Returns the initial state for this component.

Source

fn update(state: &mut Self::State, msg: Self::Message) -> Option<Self::Output>

Update component state based on a message.

Returns an optional output message for the parent to handle. Return None if no parent notification is needed.

Source

fn view(state: &Self::State, ctx: &mut RenderContext<'_, '_>)

Render the component to the given area.

Unlike App::view which renders to the full frame, components render to a specific area carried by the RenderContext. The context bundles the frame, render area, theme, and focus/disabled state.

Provided Methods§

Source

fn traced_view(state: &Self::State, ctx: &mut RenderContext<'_, '_>)

Renders the component with optional tracing instrumentation.

When the tracing feature is enabled, this emits a trace-level span around the view call with the component type name and render area dimensions. When the feature is disabled, this is identical to calling view directly.

Source

fn handle_event( state: &Self::State, event: &Event, ctx: &EventContext, ) -> Option<Self::Message>

Maps an input event to a component message.

This is the read-only half of event handling. It inspects the component’s state, the incoming event, and the EventContext (which carries focused/disabled state from the parent), and returns an appropriate message if the event is relevant.

Components should check ctx.focused and ctx.disabled to decide whether to process the event. The same focus/disabled state should be passed to both handle_event and view (via the RenderContext) so that visual state and event routing are always consistent.

The default implementation returns None (ignores all events).

Source

fn dispatch_event( state: &mut Self::State, event: &Event, ctx: &EventContext, ) -> Option<Self::Output>

Dispatches an event by mapping it to a message and updating state.

This combines handle_event and update into a single call. If the event produces a message, the message is passed to update and the output is returned.

This is the primary method users should call for event routing.

Dyn Compatibility§

This trait is not dyn compatible.

In older versions of Rust, dyn compatibility was called "object safety", so this trait is not object safe.

Implementors§

Source§

impl Component for CodeBlock

Source§

impl Component for CommandPalette

Source§

impl Component for ConfirmDialog

Source§

impl Component for Diagram

Source§

impl Component for DiffViewer

Source§

impl Component for FileBrowser

Source§

impl Component for LineInput

Source§

impl Component for MarkdownRenderer

Source§

impl Component for PaneLayout

Source§

impl Component for ProgressBar

Source§

impl Component for StepIndicator

Source§

impl Component for Accordion

Source§

impl Component for AlertPanel

Source§

impl Component for BigText

Source§

impl Component for BoxPlot

Source§

impl Component for Breadcrumb

Source§

impl Component for Button

Source§

impl Component for Calendar

Source§

impl Component for Canvas

Source§

impl Component for Chart

Source§

impl Component for Checkbox

Source§

impl Component for Collapsible

Source§

impl Component for ConversationView

Source§

impl Component for Dialog

Source§

impl Component for Divider

Source§

impl Component for Dropdown

Source§

impl Component for EventStream

Source§

impl Component for FlameGraph

Source§

impl Component for Form

Source§

impl Component for Gauge

Source§

impl Component for Heatmap

Source§

impl Component for HelpPanel

Source§

impl Component for Histogram

Source§

impl Component for InputField

Source§

impl Component for KeyHints

Source§

impl Component for LogCorrelation

Source§

impl Component for LogViewer

Source§

impl Component for Menu

Source§

impl Component for MetricsDashboard

Source§

impl Component for MultiProgress

Source§

impl Component for NumberInput

Source§

impl Component for Paginator

Source§

impl Component for ScrollView

Source§

impl Component for ScrollableText

Source§

impl Component for Select

Source§

impl Component for Slider

Source§

impl Component for SpanTree

Source§

impl Component for Sparkline

Source§

impl Component for Spinner

Source§

impl Component for SplitPanel

Source§

impl Component for StatusBar

Source§

impl Component for StatusLog

Source§

impl Component for Switch

Source§

impl Component for TabBar

Source§

impl Component for TextArea

Source§

impl Component for Timeline

Source§

impl Component for TitleCard

Source§

impl Component for Toast

Source§

impl Component for Tooltip

Source§

impl Component for UsageDisplay

Source§

impl Component for StyledText

Source§

impl Component for TerminalOutput

Source§

impl Component for Treemap

Source§

impl<S: Clone + PartialEq + Default> Component for Router<S>

Source§

impl<T: Clone + 'static> Component for Tree<T>

Source§

impl<T: Clone + Display + 'static> Component for RadioGroup<T>

Source§

impl<T: Clone + Display + 'static> Component for SearchableList<T>

Source§

impl<T: Clone + Display + 'static> Component for SelectableList<T>

Source§

impl<T: Clone + Display + 'static> Component for Tabs<T>

Source§

impl<T: Clone> Component for LoadingList<T>

Source§

impl<T: TableRow + 'static> Component for DataGrid<T>

Source§

impl<T: TableRow + 'static> Component for Table<T>