fix: prevent nested anchor elements in NavigationItem tooltip

[claygeo]

Fixes #27984. Wrap Link in a span so Radix Tooltip doesn't create nested anchor elements. 1 file, 2 lines. Replaces #28645 which had unrelated changes.

[cubic-dev-ai]

No issues found across 1 file

[romitg2]

hey mind adding before/after image, maybe showing that console that error no longer appears, and ui is not affected.

[claygeo]

@romitg2 Thanks for the review! Here are the before/after screenshots from the reproduction app (#27984).

Before (bug) — validateDOMNesting console error

Tooltip.Trigger asChild merges trigger props into <Link>, making the <Link> render as <a>. Any descendant anchor (like a badge) creates invalid nesting:

Console output:

Warning: validateDOMNesting: <a> cannot appear as a descendant of <a>.
  at a
  at NavigationItem (NavigationItem.tsx:206)
  at Tooltip (Tooltip.tsx:49) — TooltipPrimitive.Trigger asChild
  at NavigationItem (NavigationItem.tsx:205)

After (fix) — console clean

Wrapping <Link> in <span> gives Tooltip.Trigger a non-anchor element to attach to. The <a> is inside the span, no nesting:

DOM before:

<a data-state="closed">  <!-- Tooltip.Trigger asChild'd into Link -->
  Event Types
  <a href="...">3</a>  <!-- nested anchor = console error -->
</a>

DOM after:

<span data-state="closed" class="flex w-full">  <!-- Tooltip.Trigger → span -->
  <a href="...">  <!-- Link, not nested in another <a> -->
    Event Types
    <a href="...">3</a>  <!-- OK: nested in span, not in <a> -->
  </a>
</span>

Visual layout is identical — both sections show the same nav items. Only the nesting structure changes.