[xy-chart] add renderLabel to <BarSeries />

[williaster]

🏆 Enhancements

• Adds support to <BarSeries /> for rendering labels via the renderLabel and defaultLabelProps props
  • by default, if a datum has a label property, it will have a label rendered out of the box using the amazing @vx/text <Text /> component (which wraps svg text, etc.). labels are always rendered on top of the Bars themeselves.
  • The label has "smart" default aesthetics (taking from the @data-ui theme), text anchors, and wrapping behavior, but you can override them by setting defaultLabelProps to your own object.
  • to support full label customization, users can define a renderLabel function with the signature ({ datum, index, labelProps }) => node. labelProps includes all values from defaultLabelProps as well as "smart" default values for width, x, y, dx, dy, verticalAnchor, and textAnchor based on bar position, size, and orientation (horizontal vs vertical)
  • Example usage

<BarSeries
  {...restProps}
  defaultLabelProps
  renderLabel={({ datum, labelProps, index: i }) =>
    datum.label ? (
      <Text
        {...labelProps}
        fill={datum.selected ? COLOR_2 : COLOR_1}
      >
        {datum.label}
      </Text>
    ) : null
  }
/>

• Exports the @vx/text <Text /> component to support rendering custom labels.

💔 Breaking Changes

• Updates <PointSeries /> label API to match <BarSeries /> (these are the only series types that support Labels).
• specifically labelComponent was replaced with renderLabel and defaultLabelProps

TODO

• add + fix tests
• update readme

cc @conglei @kristw @rmusa

[codecov]

Codecov Report

Merging #147 into master will increase coverage by 0.03%.
The diff coverage is 88.88%.

@@            Coverage Diff             @@
##           master     #147      +/-   ##
==========================================
+ Coverage    80.5%   80.53%   +0.03%     
==========================================
  Files         109      109              
  Lines        2395     2415      +20     
  Branches      556      568      +12     
==========================================
+ Hits         1928     1945      +17     
  Misses        290      290              
- Partials      177      180       +3

Impacted Files	Coverage Δ
...y-chart/src/annotation/HorizontalReferenceLine.jsx	100% <100%> (ø)	⬆️
.../xy-chart/src/annotation/VerticalReferenceLine.jsx	92.85% <100%> (ø)	⬆️
packages/xy-chart/src/series/PointSeries.jsx	97.43% <87.5%> (-2.57%)	⬇️
packages/xy-chart/src/series/BarSeries.jsx	94.91% <88.23%> (-2.76%)	⬇️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update c08f6b9...19b7cb4. Read the comment docs.