import Box from '@mui/material/Box';
import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
import { TableFilterList } from '@arcblock/ux/lib/Datatable';
import PropTypes from 'prop-types';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
CustomFilterList.propTypes = {
  itemComponent: PropTypes.elementType.isRequired
};
export default function CustomFilterList({
  itemComponent,
  ...rest
}) {
  const {
    t
  } = useLocaleContext();
  // eslint-disable-next-line react/prop-types
  const hasFilter = !!rest?.filterList?.filter(e => e.length).length;
  if (!hasFilter) return null;
  return /*#__PURE__*/_jsxs(Box, {
    sx: {
      display: 'flex',
      gap: 1,
      alignItems: 'center'
    },
    children: [/*#__PURE__*/_jsx("div", {
      className: "toolbar-filter-title",
      children: t('notification.filter')
    }), /*#__PURE__*/_jsx("div", {
      className: "toolbar-filter-content",
      children: /*#__PURE__*/_jsx(TableFilterList, {
        ...rest,
        ItemComponent: itemComponent
      })
    })]
  });
}