import Fields from '../Fields';
|
|
const GroupField = ({ field, value, onChange }) => {
|
const groupValue = value || {};
|
|
const setSubField = (name, subValue) => {
|
onChange({ ...groupValue, [name]: subValue });
|
};
|
|
return (
|
<div className="jvb-group-field" id={field.name}>
|
{ field.label && (
|
<h4 className="components-base-control__label">{ field.label }</h4>
|
) }
|
{
|
Object.entries(field.fields || {}).map(([name, subfield]) => (
|
<Fields
|
key={name}
|
field={{ ...subfield, name }}
|
value={groupValue[name]}
|
onChange={(v) => setSubField(name, v)}
|
meta={groupValue}
|
/>
|
))
|
}
|
{ field.description && <p className="hint">{field.description}</p> }
|
</div>
|
);
|
};
|
|
export default GroupField;
|