fix(tooltip): animate scale property properly

[vaibhavshn]

Animate scale properly as well in the tooltip component so it doesn't appear staggered or weird when it animates out when you lose focus of the trigger.

Won't see much difference in the gifs below - you have to look closely, but will see when you use it.

Before:

After:

---

• Reviews
  • bonk has reviewed the change
  • automated review not possible because:
• Tests
  • Tests included/updated
  • Automated tests not possible - manual testing has been completed as follows:
  • Additional testing not necessary because: it is a transition issue. scale was left out of being transitioned.

[pkg-pr-new]

npm i https://pkg.pr.new/@cloudflare/kumo@515

commit: 15ce9ac

[github-actions]

Docs Preview

View docs preview

Commit: 15ce9ac

[github-actions]

Visual Regression Report — 1 changed, 4 unchanged

1 screenshot(s) with visual changes:

Tooltip (Open)

263 px (0%) changed

Before	After	Diff

4 screenshot(s) unchanged

• Tooltip / Tooltip Hero
• Tooltip / Tooltip Basic
• Tooltip / Tooltip Multiple
• Tooltip / Tooltip Delay

---

Generated by Kumo Visual Regression

[mattrothenberg]

/bonk

[ask-bonk]

PR Summary

PR #515: Fix tooltip scale animation exit transition

Changes Made

This PR fixes the tooltip's exit animation by adding scale to the CSS transition properties. The issue was that while the tooltip had scale-90 applied during enter/exit states, the scale property wasn't being transitioned, causing a staggered or abrupt animation when focus was lost.

Files Modified

1. .changeset/smooth-tooltip-exit.md (new) - Changeset marking this as a patch release for @cloudflare/kumo
2. packages/kumo/src/components/tooltip/tooltip.tsx - Updated two locations:
   • tooltipVariants() function: transition-[transform,opacity] → transition-[transform,scale,opacity]
   • Inline Tooltip component className: same change

Technical Details

The fix ensures that the scale CSS property is animated alongside transform and opacity, creating a smoother exit transition when the tooltip closes.

CI/Review Status

• ✅ pkg-pr-new: Preview package available (npm i https://pkg.pr.new/@cloudflare/kumo@515)
• ✅ Docs preview: Deployed at https://76585de4-kumo-docs.design-engineering.workers.dev
• ✅ Visual regression: 4 minor pixel changes detected (likely unrelated noise), 34 unchanged
• ✅ Code review: Approved by mattrothenberg

The change is minimal, targeted, and follows the existing code patterns in the component.

github run