… example

Co-authored-by: PavelVanecek <[email protected]>

…tConnectNulls to website example (#7073)

PR #7041 fixed stacked `AreaChart` null handling but broke
`connectNulls={true}` — null points became break points even when the
user explicitly opted into connecting them.

## Changes

- **Revert `src/cartesian/Area.tsx`**: Restore `connectNulls`
destructuring and `!connectNulls &&` guard in `isBreakPoint`. With
`connectNulls={true}` on a stacked chart, null entries are treated as 0
(connected through) rather than skipped.
- **Revert `test/chart/AreaChart.spec.tsx`**: Restore original test
name, expected `d` path, and assertions — `pv` area correctly curves
through the null point at y=43 rather than jumping straight across.
- **Migrate stacked story to website example**:
`StackedAreaChartConnectNulls` storybook story removed;
`AreaChartConnectNulls.tsx` website example now shows all four cases:
simple with/without `connectNulls` and stacked with/without
`connectNulls`.
- **Delete stale VR snapshots**: Old screenshots for
`AreaChartConnectNulls` removed so CI regenerates them against the
updated component.

## Related Issue

Fixes #7070

Reopens #6985

## Motivation and Context

`!connectNulls &&` was the intentional guard that let users opt into
connecting through null values in stacked charts. Removing it (PR #7041)
meant `connectNulls={true}` had no effect in stacked mode, producing a
single straight interpolated line instead of a smooth stacked curve,
causing visible visual artifacts.

## How Has This Been Tested?

Unit test `'Renders null points as 0 if stacked and connectNulls is
true'` in `test/chart/AreaChart.spec.tsx` verifies the correct path `d`
values. VR test for `AreaChartConnectNulls` will generate new
screenshots covering all four chart variants.

## Screenshots (if appropriate):

## Types of changes

- [x] Bug fix (non-breaking change which fixes an issue)

## Checklist:

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

<!-- START COPILOT ORIGINAL PROMPT -->



<details>

<summary>Original prompt</summary>

> 
> ----
> 
> *This section details on the original issue you should resolve*
> 
> <issue_title>[Unreleased] Area connect nulls overlaps</issue_title>
> <issue_description>## What is the current behavior?
> ## What is the expected behavior?
> 
>
https://www.chromatic.com/test?appId=63da8268a0da9970db6992aa&id=69a3a5c4a8428a9961c0a8ca
> 
> #7041 fixed some problems but
created new different problems.</issue_description>
> 
> <agent_instructions>Please revert changes from the PR that caused this
problem. Then, migrate the AreaChartConnectNulls.tsx storybook from
stories to a website example, and then add a VR test for
it.</agent_instructions>
> 
> ## Comments on the Issue (you are @copilot in this section)
> 
> <comments>
> </comments>
> 


</details>



<!-- START COPILOT CODING AGENT SUFFIX -->

- Fixes #7070

<!-- START COPILOT CODING AGENT TIPS -->
---

✨ Let Copilot coding agent [set things up for
you](https://github.com/recharts/recharts/issues/new?title=✨+Set+up+Copilot+instructions&body=Configure%20instructions%20for%20this%20repository%20as%20documented%20in%20%5BBest%20practices%20for%20Copilot%20coding%20agent%20in%20your%20repository%5D%28https://gh.io/copilot-coding-agent-tips%29%2E%0A%0A%3COnboard%20this%20repo%3E&assignees=copilot)
— coding agent works faster and does higher quality work when set up for
your repo.


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Bug Fixes**
* Fixed stacked area charts to properly treat missing data points as
zero when the connectNulls option is enabled, preventing unwanted
breakpoints in the chart visualization.

* **Documentation**
* Added examples demonstrating stacked area chart behavior with and
without connectNulls for handling missing data.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: copilot-swe-agent[bot] <[email protected]>
Co-authored-by: PavelVanecek <[email protected]>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

…ies are null

Fixes recharts#6985. PR recharts#7041 removed the !connectNulls guard entirely, which caused
a regression (recharts#7070) where stacked areas overlapped when connectNulls={true}
and only some series had null values.

This v2 fix preserves the original !connectNulls guard and adds a new
allStackedSeriesNull check: when connectNulls is true and a stacked chart has
a data point where ALL series in the stack are null, only then treat it as a
breakpoint. If only some series are null, they are connected through as 0
(the correct stacking behavior).

Changes:
- Added selectStackDataKeys selector to retrieve all dataKeys in a stack group
- Pass stackDataKeys into computeArea
- isBreakPoint now has three conditions:
  1. value1 == null (basic null check)
  2. hasStack && !connectNulls && rawValue == null (original guard, preserved)
  3. allStackedSeriesNull (new: all series null → break even with connectNulls)

…ries is null (#7566)

Fixes #6985.

![Stacked AreaChart with connectNulls, dataWithGaps dataset. Before:
all-null point at Page C collapses to 0. After: Page C connects across,
and the partial-null uv at Page F still renders as
0.](https://raw.githubusercontent.com/kimlj/recharts/pr-6985-assets/6985-before-after.png)

Top chart is master, bottom is this PR. The all-null point (Page C)
connects across; the partial-null point (Page F, only `uv` missing)
still renders as 0, so the #7073 regression does not return.

## Problem

In a stacked AreaChart with `connectNulls`, a data point where every
series is null renders as a drop to 0 instead of connecting across the
gap. d3-stack defaults nulls to 0, so `value1` is never null for stacked
data, and the `!connectNulls` guard is the only thing controlling null
behavior there.

## Change

`computeArea` in `src/cartesian/Area.tsx` marks a point as a break point
when every dataKey in the stack group is null (`wholeStackIsNull`). The
stack dataKeys are supplied by a new `selectStackDataKeys` selector in
`src/state/selectors/areaSelectors.ts`.

The `!connectNulls && rawValue == null` guard is unchanged, so a point
where only some series are null still renders as 0 in the stack.

- Every series null at a point: connects across (new behavior).
- Some series null at a point: unchanged, renders as 0 to preserve stack
offsets.

## Prior art

This is the design proposed by @Harikrushn9118 in #7085: keep the
existing guard, add a separate all-null check, and pass the stack
dataKeys into `computeArea`. #7085 was closed by its author before
completion. This PR implements that design and commits the VR snapshots
#7085 was missing.

## History

#7041 removed the `!connectNulls` guard and was merged, then reverted in
#7073 because it made stacked charts with a single null series render
incorrectly. This PR keeps that guard and scopes the new behavior to the
all-null case, so the #7073 regression does not return.

## Tests

- `test/chart/AreaChart.spec.tsx`: two regression tests, "connects
across points where every stacked series is null if connectNulls is
true" and "breaks at points where every stacked series is null if
connectNulls is false". Both fail without the source change. The
existing "Renders null points as 0 if stacked and connectNulls is true"
test covers the partial-null case that must stay unchanged.
- `www` example `AreaChartConnectNulls.tsx`: adds a `dataWithGaps`
dataset with an all-null point at Page C and a partial-null point at
Page F.
- VR snapshots committed for chromium, firefox, and webkit.


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Bug Fixes**
* Improved stacked area gap/break detection when an entire stacked point
has all series values missing, so gaps are handled correctly.
* `connectNulls` now reliably bridges fully missing stacked points,
while keeping breaks when `connectNulls` is disabled.
* Partial missing values still render with correct stacked
contributions.
* **Documentation**
* Added stacked area examples showing how gaps are rendered with and
without `connectNulls`.
* **Tests**
* Added coverage validating `connectNulls` behavior for all-missing
stacked points in area charts.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->