How to get ais-Panel--noRefinement when using Panel with connectRefinementList - React

If I use panel with the native RefinementList the Panel displays the class .ais-Panel--noRefinement properly when there are no refineable results

	<RefinementList attribute="vendor" operator="or"/>

The issue comes in when I use a customRefinementList

const RefinementList = ({ items, createURL }) => (
      { => (
          <li key={item.label}>
                style={{ fontWeight: item.isRefined ? 'bold' : '' }}
              {item.label} ({item.count})
const CustomRefinementList = connectRefinementList(RefinementList);
	<CustomRefinementList attribute="vendor" />

Now, when there are no results, the Panel does not get the the .ais-Panel--noRefinement as expected.

Any help would be greatly appreciated.