Hyperapp: V2 Component Wishlist

[mrozbarry]

With the inevitable future of losing dom callbacks for oncreate, onupdate, onremove, and ondestroy, it is incredibly important that we, as a community, fill in the gaps and use cases for third-party components that we've previously integrated with using these callbacks. This means graphs, custom tooltips, or any other javascript powered component.

I'd like to collect a list of the common components people are using so we can implement these or find alternative ways to integrate.

Having this list will ensure that there is an easy transition when these lifecycle hooks no longer exist.

Thanks!

[zaceno]

@mrozbarry Good point! I’m particularly interested in how graphs could be handled. Perhaps if we could collect examples (codepens/fiddles) of such use cases in 1.2, then when the 2-alpha comes out, we have something concrete to work with.

[SkaterDad]

I've used the lifecycle hooks to add embedded Google Maps and the Google Places Autocomplete.

Anyone here work at Google and wants to provide a hyperapp version? :laughing:

[mrozbarry]

@SkaterDad The easy ~solution~ hack would be to wrap that component's vdom view function in a function that looks for changes. But what sort of lifecycle do you need for those? Probably oncreate to mount maps, but for autocomplete, couldn't you just hook into the input's oninput event and do some magic with that (since you would get e.target)?

[SkaterDad]

@mrozbarry For the embedded maps, I use oncreate, onupdate, and listen for change events, since I'm synchronizing the geographic coordinates in my hyperapp state.

For the autocomplete, I currently mount it on an 's oncreate, and set up the state change callbacks. The change callbacks return a fairly large data structure which I pick and choose properties from (address, geographic coordinates, city, country, etc...).

Using web components/custom elements for these would be nice & clean from the hyperapp side, so long as I can find a way to implement them with minimal overhead. Polyfills for custom elemements alone appear to be close to 3KB minified & gzipped, though.

I'd prefer to keep the lifecycle hooks, to be honest. Having an easy escape hatch to access the DOM nodes is extremely handy when you're in a hurry.

[jorgebucaran]

Closed by mistake.

[jorgebucaran]

If there's anything else to discuss, please do it in #717. 🙏