content: import React, { Component } from 'react';
  import PropTypes from 'prop-types';
  import { Button } from 'rsuite';
  import omit from 'lodash/omit';
  
  const propTypes = {
    inputMaxLength: PropTypes.number,
    onInputConfirm: PropTypes.func
  };
  
  const defaultProps = {
    inputMaxLength: 128
  };
  
  class CreateButton extends Component {
  
    constructor(props) {
      super(props);
      this.state = {
        inputVisible: false,
        inputValue: ''
      };
    }
  
    handleShowInput = () => {
      this.setState({ inputVisible: true }, () => this.input.focus());
    };
  
    bindInput = (ref) => {
      this.input = ref;
    };
  
    handleInputConfirm = () => {
      const { onInputConfirm } = this.props;
      const state = this.state;
      const inputValue = state.inputValue;
      this.setState({
        inputVisible: false,
        inputValue: ''
      });
      onInputConfirm && onInputConfirm(inputValue);
    };
  
    handleInputChange = (e) => {
      this.setState({ inputValue: e.target.value });
    };
  
    handleInputKeyDown = (e) => {
      if (e.keyCode === 13) { // Press ENTER
        this.handleInputConfirm();
      }
    };
  
    render() {
      const { children, inputMaxLength } = this.props;
      const props = omit(this.props, [...Object.keys(propTypes), children]);
      const { inputVisible, inputValue } = this.state;
      return (
        <div className="rs-tag-create-button-wrap" {...props}>
          {
            inputVisible && (
              <input
                ref={this.bindInput}
                type="input"
                className="form-control input-sm rs-tag-create-button-input"
                value={inputValue}
                maxLength={inputMaxLength}
                onChange={this.handleInputChange}
                onBlur={this.handleInputConfirm}
                onKeyDown={this.handleInputKeyDown}
              />
            )
  
          }
          {
            !inputVisible &&
            <Button
              className="rs-tag-create-button"
              size="xs"
              onClick={this.handleShowInput}
            >{children || '+ 新标签'}</Button>
          }
        </div>
      );
    }
  }
  
  CreateButton.propTypes = propTypes;
  CreateButton.defaultProps = defaultProps;
  
  export default CreateButton;
  