Split Button

View sourcecomponents/split_button.go

Save and more actions#

The left target performs the primary action; the right target toggles the caller-owned menu state.

Enable JavaScript to run the preview. Go source and install commands remain available.

result := components.BeginSplitButton(canvas, theme, bounds, components.SplitButtonOptions{
    PrimaryID: save, MenuID: more, Label: "Save",
    Variant: components.ButtonOutline, Open: open,
}).Paint()
primary, menu := result.Clicked()

Installation

Copy the recipe into your own project.

go run ./cmd/viva add --out ./components/local split-button

Two independent actions#

SplitButton paints a joined primary action and menu trigger while declaring separate stable IDs. Call Clicked after Paint to route either action.

The primary and menu halves have independent hover, focus, pressed and disabled semantics.
Open is caller-owned and is exposed as expanded state on the menu trigger.
Use SplitButton when the menu selects a variation of one primary outcome.

Keyboard and accessibility#

Tab reaches each non-disabled half separately; Enter and Space activate the focused half through the same hit path as a pointer.

A menu-only trigger without visible text must set MenuLabel.
Disabled controls remain visible and expose disabled semantics.
The application owns menu contents, dismissal and focus restoration.

Keyboard

Use Tab to move between controls and Ctrl/⌘ K to search the catalog. Inside a preview, the Go runtime handles keyboard input.