fix(react-charts): honor caller positioning in ChartPopover and forward DonutChart calloutProps - #36775
Open
Cameron Bloomfield (Cam-Bloom) wants to merge 1 commit into
Conversation
Author
|
@microsoft-github-policy-service agree company="Sir Joseph Isherwood Limited" |
Cameron Bloomfield (Cam-Bloom)
marked this pull request as ready for review
September 23, 2026 07:14
Cameron Bloomfield (Cam-Bloom)
marked this pull request as draft
September 23, 2026 07:15
…rd DonutChart calloutProps
Cameron Bloomfield (Cam-Bloom)
force-pushed
the
user/cam-bloom/chart-popover-positioning
branch
from
September 23, 2026 08:30
90abc6b to
226a9bc
Compare
Cameron Bloomfield (Cam-Bloom)
marked this pull request as ready for review
September 23, 2026 08:34
2 tasks done
Tudor Popa (tudorpopams)
requested a review
from Paul Mardling (PaulGMardling)
October 1, 2026 13:09
This branch has not been deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Previous Behavior
ChartPopoverread onlypositioning.targetfrom itspositioningprop and hard-codedautoSize: 'always',offset: 20andcoverTarget: false.position,align,offset,autoSizeand every other value from the caller were dropped, and a shorthand string such as'below'was ignored.DonutChartnever readprops.calloutProps, althoughDonutChartPropsdeclares it.customCallout.customCalloutPropswas merged after thepositioning was read, so
calloutPropsPerDataPointcould not position the callout either.A donut slice larger than about half the ring has a bounding box as tall as the chart. The
callout then had no free space outside the box: it was squashed to a scroll box or hidden.
New Behavior
ChartPopoverresolves the callerpositioningand the per-pointpositioningwithresolvePositioningShorthand, merges them key by key, and spreads the result over theprevious defaults. The chart target is kept unless a caller sets its own.
DonutChartforwardscalloutPropstoChartPopover, the same as the cartesian charts,and merges the caller positioning with its target instead of overriding it.
@fluentui/react-positioningis now a declared dependency (it was only a type import).Tests:
ChartPopover.test.tsxandDonutChartCallout.test.tsxmockPopoverand assert thepositioning it receives. Four of the five fail on the previous code.
Follow-up, out of scope here:
GaugeChartandFunnelChartspreadcalloutPropsbutoverride
positioningwith their target, andHorizontalBarChartdoes not forwardcalloutPropsat all. Each needs the same one-line merge asDonutChart.Related Issue(s)