my first blocknote contribution: closing the popover
tiny change, huge for me
i’ve always loved tools that make you forget there’s code underneath. everything feels clean, fluid, inevitable… the kind of products where it seems like ui just melts away.
but of course, every smooth interaction is hiding about a hundred tiny edge cases. wanting to learn more about what makes a smooth product tick, i finally peeked behind the curtain and decided to contribute to blocknote, a notion-style text editor. i’ve been a notion fan for years, and blocknote felt like the perfect way to learn how these kinds of editors actually work, while giving something back to the tools i enjoy using.
finding an issue
i didn’t start with a grand feature idea. i scrolled through open issues and saw #1696: “link popover does not close when using static formatting toolbar.”
low priority, and labeled “good first issue.” couldn’t have been more perfect.
setting up
blocknote is a pnpm/nx monorepo with packages for core, react, and multiple ui layers (mantine, shadcn, ariakit). the static toolbar lives in mantine.
it took me a hot minute (and A LOT of broken builds) to get the docs site running locally. i even gutted half the demo pages just to isolate the one example i needed: static formatting toolbar. it was super janky, but it worked.
the fix
the difference between the floating toolbar (which was the working one) and the static one (which didn’t) came down to state management:
the floating toolbar’s plugin explicitly closes the popover after submit
while static toolbar never calls
setOpened(false)and therefore stays frozen in time and space.
so the fix was literally like five lines in CreateLinkButton.tsx:
editLink={(url) => {
update(url);
setOpened(false);
editor.focus();
}}
it’s a tiny change, but now the popover closes like it should.
demo
before: link applied, popover stayed open.
after: link applied, popover closes.
what i learned
monorepos feel like a maze at first, but you get good at pattern-spotting fast.
many bugs are really just “someone forgot to update state.”
you don’t need a huge feature to start contributing to repos, even small ui fixes matter.
it’s a tiny change, but it feels huge. i went from “i don’t even know where to start” to opening a pr that closes a bug.
makes me appreciate how much thought goes into these little interactions. that’s the kind of invisible polish i’ve always loved about products like figma, duolingo, slack, notion.
this isn’t the end, though! i’m so excited to dive in even deeper into blocknote. ✨
