fix(Sankey): add accessibilityLayer, title, and desc prop support by mixelburg · Pull Request #7153 · recharts/recharts

mixelburg · 2026-03-21T22:26:51Z

Problem

The Sankey chart was missing the accessibilityLayer, title, and desc props that all other Recharts chart types support. This caused TypeScript errors and the <title> element was not rendered in the SVG when provided.

Root causes:

SankeyProps did not declare accessibilityLayer, title, or desc
ReportChartProps was never called, so accessibilityLayer was never dispatched to the Redux store
SankeyImpl used raw <Surface> instead of <RootSurface>, which handles title/desc rendering and accessibilityLayer-based role/tabIndex attributes

Changes

Replace Surface with RootSurface in SankeyImpl so title, desc, and accessibility attributes are handled consistently with all other charts
Add accessibilityLayer, title, and desc to SankeyProps
Add accessibilityLayer: true to sankeyDefaultProps
Call ReportChartProps in the Sankey wrapper component to dispatch accessibilityLayer to the Redux store
Remove now-unused Surface import

Tests

Added 4 new tests to test/chart/Sankey.spec.tsx:

Sankey has role=application and tabIndex=0 by default (accessibilityLayer=true)
Sankey has no role/tabIndex when accessibilityLayer=false
title prop renders a <title> element
desc prop renders a <desc> element

All 27 tests pass.

Summary by CodeRabbit

Release Notes

New Features
- Added accessibility support to Sankey charts with new optional properties including configurable accessibility layer (enabled by default), custom title, and description for enhanced compatibility with assistive technologies.
Tests
- Added comprehensive tests validating proper rendering of accessibility attributes and properties in Sankey component.

coderabbitai · 2026-03-21T22:27:17Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 74821587-2ecd-4734-820b-2f0878e9bb2a

📥 Commits

Reviewing files that changed from the base of the PR and between b39edbf and f9a94a0.

📒 Files selected for processing (2)

src/chart/Sankey.tsx
test/chart/Sankey.spec.tsx

Walkthrough

The PR restores accessibility features to the Sankey component by re-introducing accessibilityLayer, title, and desc props, integrating them with the RootSurface component, and adding test coverage. This addresses a regression from version 3.6.0 where these props were removed.

Changes

Cohort / File(s)	Summary
Accessibility Props & Integration `src/chart/Sankey.tsx`	Added `accessibilityLayer`, `title`, and `desc` optional props to `SankeyProps`. Switched from `Surface` to `RootSurface` component with attribute forwarding. Set `accessibilityLayer: true` as default. Introduced `ReportChartProps` component to handle chart configuration with accessibility settings.
Accessibility Test Coverage `test/chart/Sankey.spec.tsx`	Added comprehensive accessibility tests validating that `<svg>` receives `role="application"` and `tabindex="0"` attributes by default, omits both when `accessibilityLayer={false}`, and conditionally includes `<title>` and `<desc>` SVG elements based on props.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related PRs

fix: implement reverseStackOrder prop in v3 Redux architecture #6644: Demonstrates similar pattern of forwarding root-level props through ReportChartProps to handle chart-wide configuration.
Omnidoc: fix default values for polar charts, and Sankey #6682: Directly modifies Sankey component including sankeyDefaultProps and public SankeyProps interface.
Add missing type exports, test #6852: Modifies the same src/chart/Sankey.tsx file and SankeyProps type definitions.

Suggested reviewers

PavelVanecek
ckifer

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 33.33% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main change: adding accessibilityLayer, title, and desc prop support to the Sankey component.
Description check	✅ Passed	The description covers Problem, Changes, and Tests sections but is missing Motivation/Context and How It Was Tested from the template.
Linked Issues check	✅ Passed	All objectives from issue `#7151` are met: SankeyProps now includes accessibilityLayer, title, and desc; RootSurface handles proper rendering; ReportChartProps is called; tests verify accessibility attributes and element rendering.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to addressing issue `#7151`: adding missing props to Sankey, replacing Surface with RootSurface, calling ReportChartProps, and adding corresponding tests.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

Tip

You can make CodeRabbit's review stricter and more nitpicky using the `assertive` profile, if that's what you prefer.

Change the reviews.profile setting to assertive to make CodeRabbit's nitpick more issues in your PRs.

codecov · 2026-03-21T22:34:51Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 89.61%. Comparing base (b39edbf) to head (f9a94a0).

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #7153   +/-   ##
=======================================
  Coverage   89.61%   89.61%           
=======================================
  Files         536      536           
  Lines       40479    40496   +17     
  Branches     5519     5519           
=======================================
+ Hits        36275    36292   +17     
  Misses       4196     4196           
  Partials        8        8

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

codecov · 2026-03-21T22:43:29Z

Bundle Report

Changes will increase total bundle size by 1.26kB (0.02%) ⬆️. This is within the configured threshold ✅

Detailed changes

Bundle name	Size	Change
recharts/bundle-cjs	1.3MB	504 bytes (0.04%) ⬆️
recharts/bundle-es6	1.13MB	482 bytes (0.04%) ⬆️
recharts/bundle-umd	546.95kB	272 bytes (0.05%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: recharts/bundle-cjs

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
`chart/Sankey.js`	504 bytes	32.56kB	1.57%

view changes for bundle: recharts/bundle-es6

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
`chart/Sankey.js`	482 bytes	30.79kB	1.59%

view changes for bundle: recharts/bundle-umd

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
`Recharts.js`	272 bytes	546.95kB	0.05%

fix(Sankey): add accessibilityLayer, title, and desc prop support

f9a94a0

PavelVanecek approved these changes Mar 21, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

fix(Sankey): add accessibilityLayer, title, and desc prop support#7153

fix(Sankey): add accessibilityLayer, title, and desc prop support#7153
mixelburg wants to merge 1 commit intorecharts:mainfrom
mixelburg:fix/sankey-accessibilityLayer-and-title

mixelburg commented Mar 21, 2026 •

edited by coderabbitai bot

Loading

Uh oh!

coderabbitai bot commented Mar 21, 2026 •

edited

Loading

❌ Failed checks (1 warning)

Uh oh!

codecov bot commented Mar 21, 2026

Uh oh!

codecov bot commented Mar 21, 2026

Assets Changed:

Assets Changed:

Assets Changed:

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

mixelburg commented Mar 21, 2026 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Problem

Changes

Tests

Summary by CodeRabbit

Release Notes

Uh oh!

coderabbitai bot commented Mar 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

❌ Failed checks (1 warning)

Uh oh!

codecov bot commented Mar 21, 2026

Codecov Report

Uh oh!

codecov bot commented Mar 21, 2026

Bundle Report

Affected Assets, Files, and Routes:

Assets Changed:

Assets Changed:

Assets Changed:

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

mixelburg commented Mar 21, 2026 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Mar 21, 2026 •

edited

Loading