import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
import { Box, Tooltip, Typography } from '@mui/material';
import PropTypes from 'prop-types';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
function Warning({
  errors,
  storeList,
  ...props
}) {
  const {
    t
  } = useLocaleContext();
  return /*#__PURE__*/_jsxs(Box, {
    ...props,
    sx: [{
      color: 'warning.main',
      fontSize: '14px',
      border: '1px solid rgba(214, 164, 64, 0.34)',
      borderRadius: '4px',
      py: 2,
      px: 1.5,
      position: 'relative'
    },
    // eslint-disable-next-line react/prop-types
    ...(Array.isArray(props.sx) ? props.sx : [props.sx])],
    children: [/*#__PURE__*/_jsx(Typography, {
      variant: "caption",
      sx: {
        fontWeight: 'bold',
        position: 'absolute',
        top: -10,
        left: 12,
        backgroundColor: 'white',
        px: 1,
        width: 'fit-content'
      },
      children: t('blocklet.publish.storeRule.warning')
    }), errors && Object.entries(errors).map(([url, error]) => {
      const list = Object.values(error);
      const storeInfo = storeList.find(x => x.url === url);
      return list.length > 0 && /*#__PURE__*/_jsxs(Box, {
        children: [/*#__PURE__*/_jsx(Tooltip, {
          title: url,
          children: /*#__PURE__*/_jsx(Box, {
            component: "span",
            sx: {
              cursor: 'pointer'
            },
            children: storeInfo.name
          })
        }), list.map(item => /*#__PURE__*/_jsx(Box, {
          component: "li",
          sx: {
            ml: 2,
            wordBreak: true
          },
          children: item
        }, item))]
      }, url);
    })]
  });
}
Warning.propTypes = {
  errors: PropTypes.object.isRequired,
  storeList: PropTypes.array.isRequired
};
export default Warning;