Redux Connect use like children-as-func instead of HOC

connect-as-child.js

import React, { createElement } from 'react';
import { render } from 'react-dom';
import { Provider, connect } from 'react-redux';

import { store } from 'store';

const TypeConnector = connect(({ router: { type } }) => {
    return {
        type
    };
})(function Connector({ type, children }) {
    return children({ type });
});

// Without JSX
render(
    createElement(
        Provider,
        { store },
        createElement(TypeConnector, null, ({ type }) => {
            return createElement('div', null, type);
        })
    ),
    document.querySelector('#app')
);

// With JSX
render(
    <Provider store={store}>
        <TypeConnector>
            {function NamedComponent({ type }) {
                return <div>{type}</div>;
            }}
        </TypeConnector>
    </Provider>,
    document.querySelector('#app')
);