UNPKG

rjsf-antd

Version:

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

64 lines 5.21 kB
import { __assign } from "tslib"; import React from 'react'; import { isMultiSelect, getDefaultRegistry } from 'react-jsonschema-form/lib/utils'; import AddButton from '../AddButton/AddButton'; import IconButton from '../IconButton/IconButton'; var ArrayFieldTemplate = function (props) { var schema = props.schema, _a = props.registry, registry = _a === void 0 ? getDefaultRegistry() : _a; if (isMultiSelect(schema, registry.definitions)) { return React.createElement(DefaultFixedArrayFieldTemplate, __assign({}, props)); } return React.createElement(DefaultNormalArrayFieldTemplate, __assign({}, props)); }; var ArrayFieldTitle = function (props) { var TitleField = props.TitleField, idSchema = props.idSchema, title = props.title, required = props.required; if (!title) { return React.createElement("div", null); } var id = idSchema.$id + "__title"; return React.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.createElement("div", null); } var id = idSchema.$id + "__description"; return React.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.createElement("div", { key: index }, React.createElement("div", null, children), hasToolbar && (React.createElement("div", null, (hasMoveUp || hasMoveDown) && (React.createElement(IconButton, { icon: "arrow-up", className: "array-item-move-up", tabIndex: -1, style: btnStyle, disabled: disabled || readonly || !hasMoveUp, onClick: onReorderClick(index, index - 1) })), (hasMoveUp || hasMoveDown) && (React.createElement(IconButton, { icon: "arrow-down", tabIndex: -1, style: btnStyle, disabled: disabled || readonly || !hasMoveDown, onClick: onReorderClick(index, index + 1) })), hasRemove && (React.createElement(IconButton, { 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.createElement("fieldset", { className: className }, React.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.createElement("div", { className: "field-description", key: "field-description-" + idSchema.$id }, uiSchema['ui:description'] || schema.description)), React.createElement("div", { className: "row array-item-list", key: "array-item-list-" + idSchema.$id }, items && items.map(DefaultArrayItem)), canAdd && (React.createElement(AddButton, { 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.createElement("div", null, React.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.createElement(ArrayFieldDescription, { key: "array-field-description-" + idSchema.$id, DescriptionField: DescriptionField, idSchema: idSchema, description: uiSchema['ui:description'] || schema.description })), React.createElement("div", { key: "array-item-list-" + idSchema.$id }, items && items.map(function (p) { return DefaultArrayItem(p); }), canAdd && (React.createElement("div", null, React.createElement(AddButton, { className: "array-item-add", onClick: onAddClick, disabled: disabled || readonly })))))); }; export default ArrayFieldTemplate; //# sourceMappingURL=ArrayFieldTemplate.js.map