<commit_before>---
title: RR 0.3.0 - Power Children
---

0.3.0 is here! We've bumped the minor version because it's a breaking change (just a small one, see [HISTORY.md](https://github.com/reasonml/reason-react/blob/master/HISTORY.md#030). We've been _really_ careful with breaking changes). Stay tuned for more exciting features coming in the next few weeks (non-breaking). In the meantime, here's the big improvement of this release: **you're now allowed to pass any data type to JSX children**. And yes, they all type check, naturally! **Note** that this particular feature currently requires the master version of `bs-platform`. BuckleScript will make a new stable release next week.

Head over to the improved [JSX](jsx.md#children) docs and then [Children](children.md) docs to know the details. Here's a summary.

Previously, `<Comp> child1 child2 </Comp>` desugars to passing an array of `[|child1, child2|]` to `Comp` as `children`. This is likewise the case for `<Comp> child1 </Comp>` where, due to syntax constraints, we're _still_ passing an array of `[|child1|]` to `Comp`. Since Reason 3, we've introduced the [children spread syntax](https://reasonml.github.io/guide/language/jsx#children-spread) which simply makes `<Comp> ...child1 </Comp>` _not_ pass the array wrapper, but directly `child1`, to `children`.

What does this unlock? Crazy tricks like these:

- A layout component that mandates a tuple of 2 react element and shows them side-by-side:

  ```reason
  <MyForm> ...(<div />, <div />) </MyForm><commit_msg>more tweaks<commit_after>---
title: RR 0.3.0 - Power Children
---

0.3.0 is here! We've bumped the minor version because it's a breaking change (just a small one, see [HISTORY.md](https://github.com/reasonml/reason-react/blob/master/HISTORY.md#030). We've been _really_ careful with breaking changes). Stay tuned for more exciting features coming in the next few weeks (non-breaking). In the meantime, here's the big improvement of this release: **you're now allowed to pass any data type to JSX children**. And yes, they all type check, naturally!

**Note** that this particular children feature currently requires the master version of `bs-platform`. BuckleScript will make a new stable release next week.

Head over to the improved [JSX](jsx.md#children) docs and then [Children](children.md) docs to know the details. Here's a summary.

Previously, `<Comp> child1 child2 </Comp>` desugars to passing an array of `[|child1, child2|]` to `Comp` as `children`. This is likewise the case for `<Comp> child1 </Comp>` where, due to syntax constraints, we're _still_ passing an array of `[|child1|]` to `Comp`. Since Reason 3, we've introduced the [children spread syntax](https://reasonml.github.io/guide/language/jsx#children-spread) which simply makes `<Comp> ...child1 </Comp>` _not_ pass the array wrapper, but directly `child1`, to `children`.

What does this unlock? Crazy tricks like these:

- A layout component that mandates a tuple of 2 react element and shows them side-by-side:

  ```reason
  <MyForm> ...(<div />, <div />) </MyForm>
{'fraction_non_alphanumeric': 0.11565951916829109, 'fraction_numerical': 0.012345679012345678, 'mean_word_length': 4.4786476868327405, 'pattern_counts': {'":': 0, '<': 23, '<?xml version=': 0, '>': 23, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6070613', 'n_tokens_mistral': 919, 'n_tokens_neox': 860, 'n_words': 411}