Action list

Examples

Action list single group


With kebab

Action list with icons

With list icons wrapper


With group icons wrapper

Action list multiple groups

Action list with cancel button

In modals, forms, data lists

In wizards

Props

ActionList

*required
NameTypeDefaultDescription
childrenReact.ReactNodeChildren of the action list
classNamestringAdditional classes added to the action list
isIconListbooleanFlag indicating the action list contains multiple icons and item padding should be removed

ActionListGroup

*required
NameTypeDefaultDescription
childrenReact.ReactNodeChildren of the action list group
classNamestringAdditional classes added to the action list group
isIconGroupbooleanFlag indicating the action list group contains multiple icons and item padding should be removed

ActionListItem

*required
NameTypeDefaultDescription
childrenReact.ReactNodeChildren of the action list item
classNamestringAdditional classes added to the action list item

CSS variables

Expand or collapse columnSelectorVariableValue
.pf-v6-c-action-list--pf-v6-c-action-list--RowGap
0.5rem
.pf-v6-c-action-list--pf-v6-c-action-list--ColumnGap
3rem
.pf-v6-c-action-list--pf-v6-c-action-list__group--ColumnGap
1rem
.pf-v6-c-action-list--pf-v6-c-action-list--m-icons--ColumnGap
0.25rem
.pf-v6-c-action-list.pf-m-icons--pf-v6-c-action-list__group--ColumnGap
0.25rem