feat: text improvements

[monfera]

Summary

This PR

• adds font configurability for the values separately from label text
• adds the ability to use the parent information in accessor functions
• adds a sortIndex for accessors which represents the index of the shape among the children of its parent, in decreasing value (size) order
• adds a straightforward way to display (formatted) values in linked annotations - previously it was only possible via the label formatter
• ensures that fill text color inversion takes into account the opacity in a possible rgba() color string
• adds stories (see below for screenshots)
• moves utilities out of stories
• adds type improvements (tighter and simpler typing) and solves a couple of code todos
• ensures that fill text is only ever rendered for a shape if the entirety of the text, including the formatted value, fits

Label vs value formatting:

Opacity lowered outer ring story:

Combined example for:

• more convenient value rendering in the linked label
• categorical color use (here, colorbrewer2.org by Cynthia Brewer et al)
  

Combined example for

• cyclical color
• color determination based on the mean angle of the sector: rather distinct colors in the inner ring, while related, yet distinct colors in the outer ring
  

Combined example for

• treemap coloring: colorbrewer2.org
• different formatting for the values
  

Combined example for

• treemap coloring: color pick at Layer 1 but it's perturbed at Layer 2 for distinct rectangle colors
• formatting of valueFont for treemaps
• text color inversion for treemap in both Layers
  

Checklist

Use strikethroughs to remove checklist items you don't feel are applicable to this PR.

• Any consumer-facing exports were added to src/index.ts (and stories only import from ../src except for test data & storybook)
• This was checked for cross-browser compatibility, including a check against IE11
• Proper documentation or storybook story was added for features that require explanation or tutorials
• Unit tests were updated or added to match the most common scenarios
• Each commit follows the convention

[codecov-io]

Codecov Report

Merging #524 into master will increase coverage by 0.06%.
The diff coverage is 16.66%.

@@            Coverage Diff             @@
##           master     #524      +/-   ##
==========================================
+ Coverage   75.21%   75.28%   +0.06%     
==========================================
  Files         193      193              
  Lines        5806     5793      -13     
  Branches     1078     1113      +35     
==========================================
- Hits         4367     4361       -6     
+ Misses       1423     1416       -7     
  Partials       16       16

Impacted Files	Coverage Δ
...ypes/partition_chart/renderer/canvas/partition.tsx	43.47% <16.66%> (-0.59%)	⬇️

---

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 e66dfd0...3073676. Read the comment docs.

[markov00]

I've left few comments on the code and I think there are also few issues on the following screenshots:

• we should avoid having scrollbars on the snapshot: integration/tests/__image_snapshots__/all-test-ts-baseline-visual-tests-for-all-stories-sunburst-sunburst-three-layers-visually-looks-correct-1-snap.png

• looks like it is clipped on the bottom side:
  integration/tests/__image_snapshots__/all-test-ts-baseline-visual-tests-for-all-stories-treemap-two-layers-stress-test-visually-looks-correct-1-snap.png

[markov00]

Changes LGTM

[markov00]

🎉 This PR is included in version 17.0.0 🎉

The release is available on:

• GitHub release
• npm package (@latest dist-tag)

Your semantic-release bot 📦🚀