Description
Currently we are invoking React.createElement in two ways:
Reactwe are passing the child elements as spread arguments toReact.createElements.React.DOMwe are passing the child elements as an array argument toReact.createElements.
From what I understand, in case (2), react considers the children to be dynamic children; i.e., children can be added, removed, shuffled around, etc. So maybe they are passed in to the component that renders them as an array. The recommendation here is that each child have a key property. Compare this to (1), where passing the children as spread arguments indicates that the children are considered to be known by the implementer. This means they do not need a key property.
I think at both places in the code we may want one behaviour or the other. For example, we may want to write child elements and not have to specify a key when we know all the elements up front (written here in JS):
const html = DOM.div(null, DOM.div(null, 'a'), DOM.div(null, 'b'));But we also might want to pass a dynamic array of children where a key should be provided (written here in JS).
const values = [ 'a', 'b' ]; // might be passed in as a prop to the component
const html = DOM.div(null, values.map(v => DOM.div({key: v}, v)));To allow for this in (1), perhaps we can provide a createElementArray function. In (2), for DOM elements, we could maybe add element_ or element'' functions that spread the child element array. However, I am open to ideas and thoughts on this.