di-react.js

const components = {
  'project.header': ProjectHeader,
  'project.body': ProjectBody,
  'project.footer': ProjectFooter,
};

components['project.header'] = CustomProjectHeader;

render(
  <Provider components={components}>
    <App />
  </Provider>
);

// Long version
@inject(components => ({
  ProjectHeader: components['project.header'],
}))
class ProjectWrapper extends Component {
  render() {
    const { ProjectHeader } = this.props;

    return (
      <div className="wrapper">
        <ProjectHeader>
          Some content for the project header.
        </ProjectHeader>
      </div>
    );
  }
}

// Short version
@inject({
  ProjectHeader: 'project.header',
})
class ProjectWrapper extends Component {
  render() {
    const { ProjectHeader } = this.props;

    return (
      <div className="wrapper">
        <ProjectHeader>
          Some content for the project header.
        </ProjectHeader>
      </div>
    );
  }
}