[Singmin]

🔗 Linked issue

Resolves #5871.

❓ Type of change

• 📖 Documentation
• 🐞 Bug fix (non-breaking)
• 👌 Enhancement
• ✨ New feature
• 🧹 Chore
• ⚠️ Breaking change

📚 Description

When UCheckbox is the direct child of UTooltip, hovering its label does not open the tooltip because the trigger's pointer listeners are forwarded to the inner checkbox button.

Forward pointermove, pointerleave and data-grace-area-trigger to the existing outer Primitive so the box and label share the hover boundary. Keep focus, click, ARIA and form attributes on the inner control, and retain the data-state filter so tooltip state cannot overwrite checkbox state. Attribute splitting happens during rendering, including when tooltip listeners change after toggling disabled.

No public props, slots, emits or DOM wrappers are added. A playground example and eight integration regression cases cover default/list/card labels, nested label-slot content, movement within and outside the root, delayed opening/cancellation, touch, disabled changes, listener invocation counts, keyboard focus, ARIA, accessibility and label-click toggling.

🧪 Validation

• Tooltip, Checkbox and DataSlot specs in both Nuxt and Vue projects: 336 tests passed.
• Full-project ESLint; final changed files also checked.
• Full-project typecheck (Node 24.19.0, NODE_OPTIONS=--max-old-space-size=6144).
• Vue playground build.
• Browser verification of label-area pointer triggering, label click, Space, Tab, Escape and aria-describedby.
• Complete full test suite.

Full-suite limitation: the full-suite run was stopped before completion. It encountered a timeout in DashboardSidebar > renders with mode drawer correctly. A standalone DashboardSidebar rerun passed all 26 tests with the original timeout, but emitted an environment teardown-timeout warning. Google font-provider requests also timed out during environment preparation. Full-suite success is therefore not claimed; this PR is a draft pending complete validation/CI.

📝 Checklist

• I have linked an issue.
• I have added regression coverage and a playground example.
• I have kept this change scoped to Checkbox tooltip interaction.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
ui	Ready	Preview	Oct 18, 2026 7:55am UTC
ui-repl	Ready	Preview	Oct 18, 2026 7:55am UTC

[github-actions]

Client output of the apps in test/bundle that changed, compared to the base branch.

Fixture	JS (gzip)	CSS (gzip)
nuxt-full	893.6 kB (+53 B, +0.0%)	28.4 kB

Raw sizes

Fixture	JS	CSS
nuxt-full	2808.5 kB (+98 B, +0.0%)	204.9 kB

[codspeed]

Merging this PR will not alter performance

✅ 31 untouched benchmarks
⏩ 10 skipped benchmarks¹

---

_{Comparing Singmin:fix/checkbox-tooltip-label (b6eb3c4) with v4 (2b70204)}

Footnotes

1. 10 benchmarks were skipped, so the baseline results were used instead. If they were deleted from the codebase, click here and archive them to remove them from the performance reports. ↩

[pkg-pr-new]

npm i https://pkg.pr.new/@nuxt/ui@7225

commit: b6eb3c4

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

• Configuration used: Organization UI
• Review profile: CHILL
• Plan: Advanced
• Run ID: 29b09d6f-328d-4ba2-957e-0fc9e0815838

📥 Commits

Reviewing files that changed from the base of the PR and between 2b70204 and b6eb3c4.

📒 Files selected for processing: 3

• playgrounds/nuxt/app/pages/components/tooltip.vue
• src/runtime/components/Checkbox.vue
• test/components/Tooltip.spec.ts

Included review availability: This review used your included allowance. Your plan provides up to 8 included reviews per hour; 7 remain after this review.

📝 Walkthrough

The Checkbox now routes pointer-move, pointer-leave, and grace-area attributes to its outer Primitive. Tooltip tests cover hover and focus behavior over Checkbox labels, tooltip state changes, accessibility, and checkbox activation. The Nuxt playground adds a tooltip around an “Accept terms” checkbox.

Priority: ⬇️ Low

Estimated code review effort: 3 (Moderate) | ~20 minutes

Severity of issue fixed: Low

Merge Risk: ⚪ Minimal · up to b6eb3

The label-hover change appears ready to merge after normal checks. The attribute routing does not duplicate handlers or move accessibility and interaction attributes off the checkbox control.

Pre-merge checks: 4 · 1

Failed checks: 1 warning

Check name	Status	Explanation	Resolution
Docstring Coverage		Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 1 files. (2 skipped: 2 …	Write docstrings for the functions missing them to satisfy the coverage threshold.

Passed checks: 4 passed

Check name	Status	Explanation
Title check		The title clearly and concisely describes the primary change: showing the tooltip when the Checkbox label is hovered.
Description check		The description directly explains the Checkbox tooltip bug fix, implementation, regression coverage, and validation status.
Linked Issues check		Issue #5871 requires the tooltip to open when the UCheckbox label is hovered. Checkbox.vue forwards pointermove, pointerleave, and data-grace-area-trigger to the outer Primitive. It keeps control attr…
Out of Scope Changes check		The reviewed changes are limited to Checkbox.vue, Tooltip.spec.ts, and a tooltip playground example. The source change directly fixes label hover boundaries. The tests verify the fix and preserve chec…

Full details: Linked Issues check

Explanation

Issue #5871 requires the tooltip to open when the UCheckbox label is hovered. Checkbox.vue forwards pointermove, pointerleave, and data-grace-area-trigger to the outer Primitive. It keeps control attributes on CheckboxRoot and excludes data-state from forwarded attributes. Tooltip.spec.ts covers label hover for list and card variants, nested label content, pointer transitions, delayed opening, touch input, disabled changes, focus, ARIA, and checkbox activation.

Full details: Out of Scope Changes check

Explanation

The reviewed changes are limited to Checkbox.vue, Tooltip.spec.ts, and a tooltip playground example. The source change directly fixes label hover boundaries. The tests verify the fix and preserve checkbox, keyboard, ARIA, and accessibility behavior. The playground example demonstrates the affected interaction. No unrelated public API or DOM wrapper change is shown.

Full details: Docstring Coverage

Explanation

Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 1 files. (2 skipped: 2 unsupported.)

Resolution

Write docstrings for the functions missing them to satisfy the coverage threshold.

• Fix all pre-merge checks with AI

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create a new PR

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[kazbekaskarov]

Hi, thanks for the contribution! The fix looks good for UTooltip. One thing worth noting: USwitch uses the same pattern (inheritAttrs: false with attrs forwarded to the inner root), so it likely has the same label hover issue. Could we apply the same fix there too, maybe through a small shared helper? Also, since rootAttrs only covers the TooltipTrigger listeners, UPopover mode="hover" still won't open from the label (HoverCard uses onPointerenter), which might be worth handling or at least leaving for a follow-up.

cc: @benjamincanac