@limetech/lime-elements
Version:
51 lines (50 loc) • 1.59 kB
JavaScript
import React from 'react';
import { isObjectType } from '../schema';
import { CollapsibleItemTemplate } from './array-field-collapsible-item';
import { SimpleItemTemplate } from './array-field-simple-item';
import { renderDescription, renderTitle } from './common';
export class ArrayFieldTemplate extends React.Component {
constructor(props) {
super(props);
this.props = props;
this.renderItem = this.renderItem.bind(this);
this.handleAddClick = this.handleAddClick.bind(this);
}
render() {
return React.createElement('div', {}, renderTitle(this.props.title), renderDescription(this.props.schema.description), this.props.items.map(this.renderItem), this.renderAddButton());
}
renderAddButton() {
if (!this.props.canAdd) {
return;
}
return React.createElement('limel-button', {
label: this.props.title || 'Add',
onClick: this.handleAddClick,
icon: 'plus_math',
class: 'button-add-new',
});
}
renderItem(item, index) {
const { schema, formData, formContext } = this.props;
if (isObjectType(schema.items)) {
return React.createElement(CollapsibleItemTemplate, {
key: item.key,
item: item,
data: formData[index],
schema: schema,
formSchema: formContext.schema,
index: index,
});
}
return React.createElement(SimpleItemTemplate, {
key: item.key,
item: item,
index: index,
});
}
handleAddClick(event) {
event.stopPropagation();
this.props.onAddClick(event);
}
}
//# sourceMappingURL=array-field.js.map