Constfunction Explosion() {
return (
<KaylaFragment>
<Particle x={0} y={0} color="yellow" />
<Particle x={-20} y={10} color="orange" />
<Particle x={15} y={-15} color="red" />
</KaylaFragment>
);
}
// Or using JSX fragment shorthand (preferred)
function Explosion() {
return (
<>
<Particle x={0} y={0} color="yellow" />
<Particle x={-20} y={10} color="orange" />
</>
);
}
Fragment component — allows returning multiple children without creating an extra wrapper entity/rectangle.
Behaves like React.Fragment: zero runtime cost, no additional
KaylaRectEntityis spawned.This is a regular functional component — use it in JSX/TSX just like any other component.