Options

NameTypeRequired
namestring
labelstring
helperTextstring
descriptionstring
isDisabledboolean
isReadOnlyboolean

This a custom component with a custom design.

Dual list select is wrapped in a form group, so it accepts all form group props.

PropsTypeDefaultDescription
optionsarray[][{label, value, ...props}] see below
leftTitleString'Options'Title for options
rightTitleString'Selected'Title for selected items
moveLeftTitleString'Move selected to left'Tooltip for move to left button
moveRightTitleString'Move selected to right'Tooltip for move to right button
moveAllLeftTitleString'Move all to left'Tooltip for move all to left button
moveAllRightTitleString'Move all to right'Tooltip for move all to right button
allToLeftBooleantrueHides all to left button
allToRightBooleantrueHides all to right button
noValueTitleString'No selected'Placeholder for empty value
noOptionsTitleString'No available options'Placeholder for empty options
filterOptionsTitleString'Filter options'Placeholder for options filter input
filterValueTitleString'Filter selected value'Placeholder for value filter input
filterValueTextString'Remove your filter to see all selected'Placeholder for value when there is no filtered value
filterOptionsTextString'Remove your filter to see all options'Placeholder for options when there is no filtered option
checkboxVariantboolfalseChange list item to checkboxes
PropsTypeDescription
valuestringValue of the option
labelnodeListItemText primary text
iconelementIcon for the ListItemIcon
isCheckboxboolCheckbox variant
secondaryActionselementChildren of secondaryActions component
ListItemPropsobjectProps passed to ListItem
ListItemIconPropsobjectProps passed to ListItemIcon
ListItemTextPropsobjectProps passed to ListItemText
ListItemSecondaryActionPropsobjectProps passed to ListItemSecondaryAction

MUI DualListSelect provides fully customization. When the props offers Right/Left variant, you can pass props to RightXXX or to LeftXXX props. Example: ListGridProps is Right/Left, so there are two more props: RightListGridProps and LeftListGridProps. These props overrides the standard props, except className, that are being combined. All these props are objects.

PropsRight/Left variant
FormFieldGridProps
InternalGridProps
ListGridPropsyes
ListPropsyes
ButtonsGridProps
ButtonsInternalGridProps
ButtonGridProps
ToRightGridProps
IconButtonProps
ToRightIconButtonProps
IconProps
AllToLeftIconProps
AllToRightGridProps
AllToRightIconButtonProps
AllToLeftGridProps
AllToLeftIconButtonProps
ToLeftGridProps
ToLeftIconProps
ToLeftIconButtonProps
ListItemPropsyes
ListItemIconPropsyes
ListItemTextPropsyes
ListItemSecondaryActionPropsyes
FormControlProps
FormLabelProps
FormHelperTextProps
TitlePropsyes
ToolbarPropsyes
FilterFieldPropsyes
SortIconButtonPropsyes
SortIconPropsyes