@rjsf/mui/lib/ErrorList/ErrorList.js

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

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import ErrorIcon from '@mui/icons-material/Error';
import Box from '@mui/material/Box';
import List from '@mui/material/List';
import ListItem from '@mui/material/ListItem';
import ListItemIcon from '@mui/material/ListItemIcon';
import ListItemText from '@mui/material/ListItemText';
import Paper from '@mui/material/Paper';
import Typography from '@mui/material/Typography';
import { TranslatableString, getUiOptions, } from '@rjsf/utils';
import { computeSxProps, getMuiProps } from '../util.js';
/** The `ErrorList` component is the template that renders the all the errors associated with the fields in the `Form`
 *
 * @param props - The `ErrorListProps` for this component
 */
export default function ErrorList({ errors, registry, uiSchema, }) {
    const { translateString } = registry;
    const uiOptions = getUiOptions(uiSchema);
    const { rjsfSlotProps: { errorPaper, errorBox, errorTypography, errorList, errorListItem, errorListItemIcon, errorListItemText, } = {}, } = getMuiProps(uiOptions);
    return (_jsx(Paper, { elevation: 2, ...errorPaper, children: _jsxs(Box, { ...errorBox, sx: computeSxProps({ mb: 2, p: 2 }, errorBox), children: [_jsx(Typography, { variant: 'h6', ...errorTypography, children: translateString(TranslatableString.ErrorsLabel) }), _jsx(List, { dense: true, ...errorList, children: errors.map((error, i) => {
                        return (_jsxs(ListItem, { ...errorListItem, children: [_jsx(ListItemIcon, { ...errorListItemIcon, children: _jsx(ErrorIcon, { color: 'error' }) }), _jsx(ListItemText, { primary: error.stack, ...errorListItemText })] }, i));
                    }) })] }) }));
}
//# sourceMappingURL=ErrorList.js.map