tailwindcss-rails 4.1.0 → 4.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8dfb2a9007c58419791262f3e6161df3aefbec1bb74f513c87404c01135751c2
-  data.tar.gz: 9339a008fff18d68721d9958fbea1d98b80825fb18f502d7394092e77a3c3d9c
+  metadata.gz: 7aa2cf1b89bf6e2c36561fc1837d68c909ec546c59389269f8ebb2b02636dd58
+  data.tar.gz: 9e31269f4da5d5b6af95c83ed8548f61a634d8f8e54aa821472196d4b10fe5ec
 SHA512:
-  metadata.gz: 86735d4c0a54258a459a0a9aab3ad5e53d738e1cf195bc6ee0b9554505c53417749e481212f17d0f5462516f0b84f8f6846606706cff315e4f9ba7923039615b
-  data.tar.gz: c299cf5e88698b34a0b1c64bad13d752af44a681628b85752bbfe7f098c8a6c31bb111ae49b566084c444eda92efc7df45f60d5a2ef6eb2e6068857facb06e40
+  metadata.gz: 294d50739faaece4341840862dfb30d10b6f554f274430ac2f826556c8254e88a22872a4ca8bbcfb7dde7ccdc41b82980f4e3ff8431873ffa47994f36643e6a4
+  data.tar.gz: a8eed8a46d161699a7d3b70c5d9682df9605c0ea9cbc0ff98e82756847528f3e4c294c335c7b382c7c155ca9e3eaab7a1638eee3b6a59c424f463fe828fd16b8

data/README.md

