Upgrade debug provider to tailwind 4

Author: oneiros

debug_fasp/Gemfile

@@ -15,7 +15,7 @@ gem "turbo-rails"
 # Hotwire's modest JavaScript framework [https://stimulus.hotwired.dev]
 gem "stimulus-rails"
 # Use Tailwind CSS [https://github.com/rails/tailwindcss-rails]
-gem "tailwindcss-rails", "~> 3.3.1"
+gem "tailwindcss-rails", "~> 4.1"
 # Build JSON APIs with ease [https://github.com/rails/jbuilder]
 gem "jbuilder"
 

debug_fasp/Gemfile.lock

@@ -224,7 +224,7 @@ GEM
     raabro (1.4.0)
     racc (1.8.1)
     rack (3.1.13)
-    rack-session (2.1.0)
+    rack-session (2.1.1)
       base64 (>= 0.1.0)
       rack (>= 3.0.0)
     rack-test (2.2.0)
@@ -331,15 +331,16 @@ GEM
     stimulus-rails (1.3.4)
       railties (>= 6.0.0)
     stringio (3.1.7)
-    tailwindcss-rails (3.3.2)
+    tailwindcss-rails (4.2.3)
       railties (>= 7.0.0)
-      tailwindcss-ruby (~> 3.0)
-    tailwindcss-ruby (3.4.17)
-    tailwindcss-ruby (3.4.17-aarch64-linux)
-    tailwindcss-ruby (3.4.17-arm-linux)
-    tailwindcss-ruby (3.4.17-arm64-darwin)
-    tailwindcss-ruby (3.4.17-x86_64-darwin)
-    tailwindcss-ruby (3.4.17-x86_64-linux)
+      tailwindcss-ruby (~> 4.0)
+    tailwindcss-ruby (4.1.5)
+    tailwindcss-ruby (4.1.5-aarch64-linux-gnu)
+    tailwindcss-ruby (4.1.5-aarch64-linux-musl)
+    tailwindcss-ruby (4.1.5-arm64-darwin)
+    tailwindcss-ruby (4.1.5-x86_64-darwin)
+    tailwindcss-ruby (4.1.5-x86_64-linux-gnu)
+    tailwindcss-ruby (4.1.5-x86_64-linux-musl)
     thor (1.3.2)
     thruster (0.1.13)
     thruster (0.1.13-aarch64-linux)
@@ -409,7 +410,7 @@ DEPENDENCIES
   solid_queue
   sqlite3 (>= 2.1)
   stimulus-rails
-  tailwindcss-rails (~> 3.3.1)
+  tailwindcss-rails (~> 4.1)
   thruster
   turbo-rails
   tzinfo-data

debug_fasp/app/assets/stylesheets/application.tailwind.css

@@ -0,0 +1,2 @@
+@import "tailwindcss";
+@config "../../../config/tailwind.config.js";

debug_fasp/app/assets/tailwind/application.css

@@ -4,6 +4,8 @@ class ApplicationController < ActionController::Base
   # Only allow modern browsers supporting webp images, web push, badges, import maps, CSS nesting, and CSS :has.
   allow_browser versions: :modern
 
+  default_form_builder FaspBase::FormBuilder
+
   private
 
   # Currently ever user can only have one server but this will probably

debug_fasp/app/controllers/application_controller.rb

@@ -24,6 +24,6 @@
   <b><%= Account.human_attribute_name(:full_object) %></b>
 </p>
 
-<pre class="rounded bg-gray-100 p-2">
+<pre class="rounded-sm bg-gray-100 p-2">
 <%= JSON.pretty_generate(@account.full_object) %>
 </pre>

debug_fasp/app/views/accounts/show.html.erb

@@ -26,6 +26,6 @@
   <b><%= Content.human_attribute_name(:full_object) %></b>
 </p>
 
-<pre class="rounded bg-gray-100 p-2">
+<pre class="rounded-sm bg-gray-100 p-2">
 <%= JSON.pretty_generate(@content.full_object) %>
 </pre>

debug_fasp/app/views/contents/show.html.erb

@@ -13,7 +13,7 @@
     <link rel="icon" href="/icon.png" type="image/png">
     <link rel="icon" href="/icon.svg" type="image/svg+xml">
     <link rel="apple-touch-icon" href="/icon.png">
-    <%= stylesheet_link_tag "tailwind", "inter-font", "data-turbo-track": "reload" %>
+    <%= stylesheet_link_tag "tailwind", "data-turbo-track": "reload" %>
     <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
     <%= javascript_importmap_tags %>
   </head>

debug_fasp/app/views/layouts/application.html.erb

@@ -1,4 +1,3 @@
-const defaultTheme = require('tailwindcss/defaultTheme')
 const execSync = require('child_process').execSync
 
 let content = [
@@ -12,25 +11,12 @@ const gems = ['fasp_base']
 
 gems.forEach((gem) => {
   const gemPath = execSync(`bundle show ${gem}`, { encoding: 'utf-8' }).trim()
+  content.push(`${gemPath}/app/form_builder/**/*.rb`)
   content.push(`${gemPath}/app/helpers/**/*.rb`)
   content.push(`${gemPath}/app/javascript/**/*.js`)
   content.push(`${gemPath}/app/views/**/*.{erb,haml,html,slim}`)
 })
 
-console.log(content)
-
 module.exports = {
-  content: content,
-  theme: {
-    extend: {
-      fontFamily: {
-        sans: ['Inter var', ...defaultTheme.fontFamily.sans],
-      },
-    },
-  },
-  plugins: [
-    require('@tailwindcss/forms'),
-    require('@tailwindcss/typography'),
-    require('@tailwindcss/container-queries'),
-  ]
+  content: content
 }

debug_fasp/config/tailwind.config.js

@@ -1,24 +1,24 @@
 module FaspBase
   class FormBuilder < ActionView::Helpers::FormBuilder
-    INPUT_CLASSES = %w(px-2 py-1 border border-blue-400 text-base)
+    INPUT_CLASSES = %w[px-2 py-1 border border-blue-400 text-base]
 
     def text_field(method, options = {})
-      options[:class] = [options[:class], INPUT_CLASSES].compact.join(" ")
+      options[:class] = [ options[:class], INPUT_CLASSES ].compact.join(" ")
       super
     end
 
     def email_field(method, options = {})
-      options[:class] = [options[:class], INPUT_CLASSES].compact.join(" ")
+      options[:class] = [ options[:class], INPUT_CLASSES ].compact.join(" ")
       super
     end
 
     def password_field(method, options = {})
-      options[:class] = [options[:class], INPUT_CLASSES].compact.join(" ")
+      options[:class] = [ options[:class], INPUT_CLASSES ].compact.join(" ")
       super
     end
 
     def url_field(method, options = {})
-      options[:class] = [options[:class], INPUT_CLASSES].compact.join(" ")
+      options[:class] = [ options[:class], INPUT_CLASSES ].compact.join(" ")
       super
     end
   end