@rjsf/mui/lib/ObjectFieldTemplate/ObjectFieldTemplate.js

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

import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import Grid from '@mui/material/Grid';
import { canExpand, descriptionId, getTemplate, getUiOptions, titleId, buttonId, } from '@rjsf/utils';
import { computeSxProps, getMuiProps } from '../util.js';
/** 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 { description, title, properties, required, disabled, readonly, uiSchema, fieldPathId, schema, formData, optionalDataControl, onAddProperty, registry, } = props;
    const uiOptions = getUiOptions(uiSchema);
    const TitleFieldTemplate = getTemplate('TitleFieldTemplate', registry, uiOptions);
    const DescriptionFieldTemplate = getTemplate('DescriptionFieldTemplate', registry, uiOptions);
    const showOptionalDataControlInTitle = !readonly && !disabled;
    // Button templates are not overridden in the uiSchema
    const { ButtonTemplates: { AddButton }, } = registry.templates;
    const { rjsfSlotProps: { objectGridContainer, objectGridItem, objectAddButtonGridContainer, objectAddButtonGridItem } = {}, } = getMuiProps(uiOptions);
    return (_jsxs(_Fragment, { children: [title && (_jsx(TitleFieldTemplate, { id: titleId(fieldPathId), title: title, required: required, schema: schema, uiSchema: uiSchema, registry: registry, optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : undefined })), description && (_jsx(DescriptionFieldTemplate, { id: descriptionId(fieldPathId), description: description, schema: schema, uiSchema: uiSchema, registry: registry })), _jsxs(Grid, { container: true, spacing: 2, ...objectGridContainer, sx: computeSxProps({ mt: 1.25 }, objectGridContainer), children: [!showOptionalDataControlInTitle ? optionalDataControl : undefined, properties.map((element, index) => 
                    // Remove the <Grid> if the inner element is hidden as the <Grid>
                    // itself would otherwise still take up space.
                    element.hidden ? (element.content) : (_jsx(Grid, { size: { xs: 12 }, ...objectGridItem, sx: computeSxProps({ mb: 1.25 }, objectGridItem), children: element.content }, index)))] }), canExpand(schema, uiSchema, formData) && (_jsx(Grid, { container: true, ...objectAddButtonGridContainer, sx: computeSxProps({ justifyContent: 'flex-end' }, objectAddButtonGridContainer), children: _jsx(Grid, { ...objectAddButtonGridItem, children: _jsx(AddButton, { id: buttonId(fieldPathId, 'add'), className: 'rjsf-object-property-expand', onClick: onAddProperty, disabled: disabled || readonly, uiSchema: uiSchema, registry: registry }) }) }))] }));
}
//# sourceMappingURL=ObjectFieldTemplate.js.map