feat: tailwind v4 by dmitriy-kostianetskiy · Pull Request #324 · sqlrooms/sqlrooms

dmitriy-kostianetskiy · 2026-01-27T12:01:16Z

Upgrade tailwind up to v4
Set up css-based tailwind configuration
Replace PostCSS + Autoprefixer with tailwind vite plugin
Replace deprecated tailwind classes
Test sqlrooms-cli app locally (@ilyabo I do need some help with python backend)
Update StackBlitz examples
Update migration guide and readme
Update husky pre-commit hook to be more volta-friendly
Exclude tailwind css files from knip (they are generation tons of import errors which make no sense)

Looks like it works :)

Copilot

Pull request overview

This pull request upgrades the project from Tailwind CSS v3 to v4, representing a significant modernization of the styling infrastructure. The upgrade adopts Tailwind v4's new CSS-first configuration approach, replacing JavaScript-based configuration with CSS @import and @source directives.

Changes:

Replaced tailwind.config.js/tailwind.config.ts with CSS-based configuration using @source directives in all projects
Removed the sqlroomsTailwindPreset TypeScript function in favor of a CSS preset file (packages/ui/tailwind-preset.css)
Migrated from PostCSS + Autoprefixer to the new @tailwindcss/vite plugin for Vite projects (Next.js projects use @tailwindcss/postcss)
Moved CSS custom properties out of @layer base to root level as required by Tailwind v4
Updated documentation with migration guide and new installation instructions

Reviewed changes

