trying syntax simplifications for using preact h without jsx

h.js

function (type, props, children) {
  // placeholder for preact h
  return {type, props, children}
}

var ElementPropSetter = {
  get: function(target, name, proxy) {
    return function(...values) {
      if (name == "class")
        target.props.class = values.join(" ")
      else if (values.length > 0)
        target.props[name] = values[0]
      return proxy
    }
  }
}


var ElementFactory = {
  get: function(target, name) {
    var el = Object.assign(
      function (...children) {
        return h(name, el.props, children)
      }, {props: {}}
    )
    return new Proxy(el, ElementPropSetter)
  }
}

var _ = new Proxy({}, ElementFactory)

var t = _.nav.class("navbar navbar-dark navbar-fixed bg-dark container-fluid").id("main").onclick(e => console.debug(e))(
  _.ul(
    _.li.class("nav-item", "active")(
      "one"
    ),
    _.li.class("nav-item")(
      "two"
    ),
    _.li.class("nav-item")(
      "three"
    ),
    _["special-element"]()
  )
)

console.debug(t)