Tailwind 4 (#1873)

* Add auto inject assets

* build assets

* Fix bootstrap.css

* Change default: false

* replace laravel-mix to vite

* fix phpstan always false error

* use Invokable controller & custom response

* wip

* wip

* Add tailwin.config.js

* wip

* wip

* wip

* wip

* fix cypress config

---------

Co-authored-by: Dan <[email protected]>

Author: luanfreitasdev

.github/workflows/test-build.yml

@@ -0,0 +1,33 @@
+name: Test Build
+
+on:
+  push:
+    branches:
+      - "**"
+  pull_request:
+    types: [ ready_for_review, synchronize, opened ]
+
+jobs:
+  test-build:
+    runs-on: ${{ matrix.os }}
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ubuntu-latest]
+    steps:
+      - name: Checkout Repository
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22.x'
+
+      - name: Install NPM Dependencies
+        run: npm install
+
+      - name: Build
+        run: npm run build
+
+      - name: Build Tailwind 4
+        run: npm run build:tailwind

composer.json

@@ -19,7 +19,7 @@
   ],
   "require": {
     "php": "^8.2",
-    "livewire/livewire": "^3.5.0",
+    "livewire/livewire": "^3.6.0",
     "laravel/prompts": "*"
   },
   "require-dev": {

dist/.vite/manifest.json

@@ -0,0 +1,18 @@
+{
+  "resources/css/bootstrap5.css": {
+    "file": "bootstrap5.css",
+    "src": "resources/css/bootstrap5.css",
+    "isEntry": true
+  },
+  "resources/css/tailwind.css": {
+    "file": "tailwind.css",
+    "src": "resources/css/tailwind.css",
+    "isEntry": true
+  },
+  "resources/js/powergrid.js": {
+    "file": "powergrid.js",
+    "name": "powergrid",
+    "src": "resources/js/powergrid.js",
+    "isEntry": true
+  }
+}

dist/bootstrap5.css

@@ -7,8 +7,9 @@
         "test": "tests"
     },
     "scripts": {
-        "dev": "mix watch",
-        "build": "mix --production",
+        "build": "vite build",
+        "build:tailwind": "npx @tailwindcss/cli -i ./resources/css/tailwind4.css -o ./dist/tailwind4.css --minify",
+        "dev": "vite build --watch",
         "blade-formatter": "blade-formatter --write resources/**/*.blade.php"
     },
     "repository": {
@@ -17,24 +18,24 @@
     },
     "author": "",
     "license": "ISC",
+    "type": "module",
     "bugs": {
         "url": "https://github.com/Power-Components/livewire-powergrid/issues"
     },
     "homepage": "https://github.com/Power-Components/livewire-powergrid#readme",
-    "dependencies": {
-        "alpinejs": "^3.14.1",
-        "laravel-mix": "^6.0.49",
-        "tom-select": "^2.3.1"
-    },
     "devDependencies": {
+        "@tailwindcss/forms": "^0.5.10",
+        "@tailwindcss/vite": "^4.0.12",
+        "alpinejs": "^3.14.7",
         "autoprefixer": "^10.4.20",
         "blade-formatter": "^1.41.1",
-        "cypress": "^13.13.2",
+        "cypress": "^13.16.1",
         "flatpickr": "^4.6.13",
-        "postcss": "^8.4.41",
         "resolve-url-loader": "^5.0.0",
-        "sass": "^1.77.8",
-        "sass-loader": "^14.1.1",
-        "tailwindcss": "^3.4.7"
+        "sass": "^1.82.0",
+        "sass-loader": "^16.0.4",
+        "tailwindcss": "^4.0.12",
+        "tom-select": "^2.4.1",
+        "vite": "^6.0.3"
     }
 }

dist/mix-manifest.json

@@ -30,8 +30,6 @@ parameters:
 
     excludePaths:
         - './src/Components/Exports/OpenSpout/*'
-        - './src/Components/Actions/Macros.php'
-        - './src/Helpers/Actions.php'
         - './src/Livewire/PerformanceCard.php'
         - './src/Recorders/PowerGridPerformanceRecorder.php'
         - './src/Themes/Theme.php'