broken-ref.js

import React, { Component } from "react";

class CustomComponent extends Component {
  apiMethod() { /* ... */ }
};

const StyledCustomComponent = props => (
  <CustomComponent {...props} style={{ padding: 10 }} />
);

const EnhancedCustomComponent = props => (
  <StyledCustomComponent {...props} extraInfo={info} />
);

class ParentComponent extends Component {  
  handleClick = () => this.component.apiMethod();

  render() {
    return (
      <div>
        <button onClick={this.handleClick}>call api method!</button>
        <EnhancedCustomComponent ref={r => this.component = r } />
      </div>
    );
  }
}