A split button with a main action and attached action menu.

Parameters:
NameTypeDescription
propsobject

Component props.

Properties
NameTypeDescription
activeboolean

Whether the main button is active or not.

activeTextstring

The active text when the main button is active.

activeTypestring

The active type, currently supports loader.

ariaLabelstring

The aria-label text for the main button.

childrenJSX.Element | null

React element children for the main button.

circularboolean

Whether the main button is a circular shape or not.

closeOnOptionClickboolean

Whether to close the menu when an option is clicked.

customAttributesobject

Custom attributes for the wrapper.

customClassesstring | Array | object

Custom classes for the wrapper.

disabledboolean

Whether the multi option button is disabled or not.

disableWhileActiveboolean

Whether to disable the main button while active.

dropdownAriaLabelstring

The aria-label text for the dropdown trigger.

dropdownIconstring

Icon name for the dropdown trigger.

dropdownIconPrefixstring

The prefix for the dropdown trigger icon library.

iconAttributesobject

Custom attributes for the main button icon.

iconstring

Icon name if using an icon button.

iconPositionstring

Icon position if using one, leading or trailing.

iconPrefixstring

The prefix for the icon library to be used.

labelstring

The label for the main button.

loaderPropsobject

All valid options for the loader component if loader button is active.

lockSizeboolean

Whether to lock the main button size when transitioning states.

mainButtonAttributesobject

Additional props for the main button.

mainButtonClassesstring | Array | object

Custom classes for the main button.

onClickfunction

On click handler for the main button.

onDropdownClosefunction

Callback fired when the dropdown menu closes.

onDropdownOpenfunction

Callback fired when the dropdown menu opens.

optionsArray

The dropdown action options.

popoverAttributesobject

Additional props for the Popover.

popoverClassesstring | Array | object

Custom classes for the Popover element.

sizestring

Size of the main button and dropdown options.

spacingstring | number | Array | object

The spacing for the wrapper component.

triggerAttributesobject

Additional props for the dropdown trigger.

triggerClassesstring | Array | object

Custom classes for the dropdown trigger.

typestring

The visual type of the main button and dropdown options.

widthstring

The main button width, auto or full.

refobject | null

Ref to the wrapper.

Since
  • 6.6.2
Returns:

The multi option button component.

Type: 
JSX.Element

Methods

(inner) handleWrapperRef(node) → {void}

Assigns the wrapper node to internal and forwarded refs.

Parameters:
NameTypeDescription
nodeHTMLElement | null

The wrapper node.

Since
  • 6.6.2
Returns:
Type: 
void