Добавление ссылки на cloneElement для установки фокуса cloneElement

Question

Я не использовал клонированные элементы раньше, но сейчас пытаюсь создать кнопку, которая при нажатии открывает окно ввода соответствующего типа и, что особенно важно, фокусируется на поле ввода. То, что у меня, похоже, в основном работает, за исключением того, что оно не фокусируется (я получаю консольную ошибку, что _this.refs.content.focus не является функцией). Я пробовал читать документацию и другие вопросы, но больше не буду ждать. Любая помощь приветствуется

  getInitialState() {
    return {
      isEditing: false,
      .....
    };
  },

  _onEdit() {
    if (this.state.isEditing) return;
    this.setState({
      isEditing: true,
      editedValue: this.props.value,
    }, () => {
      console.dir(this.refs);
      this.refs.content.focus();
    });
  },

  .....

  render() {
    .....
    // button clicked
    if (this.state.isEditing) {

      return React.cloneElement(
        this.props.children[0], {
          onBlur: this.onBlur,
          value: this.state.editedValue,
          onChange: this.onChange,
          ref: "content",
        }
      );

    } else {

      const child = this.props.children[1];

      // Editable but in read mode - display clickable button
      return pug`
        button.btn-block.btn-editable(
          onClick=this._onEdit,
          type='button',
        )= React.cloneElement(child, {}, this.state.editedValue || (child.props.children || ""))
      `;
    }
  },