こんなライブラリ見つけました
https://github.com/michael-klein/funcy.js

WebComponents を使う場合 通常は CustomElements を使って HTMLElement を継承したクラス定義を書きます
このライブラリでは関数定義でかけるようにしてくれています
もちろん内部ではクラスを作って customElements.define を使ってます

関数は React の関数コンポーネントのような hook があり useXXX で使う仕組みです
シンプルなものだと関数が要素を返すだけです

usePreactHtm という hook もあって Preact と htm を使うこともできます

CustomElements の定義はムダに書くことが多くて面倒な上 属性とかも扱えてしまう分 その辺りもちゃんと対応しておきたい気がしてどんどん面倒になるのでそういうことを一切気にしなくていいライブラリを使うのもありかなと思いました