Реагировать на компонент, маскирующийся под функцию

Может ли кто-нибудь помочь мне понять, что здесь происходит в каком-то коде, который мне нужно реорганизовать.

У меня есть компонент, который выглядит довольно обычным образом, например:

export default class MyContainer extends PureComponent {
  //props
  //state
  //render()
  //etc.
}

Затем это передается как реквизит другому компоненту, например:

export class ParentContainer
render() {
    return (
      <div>
        <Tabs
          home = {MyContainer}
        />
      </div>
    );
  }
}

но то, что меня смутило, находится внутри вкладок, для этого требуется функция.

export default class Tabs extends PureComponent {
   static propTypes = {
    home: func.isRequired,
  }
}

Это вызывает у меня много вопросов:

Что делает этот home = {MyContainer}? Может быть, просто создать экземпляр встроенного компонента со всеми реквизитами по умолчанию? Я раньше не видел такого синтаксиса. И почему этот компонент действует как функция. Что-то происходит за кулисами, например, реакция неявно преобразует компонент в функцию render ()?

Если я попытаюсь создать его «нормальным» способом, чтобы добавить новые реквизиты, то есть {<MyContainer />}, я получаю сообщение об ошибке выполнения, в котором говорится, что вкладки ожидают функцию? Должен ли я просто изменить вкладки, чтобы ожидать, что объект заработает?