I haven’t worked with web components very much, though they’ve been on my “must explore more” list for a while. A couple of days ago, I stumbled across Shoelace, “a forward-thinking library of web components.”
“That’d just work in SaxonJS, right?”, I asked myself.
Yep. I updated the helloWorldJS repository that I created a while back to demonstrate it.
The new work is in the shoelace
branch.
There’s not much different, really.
- The HTML file includes the Shoelace scripts and styling from its CDN. (A more robust application would want local copies, but this is just a toy.)
- Instead of using a
button
element, we use the Shoelace web-component:<sl-button>Click me</sl-button>
. - The match pattern for the onclick handler changes to
match="sl-button"
.
That’s pretty much all there is to it. Neat. I must try out some more web components when I have a chance. In principle, the seem like a really good idea.