supabase / supabase / 27292085525 / 1 – studio-tests

74%

master: 74%

push

github

fix(studio): custom report tooltips overflow (#46772)

## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

Previously the `overflow-hidden` on the custom report charts container
was cutting off the tooltip within the card bounds. This PR introduces
`PortalChartTooltip` here so the tooltip is able to appear outside of
the bounding area. It is still directionally aware, just relative to the
page viewport as opposed to bounding box.

| Before | After |
|--------|--------|
| <img width="376" height="341" alt="image"
src="https://github.com/user-attachments/assets/4a85901c-6b68-4f02-a13f-d2e261267348"
/> | <img width="466" height="324" alt="Screenshot 2026-06-09 at 11 45
38"
src="https://github.com/user-attachments/assets/0071c670-ef12-4df5-90fc-79df19ce98ca"
/> |

If you want to test quickly but have no data, you can ask Claude to
generate you a dummy custom report chart and then move it around, test
the long tooltips.


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

* **New Features**
* Tooltips can now render in a dedicated layer to improve visibility and
avoid clipping.
* Option added to enable portal-rendered tooltips in condensed/snippet
views.

* **Bug Fixes**
* Improved tooltip positioning to prevent overflow outside the viewport.
  * Corrected percentage label suffixes in chart tooltips.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

988 of 1384 branches covered (71.39%)

Branch coverage included in aggregate %.

1524 of 2082 relevant lines covered (73.2%)

248.54 hits per line