Component SplitButton

SplitButton

A primary action + dropdown options.

SplitButton combines:

• A primary button that runs your main action
• An optional dropdown menu for alternative actions

Example

use gpui::ElementId;
use yororen_ui::component::{split_button, SplitButtonAction};

let view = split_button()
    .key(("actions", "export"))
    .label("Export")
    .option("png", "Export PNG")
    .option("pdf", "Export PDF")
    .on_primary(|_ev, _window, _cx| {
        // ...
    })
    .on_action(|action, _ev, _window, _cx| {
        match action {
            SplitButtonAction::Primary => {}
            SplitButtonAction::Option(id) => {
                // ...
            }
        }
    });

When to use

• Actions that have a sensible default but also offer variants (export, run, open-with)

API

• split_button(): constructor
• id(...) / key(...): stable identity
• label("..."): primary button label
• option(id, label) / options([...]): add dropdown options
• disabled(bool)
• on_primary(|ev, window, cx| ...): primary click handler
• on_action(|SplitButtonAction, ev, window, cx| ...): unified handler for both primary and options
• Styling: bg/hover_bg/menu_width

Interaction and behavior

• Menu open state is internal (keyed by the element id).
• Clicking outside closes the menu.

Defaults

• Primary button height: 36px
• Menu open state is keyed by the element id; use key(...) in repeated UIs.

Tips

• Use on_action if you want a single handler for both primary and menu options.