fix: resolve tooltip overflow issue by enabling text wrapping

[hannesrudolph]

Description

Addresses feedback from PR #5098 regarding tooltips extending beyond the plugin viewport boundaries when content is too wide.

Changes Made

• Removed overflow-hidden class from TooltipContent component that was preventing text from wrapping
• Added text wrapping styles with max-w-[300px] and break-words classes to ensure tooltips wrap properly within a reasonable width
• Added optional maxWidth prop to StandardTooltip component to allow customization of maximum tooltip width when needed
• Created comprehensive tests for tooltip behavior including text wrapping, custom widths, and proper rendering

Testing

• All existing tests pass (494 tests)
• Added new test suite for tooltip components with 5 test cases
• Manual testing completed:
  • Verified tooltips now wrap text instead of extending beyond viewport
  • Tested with various content lengths
  • Confirmed custom maxWidth prop works as expected
  • Verified tooltips still appear correctly with short content

Verification of Fix

• Tooltips no longer extend beyond the plugin viewport edge
• Long tooltip content now wraps within a 300px maximum width by default
• Custom maximum widths can be set when needed via the maxWidth prop
• Existing tooltip functionality (delays, positioning, etc.) remains unchanged

Checklist

• Code follows project style guidelines
• Self-review completed
• Comments added for complex logic (prop documentation)
• No breaking changes
• Tests added for new functionality
• All tests passing
• Linting checks pass
• Type checking passes

Screenshots/Demo

Before: Tooltips with long content would extend beyond the plugin viewport edge
After: Tooltips now wrap text within a maximum width of 300px (or custom width if specified)

---

Important

Fixes tooltip overflow by enabling text wrapping and adds customizable width with comprehensive tests.

• Behavior:
  • Removed overflow-hidden class from TooltipContent to allow text wrapping.
  • Added max-w-[300px] and break-words classes for text wrapping.
  • Introduced maxWidth prop in StandardTooltip for customizable tooltip width.
• Components:
  • Updated StandardTooltip in standard-tooltip.tsx to support maxWidth.
  • Applied StandardTooltip across various components like ChatTextArea, ChatView, and CodebaseSearchResult.
• Testing:
  • Added tests in tooltip.spec.tsx for tooltip rendering and behavior.
  • Updated test utilities in test-utils.tsx to include TooltipProvider.
  • Modified existing tests to use @/utils/test-utils for consistent tooltip behavior.

^{This description was created by for fd9211a. You can customize this summary. It will automatically update as commits are pushed.}

[delve-auditor]

We have finished reviewing your PR. We have found no vulnerabilities.

Reply to this PR with @delve-auditor followed by a description of what change you want and we'll auto-submit a change to this PR to implement it.

[Copilot]

Pull Request Overview

This PR fixes tooltip overflow by enabling text wrapping and providing a customizable tooltip API.

• Removed the overflow-hidden constraint and added wrapping styles (max-w-[300px], break-words) to tooltip content
• Introduced a StandardTooltip component with an optional maxWidth prop for consistent delays and custom sizing
• Updated tests to use a custom render wrapper (test-utils.tsx) that includes the TooltipProvider

Reviewed Changes

Copilot reviewed 85 out of 85 changed files in this pull request and generated no comments.

File	Description
webview-ui/src/utils/test-utils.tsx	Added customRender wrapper with TooltipProvider for tests
webview-ui/src/components/ui/tooltip.tsx	Removed overflow-hidden, added collision handling and wrapping
webview-ui/src/components/ui/standard-tooltip.tsx	Created StandardTooltip with maxWidth prop and default delay
webview-ui/src/components/ui/select-dropdown.tsx	Wrapped dropdown trigger in StandardTooltip when title is set

Comments suppressed due to low confidence (2)

webview-ui/src/components/chat/CodebaseSearchResult.tsx:27

• Wrapping a non-interactive
  in a tooltip makes it unreachable for keyboard and screen reader users. Consider making the element focusable (e.g., convert to a or add tabIndex and aria-describedby) so assistive technologies can trigger and announce the tooltip.

		<StandardTooltip content={`Score: ${score.toFixed(2)}`}>

webview-ui/src/components/chat/checkpoints/CheckpointMenu.tsx:51

• Icon-only buttons wrapped in StandardTooltip lack an accessible name for screen readers. Add an aria-label or visually hidden text to the <Button> so that its purpose is clear to all users.

				<StandardTooltip content={t("chat:checkpoint.menu.viewDiff")}>