Code snippets have hover tooltips over content

[dustinbyrne]

The tooltip should only be present above the header

[github-actions]

Title

Restrict tooltip display to the header in MarkdownCodeSnippet component

Problem

In the MarkdownCodeSnippet component, hover tooltips currently appear over the entire code snippet content. The tooltip should only be displayed when hovering over the header, not over other parts of the code snippet.

Analysis

The MarkdownCodeSnippet component uses the VContextContainer component to display the content, which includes a header and code snippet. To ensure that tooltips only appear over the header, the event listeners for displaying tooltips need to be adjusted so they only activate when hovering over the header and not the entire content of the code snippet.

Proposed Changes

1. packages/components/src/components/chat/MarkdownCodeSnippet.vue:
   Modify the event listeners within the MarkdownCodeSnippet component to isolate the tooltip functionality to only the header. This will likely involve changes within the template section and corresponding methods to detect hover events only over the header.

2. packages/components/src/components/chat/MarkdownCodeSnippet.vue:
   Update the styling in the scoped style block to ensure hover effects and tooltips are visually associated only with the header section of the code snippets.

By isolating the hover events and ensuring the corresponding tooltip logic activates solely for the header, the tooltip appearance will be restricted to the desired area.

After implementing these changes, ensure to test the component thoroughly to confirm that tooltips no longer appear when hovering over the code content and only appear over the header.