Lumeo

SplitButton

A button split into a main action half and a chevron half that opens a dropdown menu of secondary actions.

When to Use

  • There is one dominant primary action and several less common alternatives (e.g. Save vs. Save and Publish).
  • Reduce button count in toolbars while still exposing all relevant actions.
  • Replace a plain button + separate dropdown when both should share the same visual weight.

API Reference

SplitButton

Property Type Default Description
Text string? null Primary button label text. Ignored when ChildContent is provided.
ChildContent RenderFragment? null Custom primary button label content. Takes precedence over Text.
OnClick EventCallback<MouseEventArgs> Callback invoked when the primary (left) half of the button is clicked.
MenuContent RenderFragment? null The dropdown menu items rendered when the chevron half is clicked. Place DropdownMenuItem elements here.
Variant Button.ButtonVariant Default Visual style applied to both halves. Values: Default, Secondary, Destructive, Outline, Ghost, Link.
Size Button.ButtonSize Default Size applied to both halves. Values: Sm, Default, Lg.
Disabled bool false Disables both halves of the button.
Class string? null Additional CSS classes applied to the wrapper element.
AdditionalAttributes Dictionary<string, object>? null Additional HTML attributes forwarded to the wrapper element.
  • Button — A standard single-action trigger.
  • DropdownButton — A button that opens a dropdown menu without a separate primary action.
  • ButtonGroup — Groups multiple related buttons into a segmented bar.