@@ -12,7 +12,7 @@
 - [Upgrading your application from Tailwind v3 to v4](#upgrading-your-application-from-tailwind-v3-to-v4)
   * [You don't _have_ to upgrade](#you-dont-_have_-to-upgrade)
   * [Upgrade steps](#upgrade-steps)
-  * [Troubleshooting](#troubleshooting)
+  * [Troubleshooting a v4 upgrade](#troubleshooting-a-v4-upgrade)
   * [Updating CSS class names for v4](#updating-css-class-names-for-v4)
 - [Developing with Tailwindcss](#developing-with-tailwindcss)
   * [Configuration and commands](#configuration-and-commands)
@@ -20,9 +20,10 @@
   * [Building for testing](#building-for-testing)
   * [Building unminified assets](#building-unminified-assets)
   * [Live rebuild](#live-rebuild)
+  * [Using Tailwind plugins](#using-tailwind-plugins)
   * [Using with PostCSS](#using-with-postcss)
   * [Custom inputs or outputs](#custom-inputs-or-outputs)
-- [Troubleshooting](#troubleshooting-1)
+- [Troubleshooting](#troubleshooting)
   * [Lost keystrokes or hanging when using terminal-based debugging tools (e.g. IRB, Pry, `ruby/debug`...etc.) with the Puma plugin](#lost-keystrokes-or-hanging-when-using-terminal-based-debugging-tools-eg-irb-pry-rubydebugetc-with-the-puma-plugin)
   * [Running in a docker container exits prematurely](#running-in-a-docker-container-exits-prematurely)
   * [Conflict with sassc-rails](#conflict-with-sassc-rails)
@@ -171,7 +172,7 @@ Done in 56ms
 If this doesn't succeed, it's likely that you've customized your Tailwind configuration and you'll need to do some work to make sure your application upgrades. Please read the [official upgrade guide](https://tailwindcss.com/docs/upgrade-guide) and try following the additional steps in [Updating CSS class names for v4](#updating-css-class-names-for-v4).
 
 
-### Troubleshooting
+### Troubleshooting a v4 upgrade
 
 You may want to check out [TailwindCSS v4 - upgrade experience report · rails/tailwindcss-rails · Discussion #450](https://github.com/rails/tailwindcss-rails/discussions/450) if you're having trouble upgrading.
 
@@ -195,7 +196,7 @@ With some additional manual work the upstream upgrade tool will update your appl
 /node_modules
 ```
 
-**Create** a `package.json` in the root of the project:
+**Create** or **update** a `package.json` in the root of the project:
 
 ```jsonc
 {
@@ -232,7 +233,9 @@ With some additional manual work the upstream upgrade tool will update your appl
 
 Then, once you've run that successfully, clean up:
 
-- **Delete** `package.json`, `node_modules/` and `package-lock.json` (or `yarn.lock`), plus remove `/node_modules` from `.gitignore`.
+- **Review** `package.json` to remove unnecessary modules.
+  - This includes modules added for the period of upgrade.
+  - If you don't need any modules besides `tailwindcss` itself, **delete** `package.json`, `node_modules/` and `package-lock.json` (or `yarn.lock`), plus remove `/node_modules` from `.gitignore`.
 - **Go** to your CSS file and remove the following line (if present):
   ```css
   @plugin '@tailwindcss/container-queries';
@@ -273,7 +276,6 @@ This gem also makes available a Puma plugin to manage a live rebuild process whe
 
 This gem also generates a `Procfile.dev` file which will run both the rails server and a live rebuild process (see "Live Rebuild" section below).
 
-
 ### Building for production
 
 The `tailwindcss:build` is automatically attached to `assets:precompile`, so before the asset pipeline digests the files, the Tailwind output will be generated.
@@ -286,8 +288,12 @@ The `tailwindcss:build` task is automatically attached to the `test:prepare` Rak
 
 ### Building unminified assets
 
-If you want unminified assets, you can pass a `debug` argument to the rake task, i.e. `rails tailwindcss:build[debug]` or `rails tailwindcss:watch[debug]`.
+If you want unminified assets, you can:
+
+- pass a `debug` argument to the rake task, i.e. `rails tailwindcss:build[debug]` or `rails tailwindcss:watch[debug]`.
+- set an environment variable named `TAILWINDCSS_DEBUG` with a non-blank value
 
+If both values are set, the environment variable will take precedence over the rake task argument.
 
 ### Live rebuild
 
@@ -331,6 +337,32 @@ If you are running `rails tailwindcss:watch` in a docker container without a tty
 Running `bin/dev` invokes Foreman to start both the Tailwind watch process and the rails server in development mode based on your `Procfile.dev` file.
 
 
+### Using Tailwind plugins
+
+If you want to use Tailwind plugins, they can be installed using `package.json`.
+
+Using Yarn:
+
+``` sh
+[ ! -f package.json ] && yarn init
+yarn add daisyui # example
+```
+
+Using npm:
+
+``` sh
+npm init
+npm add daisyui # example
+```
+
+Than use `@plugin` annotation in `app/assets/tailwind/application.css`:
+
+``` css
+@import "tailwindcss";
+@plugin "daisyui";
+```
+
+
 ### Using with PostCSS
 
 If you want to use PostCSS as a preprocessor, create a custom `postcss.config.js` in your project root directory, and that file will be loaded by Tailwind automatically.

data/lib/generators/tailwindcss/authentication/templates/app/views/passwords/edit.html.erb

@@ -15,7 +15,7 @@
     </div>
 
     <div class="inline">
-      <%%= form.submit "Save", class: "rounded-md px-3.5 py-2.5 bg-blue-600 hover:bg-blue-500 text-white inline-block font-medium cursor-pointer" %>
+      <%%= form.submit "Save", class: "w-full sm:w-auto text-center rounded-md px-3.5 py-2.5 bg-blue-600 hover:bg-blue-500 text-white inline-block font-medium cursor-pointer" %>
     </div>
   <%% end %>
 </div>

data/lib/generators/tailwindcss/authentication/templates/app/views/passwords/new.html.erb

@@ -11,7 +11,7 @@
     </div>
 
     <div class="inline">
-      <%%= form.submit "Email reset instructions", class: "rounded-lg px-3.5 py-2.5 bg-blue-600 hover:bg-blue-500 text-white inline-block font-medium cursor-pointer" %>
+      <%%= form.submit "Email reset instructions", class: "w-full sm:w-auto text-center rounded-lg px-3.5 py-2.5 bg-blue-600 hover:bg-blue-500 text-white inline-block font-medium cursor-pointer" %>
     </div>
   <%% end %>
 </div>

data/lib/generators/tailwindcss/authentication/templates/app/views/sessions/new.html.erb

@@ -20,7 +20,7 @@
 
     <div class="col-span-6 sm:flex sm:items-center sm:gap-4">
       <div class="inline">
-        <%%= form.submit "Sign in", class: "rounded-md px-3.5 py-2.5 bg-blue-600 hover:bg-blue-500 text-white inline-block font-medium cursor-pointer" %>
+        <%%= form.submit "Sign in", class: "w-full sm:w-auto text-center rounded-md px-3.5 py-2.5 bg-blue-600 hover:bg-blue-500 text-white inline-block font-medium cursor-pointer" %>
       </div>
 
       <div class="mt-4 text-sm text-gray-500 sm:mt-0">

data/lib/generators/tailwindcss/scaffold/templates/_form.html.erb.tt

@@ -38,6 +38,6 @@
 
 <% end -%>
   <div class="inline">
-    <%%= form.submit class: "rounded-md px-3.5 py-2.5 bg-blue-600 hover:bg-blue-500 text-white inline-block font-medium cursor-pointer" %>
+    <%%= form.submit class: "w-full sm:w-auto rounded-md px-3.5 py-2.5 bg-blue-600 hover:bg-blue-500 text-white inline-block font-medium cursor-pointer" %>
   </div>
 <%% end %>

data/lib/generators/tailwindcss/scaffold/templates/edit.html.erb.tt

@@ -5,6 +5,6 @@
 
   <%%= render "form", <%= singular_table_name %>: @<%= singular_table_name %> %>
 
-  <%%= link_to "Show this <%= human_name.downcase %>", <%= model_resource_name(prefix: "@") %>, class: "ml-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
-  <%%= link_to "Back to <%= human_name.pluralize.downcase %>", <%= index_helper(type: :path) %>, class: "ml-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
+  <%%= link_to "Show this <%= human_name.downcase %>", <%= model_resource_name(prefix: "@") %>, class: "w-full sm:w-auto text-center mt-2 sm:mt-0 sm:ml-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
+  <%%= link_to "Back to <%= human_name.pluralize.downcase %>", <%= index_helper(type: :path) %>, class: "w-full sm:w-auto text-center mt-2 sm:mt-0 sm:ml-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
 </div>

data/lib/generators/tailwindcss/scaffold/templates/index.html.erb.tt

@@ -13,13 +13,13 @@
   <div id="<%= plural_table_name %>" class="min-w-full divide-y divide-gray-200 space-y-5">
     <%% if @<%= plural_table_name %>.any? %>
       <%% @<%= plural_table_name %>.each do |<%= singular_table_name %>| %>
-        <div class="flex justify-between items-center">
+        <div class="flex flex-col sm:flex-row justify-between items-center pb-5 sm:pb-0">
           <%%= render <%= singular_table_name %> %>
-          <div class="space-x-2">
-            <%%= link_to "Show", <%= model_resource_name(singular_table_name) %>, class: "rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
-            <%%= link_to "Edit", <%= edit_helper(singular_table_name, type: :path) %>, class: "rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
-            <div class="inline-block">
-              <%%= button_to "Destroy", <%= model_resource_name %>, method: :delete, class: "rounded-md px-3.5 py-2.5 text-white bg-red-600 hover:bg-red-500 font-medium cursor-pointer", data: { turbo_confirm: "Are you sure?" } %>
+          <div class="w-full sm:w-auto flex flex-col sm:flex-row space-x-2 space-y-2">
+            <%%= link_to "Show", <%= model_resource_name(singular_table_name) %>, class: "w-full sm:w-auto text-center rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
+            <%%= link_to "Edit", <%= edit_helper(singular_table_name, type: :path) %>, class: "w-full sm:w-auto text-center rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
+            <div class="sm:inline-block">
+              <%%= button_to "Destroy", <%= model_resource_name %>, method: :delete, class: "w-full sm:w-auto rounded-md px-3.5 py-2.5 text-white bg-red-600 hover:bg-red-500 font-medium cursor-pointer", data: { turbo_confirm: "Are you sure?" } %>
             </div>
           </div>
         </div>

data/lib/generators/tailwindcss/scaffold/templates/new.html.erb.tt

@@ -5,5 +5,5 @@
 
   <%%= render "form", <%= singular_table_name %>: @<%= singular_table_name %> %>
 
-  <%%= link_to "Back to <%= human_name.pluralize.downcase %>", <%= index_helper(type: :path) %>, class: "ml-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
+  <%%= link_to "Back to <%= human_name.pluralize.downcase %>", <%= index_helper(type: :path) %>, class: "w-full sm:w-auto text-center mt-2 sm:mt-0 sm:ml-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
 </div>

data/lib/generators/tailwindcss/scaffold/templates/partial.html.erb.tt

@@ -1,4 +1,4 @@
-<div id="<%%= dom_id <%= singular_name %> %>" class="my-5 space-y-5">
+<div id="<%%= dom_id <%= singular_name %> %>" class="w-full sm:w-auto my-5 space-y-5">
 <% attributes.reject(&:password_digest?).each do |attribute| -%>
   <div>
     <strong class="block font-medium mb-1"><%= attribute.human_name %>:</strong>

data/lib/generators/tailwindcss/scaffold/templates/show.html.erb.tt

@@ -9,9 +9,9 @@
 
   <%%= render @<%= singular_table_name %> %>
 
-  <%%= link_to "Edit this <%= human_name.downcase %>", <%= edit_helper(type: :path) %>, class: "mt-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
-  <%%= link_to "Back to <%= human_name.pluralize.downcase %>", <%= index_helper %>_path, class: "ml-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
-  <div class="inline-block ml-2">
-    <%%= button_to "Destroy this <%= human_name.downcase %>", <%= model_resource_name(prefix: "@") %>, method: :delete, class: "mt-2 rounded-md px-3.5 py-2.5 text-white bg-red-600 hover:bg-red-500 font-medium cursor-pointer", data: { turbo_confirm: "Are you sure?" } %>
+  <%%= link_to "Edit this <%= human_name.downcase %>", <%= edit_helper(type: :path) %>, class: "w-full sm:w-auto text-center rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
+  <%%= link_to "Back to <%= human_name.pluralize.downcase %>", <%= index_helper %>_path, class: "w-full sm:w-auto text-center mt-2 sm:mt-0 sm:ml-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %>
+  <div class="sm:inline-block mt-2 sm:mt-0 sm:ml-2">
+    <%%= button_to "Destroy this <%= human_name.downcase %>", <%= model_resource_name(prefix: "@") %>, method: :delete, class: "w-full rounded-md px-3.5 py-2.5 text-white bg-red-600 hover:bg-red-500 font-medium cursor-pointer", data: { turbo_confirm: "Are you sure?" } %>
   </div>
 </div>

data/lib/tailwindcss/commands.rb

@@ -4,6 +4,7 @@ module Tailwindcss
   module Commands
     class << self
       def compile_command(debug: false, **kwargs)
+        debug = ENV["TAILWINDCSS_DEBUG"].present? if ENV.key?("TAILWINDCSS_DEBUG")
         rails_root = defined?(Rails) ? Rails.root : Pathname.new(Dir.pwd)
 
         command = [

data/lib/tailwindcss/version.rb

@@ -1,3 +1,3 @@
 module Tailwindcss
-  VERSION = "4.1.0"
+  VERSION = "4.2.0"
 end

metadata

@@ -1,13 +1,13 @@
 --- !ruby/object:Gem::Specification
 name: tailwindcss-rails
 version: !ruby/object:Gem::Version
-  version: 4.1.0
+  version: 4.2.0
 platform: ruby
 authors:
 - David Heinemeier Hansson
 bindir: bin
 cert_chain: []
-date: 2025-02-19 00:00:00.000000000 Z
+date: 2025-03-02 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: railties