[bug]: ToolTipConent asChild breaks

[jhernandezb]

Describe the bug

Radix tooltip when content is used as child is expecting exactly one children, but in v4 an arrow was introduced to the content breaking it

ui/apps/v4/registry/new-york-v4/ui/tooltip.tsx

Lines 54 to 55 in 57d15bb

	{children}
	<TooltipPrimitive.Arrow className="bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />

Affected component/components

Tooltip

How to reproduce

 <TooltipProvider>
      <TooltipTrigger asChild>
        <span className="inline-flex">Trigger</span>
      </TooltipTrigger>
      <TooltipContent asChild>
        <div >
          some content
        </div>
      </TooltipContent>
    </TooltipProvider>

Codesandbox/StackBlitz link

No response

Logs

System Info

shadcn@canary, tailwind v4, react 19

Before submitting

• I've made research efforts and searched the documentation
• I've searched for existing issues

[haratake22]

I've researched this issue and would like to share my findings.
Hope this helps.

Most likely, the problem is caused by using asChild on the TooltipContent component.
The TooltipPrimitive.Arrow arrow will display even without adding asChild to the TooltipContent.

The reason why adding asChild to TooltipContent causes an error is likely because TooltipPrimitive.Content, which is wrapped by TooltipContent, has asChild set to false by default in radix-ui.

https://github.com/radix-ui/themes/blob/main/packages/radix-ui-themes/src/components/tooltip.tsx