curiosidade sobre o array retornado pelo map dentro do component

Fala Felipe, tudo certo?

Isso aí, não consigo te confirmar se ele faz exatamente um spread, mas ele executa uma função chamada createElement para cada item no array de children, que é chamado de child.

Para você entender como funciona o createElement, veja o exemplo desse children:

function Lista() {
  const tarefas = ['react', 'typescript', 'javascript'];

  return (
    <ul>
      {tarefas.map(tarefa => <li> {tarefa} </li>)}
    </ul>
  )
}

Isso pega o array tarefas e transforma em um array de JSX, você pode reescrever ele literalmente assim

function Lista() {
  const tarefas = ['react', 'typescript', 'javascript'];

  return (
    <ul>
      {[<li> React </li>,<li> Typescript </li>,<li> Javacript </li>]}
    </ul>
  )
}

Isso funciona igual.

Por debaixo dos panos ele cria um elemento React com a função React.createElement, passando como primeiro parâmetro o elemento HTML ou Componente React (esse parâmetro é obrigatório), o segundo são as props (pode ser null) e o terceiro é o children (pode ser null também), então esse componente de cima fica assim sem JSX:

function Lista() {
  const tarefas = ['react', 'typescript', 'javascript'];

  return React.createElement('ul', null, [<li> React </li>,<li> Typescript </li>,<li> Javacript </li>])

Perceba que eu coloquei que eu quero que seja renderizado com um elemento <ul>, que não tenha props e que o children seja um array de JSX, mas eu poderia colocar como outros createElements ou apenas strings que funcionaria igual.

O React por debaixo dos panos pega esse array e cria vários React.createElement, dessa forma:

function Lista() {
  const tarefas = ['react', 'typescript', 'javascript'];

  return React.createElement('ul', null, [React.createElement('li', null, "React"), React.createElement('li', null, "Typescript"), React.createElement('li', null, "Javacript")])

E no final esse array cheio de React.createElement é convertido em filhos (provavelmente com spread) no HTML, do jeito que você vê no DOM:

<ul>
  <li> React </li>
  <li> Typescript </li>
  <li> Javascript </li>
</ul>

Bons estudos!