chore(Tooltip): migrate to CSS Modules with visual regression baseline

[DreaminDani]

Commits

• test(Tooltip): add visual regression baseline before CSS Modules migration — adds stories, Playwright spec, and fresh PNG snapshots that capture the current rendering.
• chore(Tooltip): migrate styling from styled-components to CSS Modules — replaces styled-components with .module.css + cn. DOM-identical, byte-for-byte visual parity verified.

Verification

• yarn test:visual tests/display/tooltip.spec.ts passes with zero snapshot regenerations
• yarn test Tooltip, yarn lint:css, yarn lint:code, yarn format, yarn build all green
• grep -r 'styled-components' src/components/Tooltip/ empty

---

Note

Low Risk
Presentation-only refactor of a single component with explicit visual parity tests; public API and Radix behavior stay the same.

Overview
Tooltip styling moves off styled-components onto Tooltip.module.css, using existing --click-tooltip-* tokens and a --tooltip-max-width inline override for the maxWidth prop. Tooltip.Content now merges classes with cn and applies arrow styles directly on RadixTooltip.Arrow.

Storybook gains a TooltipExample wrapper plus controlled stories (open with/without arrow, maxWidth wrapping) to lock rendering. New Playwright visual tests in tests/display/tooltip.spec.ts snapshot those stories in light/dark and assert hover opens the panel.

Patch changeset notes no behavior change for @clickhouse/click-ui.

^{Reviewed by Cursor Bugbot for commit 9bf63a4. Bugbot is set up for automated code reviews on this repo. Configure here.}

[changeset-bot]

🦋 Changeset detected

Latest commit: 9bf63a4

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-9injmdw3m-clickhouse.vercel.app

Built from commit: 7b2b6543e3e4e784c5109586fa4e69faf3d94d0e

[Copilot]

Pull request overview

Migrates the Tooltip component’s styling from styled-components to CSS Modules while adding Playwright visual-regression baselines to ensure byte-for-byte rendering parity across light/dark themes.

Changes:

• Added Playwright visual regression coverage for Tooltip stories (open variants + hover behavior) with light and system-dark snapshots.
• Replaced styled-components Tooltip styling with Tooltip.module.css and cn() class merging; uses a CSS variable to implement the maxWidth prop.
• Added Storybook wrapper/stories to provide stable, controlled Tooltip renderings for snapshotting.

Reviewed changes

Copilot reviewed 5 out of 11 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
tests/display/tooltip.spec.ts	Adds Tooltip visual regression specs and snapshots for light/dark themes plus hover-open behavior.
src/components/Tooltip/Tooltip.tsx	Switches Tooltip content/arrow styling from styled-components to CSS Modules and merges classes via cn.
src/components/Tooltip/Tooltip.stories.tsx	Introduces controlled stories via TooltipExample to stabilize visual baselines.
src/components/Tooltip/Tooltip.module.css	New CSS Module implementing Tooltip content + arrow styling using existing design tokens.
.changeset/migrate-tooltip-to-css-modules.md	Records the Tooltip migration as a patch changeset with no behavior change.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.