Skip to content

Conversation

@langermank
Copy link
Contributor

@langermank langermank commented Jul 22, 2025

Closes https://github.com/github/primer/issues/5515

Changelog

Visually aligns the React Tooltip with PVC's

Before:

prc pvc
React Rails

After:

prc pvc
React pvc

New

Changed

Removed

Rollout strategy

  • Patch release
  • Minor release
  • Major release; if selected, include a written rollout or migration plan
  • None; if selected, include a brief description as to why

Testing & Reviewing

Merge checklist

@changeset-bot
Copy link

changeset-bot bot commented Jul 22, 2025

🦋 Changeset detected

Latest commit: c6fff1c

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@primer/react Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions github-actions bot added the integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm label Jul 22, 2025
@github-actions
Copy link
Contributor

👋 Hi, this pull request contains changes to the source code that github/github depends on. If you are GitHub staff, we recommend testing these changes with github/github using the integration workflow. Thanks!

@github-actions
Copy link
Contributor

github-actions bot commented Jul 22, 2025

size-limit report 📦

Path Size
packages/react/dist/browser.esm.js 92.32 KB (0%)
packages/react/dist/browser.umd.js 92.47 KB (0%)

@langermank langermank changed the title Align font with PVC Align Tooltip font with PVC Jul 22, 2025
@langermank langermank added the update snapshots 🤖 Command that updates VRT snapshots on the pull request label Jul 22, 2025
@github-actions github-actions bot removed the update snapshots 🤖 Command that updates VRT snapshots on the pull request label Jul 22, 2025
@github-actions github-actions bot temporarily deployed to storybook-preview-6349 July 22, 2025 17:16 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-6349 July 22, 2025 17:25 Inactive
@langermank langermank added the update snapshots 🤖 Command that updates VRT snapshots on the pull request label Jul 22, 2025
@github-actions github-actions bot temporarily deployed to storybook-preview-6349 July 22, 2025 19:07 Inactive
@github-actions github-actions bot removed the update snapshots 🤖 Command that updates VRT snapshots on the pull request label Jul 22, 2025
@github-actions github-actions bot temporarily deployed to storybook-preview-6349 July 22, 2025 19:18 Inactive
@github-actions github-actions bot removed the update snapshots 🤖 Command that updates VRT snapshots on the pull request label Jul 24, 2025
@github-actions github-actions bot temporarily deployed to storybook-preview-6349 July 24, 2025 00:26 Inactive
@langermank langermank marked this pull request as ready for review July 24, 2025 15:53
Copilot AI review requested due to automatic review settings July 24, 2025 15:53
@langermank langermank requested review from a team as code owners July 24, 2025 15:53
@langermank langermank requested a review from mperrotti July 24, 2025 15:53
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR aligns the Tooltip component's font styling with Primer View Components (PVC) by replacing hardcoded CSS values with design token variables and making related improvements.

Key changes:

  • Updates font and padding properties in Tooltip to use design system tokens instead of hardcoded values
  • Adds text-wrap: balance for better typography
  • Removes outdated margin adjustment for keybinding hints
  • Disables animations in a test for better stability

Reviewed Changes

Copilot reviewed 3 out of 147 changed files in this pull request and generated 1 comment.

File Description
packages/react/src/TooltipV2/Tooltip.module.css Updates font, padding, and layout styles to use design tokens; adds text-wrap balance; removes keybinding hint margin
e2e/components/IconButton.test.ts Disables animations in keybinding hint test for stability
.changeset/hot-cooks-collect.md Adds changeset entry documenting the font alignment changes

border: 0;
border-radius: var(--borderRadius-medium);
-webkit-font-smoothing: subpixel-antialiased;
inset: auto;
Copy link

Copilot AI Jul 24, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The text-wrap: balance property has limited browser support and may not work in older browsers. Consider adding a fallback or checking if this aligns with the project's browser support requirements.

Suggested change
inset: auto;
inset: auto;
word-wrap: break-word; /* Fallback for older browsers */
overflow-wrap: break-word; /* Ensures compatibility */

Copilot uses AI. Check for mistakes.
@langermank langermank enabled auto-merge July 24, 2025 16:49
@langermank langermank added this pull request to the merge queue Jul 25, 2025
Merged via the queue into main with commit b831e20 Jul 25, 2025
43 checks passed
@langermank langermank deleted the fix-tooltip-fontsize branch July 25, 2025 19:08
@primer primer bot mentioned this pull request Jul 25, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants