JSX whitespace coalescing rules

### Current rules

```
{1}··Aaa··Bbb··{2}··{3}  →  {1}·Aaa··Bbb·{2}{3}
{1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}·Aaa·Bbb·{2}{3}
```

While they seem reasonable to some extent, they are quite nonsensical from a theoretical perspective.

```{expr}``` is treated identically to ```<tag>``` and ```</tag>```
```· space``` ```¬ newline```

### Whitespace rules

*1\. Remove whitespace, makes no sense whatsoever.*

**2\. Replace whitespace a space, consistent output**
Minimal whitespace is always produced and it is consistent with normal browser rendering, any and all special whitespace requirements are explicit and easy to spot in the code.

**3\. Replace whitespace with spaces, faithful to source code**
Unintended double-spaces are possible but unlikely and normally renders identically to 2. Interesting in that it might encourage less hacky ```&nbsp;``` and more ```white-space: pre```, all things considered it seems like a feature.

*4\. Keep whitespace as is, identical to source*
Normally renders identically to 3 but relying on non-escaped non-space whitespace seems really finicky and hardly something that should be encouraged, non-space whitespace should be explicitly injected.

```
1.  {1}··Aaa··Bbb··{2}··{3}  →  {1}AaaBbb{2}{3}
2.  {1}··Aaa··Bbb··{2}··{3}  →  {1}·Aaa·Bbb·{2}·{3}
3.  {1}··Aaa··Bbb··{2}··{3}  →  {1}··Aaa··Bbb··{2}··{3}
4.  {1}··Aaa··Bbb··{2}··{3}  →  {1}··Aaa··Bbb··{2}··{3}
```

### Newline rules

**A. Remove newlines, consistent and uncomplicated**
Text requires explicit whitespace injection, slightly cumbersome and ugly in "worst case".

**B. Remove newlines but insert a space between text**
Most likely what the user wants without having to be overly explicit, implicit space can be overridden with braces.

*C. Remove newlines, but insert a space before/after text*
This may seem kind of interesting at first, even though it's a bit weird. However this is, in its basic form, the root cause of all the excess whitespace that is creeping in at the start and end of every text with the current rules. In my opinion, the only way this rule makes sense (without being a burden) is if it *does not match* after an opening tag or before a closing tag... simply put, it would only add a space when text is sibling to a node (or a brace). Which would make it quite magic, which isn't necessarily bad, but my gut feeling says it is. Being explicit in ambiguous cases is preferable to it sometimes making the wrong decision (especially when it comes to tests), and the rules would be very complex to explain.

*D. Remove newlines but insert a newline between text*
Likely unintended and very unlikely to be useful, easy to break if relying on identical text output, implicit newline can be overriden with braces.

**E. Remove newlines before and after tags, faithful to source code**
Although there are vaguely potential uses for this, that much text should never be inlined, be explicit if you absolutely must, implicit newlines can be overriden with braces.

*F. Keep newlines as is, identical to source but whitespace is trimmed*
This is a horrible feature in HTML, let's not go there.

```
A.  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}AaaBbb{2}{3}
B.  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}Aaa·Bbb{2}{3}
C.  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}·Aaa·Bbb·{2}{3}
D.  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}Aaa¬Bbb{2}{3}
E.  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}Aaa¬¬Bbb{2}{3}
F.  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}
```

_All lines are trimmed from leading and trailing whitespace, indenting code **must never** interfere with output in my opinion._

---

### Contenders

**2A/2B. Minimal whitespace, consistent output, encourage explicit whitespace**
The user is encouraged to be explicit in special-cases. With 2A we assume nothing, slightly cumbersome/ugly when dealing with moderate amounts of text, but very straight-forward. With 2B we reasonably assume that multi line texts should be separated by a space, the user can override if necessary.

```
2.  {1}··Aaa··Bbb··{2}··{3}  →  {1}·Aaa·Bbb·{2}·{3}
A.  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}AaaBbb{2}{3}
B.  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}Aaa·Bbb{2}{3}
```

**3A/B. Additional whitespace is most likely intentional, but very rarely useful**
Although in my opinion this is largely because of the largely unknown ```white-space: pre```, although still limited in usefulness. Otherwise same as 2A/B, except that 3B has a bit weird mix of keeping and generating whitespace, but results are intuitive and straight-forward still.

```
3.  {1}··Aaa··Bbb··{2}··{3}  →  {1}··Aaa··Bbb··{2}··{3}
A.  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}AaaBbb{2}{3}
B.  {1}¬¬Aaa¬¬Bbb¬¬{2}¬¬{3}  →  {1}Aaa·Bbb{2}{3}
```

**My personal vote goes to 3B at this time.**

It's also worth mentioning that ALL whitespace rules can be overriden with braces, so none of these rules are able to exclude any useful behavior, it can only make the resulting code more or less ugly.

I would also strongly recommend https://github.com/facebook/react/pull/489 to cut down on braces exploding into spans (especially when transforming existing code as it would add braces in a lot of places, generating lots and lots of unnecessary spans).

---

### Legacy JSX

Seeing as there's probably already a bit of code out there using JSX, I've written a first implementation of a tool that converts existing JSX files so that they continue to produce **identical output** even after switching to these new whitespace rules (final implementation is awaiting final verdict on which whitespace rules we want). This obviously potentially uglifies the code a bit with ```{' '}```, but they are easy to spot, and each transformation in the tool is optional, including even using ```{(' ')}``` as space to make it more obvious what's auto-generated.

https://github.com/syranide/react/compare/jsx-legacy-whitespace-tool