UNPKG

@rjsf/mui

Version:

Material UI 5 theme, fields and widgets for react-jsonschema-form

21 lines 1.98 kB
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; import Box from '@mui/material/Box/index.js'; import Grid from '@mui/material/Grid/index.js'; import Paper from '@mui/material/Paper/index.js'; import { getTemplate, getUiOptions, } from '@rjsf/utils'; /** The `ArrayFieldTemplate` component is the template used to render all items in an array. * * @param props - The `ArrayFieldTemplateItemType` props for the component */ export default function ArrayFieldTemplate(props) { const { canAdd, disabled, idSchema, uiSchema, items, onAddClick, readonly, registry, required, schema, title } = props; const uiOptions = getUiOptions(uiSchema); const ArrayFieldDescriptionTemplate = getTemplate('ArrayFieldDescriptionTemplate', registry, uiOptions); const ArrayFieldItemTemplate = getTemplate('ArrayFieldItemTemplate', registry, uiOptions); const ArrayFieldTitleTemplate = getTemplate('ArrayFieldTitleTemplate', registry, uiOptions); // Button templates are not overridden in the uiSchema const { ButtonTemplates: { AddButton }, } = registry.templates; return (_jsx(Paper, { elevation: 2, children: _jsxs(Box, { p: 2, children: [_jsx(ArrayFieldTitleTemplate, { idSchema: idSchema, title: uiOptions.title || title, schema: schema, uiSchema: uiSchema, required: required, registry: registry }), _jsx(ArrayFieldDescriptionTemplate, { idSchema: idSchema, description: uiOptions.description || schema.description, schema: schema, uiSchema: uiSchema, registry: registry }), items && items.map(({ key, ...itemProps }) => (_jsx(ArrayFieldItemTemplate, { ...itemProps }, key))), canAdd && (_jsx(Grid, { container: true, justifyContent: 'flex-end', children: _jsx(Grid, { item: true, children: _jsx(Box, { mt: 2, children: _jsx(AddButton, { className: 'array-item-add', onClick: onAddClick, disabled: disabled || readonly, uiSchema: uiSchema, registry: registry }) }) }) }))] }) })); } //# sourceMappingURL=ArrayFieldTemplate.js.map