components) Support JSX templates

[brianmhunt]

(From tko.components/issues/5, pre monorepo)
Re: knockout/knockout#1663

Proposal:

Add jsx as an option to the template registration e.g.

ko.components.register('test-widget', {
   viewModel: SomeTestWidgetViewModelClass,
   template: {
     jsx: /* JSX Things ...*/
   }
})

---

@daedalus28

Just a note about this - part of the advantage of JSX is the ability to use native js things instead of having custom DSLs (for example, using a simple array.map instead of learning bindings like foreach). For this to really shine, bindings themselves should also be able to be called as functions and ideally be able to be less KO specific. The ideal situation here is probably to internally allow using a template that is a function which becomes a computed so you can do all the things you'd do in react like map, etc and not have to have it map to some custom binding. React + MobX is a great example of this

---

@Tschaul

Thats how i see it too. The knockout bindings would be gone / not needed anymore.

But knockout would have to do slightly more than handle the jsx template as computed observable. It has to instantiate other ko-Components that are used inside the template and handle their lifecylce. But that shouldn't be too different than what knockout is doing with the current templating logic.

I have a working proof of concept using the virtual-dom library here: https://github.com/Tschaul/hyperknock/blob/master/index.jsx

[brianmhunt]

This is substantially complete, at least for a first iteration, as of #73

[cosmoKenney]

I could live without JSX. Should definitely be an opt-in requiring the installation and import of a companion library.

[brianmhunt]

The point of TKO is you can choose parts as you wish. The knockout build may never have JSX support; there will likely be an official build with only the JSX provider.