How to use "children" of a custom component in solid-elements?

[onx2]

I can't figure out how to pass along the children from the consumer into my custom component. Does anyone know how to do this?

consumer:

<wb-button variant="asdf">button</wb-button>

my custom element:

customElement(
  "wb-button",
  { variant: "one" },
  (props: WbButtonProps, { element }) => {
    return <button>{element.children}</button>;
  }
);

what I end up with:

[onx2]

I think I figured this out though I don't find it very ergonomic so if anyone has a better approach, I would love to hear it.

customElement(
  "wb-button",
  { variant: "one" },
  (props: WbButtonProps, { element }) => {
    return (
      <button>
        <style>{style}</style>
        <For each={element.childNodes}>{(child) => child}</For>
      </button>
    );
  }
);

<wb-button variant="asdf">
        <span>button</span>
        asdf
</wb-button>