feat: rewrite color picker and add alpha picker

[yisibl]

We've combined input range and input color into one to keep it aesthetically pleasing and harmonious on the UI.

Here are a few tips:

1. Bind a click event to the input range to call color.showPicker().
2. input range is responsible for changing the alpha, and then color-mix() mixes the color and alpha to get the new color.
3. The color format obtained through getComputedStyle is color(), need to be converted to rgba() by convertColorToRGBA(), because resvg-js doesn't support color().
4. Use anchor positioning to make the color picker's popover follow the slider thumb.

Currently only Chrome is supported.

Closes: #336

2024-05-28.00-30-21.mp4

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
resvg-js	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 28, 2024 3:44pm