JSX support?

[guscost]

So full disclosure I've been tinkering a lot with kind of a overly-minimalist embedded-DOM adaptation of some of these ideas:

https://github.com/guscost/protozoa

And it turns out that this kind of JSON format can definitely be generated from JSX source. I understand a lot of the benefit of the "compact" or "process-less" development workflow, but writing JSX can be really nice and I'm missing it. It turns out it is possible to just add that syntax by itself if you want it! I was able to extend TypeScript to support generating JS object literals from JSX rather than calls to React, and I have a working implementation here:

https://github.com/guscost/protozoa-tsx

It would be pretty easy to adapt to generate objects for any object-spec type of API.

[devsnek]

Wouldn't this be on your end to manage, the same way tc39 doesn't have to deal with jsx?

[guscost]

Sure, but I'm not aware of any common transpilers or plugins that can be configured to output the necessary object literals in-place based on your source JSX file. TypeScript was somewhat coupled to the notion that JSX would only be transpiled for "React" (basically meaning a JSX element turns into a function call) or not at all.

And for clarity, I am talking about an optional new transpile/build step to generate this JSON. It would not make much sense to try to transpile JSX at runtime, and at build time it should only be optional since a selling point of Cell is "no build required".

[devsnek]

You could probably just fork this and add that transpiler in somewhere

[guscost]

Would that method be tolerant of complex JS logic nested in JSX elements? JSX could potentially have all kinds of crazy nested JS/JSX/JS (probably usually a horrible idea but the language does support it).

I thought for some reason the JS-in-JSX feature necessitated a full-text parser.

EDIT: Oh, is that a ES5 parser library??

[devsnek]

parse5 is a whatwg html5 spec compliant ast generator for html.

[guscost]

Ah HTML, ok yeah that might break on deeply-nested JS expressions and the like, but I'm not 100% sure.

[gliechtenstein]

@guscost I think JSX is something you can easily add on top of Cell but not something that should be included in the library itself.

For example, I wrote a quick handlebars-based app here https://play.celljs.org/items/1mQfq1/edit using the new $html attribute

I'm not yet 100% sure what using complex JSX to write Cell apps would look like yet, but if you make any progress please keep us posted. It's really fascinating how people are already mixing Cell with other libraries (for example, someone already wrote a redux powered cell https://twitter.com/davidbonnet/status/878560703388536832)

[piranna]

@guscost I think JSX is something you can easily add on top of Cell but not something that should be included in the library itself.

I think so too.

[guscost]

@gliechtenstein Makes sense. I'm probably going to look into getting TypeScript itself to be configurable for support configurable JSON-like output for JSX, at some point at least, since it's not a huge lift and potentially could be built alongside the React.createElement output format.

And yes, I'd say don't build any required transpilation at all into this project if you can avoid it.

[devsnek]

@guscost i made this https://github.com/devsnek/to_cell i supports jsx

[gliechtenstein]

Thanks to @devsnek we can close this now.