rjsf-antd/lib/ArrayFieldTemplate/ArrayFieldTemplate.js

Ant Design theme, fields and widgets for react-jsonschema-form

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importDefault(require("react"));
var utils_1 = require("react-jsonschema-form/lib/utils");
var AddButton_1 = tslib_1.__importDefault(require("../AddButton/AddButton"));
var IconButton_1 = tslib_1.__importDefault(require("../IconButton/IconButton"));
var ArrayFieldTemplate = function (props) {
    var schema = props.schema, _a = props.registry, registry = _a === void 0 ? utils_1.getDefaultRegistry() : _a;
    if (utils_1.isMultiSelect(schema, registry.definitions)) {
        return react_1.default.createElement(DefaultFixedArrayFieldTemplate, tslib_1.__assign({}, props));
    }
    return react_1.default.createElement(DefaultNormalArrayFieldTemplate, tslib_1.__assign({}, props));
};
var ArrayFieldTitle = function (props) {
    var TitleField = props.TitleField, idSchema = props.idSchema, title = props.title, required = props.required;
    if (!title) {
        return react_1.default.createElement("div", null);
    }
    var id = idSchema.$id + "__title";
    return react_1.default.createElement(TitleField, { id: id, title: title, required: required });
};
var ArrayFieldDescription = function (props) {
    var DescriptionField = props.DescriptionField, idSchema = props.idSchema, description = props.description;
    if (!description) {
        return react_1.default.createElement("div", null);
    }
    var id = idSchema.$id + "__description";
    return react_1.default.createElement(DescriptionField, { id: id, description: description });
};
// Used in the two templates
var DefaultArrayItem = function (props) {
    var btnStyle = {
        flex: 1,
        paddingLeft: 6,
        paddingRight: 6,
        fontWeight: 'bold'
    };
    var index = props.index, children = props.children, hasMoveUp = props.hasMoveUp, hasMoveDown = props.hasMoveDown, disabled = props.disabled, readonly = props.readonly, onDropIndexClick = props.onDropIndexClick, hasToolbar = props.hasToolbar, onReorderClick = props.onReorderClick, hasRemove = props.hasRemove;
    return (react_1.default.createElement("div", { key: index },
        react_1.default.createElement("div", null, children),
        hasToolbar && (react_1.default.createElement("div", null,
            (hasMoveUp || hasMoveDown) && (react_1.default.createElement(IconButton_1.default, { icon: "arrow-up", className: "array-item-move-up", tabIndex: -1, style: btnStyle, disabled: disabled || readonly || !hasMoveUp, onClick: onReorderClick(index, index - 1) })),
            (hasMoveUp || hasMoveDown) && (react_1.default.createElement(IconButton_1.default, { icon: "arrow-down", tabIndex: -1, style: btnStyle, disabled: disabled || readonly || !hasMoveDown, onClick: onReorderClick(index, index + 1) })),
            hasRemove && (react_1.default.createElement(IconButton_1.default, { icon: "remove", tabIndex: -1, style: btnStyle, disabled: disabled || readonly, onClick: onDropIndexClick(index) }))))));
};
var DefaultFixedArrayFieldTemplate = function (props) {
    var className = props.className, TitleField = props.TitleField, idSchema = props.idSchema, title = props.title, uiSchema = props.uiSchema, schema = props.schema, items = props.items, canAdd = props.canAdd, required = props.required, onAddClick = props.onAddClick, disabled = props.disabled, readonly = props.readonly;
    return (react_1.default.createElement("fieldset", { className: className },
        react_1.default.createElement(ArrayFieldTitle, { key: "array-field-title-" + idSchema.$id, TitleField: TitleField, idSchema: idSchema, title: uiSchema['ui:title'] || title, required: required }),
        (uiSchema['ui:description'] || schema.description) && (react_1.default.createElement("div", { className: "field-description", key: "field-description-" + idSchema.$id }, uiSchema['ui:description'] || schema.description)),
        react_1.default.createElement("div", { className: "row array-item-list", key: "array-item-list-" + idSchema.$id }, items && items.map(DefaultArrayItem)),
        canAdd && (react_1.default.createElement(AddButton_1.default, { className: "array-item-add", onClick: onAddClick, disabled: disabled || readonly }))));
};
var DefaultNormalArrayFieldTemplate = function (props) {
    var TitleField = props.TitleField, idSchema = props.idSchema, title = props.title, required = props.required, uiSchema = props.uiSchema, schema = props.schema, items = props.items, canAdd = props.canAdd, onAddClick = props.onAddClick, disabled = props.disabled, readonly = props.readonly, DescriptionField = props.DescriptionField;
    return (react_1.default.createElement("div", null,
        react_1.default.createElement(ArrayFieldTitle, { key: "array-field-title-" + props.idSchema.$id, TitleField: TitleField, idSchema: idSchema, title: uiSchema['ui:title'] || title, required: required }),
        (uiSchema['ui:description'] || schema.description) && (react_1.default.createElement(ArrayFieldDescription, { key: "array-field-description-" + idSchema.$id, DescriptionField: DescriptionField, idSchema: idSchema, description: uiSchema['ui:description'] || schema.description })),
        react_1.default.createElement("div", { key: "array-item-list-" + idSchema.$id },
            items && items.map(function (p) { return DefaultArrayItem(p); }),
            canAdd && (react_1.default.createElement("div", null,
                react_1.default.createElement(AddButton_1.default, { className: "array-item-add", onClick: onAddClick, disabled: disabled || readonly }))))));
};
exports.default = ArrayFieldTemplate;
//# sourceMappingURL=ArrayFieldTemplate.js.map