@lonli-lokli/dynamic-forms-mui/lib/ArrayFieldItemTemplate/ArrayFieldItemTemplate.js

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

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import Box from '@mui/material/Box/index.js';
import Grid2 from '@mui/material/Grid2/index.js';
import Paper from '@mui/material/Paper/index.js';
import { getUiOptions, getTemplate, } from '@lonli-lokli/dynamic-forms-utils';
/** The `ArrayFieldItemTemplate` component is the template used to render an items of an array.
 *
 * @param props - The `ArrayFieldItemTemplateType` props for the component
 */
export default function ArrayFieldItemTemplate(props) {
    const { children, buttonsProps, hasToolbar, uiSchema, registry } = props;
    const uiOptions = getUiOptions(uiSchema);
    const ArrayFieldItemButtonsTemplate = getTemplate('ArrayFieldItemButtonsTemplate', registry, uiOptions);
    const btnStyle = {
        flex: 1,
        paddingLeft: 6,
        paddingRight: 6,
        fontWeight: 'bold',
        minWidth: 0,
    };
    return (_jsxs(Grid2, { container: true, alignItems: 'center', children: [_jsx(Grid2, { size: 'auto', style: { overflow: 'auto' }, children: _jsx(Box, { mb: 2, children: _jsx(Paper, { elevation: 2, children: _jsx(Box, { p: 2, children: children }) }) }) }), hasToolbar && (_jsx(Grid2, { children: _jsx(ArrayFieldItemButtonsTemplate, { ...buttonsProps, style: btnStyle }) }))] }));
}
//# sourceMappingURL=ArrayFieldItemTemplate.js.map