fix(Tooltip): forward the ref and props of Tooltip.Trigger with asChild

[ariser]

Description

• Tooltip.Trigger now forwards its ref. Before, it was a plain function component, so a ref was dropped with and without asChild.
• With asChild, the props given to Tooltip.Trigger (event handlers, aria-*, data-*, className, style) now reach the child element. Before, only the child's own props survived. The props and the ref go through Radix Slot, which merges event handlers, class names, styles and refs with the child's own.
• Without asChild, the wrapper <div> gets the props as before, and now the ref too. The markup does not change.
• The ref is typed HTMLElement, because with asChild it lands on the consumer's element, whatever its tag. TooltipTriggerProps is unchanged.

Links and tickets

CUI-326. Related: #1257. With both, Dropdown.Item asChild can be the child of Tooltip.Trigger asChild.

Good to know

• This makes it possible to compose Tooltip.Trigger asChild as the asChild child of another Radix part (for example inside Dropdown.Item asChild), so consumers no longer need a controlled tooltip as a workaround.
• Known separate issue, not changed here: without asChild, the trigger is a non-focusable <div>, so keyboard users cannot open the tooltip. That is a markup and accessibility change for a follow-up PR.
• No new dependency: @radix-ui/react-slot is already a direct dependency.

Tests

Tooltip.test.tsx: Tooltip.Trigger passes its props and ref to the child with asChild, and to the wrapper element without it.

Test	Mutation that made it fail
passes its props to the child with asChild	Slot {...props} → {...(asChild ? {} : props)}
calls its onClick together with the child's onClick with asChild	same as above; and cloneElement(children, props), which overwrites the child's onClick
points its ref at the child with asChild	ref={asChild ? undefined : ref}
passes its props to the wrapper element without asChild	{...(asChild ? props : {})}
points its ref at the wrapper element without asChild	ref={asChild ? ref : undefined}

Checklist

• Breaking changes? (add migration notes in changesets)
• Visual changes? (specify in changesets)
• Design review needed?

Contribution

• Sufficient research before PR
• Self-reviewed the PR
• Manually tested the changes (when applies - visual confirmation in Storybook)
• build and build-storybook work locally
• Tests and Stories are aligned with the changes

Accessibility

No markup, styles or ARIA changed. Props such as aria-* that a consumer gives to Tooltip.Trigger asChild now reach the child (WCAG 4.1.2 Name, Role, Value). Not tested: a manual keyboard pass and the Storybook axe panel.

Screenshots

None: there is no visual change. yarn test:visual Tooltip (7) and EllipsisContent (11) pass with no snapshot changes.

🤖 Generated with Claude Code

[changeset-bot]

🦋 Changeset detected

Latest commit: 3eb067e

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clickhouse/click-ui	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[workflow-authentication-public]

Storybook Preview Deployed

✅ Preview URL: https://click-6jbazf5v9-clickhouse.vercel.app

Built from commit: 36df2a0897f5d7d8ebe997589d3de88dfd196cb3

[workflow-authentication-public]

Chromatic Storybook

Check	Status	Link
Storybook	✅ 642 stories published	Open Storybook
UI Tests	✅ 642 tests unchanged	Open build

Built from commit: 3eb067e203b35da1c2763addafc215ca0f36747b · Chromatic run

_{Statuses as of the end of the run. The build link shows the live review state.}