[Lens] Color mapping UX refactoring

[markov00]

Summary

This update revisits the UX for the Lens color mapping applying a slightly different UX behaviour to allow looping of colors from a chosen palette.

fix #168891
fix #176076

[stratoula]

@dej611 I see what you say now!

Yes this is weird. Also why does it take the pink color? I am expecting here the next one (yellowish)

[markov00]

@stratoula @dej611 @ninoslavmiskovic I've aligned the next color selection logic in both cases. Now we choose the next color in the palette after the last one configured in the assignments.
This applies in the loop and the next color when adding a new assignment start and should work as expected.

I've also added the suggestion from Stratoula (and Nino in our call) to hide the unassigned terms section until we don't have at least one assigned term: in fact, this doesn't offer any feature when there are no assignments and it also can create confusion if you play with that before assigning terms. @MichaelMarcialis please let us know if is fine for you.

[MichaelMarcialis]

I've also added the suggestion from Stratoula (and Nino in our call) to hide the unassigned terms section until we don't have at least one assigned term: in fact, this doesn't offer any feature when there are no assignments and it also can create confusion if you play with that before assigning terms. @MichaelMarcialis please let us know if is fine for you.

@markov00: Makes sense to me. Let's do it!

[stratoula]

/ci

[stratoula]

I tested it again and works great now!

@markov00 I just find the third disabled swatch a bit weird. When you click the single color I understood why we have it there. Does it make sense to hide it until the user clicks the single color? Or am I missing something obvious here?

What about this?

Also on the inline editing, when the flyout has its maximum width, the left column has a big space with the right one. Can they be responsive ?

[stratoula]

This works great! LGTM! Looking forward to making this the default and remove the switch! 🎉

[stratoula]

/ci

[dej611]

Tested locally in Safari 👍

[kibana-ci]

💚 Build Succeeded

• Buildkite Build
• Commit: 275ccb2
• Storybooks Preview

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
charts	122	125	+3
eventAnnotationListing	466	469	+3
expressionHeatmap	156	159	+3
expressionMetricVis	97	100	+3
expressionPartitionVis	171	174	+3
expressionTagcloud	145	148	+3
expressionXY	231	234	+3
lens	1260	1263	+3
visDefaultEditor	188	191	+3
visTypeTimeseries	442	445	+3
total			+30

Public APIs missing comments

Total count of every public API that lacks a comment. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats comments for more detailed information.

id	before	after	diff
@kbn/coloring	174	180	+6

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
expressionPartitionVis	40.8KB	36.4KB	-4.4KB
expressionTagcloud	23.2KB	18.8KB	-4.3KB
expressionXY	132.6KB	128.2KB	-4.3KB
lens	1.4MB	1.4MB	+1.3KB
total			-11.8KB

Public APIs missing exports

Total count of every type that is part of your API that should be exported but is not. This will cause broken links in the API documentation system. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats exports for more detailed information.

id	before	after	diff
@kbn/coloring	8	9	+1

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
expressionPartitionVis	27.5KB	27.4KB	-161.0B
expressionTagcloud	11.7KB	11.5KB	-161.0B
expressionXY	40.7KB	40.5KB	-161.0B
lens	45.4KB	45.4KB	-1.0B
total			-484.0B

Unknown metric groups

API count

id	before	after	diff
@kbn/coloring	211	217	+6

History

• 💚 Build #192133 succeeded a5e60e5
• 💚 Build #192020 succeeded 70cb65a
• 💚 Build #191904 succeeded 58c37f3
• 💚 Build #191847 succeeded d8dd0a2
• 💚 Build #191808 succeeded 6a8e3eb
• 💚 Build #191568 succeeded dc66b7a

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream