import Box from '@mui/material/Box';
import Typography from '@mui/material/Typography';
import Chip from '@mui/material/Chip';
import PropTypes from 'prop-types';
import NotificationSeverity from '../severity';
import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
SeverityFilterRender.propTypes = {
  list: PropTypes.array.isRequired,
  label: PropTypes.string.isRequired,
  onDelete: PropTypes.func
};
export default function SeverityFilterRender({
  list,
  label,
  onDelete = () => {}
}) {
  return /*#__PURE__*/_jsxs(Box, {
    sx: {
      display: 'flex',
      gap: 1,
      alignItems: 'center'
    },
    children: [/*#__PURE__*/_jsxs(Typography, {
      children: [label, ": "]
    }), list.map(severity => {
      return /*#__PURE__*/_jsx(Chip, {
        size: "small",
        label: /*#__PURE__*/_jsx(Box, {
          sx: {
            display: 'flex',
            alignItems: 'center',
            gap: '4px'
          },
          children: /*#__PURE__*/_jsx(NotificationSeverity, {
            severity: severity
          })
        }),
        onDelete: e => onDelete(e, severity)
      }, severity);
    })]
  });
}