I built my first "quick" toast component in about twenty minutes. Then I spent the next two days fixing it, because it turns out the twenty-minute version breaks the second you do anything realistic with it — trigger three toasts back to back, hover over one while it's about to disappear, resize the window, or turn on VoiceOver. What looks like the simplest UI pattern in your whole app is actually a pile of small decisions wearing a trench coat.
Here's the version I landed on after fixing all of that, and the reasoning behind each piece, so you don't have to rediscover it the hard way.
The problems nobody mentions until you hit them
A few things I only figured out by shipping a broken version first:
New toasts kept shoving old ones around instead of stacking cleanly.
