IconButton: introduce tooltips on icon buttons behind the unsafeDisableTooltip prop for an incremental rollout

[broccolinisoup]

This PR introduces the tooltip behaviour on icon buttons with an option to be able to disable it with disable unsafeDisableTooltip prop. It is based on our team discussion https://github.com/github/primer/discussions/3027

Changelog

New

• unsafeDisableTooltip prop is added with the default value of true
• tooltipDirection prop is added to icon button as an optional prop.
  • https://github.com/github/primer/pull/3000
• description prop is added to icon button as an optional prop to add additional text to icon buttons (I.e. an icon button named with "Notifications" and "You have unread notifications" as a description to provide extra information)
  • https://github.com/github/primer/pull/2339

Changed

• If unsafeDisableTooltip prop is passed as false, IconButton is going to be rendered with a tooltip.
• listLabelledBy attribute on the ActionMenu.Overlay returns the tooltip id if the menu anchor is an icon button.

Removed

Nothing

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

We do not expect any change in icon buttons with this PR. This is the first step of the roll out strategy.

Testing & Reviewing

Merge checklist

• Added/updated tests
• Added/updated documentation
• Added/updated previews (Storybook)
• Changes are SSR compatible
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge
• (GitHub staff only) Integration tests pass at github/github (Learn more about how to run integration tests) - https://github.com/github/github/pull/311597 There are some failing but I believe they are not related to the branch. I'll update it after checking with the release coordinator

[changeset-bot]

🦋 Changeset detected

Latest commit: a4cef3b

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	Minor

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]

size-limit report 📦

Path	Size
packages/react/dist/browser.esm.js	87.96 KB (+0.17% 🔺)
packages/react/dist/browser.umd.js	88.32 KB (+0.12% 🔺)

[siddharthkp]

Hi!

Optional feedback about strategy that has less steps: https://github.com/github/primer/discussions/3027#discussioncomment-8409508 (sorry for changing the strategy on you!)

It's pretty much the same strategy but grouped differently. Key difference is that the prop/flag is always opting-out of tooltip instead of opting-in, which is in line with the future we want.

[langermank]

Approving the rogue snapshot test!