Rendering a `connect[Hits,Autocomplete]` component with custom props throws TS error

I have a component to render search results using connectHits. It renders my own component, SearchResults.

type Props = HitsProvided<Item> & {
  resultsCountUpdate: (count: number) => void;
  searchTerm: string;
  recentlyViewedUpdate: (item: Item) => void;
};

const SearchResults = ({
  hits = [],
  resultsCountUpdate = () => {},
  searchTerm,
  recentlyViewedUpdate,
}: Props) => {} // render code

// Normally this will cause a TS error too but I've surpassed it per https://discourse.algolia.com/t/custom-refinement-list-typescript-issues/9819
const CustomHits = connectHits(SearchResults);

export default CustomHits;

When I try to use CustomHits and pass in props I want, I receive a TypeScript error:

/** 
Type '{ searchTerm: string; resultsCountUpdate: Dispatch<SetStateAction<number>>; recentlyViewedUpdate: (item: any) => void; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<{}, any, any>> & Readonly<{}> & Readonly<{ children?: ReactNode; }>'.
  Property 'searchTerm' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<{}, any, any>> & Readonly<{}> & Readonly<{ children?: ReactNode; }>'.ts(2322
*/
 <SearchResults
  searchTerm={searchTerm}
  resultsCountUpdate={resultsCountUpdate}
  recentlyViewedUpdate={combineRecentlyViewed}
/>

Am I supposed to use connectHits differently or is my typing incorrect?