[charts] Create color legend

[alexfauquette]

Fix #12379

In this PR I propose to add 2 components to display the legend associated with colorMap:

• ContinuousColorLegend
• PiecewiseColorLegend

The PiecewiseColorLegend is quite similar to the series legend. So I abstracted the rendering into LegendPerItem which takes a array of objects { color, label } and do the display part. Then DefaultChartsLegend, and PiecewiseColorLegend only have to define the colors and labels they want to display

Known point of discussion

• the LegendPerItem being a copy past of the DefaultChartsLegend some naming can be weird/not well suited for the PiecewiseColorLegend
• text are not always perfectly placed. But that's due to text bounding box computation errors. Should be fixed latter
• Components names does not start with the prefix Charts I thought it would make the naming too long. Buit at the same time not putting it kind of break the convention we follow for charts subcomponents

[mui-bot]

Deploy preview: https://deploy-preview-13700--material-ui-x.netlify.app/

Updated pages:

• docs/data/charts/legend/legend.md

Generated by 🚫 dangerJS against ae18c60

[github-actions]

This pull request has conflicts, please resolve those before we can evaluate the pull request.

[JCQuintas]

Nice PR, I think most of my comments are minor details.

A big question though is if we shouldn't only have the ChartsLabel component and derive all other components from it. So the legend props would have all the configuration necessary

I feel the DX would be simpler since users wouldn't need to use composition if they don't want to? WDYT?

[alexfauquette]

I feel the DX would be simpler since users wouldn't need to use composition if they don't want to? WDYT?

I started with a middle ground: a <ColorLegend /> component that does automatically which between gradient or pieces depending on the colorMap.type

The issue is that customization props are not the same (length, thikness, minLabel, spagin, itemWidth, ...) so it would be a pain for the API documentation due to props used in some cases, but not others.

Since those legends are for already advanced use cases, I preferred to add them in a composition manner.

But the heatmap could have it as a slot

[JCQuintas]

This PR might break the ci because this other pr was merged too #13822