'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var icons = require('@ant-design/icons');
var styled = require('./styled.js');
var index = require('../Overflow/index.js');
var index$1 = require('../Truncate/index.js');
var antd = require('antd');
var cs = require('classnames');
var React = require('react');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var cs__default = /*#__PURE__*/_interopDefault(cs);
var React__default = /*#__PURE__*/_interopDefault(React);

const ColorBlock = ({ background }) => /* @__PURE__ */ React__default.default.createElement("div", { className: cs__default.default(styled.ColorBlockStyle, "color-block"), style: { background } });
const MetricLegend = (props) => {
  const { deselected, onClick, legends } = props;
  return /* @__PURE__ */ React__default.default.createElement(
    index.ExtraOverflow,
    {
      className: styled.LegendStyle,
      extraEl: (end) => /* @__PURE__ */ React__default.default.createElement(
        antd.Dropdown,
        {
          overlayClassName: styled.ExtraResource,
          overlay: /* @__PURE__ */ React__default.default.createElement(antd.Menu, null, legends.slice(end).map((legend, idx) => {
            return /* @__PURE__ */ React__default.default.createElement(
              antd.Menu.Item,
              {
                className: cs__default.default(
                  styled.LegendItemStyle,
                  deselected.includes(legend.id) && "deselected"
                ),
                key: legend.id,
                onClick: () => onClick(legend.id)
              },
              /* @__PURE__ */ React__default.default.createElement(ColorBlock, { background: legend.color }),
              /* @__PURE__ */ React__default.default.createElement("span", null, legend.name)
            );
          }))
        },
        /* @__PURE__ */ React__default.default.createElement(icons.DoubleRightOutlined, { rotate: 90 })
      ),
      els: legends.map((legend) => {
        return /* @__PURE__ */ React__default.default.createElement(
          "div",
          {
            className: cs__default.default(
              styled.LegendItemStyle,
              deselected.includes(legend.id) && "deselected"
            ),
            key: legend.id,
            onClick: () => onClick(legend.id)
          },
          /* @__PURE__ */ React__default.default.createElement(ColorBlock, { background: legend.color }),
          /* @__PURE__ */ React__default.default.createElement("span", null, /* @__PURE__ */ React__default.default.createElement(index$1, { text: legend.name, len: 50, backLen: 20 }))
        );
      })
    }
  );
};
const LegendComponent = (props) => {
  const { name, color } = props;
  return /* @__PURE__ */ React__default.default.createElement("div", { className: cs__default.default(styled.LegendItemStyle, "legend-component") }, /* @__PURE__ */ React__default.default.createElement(ColorBlock, { background: color }), /* @__PURE__ */ React__default.default.createElement("span", null, name));
};
var MetricLegend$1 = MetricLegend;

exports.ColorBlock = ColorBlock;
exports.LegendComponent = LegendComponent;
exports.default = MetricLegend$1;
