Why React component must return a single element?

This is because in JSX (the syntax that React uses), everything must be contained within a single root element.

In JavaScript, every function must return a single value.

And JSX under the hood is transformed into plain JavaScript objects. You can’t return two objects from a function without wrapping them into an array.

https://beta.reactjs.org/learn/writing-markup-with-jsx#1-return-a-single-root-element