Skip to content

Apply BarStackClipLayer on active bars#6906

Merged
ckifer merged 1 commit intomainfrom
barstack-activebar
Jan 19, 2026
Merged

Apply BarStackClipLayer on active bars#6906
ckifer merged 1 commit intomainfrom
barstack-activebar

Conversation

@PavelVanecek
Copy link
Collaborator

@PavelVanecek PavelVanecek commented Jan 19, 2026 •
edited by coderabbitai bot
Loading

Description

Portal erases the clip so I applied it again.

Related Issue

Fixes #6890

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

  • My change requires a change to the documentation.
  • I have updated the documentation accordingly.
  • I have added tests to cover my changes.
  • I have added a storybook story or VR test, or extended an existing story or VR test to show my changes

Summary by CodeRabbit

Release Notes

  • New Features

    • Bar charts now support a defaultIndex prop to set the initially highlighted bar on load
    • Active bars now display with customized fill colors for improved visual feedback

  • Tests

    • Updated bar chart tests to verify default index initialization behavior

✏️ Tip: You can customize this high-level summary in your review settings.

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Jan 19, 2026 •
edited
Loading

Walkthrough

When a Bar is active within a BarStack, the active bar is now wrapped in a BarStackClipLayer to preserve styling properties like radius. The example component is updated to support a defaultIndex prop for tooltip behavior, and tests are adjusted accordingly.

Changes

Cohort / File(s) Summary
Core rendering fix
src/cartesian/Bar.tsx		 When Bar is active, BarRectangle is wrapped inside BarStackClipLayer instead of rendering directly, preserving radius and styling when hovering bars in a stacked configuration.
Example & test updates
www/src/docs/exampleComponents/BarChart/RangedStackedBarChart.tsx, test-vr/tests/www/BarChartApiExamples.spec-vr.tsx		 RangedStackedBarChart now accepts optional defaultIndex prop wired to Tooltip, each Bar includes activeBar fill colors, and test passes defaultIndex="1" to exercise the new feature.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

  • #6676: Modifies BarRectangleItem export and handling in src/cartesian/Bar, which is directly affected by this PR's rendering changes.
  • #6553: Updates z-index and layering logic for active bar elements, closely related to the BarStackClipLayer wrapping change.
  • #6536: Also modifies Bar rendering layering in src/cartesian/Bar.tsx, affecting render order and stacking behavior.

Suggested labels

enhancement

Suggested reviewers

  • ckifer
🚥 Pre-merge checks | ✅ 4 | ❌ 1
❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% 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 'Apply BarStackClipLayer on active bars' clearly and specifically describes the main change in the code, which wraps active BarRectangles in BarStackClipLayer.
Description check ✅ Passed The description includes Related Issue link, explanation of the bug fix, and indicates VR tests were added; all key sections are covered despite some optional sections being omitted.
Linked Issues check ✅ Passed The code changes directly address issue #6890 by reapplying BarStackClipLayer to active bars, which preserves the radius style when activeBar is used with BarStack.
Out of Scope Changes check ✅ Passed All changes are focused on fixing the BarStack and activeBar conflict; modifications to component props and VR tests are directly related to testing and demonstrating the fix.

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

✨ Finishing touches
  • 📝 Generate docstrings

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.

@codecov
Copy link

codecov bot commented Jan 19, 2026 •
edited
Loading

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 94.35%. Comparing base (0374d8e) to head (37a4338).
⚠️ Report is 1 commits behind head on main.

Additional details and impacted files 
@@           Coverage Diff           @@
##             main    #6906   +/-   ##
=======================================
  Coverage   94.35%   94.35%           
=======================================
  Files         566      566           
  Lines       55404    55427   +23     
  Branches     5182     5182           
=======================================
+ Hits        52275    52298   +23     
  Misses       3120     3120           
  Partials        9        9

☔ 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.

@github-actions
Copy link
Contributor

github-actions bot commented Jan 19, 2026

Staging Deployment Details

These deployments will remain available for 30 days.

To update snapshots: Comment /update-snapshots on this PR to automatically update the baseline screenshots.

@ckifer ckifer merged commit 2548a9f into main Jan 19, 2026
47 checks passed
@PavelVanecek PavelVanecek deleted the barstack-activebar branch January 19, 2026 19:16
@codecov
Copy link

codecov bot commented Jan 20, 2026

Bundle Report

Changes will increase total bundle size by 202 bytes (0.01%) ⬆️. This is within the configured threshold ✅

Detailed changes
Bundle name Size Change
recharts/bundle-cjs 1.21MB 91 bytes (0.01%) ⬆️
recharts/bundle-es6 1.05MB 81 bytes (0.01%) ⬆️
recharts/bundle-umd 529.48kB 30 bytes (0.01%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: recharts/bundle-cjs

Assets Changed:

Asset Name Size Change Total Size Change (%)
cartesian/Bar.js 91 bytes 27.91kB 0.33%
view changes for bundle: recharts/bundle-umd

Assets Changed:

Asset Name Size Change Total Size Change (%)
Recharts.js 30 bytes 529.48kB 0.01%
view changes for bundle: recharts/bundle-es6

Assets Changed:

Asset Name Size Change Total Size Change (%)
cartesian/Bar.js 81 bytes 26.18kB 0.31%

@coderabbitai coderabbitai bot mentioned this pull request Jan 22, 2026
Merged
7 tasks
@coderabbitai coderabbitai bot mentioned this pull request Feb 22, 2026
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@ckifer ckifer ckifer approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

BarStack conflicts with activeBar

2 participants

@PavelVanecek @ckifer