WIP: Upgrade Tailwind V3 to V4 - #594
Open
tarunsinghofficial wants to merge 14 commits into
Open
Conversation
|
Warning Review limit reached
Next review available in: 40 minutes Limit details: You’ve used the included review currently available. You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository. How can I continue?Wait for the limit to reset, then comment An organization admin can change what happens after included review limits in Billing. How do review limits work?CodeRabbit enforces per-developer PR review limits within each organization. For paid Pro and Pro+ reviews, CodeRabbit uses a developer's included PR review attempts over the past 7 days to set the current hourly allowance. At typical activity levels, the full plan allowance applies. Higher sustained activity can lower the allowance until earlier attempts leave the 7-day window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (10)
📒 Files selected for processing (48)
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (23)
💤 Files with no reviewable changes (1)
Included review availability: Your plan provides up to 1 included review per hour; 0 remain after this review. 📝 WalkthroughWalkthroughChangesTailwind CSS 4 migration
Estimated code review effort: 3 (Moderate) | ~20 minutes Merge Risk: ⚪ Minimal · up to This dependency and build-tooling upgrade has no actionable merge-blocking risk remaining based on the supplied evidence and is merge-ready after normal checks and review. Suggested reviewers: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches 💡 1🛠️ Fix failing CI checks 💡
📝 Generate docstrings
🧪 Generate unit tests (beta)
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. Comment |
flowbite-svelte-icons@1.6.2 peers tailwindcss ^3.3.2, which breaks plain npm install on Tailwind v4. The package is not imported anywhere.
tarunsinghofficial
marked this pull request as ready for review
August 23, 2026 07:21
maplibre-gl pulls @mapbox/jsonlint-lines-primitives@2.0.3, which requires Node >=22. With engine-strict, npm install fails on CI (Node 18 lint / Node 20 test). Override to 2.0.2.
Tailwind v4 pulls @tailwindcss/oxide, which requires Node >=20.
|
Coverage is 93.106% — feat/tailwind-v4 into develop. No base build found for |
0.8.1 crashes with "a.startsWith is not a function" on non-Svelte files, making prettier --check exit 2 (lint fails in CI). 0.6.14 still sorts Tailwind v4 classes. Reformat affected files.
tarunsinghofficial
force-pushed
the
feat/tailwind-v4
branch
from
August 23, 2026 07:34
dfd0078 to
78ebf0b
Compare
Import Flowbite components from subpath exports instead of the package barrel, and rewrite internal barrel imports in vite.config.js. Prevents Vite SSR crash after dependency re-optimization on Tailwind v4.
4 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Migrates Wayfinder from Tailwind CSS v3.4 to v4, using the
@tailwindcss/viteplugin and keeping the existing JS config via@configso env-var branding (generatePalette(), brand/surface colors) continues to work unchanged.Closes #353
What changed
Build pipeline
tailwindcss@4+@tailwindcss/vitevite.config.js; removepostcss.config.js,autoprefixer, and@tailwindcss/line-clamp(built into v4)@tailwindcss/formsandprettier-plugin-tailwindcssCSS / config
@tailwinddirectives with@import "tailwindcss"+@config "../tailwind.config.js"@custom-variant darkusing:is(.dark, .dark *)so dark utilities beat light ones on the same node (fixes search pane in dark mode)tailwind.config.jsfor ESM plugin importsCodemod + fixes
@tailwindcss/upgradefor v4 utility renames (bg-gradient-to-*→bg-linear-to-*,break-words→wrap-break-word, etc.)@referenceinStopMarker.sveltefor@applyin component stylesmaplibre-glas a direct dependency (peer of@maplibre/maplibre-gl-leaflet, dropped by--legacy-peer-depsinstalls)Flowbite
Spiked
flowbite-svelte@1.33— needs Svelte 5.40+, Datepicker build/API churn, and component API updates across 6 files.flowbite-svelte@0.47works with Tailwind v4 (build + UI verified), so it stays on 0.47 for this PR. A Flowbite 1.x upgrade can be a follow-up issue.Components in use: Modal, Button, Tabs/TabItem, Datepicker, Radio, Checkbox, Input (6 files).
Visual QA
Compared 8 dark-mode before/after screenshots (search pane, All Routes, route detail, map pins, etc.) — no visible regressions after the dark-mode specificity fix.
Test plan
npm run lintnpx vitest run(103 files, 1794 tests)npm run buildSummary by CodeRabbit
Refactor
Bug Fixes
Documentation