[New WC] Coordinate dropdown

[DmitrySharabin]

Depends on #123

This new WC encapsulates the color space dropdown and can be used inside <color-picker> and <color-chart> to allow users to set (change) the color coord dynamically.

[DmitrySharabin]

As @LeaVerou mentioned, the main issue with the current styles is that it doesn't communicate the hierarchy:

I thought, what if we use a chevron instead of a line, like in breadcrumbs? Will it help?

[LeaVerou]

Too many chevrons, but it could work if the dropdown arrow only appears on hover/focus

[DmitrySharabin]

Here are the UIs we considered (until now) for this component in one place.

Current one — Live preview

A là breadcrumbs

With some tweaks (not so many chevrons from the very beginning) — Related PR #150 — Live preview

Demo.mov

Channels as a button group — Related PR #169

With some tweaks (color space picker in bold, smaller text font for channels) — Live preview

Using fieldset (basic — channels is a button group, compact — channels is a <select> element) — Live demo

All the above + A là breadcrumbs + connector — Live preview

[LeaVerou]

Should we close this? We do have this component now.