import _Input from "@alifd/next/es/input";
import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
import { Component } from 'react';
var EditablePane = /*#__PURE__*/function (_Component) {
  _inheritsLoose(EditablePane, _Component);
  function EditablePane(props) {
    var _this;
    _this = _Component.call(this, props) || this;
    _this.onKeyDown = function (e) {
      var keyCode = e.keyCode;
      // Stop bubble up the events of keyUp, keyDown, keyLeft, and keyRight
      if (keyCode > 36 && keyCode < 41) {
        e.stopPropagation();
      }
    };
    _this.onBlur = function (e) {
      _this.setState({
        // editable: false,
        // editable: true,
        cellTitle: e.target.value
      });
      _this.props.fn(e.target.value);
    };
    _this.onDblClick = function () {
      _this.setState({
        editable: true
      });
    };
    _this.state = {
      cellTitle: props.defaultTitle,
      kinds: props.kinds,
      editable: true
    };
    return _this;
  }

  // eslint-disable-next-line react/no-deprecated
  var _proto = EditablePane.prototype;
  _proto.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
    if (nextProps.defaultTitle !== this.state.cellTitle) {
      this.setState({
        cellTitle: nextProps.defaultTitle
      });
    }
  };
  _proto.render = function render() {
    var _this$state = this.state,
      cellTitle = _this$state.cellTitle,
      editable = _this$state.editable,
      kinds = _this$state.kinds;
    if (kinds === "1") {
      if (editable) {
        return /*#__PURE__*/React.createElement(_Input, {
          autoFocus: true,
          defaultValue: cellTitle,
          onKeyDown: this.onKeyDown,
          onBlur: this.onBlur
        });
      }
      return /*#__PURE__*/React.createElement("span", {
        onDoubleClick: this.onDblClick
      }, cellTitle);
    } else {
      if (editable) {
        return /*#__PURE__*/React.createElement(_Input, {
          innerAfter: "%",
          autoFocus: true,
          defaultValue: cellTitle,
          onKeyDown: this.onKeyDown,
          onBlur: this.onBlur
        });
      }
      return /*#__PURE__*/React.createElement("span", {
        onDoubleClick: this.onDblClick
      }, cellTitle);
    }
  };
  return EditablePane;
}(Component);
export { EditablePane as default };