Options

NameTypeRequired
namestring
labelstring
descriptionstring

MUI component mapper provides an experimental implementation of field array.

Props

PropTypeDescription
labelnodeLabel of the array.
descriptionnodeDescription of the array.
fieldsarrayA group of fields, which are being added to the array.
defaultItemanyDefault item which is inserted into a newly created fields group. If you have nested names, don't forget you need to insert an object!
minItemsnumberRemove button is disabled, if the length of the array is equal or smaller.
maxItemsnumberAdd button is disabled, if the length of the array is equal or bigger.
noItemsMessagenodeA message which is shown, when there are no items in the array.
buttonLabelsobject{add: 'ADD', remove: 'REMOVE'} sets labels of buttons.

Revert removal

MUI field array allow users to revert latest removal actions.

Fields can contain names, then the value will be handled as array of objects.

const fields = [
{ name: 'name', ... },
{ name: 'lastname', ... }
]
[
{ name: value1.name, lastname: value1.lastname },
{ name: value2.name, lastname: value2.lastname },
...
]

Or you can put a single field with no name. In this case, values are stored as a simple array.

const fields = [
{ component: 'text-field' }
]
[ value1, value2, ... ]

To implement a custom component, please take a look here.