import React, { useMemo } from 'react';
import { Select, Tooltip } from 'antd';
import HelpCircle from '@pisell/icon/es/HelpCircle';
import { getText } from "../../../../../locales";
import "./PopoverContent.less";
var prefix = 'pisell-lowcode-';
var PopoverContent = function PopoverContent(props) {
  var columns = props.columns,
    _props$value = props.value,
    value = _props$value === void 0 ? [] : _props$value,
    onChange = props.onChange;
  var firstValue = (value === null || value === void 0 ? void 0 : value[0]) || {};
  var handleFieldChange = function handleFieldChange(value) {
    if (!value) {
      onChange === null || onChange === void 0 ? void 0 : onChange([]);
      return;
    }
    onChange === null || onChange === void 0 ? void 0 : onChange([{
      field: value
    }]);
  };
  var options = useMemo(function () {
    // 是否开启了隐藏
    var _lists = (columns || []).filter(function (item) {
      return !(item !== null && item !== void 0 && item.isHidden);
    });
    return _lists.map(function (item) {
      return {
        label: item.label,
        value: "".concat(item.name)
      };
    });
  }, [columns]);
  return /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefix, "table-action-group-popover-content-wrap")
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefix, "table-action-group-header")
  }, /*#__PURE__*/React.createElement("span", {
    className: "".concat(prefix, "table-action-group-header-title")
  }, getText('table-action-group-by-title')), /*#__PURE__*/React.createElement(Tooltip, {
    title: getText('table-action-group-by-title-tip')
  }, /*#__PURE__*/React.createElement(HelpCircle, null))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, {
    options: options,
    value: firstValue.field,
    onChange: handleFieldChange,
    style: {
      width: 200
    },
    allowClear: true
  }))));
};
export default PopoverContent;