chore(react19+tw4): React 19 + Tailwind 4

package.json

@@ -48,9 +48,9 @@
     "input-otp": "^1.2.4",
     "lucide-react": "^0.451.0",
     "next-themes": "^0.3.0",
-    "react": "^18.3.1",
+    "react": "^19.0.0",
     "react-day-picker": "^8.10.1",
-    "react-dom": "^18.3.1",
+    "react-dom": "^19.0.0",
     "react-hook-form": "^7.53.0",
     "react-resizable-panels": "^2.1.3",
     "react-router-dom": "^6.26.2",
@@ -64,10 +64,11 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.9.0",
+    "@tailwindcss/postcss": "^4.0.17",
     "@tailwindcss/typography": "^0.5.15",
     "@types/node": "^22.5.5",
-    "@types/react": "^18.3.3",
-    "@types/react-dom": "^18.3.0",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
     "@vitejs/plugin-react-swc": "^3.5.0",
     "autoprefixer": "^10.4.20",
     "eslint": "^9.9.0",
@@ -76,7 +77,7 @@
     "globals": "^15.9.0",
     "component-tagger": "^1.1.3",
     "postcss": "^8.4.47",
-    "tailwindcss": "^3.4.11",
+    "tailwindcss": "^4.0.17",
     "typescript": "^5.5.3",
     "typescript-eslint": "^8.0.1",
     "vite": "^5.4.1"

postcss.config.js

@@ -1,6 +1,6 @@
 export default {
   plugins: {
-    tailwindcss: {},
+    '@tailwindcss/postcss': {},
     autoprefixer: {},
   },
 }

src/index.css

@@ -1,9 +1,7 @@
 @import url('https://cdn.jsdelivr.net/npm/[email protected]/dist/fonts/geist-sans/style.css');
 @import url('https://cdn.jsdelivr.net/npm/[email protected]/dist/fonts/geist-mono/style.css');
-
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
+@import "tailwindcss";
+@config "../tailwind.config.ts";
  
 @layer base {
   html { font-family: 'Geist', ui-sans-serif, system-ui, sans-serif; }