Failed prop type: Invalid child component `[object Object]`. Must be one of: Cover, Body, Footer

I'm using Theme UI with the pragma set in `.babelrc` like this:

```json
{
"presets": [["next/babel", {
"preset-react": {
"pragma": "jsx"
}
}]],
"plugins": [
[
"@emotion/babel-plugin-jsx-pragmatic",
{
"module": "theme-ui",
"import": "jsx",
"export": "jsx"
}
]
]
}
```

and I'm creating the following macro component:

```js
import React from "react";
import Macro from "macro-components";
import Flex from "../Flex";
import Box from "../Box";
import Stack from "../Stack";

const Cover = ({ children }) => (

{children}

);

const Body = ({ children }) => {children};

const Footer = ({ children }) => {children};

const Card = Macro({ Cover, Body, Footer })(
({ Cover, Body, Footer }, props) => (

{Cover}

{Body}
{Footer}


)
);

export default Card;
```

but then I'm trying to use it in the app I see the error:

```
Failed prop type: Invalid child component `[object Object]`. Must be one of: Cover, Body, Footer
```

I'm wondering if this is somehow related...

Start by reproducing the error with the shown .babelrc configuration and Card macro component in the app. Inspect the Macro usage and the child-component validation to determine why the Cover, Body, and Footer values are rejected; done means the example renders without the invalid-child warning and the behavior is covered by an appropriate test.

Written by the indexing model from the issue text.