Tooltip arrow positioning issues with `align="start"` and `align="end"`

[wosephjeber]

Bug report

Current Behavior

• When positioned on the top or bottom side and aligned to the start or end, the arrow unexpectedly appears and disappears at different viewport widths. Exactly which viewport widths this happens at seems to vary on the width of the tooltip content, the width of the arrow, and the pixel density of the screen.
• When positioned on the left or right side and aligned to the start or end, the arrow doesn't seem to respect the arrowPadding. It encroaches on the rounded corners of the tooltip content container even when enough arrowPadding has been defined to account for the border radius.

Here's a video of the behavior, recorded from the reproduction below

Screen.Recording.2025-04-07.at.5.34.04.PM.smaller.mov

Expected behavior

• When positioned on the top or bottom side and aligned to the start or end, the arrow should only disappear if the trigger element is cut off by a boundary.
• When positioned on the left or right side and aligned to the start or end, the arrow should respect the arrowPadding.

Reproducible example

Reproduction on StackBlitz: https://stackblitz.com/edit/sb1-hhufqk4f?file=src%2FApp.tsx

Suggested solution

Not sure at the moment.

Additional context

This seems to be happening regardless of whether I'm using the default arrow or a custom arrow element. The reproduction uses a custom arrow element because that's what I was using when I encountered the issue, but I've also tried reverting to the default arrow and still notice the same behaviors.

Your environment

Software	Name(s)	Version
Radix Package(s)	@radix-ui/react-tooltip@	1.1.8
React	n/a	18.3.1
Browser	Chrome	Version 135.0.7049.42 (Official Build) (arm64)
Assistive tech
Node	n/a	22.13.0
npm/yarn	yarn	1.22.22
Operating System	MacOS	Sequoia 15.3.2