Open the swatch's own colour window, not the first on the page

Fixkamo-internal
Shipped
August 23, 2026 at 3:06 AM UTC
Author
kamo
Commit
6969c80

The swatch reached its hidden <input type="color"> through document.getElementById on an id built from the picker's translated label. A label is only unique inside one group: the branding editor renders a Primary and a Secondary group side by side, each carrying a Base Color / Lightest / Lighter / Darker / Darkest slot, so two inputs shared every id and the lookup always returned the first in document order — the Primary group's. Clicking any Secondary swatch opened the Primary colour window. The e-sign annotation toolbar had the same collision between its highlight and draw pickers, both labelled "color". The swatch now clicks its own input through a ref, and the id comes from useId() so no two pickers can collide in the DOM at all.

All changes

Like what you see shipping?

Every one of these updates lands in your workspace automatically. Start free and watch it grow week after week.

Start Free ForeverView Pricing