7028: Reduce timeseries tooltip to max 5 items

[cdavalos7]

Motivation for features / changes

Limits tooltip display to 5 items and adds a legend indicating additional items when there are more than 5 series.
This prevents tooltips from becoming too large and improves readability and usability when many series are present.

Technical description of changes

• Tooltip data is limited to a maximum of 5 items to avoid oversized tooltips.
• When more than 5 items exist, a legend row is added showing the count of additional items.
  • Example: “3 additional items” when 8 total items exist.
  • Correctly handles singular and plural cases (“1 item” vs “2 items”).
• Updated tooltip templates in the following components:
  • Scalar Card Component: Custom tooltip template updated.
  • Line Chart Interactive View: Default tooltip template updated.
• Tooltip data is pre-computed during data updates instead of calling functions from templates.
  • This reduces change detection overhead and improves performance.
• Handles edge cases such as empty data, exactly 5 items, and different numbers of columns in the tooltip table.
• Removes the tooltip scroll, which was not providing useful interaction.

Screenshots of UI changes

Detailed steps to verify changes work correctly

1. Load a timeseries chart with 5 or fewer series.
   • Verify the tooltip displays all items without a legend.
2. Load a timeseries chart with more than 5 series.
   • Verify the tooltip displays only the first 5 items.
   • Verify a legend row appears indicating the number of additional items.
3. Test scenarios with exactly 6 items and more than 10 items.
   • Confirm correct singular/plural text is displayed.
4. Verify behavior in both:
   • Scalar cards
   • Default line chart tooltips
5. Confirm the tooltip no longer shows a scroll and remains readable.
6. Run tests:

   bazel test //tensorboard/webapp:karma_test_chromium-local

[google-cla]

Thanks for your pull request! It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

View this failed invocation of the CLA check for more information.

For the most up to date status, view the checks section at the bottom of the pull request.