Haz

@haz

Co-founder @ariakit.com. Ex Automattic, WordPress. Posts about Design, JS, CSS, a11y. Neurodivergent, dad.

238 Siguiendo3106 Seguidores957 Publicaciones

Bluesky

¿Es tu perfil?Reclámalo y haz.dirty.social es tuyo.Reclamar perfil

Haz@haz· 6d

Feels good, especially these days 🥲

GitHub pull request statistics showing 532 lines added and 1,636 lines removed, with a five-segment bar indicating substantially more deletions than additions.

Haz@haz· 22d

Ariakit React just hit 1M weekly downloads on npm 🎉 We're just getting started. Launching something big in September/October.

Weekly Downloads metric showing 1,084,779 downloads, with a purple sparkline trending upward despite several dips.

Haz@haz· Jul 13

I don't know if it's just me, but I often struggle with walls of text that lack code examples when trying to understand code decisions. That's why I use this custom instruction in ChatGPT. It really helps me follow its line of thinking during the session and in the final output.

A settings interface for Custom instructions prompting an AI to always include code examples.

Haz@haz· Jul 12

We just removed .nvmrc from Ariakit and let pnpm manage Node.js too. If your project already uses pnpm, you may not need a separate Node version manager. Here’s the migration:

Terminal output showing the successful execution of the pnpm i command in the ariakit repository, adding node version 24.18.0

Haz@haz· Jun 2

If you're using jsdom with Vitest, consider switching to happy-dom instead. It's much faster, but it comes with one caveat: its DOM spec coverage isn't as extensive as jsdom's. That's why I was using jsdom. But there's a better approach...

Console output comparison showing test duration dropping from 46.8 seconds with jsdom to 20.8 seconds with happy-dom

Haz@haz· Mar 21

I'm considering this for all my open-source projects. I prefer a detailed issue/discussion. I don't mind if it's AI-generated as long as it's valid and heads in the right direction. High-quality PRs from external contributors are much rarer, whether they're from humans or AI.

A dark mode settings panel showing pull request permissions set to Collaborators only.

Haz@haz· Mar 16

That pose and outfit kind of remind me of this drawing I made 20 years ago haha.

A black and white pencil sketch of a young woman standing and hugging a dark electric guitar to her chest. She is dressed in a t-shirt reading LOVE ROCK under a fringed vest, plaid shorts, solid black tights, and ankle boots. A sketched, floating staircase curves behind her against a plain background.

Haz@haz· Mar 15

Happy and sad in one image.

A code diff summary showing 22,830 lines added and 48,919 lines removed.

Haz@haz· Feb 28

Tailwind autocomplete would be more useful if multiple related tokens were grouped under their parent token. It would make it much easier to discover and navigate between them.

Two screenshots of a code editor's autocomplete menu for the class bg-. The top image, marked with a red X, shows the menu cluttered with every individual shade of amber like bg-amber-50 and bg-amber-100. The bottom image, marked with a green check, shows a much cleaner menu where all amber shades are grouped into a single line like bg-amber-100, 200, allowing other background utilities to be easily visible.

Haz@haz· Feb 26

Last I checked it was considered fine to use @apply for the use case I’m describing:

Haz@haz· Feb 20

There’s a way to achieve `inherit()` with container style queries, but it’s a bit complicated. You alternate between odd and even variables, use one, and set the other:

$@container style(--_ak-layer-parent-parity: even) { --_ak-layer-parent-parity: odd; --_ak-layer-parent-odd: var(--ak-layer); --ak-layer-parent: var(--_ak-layer-parent-even); } @container style(--_ak-layer-parent-parity: odd) { --_ak-layer-parent-parity: even; --_ak-layer-parent-even: var(--ak-layer); --ak-layer-parent: var(--_ak-layer-parent-odd); }$