@hyperapp/html: use a Proxy?

Author: mindplay-dkCreated Feb 23, 2022Updated Mar 22, 2022

Labelsenhancement

In modern browsers, can we use a Proxy instead of hard coding all the element types?

I'm using this right now:

javascript

    import { h } from "./lib/hyperapp.js";

    const { main, h1, input, ul, li, button } = new Proxy(h, {
      get(h, type) { return (props, children) => h(type, props, children) }
    });

One more line of code, and you have support for custom elements:

javascript

    const { hyperApp } = new Proxy(h, {
      get(h, type) {
        const name = type.replace(/([A-Z])/g, c => "-" + c.toLowerCase());
        return (props, children) => h(name, props, children)
      }
    });

    console.log(hyperApp({foo:"bar"}, ["baz"])); // type: "hyper-app"

Thoughts? :-)

Source: hyperapp/hyperapp

View original on GitHub View discussion on GitHub