@aokiapp/rjsf-mantine-theme
Version:
Mantine theme, fields and widgets for react-jsonschema-form
24 lines • 1.98 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Fieldset, Group, Box } from '@mantine/core';
import { canExpand, getTemplate, getUiOptions, titleId, } from '@rjsf/utils';
import { useFieldContext } from './FieldTemplate';
/** The `ObjectFieldTemplate` is the template to use to render all the inner properties of an object along with the
* title and description if available. If the object is expandable, then an `AddButton` is also rendered after all
* the properties.
*
* @param props - The `ObjectFieldTemplateProps` for this component
*/
export default function ObjectFieldTemplate(props) {
const { disabled, formData, idSchema, onAddClick, properties, readonly, registry, required, schema, title, uiSchema, } = props;
const { description } = useFieldContext();
const options = getUiOptions(uiSchema);
const TitleFieldTemplate = getTemplate('TitleFieldTemplate', registry, options);
// Button templates are not overridden in the uiSchema
const { ButtonTemplates: { AddButton }, } = registry.templates;
const classNames = options.classNames;
const legendNode = (_jsxs(Group, { gap: 'xs', className: 'armt-template-objectfield-legend', children: [title && (_jsx(TitleFieldTemplate, { id: titleId(idSchema), title: title, required: required, schema: schema, uiSchema: uiSchema, registry: registry })), description] }));
return (_jsxs(Fieldset, { id: idSchema.$id, legend: legendNode, style: {
width: '100%',
}, className: `armt-template-objectfield ${classNames !== null && classNames !== void 0 ? classNames : ''}`, children: [_jsx(Box, { className: 'armt-template-objectfield-item', children: properties.map((prop) => prop.content) }), canExpand(schema, uiSchema, formData) && (_jsx(AddButton, { className: 'object-property-expand', onClick: onAddClick(schema), disabled: disabled || readonly, uiSchema: uiSchema, registry: registry }))] }));
}
//# sourceMappingURL=ObjectFieldTemplate.js.map