'use strict';

var antd = require('antd');
var React = require('react');
var useParrotTranslation = require('../../../hooks/useParrotTranslation.js');

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

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

const AffixColumnHeaderCell = ({ data, column, onChange, onBlur }) => {
  const [suffix, setSuffix] = React.useState("");
  const [prefix, setPrefix] = React.useState("");
  const { t } = useParrotTranslation();
  const onPrefixChange = React.useCallback(
    (e) => {
      const newPrefix = e.target.value;
      setPrefix(newPrefix);
      onChange(newPrefix + suffix);
    },
    [suffix, onChange]
  );
  const onSuffixChange = React.useCallback(
    (e) => {
      const newSuffix = e.target.value;
      setSuffix(newSuffix);
      onChange(prefix + newSuffix);
    },
    [prefix, onChange]
  );
  return /* @__PURE__ */ React__default.default.createElement(antd.Space, { style: { marginTop: "4px" } }, !column.disablePrefix ? /* @__PURE__ */ React__default.default.createElement(
    antd.Input,
    {
      value: prefix,
      placeholder: t("components.prefix"),
      size: "small",
      onChange: onPrefixChange,
      onBlur
    }
  ) : void 0, !column.disableSuffix ? /* @__PURE__ */ React__default.default.createElement(
    antd.Input,
    {
      value: suffix,
      placeholder: t("components.suffix"),
      size: "small",
      onChange: onSuffixChange,
      onBlur
    }
  ) : void 0);
};

exports.AffixColumnHeaderCell = AffixColumnHeaderCell;
