Typescript, React with destructured props in function parns breaks {children}

So I found a thing that in typescript if you use a styleguide like AirBNB ir prefers props destructuring in the function braces:

interface MyComponentProps {
  children: React.ReactNode
}
export default function MyComponent({children}: MyComponentProps) {
  return (
    <div>{children}</div>
  );
}

I had a rule that required spread op in the declaration, and when that was done, {children} was not recognized as being valid react elements. I would get the error:

Objects are not valid as a React child

Now this is a no-brainer. You take childen in as an argument and dump them where you want (at the time, I was extracting some code and making an element to wrap the {children} with special formatting.

What I found is that restructuring the code worked better, particularly elements like being directly referenced, or assigned to a var first. I had better luck with:

<div>{props.children}</div>

and

const children = props.children;
<div>{children}</div>

But especially, function argument destructuring broke my code. What is going on?