Chainable without () ?

Hi all, I have this:

export function JSZComponent() {
  return (
    div()
      .children([
        a()
          .href("https://google.ca").children(
            span()
              .children("Google")(),
            )(),
      ])();
  )
}

export function JSZComponent() {
  return (
    div()
      .children([
        a()
          .href("https://google.ca").children(
            span()
              .children("Google")(),
            )(),
      ])();
  )
}

which is gross because you need to invoke the return of each chainable prop-call in order to actually call createElement. Is there a way to chain createElement calls like I'm doing without having to curry like this?

6 Replies

barry•2y ago

what is this wizardry

bentenOP•2y ago

It's using a proxy with custom getters to basically curry a prop object, where calling it calls createElement() Ideally I'd do this without currying tho I wonder if I could somehow instantiate the createElement call in div() and then just mutate it's props?

Valhalaar•2y ago

so your desired API is just this without the ending invocations?

export function JSZComponent() {
  return (
    div()
      .children([
        a()
          .href("https://google.ca").children(
            span()
              .children("Google"), // no more ()
            ), // no more ()
      ]); // no more ()
  )
}

export function JSZComponent() {
  return (
    div()
      .children([
        a()
          .href("https://google.ca").children(
            span()
              .children("Google"), // no more ()
            ), // no more ()
      ]); // no more ()
  )
}

this ^?

bentenOP•2y ago

yeah

Unknown User•2y ago

Message Not Public

bentenOP•2y ago

JavaScript

Gaming

Programming

Chainable without () ?