DataTable: Not accepting external components as children

[KajetanDobczyk]

Describe the bug

Hi! I've spent couple hours today on this bug, and I have no idea why it is happening... I have couple Dialogs where I use DataTable, and I wanted to make them generic. That is when I discovered this issue (very simplified):

When I pass the Columns to the DataTable from a function, or straight there, it works fine.

const items = [{id: "0"}]

(...)

<DataTable value={items}>
      <Column field="id" header="ID" />
    </DataTable>

When I do something like this, the data doesn't render at all...

const items = [{id: "0"}]

const Content = () => <Column field="id" header="ID" />;

(...)

<DataTable value={items}>
      <Content />
    </DataTable>

Reproducer

No response

PrimeReact version

9.2.0

React version

18.x

Language

TypeScript

Build / Runtime

Vite

Browser(s)

No response

Steps to reproduce the behavior

No response

Expected behavior

No response

[melloware]

Pretty sure this is related to:

#644

#1825

The real explanation i think is: #2052 (comment)