...

A split button groups actions together in a Drop-down Menu, with one primary action and a set of related actions.

Image RemovedImage Added

Usage & Behavior

...

• The primary action should also be shown in the action menu.

• The button has 2 modes of operations:

  • Persistent split button - the default action is kept until the user makes a different selection, which then becomes the default.

  • Fixed split button - the primary action is kept as the default, even when the user selects another option.

• The action menu closes when the user makes a selection.

States

	Regular	Image Removed Enter
Regular	Image Added	Image Added
Hover	Image AddedImage Added
Active	Image Added	Image Added
Disabled		ErrorImage Added	Image Removed
Warning	Image Removed	FocusedFocused	Image Added
Focused, Hover	Image AddedImage Added
Focused, Active	Image AddedImage Added
Focused, Disabled	Image Added

Interaction

• Clicking the left-hand action area triggers the primary action.

• Clicking the right-hand drop-down arrow opens an action menu of alternative actions.

• Clicking an action in the Action Menu triggers the related action.

...