Web Components

You don’t necessarily have to do focus handling yourself with shadow DOM web components. For simple wrapper components, there is an easier (and better) way.

When you make a Web Component for a form element, you’ve got a bit of extra work to do to make sure they participate on the form in expected ways.

A framework-agnostic component library, designed to be styled. It can be done.

Turns out `anchor-scope` is pretty darn useful for button/menu setups that will appear multiple times on the same page.

Putting a YouTube video inside a closed details element means it won’t load until that details element is opened. We can use that.

Firefox 147 just came out, and the flagship developer feature is clearly anchor positioning support, bringing that “to the baseline” as we’re supposed to say these days. That rules, but I’m also very hyped about CSS module scripts. Remember, they are a way of importing a stylesheet in JavaScript, that is, the only decent way […]

If your project uses web components of your own making, you could be auto-generating a Custom Elements Manifest that can be ultra-helpful, like powering a VS Code language server.

You can use a smaller part of Lit to build web web components that still take advantage of some of it’s best features, particularly if you’re cool with Light DOM.

Exploring a Card component made hyper flexible though use of easily changeable custom properties, props, and slots.

One of the nice things about Markdown is that you can just… put HTML in there too. There is no Markdown shortcut for a <div>, but you can just use a <div>. That means you can use use <my-custom-element> as well, bringing the world of Web Components into your writing and creating of content. Deane […]