Typescript check React children for specific component

I have a component that takes children:

interface FooProps {
  title: string;
}

const Foo: React.FC<FooProps> = ({ children, title }) => (
  <div>
    <h1>{title}</h1>
    {children}
  </div>
);

Now I want to restrict children to only accept a specific component - let's say a Button component. Is there a way to define this in FooProps?

A common method seems to be:

interface FooProps {
  children: React.ReactElement<Button>;
  title: string;
}

However this only checks that ANY element is passed as long as the children props are correct. My Button component may not have any required props, so this this technique would end up essentially allowing any children types. Is there a stronger way to type this?