TypeError: this.input.focus is not a function

import React, { Component } from 'react';
import {TextInput} from 'react-desktop/macOs'

class App extends Component {
  focus() {
    this.input.focus();
  }

  render() {
    return (
      <div>
        <TextInput ref={(input) => { this.input = input; }}/>
        <button onClick={(e) => this.focus()}>Focus</button>
      </div>
    );
  }
}

App.js:8 Uncaught TypeError: this.input.focus is not a function
    at App.focus (App.js:8)
    at onClick (App.js:15)
    at HTMLUnknownElement.callCallback (react-dom.development.js:540)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:579)
    at Object.invokeGuardedCallback (react-dom.development.js:436)
    at Object.invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:450)
    at executeDispatch (react-dom.development.js:834)
    at executeDispatchesInOrder (react-dom.development.js:856)
    at executeDispatchesAndRelease (react-dom.development.js:954)
    at executeDispatchesAndReleaseTopLevel (react-dom.development.js:965)
    at Array.forEach (<anonymous>)
    at forEachAccumulated (react-dom.development.js:933)
    at processEventQueue (react-dom.development.js:1105)
    at runEventQueueInBatch (react-dom.development.js:3600)
    at handleTopLevel (react-dom.development.js:3609)
    at handleTopLevelImpl (react-dom.development.js:3340)
    at batchedUpdates (react-dom.development.js:11066)
    at batchedUpdates (react-dom.development.js:2323)
    at dispatchEvent (react-dom.development.js:3414)