Copilot reviewed 120 out of 121 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
packages/ui/tailwind-preset.css	New CSS-based preset replacing the TypeScript configuration
packages/ui/src/tailwind-preset.ts	Removed - no longer needed with CSS-first approach
packages/ui/src/index.ts	Removed export of deprecated `sqlroomsTailwindPreset`
packages/ui/package.json	Updated peer dependency from Tailwind v3 to v4, removed autoprefixer
packages/ui/components.json	Updated config path to point to CSS file
knip.json	Added CSS file ignoring and formatted arrays
examples/*/vite.config.ts	Added `@tailwindcss/vite` plugin to all Vite projects
examples/*/tailwind.config.ts	Removed - replaced by CSS configuration
examples/*/src/index.css	Added `@source` directives and removed `@layer base` wrapper
examples/*/postcss.config.js	Removed - no longer needed with Vite plugin
examples/*/package.json	Updated dependencies: added `@tailwindcss/vite`, removed `autoprefixer` and `postcss`, upgraded `tailwindcss` to v4
examples/nextjs/postcss.config.mjs	Updated to use object syntax for PostCSS plugin configuration
examples/nextjs/app/globals.css	Added `@source` directives for Next.js-specific paths
examples/ai-nextjs/postcss.config.mjs	Updated to use object syntax for PostCSS plugin configuration
examples/ai-nextjs/app/globals.css	Added `@source` directives for Next.js-specific paths
apps/sqlrooms-cli-ui/*	Applied same migration pattern as examples
docs/upgrade-guide.md	Added comprehensive migration guide for v3 to v4
docs/theming.md	Updated CSS examples to remove `@layer base` wrapper
docs/getting-started.md	Updated Tailwind installation instructions to reference v4
README.md	Updated Tailwind installation instructions to reference v4

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

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

apps/sqlrooms-cli-ui/src/style.css

docs/upgrade-guide.md

README.md

docs/getting-started.md

greptile-apps · 2026-01-27T14:27:15Z

Too many files changed for review. (199 files found, 100 file limit)

Copilot

Pull request overview

Copilot reviewed 198 out of 199 changed files in this pull request and generated 2 comments.

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

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

packages/ui/src/components/table.tsx

Copilot · 2026-01-27T14:31:23Z

@dmitriy-kostianetskiy I've opened a new pull request, #327, to work on those changes. Once the pull request is ready, I'll request review from you.

dmitriy-kostianetskiy · 2026-01-27T15:04:37Z

@copilot can you make sure all deprecated tailwind classes are replaced with the new ones (tailwind v3 -> v4 migration)

Copilot · 2026-01-27T15:04:47Z

@dmitriy-kostianetskiy I've opened a new pull request, #329, to work on those changes. Once the pull request is ready, I'll request review from you.

* feat: Abort query in CreateTableForm Signed-off-by: Ilya Boyandin <ilyabo@gmail.com> * fixes Signed-off-by: Ilya Boyandin <ilyabo@gmail.com> * fixes Signed-off-by: Ilya Boyandin <ilyabo@gmail.com> --------- Signed-off-by: Ilya Boyandin <ilyabo@gmail.com>

* fix: Prevent type errors in React 18 which don't have `inert` Signed-off-by: Ilya Boyandin <ilyabo@gmail.com> * rename isActive -> isSelected for clarity Signed-off-by: Ilya Boyandin <ilyabo@gmail.com> --------- Signed-off-by: Ilya Boyandin <ilyabo@gmail.com>

) * fix: configureKeplerInjector factory resolving was happening early Signed-off-by: Ilya Boyandin <ilyabo@gmail.com> * pr feedback Signed-off-by: Ilya Boyandin <ilyabo@gmail.com> --------- Signed-off-by: Ilya Boyandin <ilyabo@gmail.com>

* render reasoning in agent tool; error->Error * fix ts error

* add a flag for creating layers * Update packages/kepler/src/KeplerSlice.ts Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com> --------- Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>

* fix: eslint errors Parsing error: No tsconfigRootDir was set, and multiple candidate TSConfigRootDirs are present. * chore: add js files to lintstage

coderabbitai · 2026-02-06T14:24:43Z

Important

Review skipped

Too many files!

This PR contains 280 files, which is 130 over the limit of 150.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

🔍 Trigger a full review

✨ Finishing touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch feat/tailwind-v4

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

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

charlieforward9 · 2026-02-15T19:12:58Z

This one is blocking me from using the /recharts package!

ilyabo · 2026-02-15T21:51:39Z

This one is blocking me from using the /recharts package!

We hope to land it next week

dmitriy-kostianetskiy added 7 commits January 27, 2026 12:10

feat: set up tailwind v4

ac1550f

feat: update theming.md

5817298

feat: migrate sql-rooms-cli-ui

bd6f401

feat: update next js examples

58a69e3

fix: tailwind version in sqlrooms-cli-ui

3f79103

fix: remove unused dependencies

6bdb1df

fix: exclude entry css files from knip

e887abb

dmitriy-kostianetskiy requested review from Copilot and ilyabo January 27, 2026 12:01

dmitriy-kostianetskiy self-assigned this Jan 27, 2026

Copilot started reviewing on behalf of dmitriy-kostianetskiy January 27, 2026 12:01 View session

Copilot AI reviewed Jan 27, 2026

View reviewed changes

apps/sqlrooms-cli-ui/src/style.css Show resolved Hide resolved

docs/upgrade-guide.md Outdated Show resolved Hide resolved

README.md Show resolved Hide resolved

docs/getting-started.md Show resolved Hide resolved

dmitriy-kostianetskiy added 4 commits January 27, 2026 14:59

feat: replace deprecated tw classes in examples

d85d585

feat: replace deprecated tw classes in packages/ui

2be1da5

feat: replace deprecated tw classes in the rest of the files

c47687b

fix: code review comments from co-pilot

c6ebeeb

dmitriy-kostianetskiy marked this pull request as ready for review January 27, 2026 14:26

dmitriy-kostianetskiy requested a review from Copilot January 27, 2026 14:27

Copilot started reviewing on behalf of dmitriy-kostianetskiy January 27, 2026 14:27 View session

Copilot AI reviewed Jan 27, 2026

View reviewed changes

packages/ui/src/components/table.tsx Show resolved Hide resolved

packages/ui/src/components/table.tsx Show resolved Hide resolved

Copilot AI mentioned this pull request Jan 27, 2026

Clarify Tailwind v4 selector syntax is correct from official upgrade tool #327

Closed

Copilot AI mentioned this pull request Jan 27, 2026

Fix invalid Tailwind v4 selector syntax generated by upgrade tool #329

Closed

ilyabo mentioned this pull request Jan 28, 2026

fix: color utils get css color from theme mode #331

Merged

ilyabo added 3 commits January 28, 2026 13:42

lixun910 and others added 6 commits January 28, 2026 13:42

feat: render reasoning in agent tool (#322)

a41f2ca

* render reasoning in agent tool; error->Error * fix ts error

fix: eslint configuration (#317)

571f78e

* fix: eslint errors Parsing error: No tsconfigRootDir was set, and multiple candidate TSConfigRootDirs are present. * chore: add js files to lintstage

fix: make pre-push hook volta friendly

44336d9

fix: replace outline-none with outline-hidden

a80fa8a

fix: order of deps in package.json

e66cf42

ilyabo mentioned this pull request Feb 11, 2026

Getting Started, ! could not find commit hash for master #338

Closed

Conversation

dmitriy-kostianetskiy commented Jan 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

greptile-apps bot commented Jan 27, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Copilot AI commented Jan 27, 2026

Uh oh!

dmitriy-kostianetskiy commented Jan 27, 2026

Uh oh!

Copilot AI commented Jan 27, 2026

Uh oh!

coderabbitai bot commented Feb 6, 2026

Review skipped

Uh oh!

charlieforward9 commented Feb 15, 2026

Uh oh!

ilyabo commented Feb 15, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

Comments

dmitriy-kostianetskiy commented Jan 27, 2026 •

edited

Loading