calmm-js / karet

Karet is a library that allows you to embed Kefir observables into React VDOM
MIT License
83 stars 8 forks source link

Implement template string helpers for detecting observers #16

Closed fiatjaf closed 7 years ago

fiatjaf commented 7 years ago

Today if you write a templated string like

`my count is ${Kefir.sequentially(1000, [1, 2, 3, 4, 5])}`

karet will not know there's an observable inside the string and will print my count is [sequentially] instead.

If there was a helper function k, for example, for passing template strings to, that could identify which of the template strings' variables were observers and treat them like a children. Basically just turning a template string inside a React children as multiple different children would make this work, so instead you would have to write

k`my count is ${Kefir.sequentially(1000, [1, 2, 3, 4, 5])}`

And that's it.

What do you think? Should I submit a PR? What do you think would be the best way to implement such a feature?

polytypic commented 7 years ago

Thanks for the suggestion! The Karet Util library contains utilities like this. As it happens, the (not yet documented) U.string function implements support for template strings with embedded observables. (PRs for documentation are welcome!)

So, using U.string from Karet Util you can write

U.string`my count is ${Kefir.sequentially(1000, [1, 2, 3, 4, 5])}`

and the result is an observable. In case the template does not contain observable parameters, the result is a plain string. This way unnecessary observables are avoided.