@automattic/charts 4.14.0 → 4.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/TOKENS.md +1 -1
  3. package/dist/index.cjs +1249 -325
  4. package/dist/index.cjs.map +1 -1
  5. package/dist/index.css +31 -0
  6. package/dist/index.d.cts +41 -7
  7. package/dist/index.d.ts +41 -7
  8. package/dist/index.js +964 -325
  9. package/dist/index.js.map +1 -1
  10. package/package.json +9 -8
  11. package/src/charts/area-chart/area-chart.tsx +29 -20
  12. package/src/charts/area-chart/types.ts +3 -1
  13. package/src/charts/bar-chart/bar-chart.module.scss +38 -0
  14. package/src/charts/bar-chart/bar-chart.tsx +159 -56
  15. package/src/charts/bar-chart/private/band-tooltip.tsx +40 -5
  16. package/src/charts/bar-chart/private/bar-layer.tsx +66 -13
  17. package/src/charts/bar-chart/private/category.ts +25 -0
  18. package/src/charts/bar-chart/private/comparison-bars-geometry.ts +13 -1
  19. package/src/charts/bar-chart/private/index.ts +3 -1
  20. package/src/charts/bar-chart/private/selected-bar-ring.tsx +17 -6
  21. package/src/charts/bar-chart/private/stack-layout.ts +99 -0
  22. package/src/charts/bar-chart/private/stacked-bar-series.tsx +145 -0
  23. package/src/charts/bar-chart/private/test/stack-layout.test.ts +81 -0
  24. package/src/charts/bar-chart/private/test/value-domain.test.ts +10 -0
  25. package/src/charts/bar-chart/private/use-bar-chart-options.ts +35 -11
  26. package/src/charts/bar-chart/private/{use-overlap-slots.ts → use-bar-slots.ts} +36 -38
  27. package/src/charts/bar-chart/private/use-bar-stops.ts +19 -19
  28. package/src/charts/bar-chart/private/value-domain.ts +10 -8
  29. package/src/charts/bar-chart/test/bar-chart-stacked.test.tsx +546 -0
  30. package/src/charts/bar-chart/test/bar-chart.test.tsx +75 -0
  31. package/src/charts/bar-chart/test/use-bar-legend-items.test.tsx +18 -0
  32. package/src/charts/bar-chart/types.ts +3 -1
  33. package/src/charts/bar-chart/use-bar-colors.ts +12 -0
  34. package/src/charts/bar-chart/use-bar-legend-items.ts +4 -2
  35. package/src/charts/bar-list-chart/bar-list-chart.tsx +2 -0
  36. package/src/charts/line-chart/line-chart.tsx +55 -26
  37. package/src/charts/line-chart/test/line-chart.test.tsx +86 -0
  38. package/src/charts/line-chart/types.ts +3 -1
  39. package/src/charts/private/test/compact-when-short.test.tsx +170 -0
  40. package/src/charts/private/test/tick-decimals.test.tsx +95 -0
  41. package/src/charts/private/tick-decimals.tsx +132 -0
  42. package/src/charts/private/use-compact-when-short.ts +18 -0
  43. package/src/providers/chart-context/themes.ts +4 -0
  44. package/src/types.ts +35 -2
  45. package/src/charts/private/test/whole-number-ticks.test.tsx +0 -57
  46. package/src/charts/private/whole-number-ticks.tsx +0 -79
package/CHANGELOG.md CHANGED
@@ -5,6 +5,15 @@ All notable changes to this project will be documented in this file.
5
5
  The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
6
6
  and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
7
7
 
8
+ ## [4.15.0] - 2026-11-04
9
+ ### Added
10
+ - Axis: Add a `tickDecimals` option that keeps value-axis ticks to a number of decimal places, so rounded labels never repeat. [#54399]
11
+ - Bar chart: Add a stacked layout. [#54447]
12
+ - Line, area and bar charts: Add `compactWhenShort`, which drops the axes, grid and legend while the chart is shorter than the new `theme.compactWhenShort.below` (140px by default). [#54338]
13
+
14
+ ### Changed
15
+ - Update package dependencies. [#54391] [#54512]
16
+
8
17
  ## [4.14.0] - 2026-11-02
9
18
  ### Added
10
19
  - Leaderboard chart: Derive bar shares and percentage change from the values when an entry omits them, and add a `negativeBars` option to draw negative values as empty bars. [#54250]
@@ -1220,6 +1229,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
1220
1229
  - Fixed lints following ESLint rule changes for TS [#40584]
1221
1230
  - Fixing a bug in Chart storybook data. [#40640]
1222
1231
 
1232
+ [4.15.0]: https://github.com/Automattic/charts/compare/v4.14.0...v4.15.0
1223
1233
  [4.14.0]: https://github.com/Automattic/charts/compare/v4.13.0...v4.14.0
1224
1234
  [4.13.0]: https://github.com/Automattic/charts/compare/v4.12.0...v4.13.0
1225
1235
  [4.12.0]: https://github.com/Automattic/charts/compare/v4.11.1...v4.12.0
package/TOKENS.md CHANGED
@@ -160,7 +160,7 @@ The palette is resolved per provider, so one `ColorCache` and one group-to-color
160
160
 
161
161
  The motion pair carries the one-shot reveal a data mark plays on first paint, across all six charts that animate in. It deliberately does **not** cover interaction motion: hover and transition timings read `--wpds-motion-*` directly, as interface chrome rather than a chart role.
162
162
 
163
- `--a8c-charts-border-radius-bar` rounds the conversion funnel's bars. `--a8c-charts-border-radius-bar-chart` rounds the bars of the bar chart and bar list chart; set it to a radius such as `var(--wpds-border-radius-sm)` to opt in. Bar charts apply it as the CSS `rx` property, so it rounds all four corners of a bar. It resolves in CSS at the bar, so an override set anywhere inside the provider tree applies, the chart's own class included; see [Precedence](#precedence) for overrides above the provider.
163
+ `--a8c-charts-border-radius-bar` rounds the conversion funnel's bars. `--a8c-charts-border-radius-bar-chart` rounds the bars of the bar chart and bar list chart; set it to a radius such as `var(--wpds-border-radius-sm)` to opt in. Bar charts apply it as the CSS `rx` property, so it rounds all four corners of a bar; a stacked bar instead clips only the outer end of each stack to it. It resolves in CSS at the bar, so an override set anywhere inside the provider tree applies, the chart's own class included; see [Precedence](#precedence) for overrides above the provider.
164
164
 
165
165
  `--a8c-charts-dimension-leaderboard-label-inset` pads an overlay label at its inline start, inside the `--wpds-border-width-focus` every row reserves for its focus ring. Read both to line up content outside the chart, such as a column header, with the row text.
166
166