[Charts] Add ability to fully customize chart legends

[allen138]

Is your feature request related to a problem?

Currently, we can modify the position and the alignment of the chart legend via chartConfig. We can also specify if we want to hide the legend through component prop. But we cannot specify exactly how we want the legend to look. Similar to how we have a 'lineConfig' for the lineCharts exposed, we should have a legendConfig so we can fully utilize the props from the lib. https://recharts.org/en-US/api/Legend/.

Our designers would like to have something like this:

However, this is not easily achievable without having access to some of the props such as the legend formatter. If the flexibility of the formatter may still not satisfy the needs of the designers, than we can consider to use the content prop to have full control.

Describe the solution you'd like

Ability to have full control over the Legend component by exposing a config prop that would pass the to the underlying recharts component

Describe alternatives you've considered

No response

Additional Context

No response

Organization

SF

Declaration

• I’m not disclosing any internal or sensitive information.