AlertModal

AlertModal is an informational modal component. It has no confirm/cancel buttons; it displays a message and calls on_close when one of the configured close keys is pressed. While the modal is open, the internal input layer cuts off lower handlers, so background lists and page shortcuts do not process the same event.

This recording is generated by docs/tapes/alert-modal.tape. The example first moves the background list to Docs preview, then opens an alert. While the alert is open, pressing j once does not move the background selection further. It then closes the alert with Enter and with Esc.

Run

cargo run --example alert_modal

In the background state, press j/k to move and a to open the alert. Inside the alert, press Enter or Esc to close, and q to quit.

Minimal form

examples/components/alert_modal.rs

AlertModal(
    open: alert_open.get(),
    title: Line::from("Workspace is current"),
    message: format!("{selected_label} is already synchronized."),
    on_close: move |_: ()| {
        status.set(format!("closed alert for {selected_label}"));
        alert_open.set(false);
    },
)

Like the other built-in modals, AlertModal is controlled: open decides whether it is shown, and on_close only tells business code that the user triggered close. Business code decides whether to actually close by updating the open state in the callback.

Close keys

The default close keys are Esc and Enter:

AlertModal(
    close_keys: vec![KeyCode::Esc, KeyCode::Enter],
    close_hint: Line::from("Enter / Esc").centered(),
)

If your flow wants to close alerts with Space, q, or a custom key, replace close_keys. The hint text is not generated automatically from close_keys; pass close_hint yourself so UI copy stays consistent with product language.

Input exclusivity

AlertModal uses the same layer pairing as ConfirmModal:

let layer = hooks.use_input_layer(open, true);

hooks.use_event_handler(EventScope::Layer(layer), EventPriority::High, move |event| {
    if close_keys.contains(&key.code) {
        on_close(());
    }
    EventResult::Consumed
});

Modal(open: open, layer: Some(layer)) {
    // alert content
}

Notice the final EventResult::Consumed: even when a key is not a close key, the alert consumes it. That is why pressing j/k/q while an alert is open does not move or quit the background. The j in the recording follows this path.

Size and style

AlertModal directly exposes the low-level Modal size, mask, and content styles:

AlertModal(
    width: Constraint::Length(76),
    height: Constraint::Length(8),
    style: Style::new().dim(),
    border_style: Style::new().yellow(),
    title_style: Style::new().yellow().bold(),
    message_style: Style::new(),
    padding: Padding::new(2, 2, 1, 1),
)

Message content is centered and wrapped. Short messages fit fixed width well; for longer information, increase height or compose the low-level Modal with ScrollView.

Use ConfirmModal when the user needs to choose. For grouped shortcut help, see ShortcutInfoModal.