1
1
import React from 'react' ;
2
2
import PropTypes from 'prop-types' ;
3
+ import clsx from 'clsx' ;
4
+
3
5
import { useFieldApi , useFormApi , FieldArray as FieldArrayFF } from '@data-driven-forms/react-form-renderer' ;
4
6
5
7
import { Button , FormGroup } from 'carbon-components-react' ;
@@ -26,8 +28,8 @@ const ArrayItem = ({ remove, fields, name, removeText, buttonDisabled, RemoveBut
26
28
id = { `remove-${ name } ` }
27
29
kind = "danger"
28
30
onClick = { remove }
29
- className = { 'ddorg__carbon-field-array-remove' }
30
31
{ ...RemoveButtonProps }
32
+ className = { clsx ( 'ddorg__carbon-field-array-remove' , RemoveButtonProps . className ) }
31
33
>
32
34
{ removeText }
33
35
</ Button >
@@ -84,8 +86,8 @@ const FieldArray = (props) => {
84
86
invalid = { Boolean ( invalid ) }
85
87
message = { Boolean ( invalid ) }
86
88
messageText = { invalid || '' }
87
- className = { 'ddorg__carbon-field-array-form-group' }
88
89
{ ...FormGroupProps }
90
+ className = { clsx ( 'ddorg__carbon-field-array-form-group' , FormGroupProps . className ) }
89
91
>
90
92
< FieldArrayFF name = { input . name } validate = { arrayValidator } >
91
93
{ ( fieldArrayProps ) => (
@@ -103,14 +105,14 @@ const FieldArray = (props) => {
103
105
RemoveButtonProps = { RemoveButtonProps }
104
106
/>
105
107
) ) }
106
- < div className = { 'ddorg__carbon-field-array-add-container' } { ... AddContainerProps } >
108
+ < div { ... AddContainerProps } className = { clsx ( 'ddorg__carbon-field-array-add-container' , AddContainerProps . className ) } >
107
109
< Button
108
110
disabled = { fieldArrayProps . fields . length >= maxItems }
109
111
renderIcon = { AddAlt32 }
110
112
id = { `add-${ input . name } ` }
111
113
onClick = { ( ) => fieldArrayProps . fields . push ( defaultItem ) }
112
- className = { 'ddorg__carbon-field-array-add' }
113
114
{ ...AddButtonProps }
115
+ className = { clsx ( 'ddorg__carbon-field-array-add' , AddButtonProps . className ) }
114
116
>
115
117
{ buttonLabelsFinal . add }
116
118
</ Button >
0 commit comments